/* =========================
   Estilos principais do Cronos
   ========================= */

    :root{
      --bg:#060d1f;
      --panel:#0b1730;
      --panel2:#0f1d3d;
      --card:#0f1d3d;
      --text:#eef6ff;
      --muted:#9cb3d9;
      --brand:#1677ff;
      --brand2:#19c6ff;
      --brand3:#2ee6a6;
      --accent:#19c6ff;
      --danger:#ff5a7a;
      --warn:#ffcc00;
      --ok:#2ee6a6;
      --info:#46a7ff;
      --line:rgba(183,212,255,.12);
      --shadow: 0 12px 34px rgba(0,0,0,.42);
      --radius: 18px;
      --radius2: 14px;
      --font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji","Segoe UI Emoji";
      color-scheme: dark;
    }

    /* Light theme overrides */
    :root.light{
      --bg: linear-gradient(135deg, #dbeafe, #dcfce7);
      --panel: rgba(255,255,255,0.75);
      --panel2: #ffffff;
      --text:#0f172a;
      --muted:#334155;
      --brand:#2563eb;
      --brand2:#14b8d6;
      --brand3:#2dd4bf;
      --danger:#e11d48;
      --warn:#d97706;
      --ok:#16a34a;
      --info:#2563eb;
      --line:rgba(17,24,39,.12);
      --shadow: 0 10px 30px rgba(17,24,39,.10);
      color-scheme: light;
    }

    *{box-sizing:border-box}
    html,body{height:100%}
    body{
      margin:0; font-family:var(--font);
      background:
        radial-gradient(1200px 700px at 10% 10%, rgba(22,119,255,.18), transparent 60%),
        radial-gradient(900px 500px at 90% 0%, rgba(46,230,166,.12), transparent 55%),
        var(--bg);
      color:var(--text);
    }

    a{color:inherit}
    button,input,select,textarea{font:inherit}
    .hidden{display:none!important}
    .muted{color:var(--muted)}
    .nowrap{white-space:nowrap}
    .mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;}

    /* Fix select options visibility on Windows */
    select{ color-scheme: light dark; }
    select option{ background: var(--panel2); color: var(--text); }

    .app{
      display:grid;
      grid-template-columns: 300px 1fr;
      min-height:100vh;
    }
    @media(max-width: 980px){
      .app{display:block; grid-template-columns: 1fr; min-height:auto;}
      .sidebar{
        position:static !important;
        top:auto !important;
        height:auto !important;
        overflow:visible !important;
        border-right:none;
        border-bottom:1px solid var(--line);
      }
      .main{
        padding:12px;
        overflow:visible;
      }
      .stickyFilters{
        position:static !important;
        top:auto !important;
        z-index:auto;
      }
    }

    .sidebar{
      border-right:1px solid var(--line);
      background: linear-gradient(180deg, rgba(255,255,255,.03), transparent 60%), var(--panel);
      padding:16px;
      position:sticky; top:0; height:100vh; overflow:auto;
    }

    .brand{
      display:flex; align-items:center; gap:8px;
      padding:10px 10px; border:1px solid var(--line);
      border-radius: var(--radius);
      background: linear-gradient(135deg, rgba(22,119,255,.16), rgba(46,230,166,.10));
      box-shadow: var(--shadow);
      margin-bottom:12px;
    }
    :root.light .brand{
      background: linear-gradient(135deg, rgba(37,99,235,.14), rgba(6,182,212,.10));
    }

    .logoBox{
      width:44px; height:44px; border-radius:100px;
      background: none;
      border:none;
      display:grid; place-items:center;
      overflow:hidden;
      flex:0 0 auto;
    }
    :root.light .logoBox{
      background: transparent;
      border: none;
    }
    .logoBox svg{width:30px;height:30px;display:block}
    .brand h1{font-size:14px; margin:0; line-height:1.05; white-space:nowrap}
    .brand p{margin:2px 0 0; font-size:12px; color:var(--muted)}
    .brand > div:nth-child(2){min-width:0; flex:1}

    .topTools{
      display:flex; gap:8px; margin-top:10px;
    }
    .iconBtn{
      width:40px; height:40px;
      border-radius:14px;
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      cursor:pointer;
      display:grid; place-items:center;
      transition:.15s ease;
    }
    .iconBtn:hover{transform:translateY(-1px); background: rgba(255,255,255,.06)}
    .iconBtn small{font-size:16px; line-height:1}

    .nav{
      display:flex; flex-direction:column; gap:8px;
      margin-top:12px;
    }
    .nav button{
      width:100%;
      text-align:left;
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      padding:10px 12px;
      border-radius: 14px;
      display:flex; align-items:center; justify-content:space-between;
      cursor:pointer;
      transition: .15s ease;
    }
    .nav button:hover{transform: translateY(-1px); background: rgba(255,255,255,.05)}
    .nav button.active{
      border-color: rgba(22,119,255,.60);
      background: rgba(22,119,255,.14);
      box-shadow: 0 8px 20px rgba(22,119,255,.15);
    }
    :root.light .nav button.active{
      border-color: rgba(37,99,235,.55);
      background: rgba(37,99,235,.10);
      box-shadow: 0 10px 22px rgba(37,99,235,.12);
    }


/* Navegação: feedback visual instantâneo no clique, sem esperar render pesado da aba */
.nav button,
.nav button span{
  transition-property: background, border-color, box-shadow, transform, filter, opacity;
  transition-duration:.15s;
  transition-timing-function:ease;
}
.nav button.active > span:first-child{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
.nav button.active .pill,
.nav button.active .todayNavBadge{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* Correção: botão desativado não pode herdar texto branco do estado ativo anterior */
.sidebar .nav button:not(.active),
.sidebar .nav button:not(.active) > span:first-child,
.sidebar .nav button:not(.active) > span:first-child *,
.nav button:not(.active),
.nav button:not(.active) > span:first-child,
.nav button:not(.active) > span:first-child *{
  color:var(--text) !important;
  -webkit-text-fill-color:var(--text) !important;
}
.sidebar .nav button.active,
.sidebar .nav button.active > span:first-child,
.sidebar .nav button.active > span:first-child *,
.nav button.active,
.nav button.active > span:first-child,
.nav button.active > span:first-child *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

    .pill{
      font-size:12px; color:var(--muted);
      border:1px solid var(--line);
      padding:2px 8px; border-radius:999px;
      background: rgba(0,0,0,.10);
    }
    :root.light .pill{ background: rgba(17,24,39,.04); }

    .sideFooter{
      margin-top:14px;
      padding-top:12px;
      border-top:1px solid var(--line);
      color:var(--muted);
      font-size:12px;
    }
    .sideFooter .row{display:flex; gap:8px; margin-top:10px}
    .sideFooter button{
      flex:1;
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      padding:10px 12px;
      border-radius: 14px;
      cursor:pointer;
    }
    .sideFooter button:hover{background: rgba(255,255,255,.06)}
    .danger{border-color: rgba(255,77,109,.45)!important}
    .danger:hover{background: rgba(255,77,109,.12)!important}

    .main{
      padding:18px;
      overflow:auto;
    }

    .topbar{
      display:flex; flex-wrap:wrap;
      gap:12px; align-items:center; justify-content:space-between;
      margin-bottom:12px;
    }

    @media(max-width: 980px){
      .topbar{margin-bottom:10px;}
      .card{padding:12px;}
      .sidebar .nav{margin-bottom:8px;}
    }
    .titleBlock h2{margin:0; font-size:18px}
    .titleBlock p{margin:3px 0 0; color:var(--muted); font-size:13px}

    .btn{
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      padding:10px 12px;
      border-radius: 14px;
      cursor:pointer;
      transition:.15s ease;
      display:inline-flex; gap:8px; align-items:center;
    }
.spin {
animation: spin 0.6s ease-in-out;
}

@keyframes spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
    .btn:hover{transform:translateY(-1px); background: rgba(255,255,255,.06)}
    .btn.primary{
      border-color: rgba(22,119,255,.55);
      background: linear-gradient(135deg, rgba(22,119,255,.26), rgba(25,198,255,.18) 56%, rgba(46,230,166,.14));
    }
    :root.light .btn.primary{
      border-color: rgba(37,99,235,.45);
      background: rgba(37,99,235,.10);
    }
    .btn.ok{
      border-color: rgba(46,230,166,.55);
      background: rgba(46,230,166,.10);
    }
    :root.light .btn.ok{
      border-color: rgba(22,163,74,.35);
      background: rgba(22,163,74,.10);
    }
    .btn.small{padding:8px 10px; border-radius:12px; font-size:13px}
    .btn.ghost{background:transparent}

    .card{
      border:1px solid var(--line);
      border-radius: var(--radius);
      background: linear-gradient(180deg, rgba(255,255,255,.03), transparent 45%), var(--panel);
      box-shadow: var(--shadow);
      padding:14px;
    }

    .grid{
      display:grid;
      grid-template-columns: 1fr;
      gap:12px;
    }
    @media(min-width: 1100px){
      .grid.cols2{grid-template-columns: 1.15fr .85fr}
      .grid.cols3{grid-template-columns: 1fr 1fr 1fr}
    }

    .kpis{
      display:grid;
      grid-template-columns: repeat(2, 1fr);
      gap:12px;
    }
    @media(min-width: 900px){.kpis{grid-template-columns: repeat(4, 1fr)}}
    .kpi{
      border:1px solid var(--line);
      border-radius: var(--radius2);
      background: rgba(255,255,255,.03);
      padding:12px;
    }
    .kpiHead{display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:2px}
    .kpiPct{display:inline-flex; align-items:center; justify-content:center; padding:2px 8px; min-height:24px; border-radius:999px; border:1px solid var(--line); background:rgba(255,255,255,.05); color:var(--muted); font-size:12px; font-weight:700; white-space:nowrap}
    :root.light .kpiPct{background:rgba(17,24,39,.05)}
    .kpi .label{font-size:12px; color:var(--muted)}
    .kpi .value{font-size:20px; font-weight:800; margin-top:6px}
    .kpi .hint{font-size:12px; color:var(--muted); margin-top:4px}
    :root.light .kpi{background:var(--panel2); border-color:rgba(17,24,39,.12); box-shadow:0 4px 14px rgba(17,24,39,.05);}

    /* Sticky filter bar */
    .stickyFilters{
      position: sticky;
      top: 0;
      z-index: 20;
      background: color-mix(in srgb, var(--panel) 85%, transparent);
      backdrop-filter: blur(8px);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      padding:10px;
      margin-bottom:12px;
    }
    :root.light .stickyFilters{
      background: color-mix(in srgb, var(--panel) 95%, transparent);
    }
    .filtersRow{
      display:flex; flex-wrap:wrap; gap:10px; align-items:end;
    }
    .filtersRow > *{min-width: 140px}
    .filtersRow .grow{flex: 1 1 360px; min-width: 260px}

    label{display:block; font-size:12px; color:var(--muted); margin-bottom:6px}
    input,select,textarea{
      width:100%;
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      padding:10px 12px;
      border-radius: 14px;
      outline:none;
      position:relative;
      z-index:1;
      pointer-events:auto;
    }
    .stickyFilters input,.stickyFilters select,.modal input,.modal select,.modal textarea{position:relative; z-index:2; pointer-events:auto;}
    textarea{min-height: 90px; resize: vertical}

    .tableWrap{overflow:auto; border-radius: var(--radius2); border:1px solid var(--line)}
    table{width:100%; border-collapse:collapse; min-width: 1200px; background: rgba(0,0,0,.10)}
    th,td{padding:10px 10px; border-bottom:1px solid var(--line); vertical-align:top; font-size:13px}
    th{position:sticky; top:0; background: color-mix(in srgb, var(--panel2) 92%, transparent); backdrop-filter: blur(8px); text-align:left; font-size:12px; color:var(--muted); z-index:1}
    tr:hover td{background: rgba(255,255,255,.03)}

    .chip{
      display:inline-flex; align-items:center; gap:6px;
      padding:3px 8px; border-radius:999px;
      border:1px solid var(--line);
      font-size:12px;
      background: rgba(255,255,255,.03);
    }
    .dot{width:8px; height:8px; border-radius:999px; background: var(--muted)}
    .dot.hot{background: var(--danger)}
    .dot.warm{background: var(--warn)}
    .dot.ok{background: var(--info)}
    :root.light .dot.ok{background: var(--brand)} /* stays blue */

    .actionsCell{display:flex; gap:8px; justify-content:flex-end; align-items:center; flex-wrap:wrap;}
    .miniBtn{
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      padding:8px 10px;
      border-radius: 12px;
      cursor:pointer;
      font-size:13px;
    }
    .miniBtn:hover{background: rgba(255,255,255,.06)}
    .miniBtn.danger{border-color: rgba(255,77,109,.45)}
    .miniBtn.ok{border-color: rgba(46,230,166,.45)}

    /* Modal */
    .modalBg{
      position:fixed; inset:0;
      background: rgba(0,0,0,.55);
      display:none;
      align-items:center; justify-content:center;
      padding:16px;
      z-index: 50;
    }
    .modalBg.show{display:flex}
    .modal{
   position:relative;
   width:min(980px, 100%);
   border:1px solid var(--line);
   border-radius:22px;
   background: var(--panel2);
   box-shadow: 0 20px 60px rgba(17,24,39,.15);
   padding:20px 12px 20px 12px;
   max-height:92vh;
   display:flex;
   flex-direction:column;
   overflow:hidden;
}

.dark .modal{
   background: linear-gradient(
      180deg,
      rgba(255,255,255,.05),
      transparent 45%
   ), var(--panel2);
}
    .modalHead{
      display:flex; justify-content:space-between; align-items:flex-start; gap:10px;
      margin-bottom:10px;
    }
    .modalHead h3{margin:0; font-size:15px}
    .x{
      border:1px solid var(--line);
      background: rgba(255,255,255,.03);
      color:var(--text);
      width:38px; height:38px; border-radius: 14px;
      cursor:pointer;
    }
    .modalFoot{
      display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap;
      margin-top:12px; padding-top:12px; border-top:1px solid var(--line);
    }
    .twoCol{display:grid; grid-template-columns:1fr; gap:12px}
    @media(min-width: 900px){.twoCol{grid-template-columns: 1fr 1fr}}
    .threeCol{display:grid; grid-template-columns:1fr; gap:12px}
    @media(min-width: 1100px){.threeCol{grid-template-columns: 1fr 1fr 1fr}}

    
/* Modal scroll (lead form) */
#modalBody{
      -webkit-overflow-scrolling: touch;
  overflow:auto;
  padding-right:6px;
  max-height: calc(92vh - 150px);
}

/* Kanban */
.kanbanWrap{
  display:grid;
  grid-template-columns: repeat(1, 1fr);
  gap:12px;
}
@media(min-width: 1100px){
  .kanbanWrap{grid-template-columns: repeat(5, 1fr);}
}
.kanCol{
  border:1px solid var(--line);
  border-radius: var(--radius2);
  background: rgba(255,255,255,.03);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height: 320px;
}
.kanHead{
  padding:10px 10px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  background: color-mix(in srgb, var(--panel2) 92%, transparent);
  position:sticky;
  top:0;
  z-index:2;
}
.kanHead b{font-size:13px}
.kanList{
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:10px;
  overflow:auto;
}
.kanCard{
  border:1px solid var(--line);
  border-radius: 14px;
  padding:10px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), transparent 50%), var(--panel);
  cursor:grab;
}
.kanCard:active{cursor:grabbing}
.kanDropHint{
  border:1px dashed rgba(22,119,255,.55);
  background: rgba(22,119,255,.10);
}

.kanCard.kanSelected{
  outline:2px solid rgba(46,230,166,.65);
  box-shadow: 0 0 0 4px rgba(46,230,166,.14);
}
.kanCard.kanDragging{ opacity:.65; }

/* Tasks */
.taskBad{border-color: rgba(255,77,109,.55)!important}
.taskOk{border-color: rgba(46,230,166,.55)!important}
/* Autocomplete */
    .suggest{
      position: relative;
    }
    .suggestBox{
      position:absolute;
      top: calc(100% + 6px);
      left:0; right:0;
      border:1px solid var(--line);
      border-radius: 14px;
      background: var(--panel2);
      box-shadow: var(--shadow);
      max-height: 240px;
      overflow:auto;
      display:none;
      z-index: 60;
    }
    .suggestBox.show{display:block}
    .suggestItem{
      padding:10px 12px;
      cursor:pointer;
      border-bottom:1px solid rgba(255,255,255,.06);
    }
    .suggestItem:hover{background: rgba(255,255,255,.06)}
    .suggestItem b{display:block; font-size:13px}
    .suggestItem small{display:block; color:var(--muted); margin-top:2px}

    /* Auth */
    .auth{
      min-height:100vh;
      display:grid;
      place-items:center;
      padding:18px;
    }
    .authCard{
      width:min(520px, 100%);
      border:1px solid var(--line);
      border-radius: 26px;
      background: linear-gradient(180deg, rgba(255,255,255,.05), transparent 42%), var(--panel);
      box-shadow: var(--shadow);
      padding: 16px 16px 16px 16px;
    }

    .bootSplashCard{
      text-align:left;
    }
    .bootSplashCard .authStatus{
      justify-content:center;
    }

    .authLoginGrid{
      display:grid;
      grid-template-columns:1fr;
      gap:12px;
      align-items:start;
    }
    .authLoginGrid .authFullRow{
      grid-column:1 / -1;
    }
    @media(min-width: 900px){
      .authLoginGrid{grid-template-columns: 1fr 1fr;}
    }

    .authPassField{position:relative;}
    .authPassField input{padding-right:60px;}
    .authPassToggle{
      position:absolute;
      right:16px;
      bottom:8px;
      width:28px;
      height:28px;
      border:none;
      background:transparent;
      color:var(--muted);
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      padding:0;
      margin:0;
      z-index:3;
      pointer-events:auto;
    }
    .authPassToggle:hover{background:transparent; color:var(--text);}
    .authPassToggle svg{width:22px; height:22px; display:block; pointer-events:none;}
    :root.light .authPassToggle:hover{background:transparent;}



    /* Login — CTA principal com mais contraste e cara de produto */
    #authView #btnLogin{
      justify-content:center;
      min-height:48px;
      padding:13px 18px;
      border:0;
      border-radius:16px;
      color:#ffffff;
      font-weight:900;
      letter-spacing:.025em;
      text-transform:none;
      background:linear-gradient(135deg, #2563eb 0%, #0ea5e9 48%, #10b981 100%);
      box-shadow:0 16px 34px rgba(37,99,235,.28), inset 0 1px 0 rgba(255,255,255,.28);
    }
    :root:not(.light) #authView #btnLogin{
      background:linear-gradient(135deg, #3b82f6 0%, #06b6d4 48%, #2ee6a6 100%);
      box-shadow:0 18px 40px rgba(6,182,212,.20), 0 10px 26px rgba(46,230,166,.12), inset 0 1px 0 rgba(255,255,255,.22);
    }
    #authView #btnLogin:hover{
      transform:translateY(-1px);
      background:linear-gradient(135deg, #1d4ed8 0%, #0284c7 48%, #059669 100%);
      box-shadow:0 20px 42px rgba(37,99,235,.34), inset 0 1px 0 rgba(255,255,255,.30);
      filter:saturate(1.04) brightness(1.02);
    }
    :root:not(.light) #authView #btnLogin:hover{
      background:linear-gradient(135deg, #2563eb 0%, #0891b2 48%, #10b981 100%);
      box-shadow:0 22px 44px rgba(6,182,212,.24), 0 12px 30px rgba(46,229,157,.15), inset 0 1px 0 rgba(255,255,255,.24);
    }
    #authView #btnLogin:active{
      transform:translateY(0);
      filter:saturate(1.02) brightness(.98);
      box-shadow:0 10px 22px rgba(37,99,235,.24), inset 0 1px 0 rgba(255,255,255,.18);
    }
    #authView #btnLogin:disabled,
    #authView #btnLogin.loading{
      opacity:.86;
      cursor:wait;
      transform:none;
      filter:none;
    }
    #authView #btnLogin .spinner{
      border-color:rgba(255,255,255,.34);
      border-top-color:#ffffff;
    }

    /* Toast */
    .toast{
      position:fixed; right:16px; bottom:16px;
      border:1px solid var(--line);
      border-radius: 16px;
      background: color-mix(in srgb, var(--panel2) 92%, transparent);
      backdrop-filter: blur(8px);
      padding:10px 12px;
      box-shadow: var(--shadow);
      display:none;
      max-width: 420px;
      z-index: 80;
      font-size:13px;
      color: var(--text);
    }
    .toast.show{display:block}
    .toast .small{color:var(--muted); font-size:12px; margin-top:4px}

    .authCard.loading{
      transform: translateY(-1px);
      box-shadow: 0 18px 50px rgba(0,0,0,.22);
    }
    .authStatus{
      display:flex;
      align-items:center;
      gap:10px;
      margin-top:12px;
      padding:10px 12px;
      border-radius:14px;
      border:1px solid var(--line);
      background: color-mix(in srgb, var(--panel2) 88%, transparent);
      color: var(--text);
      font-size:13px;
    }
    .spinner{
      width:16px;
      height:16px;
      border-radius:999px;
      border:2px solid color-mix(in srgb, var(--text) 16%, transparent);
      border-top-color: var(--accent);
      animation: authSpin .8s linear infinite;
      flex:0 0 auto;
    }
    .spinner.sm{width:14px;height:14px;border-width:2px}
    .btn.loading{
      opacity:.94;
      pointer-events:none;
    }
    .btn.loading .btnSpinner{
      display:inline-flex;
      margin-right:8px;
      vertical-align:-2px;
    }
    .btn.loading .btnSpinner .spinner{
      width:14px;
      height:14px;
      border-width:2px;
    }
    @keyframes authSpin{to{transform:rotate(360deg)}}

    .tagPill{
      display:inline-flex; align-items:center; gap:6px;
      padding:2px 8px;
      border-radius: 999px;
      border:1px dashed rgba(255,255,255,.18);
      color:var(--muted);
      font-size:12px;
      background: rgba(255,255,255,.02);
    }

  
/* Leads: scrollbar horizontal no topo + colunas fixas (Lead e Ações) */
.hscrollTop{overflow-x:auto;overflow-y:hidden;height:14px;border-radius:10px;margin:10px 0 8px 0;background:rgba(255,255,255,.03);}
.hscrollTop::-webkit-scrollbar{height:10px}
.hscrollTopInner{height:1px}
.leadsTableWrap .tableWrap{overflow-x:auto; position:relative;}
/* sticky primeira e última coluna (evita “sumir nome” ou “sumir ações”) */
.leadsTableWrap table thead th:first-child,
.leadsTableWrap table tbody td:first-child{
  position:sticky; left:0; z-index:4; background:rgba(10,14,22,.96);
  box-shadow: 8px 0 16px rgba(0,0,0,.35);
}
.leadsTableWrap table thead th:last-child,
.leadsTableWrap table tbody td:last-child{
  position:sticky; right:0; z-index:5; background:rgba(10,14,22,.96);
  box-shadow: -8px 0 16px rgba(0,0,0,.35);
}

/* Status dots — cores por status (Leads) */
.dot.st-yellow{background: #facc15;}
.dot.st-blue{background: #38bdf8;}
.dot.st-green{background: #22c55e;}
.dot.st-purple{background: #19c6ff;}
.dot.st-orange{background: #fb923c;}
.dot.st-red{background: #ef4444;}
.dot.st-gray{background: #9ca3af;}

/* Leads: sem scroll horizontal + ações em linha + layout mais denso */
.leadsTableWrap .hscrollTop{display:none!important;}
.leadsTableWrap .tableWrap{overflow-x:visible!important;}
.leadsTableWrap table{min-width:0!important; width:100%!important; table-layout:fixed;}
.leadsTableWrap th, .leadsTableWrap td{word-break:break-word;}
.leadsTableWrap .nowrap{white-space:normal!important;}
.leadsTableWrap .actionsCell{display:flex; gap:8px; justify-content:flex-end; align-items:center; flex-wrap:nowrap; white-space:nowrap;}
/* Ajuste sutil de densidade */
.leadsTableWrap th, .leadsTableWrap td{padding:6px 8px!important; vertical-align:middle!important;}

/* Área de leads */
#view-leads .tableWrap{overflow-x:auto; position:relative; border-radius:14px;}
#view-leads .tableWrap::-webkit-scrollbar{height:0px;}
#view-leads .tableWrap{scrollbar-width:none;}
#view-leads .tableWrap table{min-width:0 !important; width:100% !important; table-layout:fixed !important;}
#view-leads table thead th:first-child,
#view-leads table tbody td:first-child{
  position:sticky; left:0; z-index:3;
  background:linear-gradient(180deg, rgba(9,14,20,.96), rgba(9,14,20,.86));
}
#view-leads table thead th:last-child,
#view-leads table tbody td:last-child{
  position:sticky; right:0; z-index:4;
  background:linear-gradient(180deg, rgba(9,14,20,.96), rgba(9,14,20,.86));
}
#view-leads table thead th:last-child{z-index:6;}

/* Light theme: keep sticky columns consistent (no dark gradient blocks) */
.light #view-leads table thead th:first-child,
.light #view-leads table tbody td:first-child,
.light #view-leads table thead th:last-child,
.light #view-leads table tbody td:last-child{
  background: var(--panel2) !important;
}
.actionsCell{display:flex; flex-direction:row; flex-wrap:nowrap !important; gap:10px; justify-content:flex-end; align-items:center;}
.actionsCell .miniBtn{width:40px; height:40px;}
/* top horizontal scroller (always accessible) */
#leadsTopScroll{position:sticky; top:0; z-index:8; height:14px; margin:0 0 10px 0; border-radius:999px;
  background:rgba(255,255,255,.06); overflow-x:auto; overflow-y:hidden;}
#leadsTopScroll::-webkit-scrollbar{height:12px;}
#leadsTopScroll > .inner{height:1px;}


/* Gráficos e indicadores */
#view-dashboard .card h3{margin:0 0 8px 0;}
#view-dashboard .chartTitle{margin-top:0;}
.chartNote{margin-top:0;}


/* Área de leads */
#leads .tableWrap table{width:100%; table-layout:fixed;}
#leads .tableWrap th, #leads .tableWrap td{overflow:hidden; text-overflow:ellipsis; white-space:normal;}
#leads .tableWrap th:nth-child(10), #leads .tableWrap td:nth-child(10){width:160px;} /* Datas */
#leads .tableWrap th:nth-child(11), #leads .tableWrap td:nth-child(11){width:150px;} /* Ações */
#leads .tableWrap td:nth-child(2){white-space:nowrap;} /* Contato */
#leads .tableWrap td:nth-child(3){white-space:nowrap;} /* Status pill */

.actionsCell{flex-wrap:nowrap !important; justify-content:flex-end; gap:10px;}
.actionsCell .btnIcon{flex:0 0 auto;}

#view-tasks .tableWrap table{width:100% !important; table-layout:fixed;}
#view-tasks .tableWrap th, #view-tasks .tableWrap td{overflow:hidden; text-overflow:ellipsis; white-space:normal;}
#view-tasks .tableWrap th:nth-child(1), #view-tasks .tableWrap td:nth-child(1){width:120px;} /* Status */
#view-tasks .tableWrap th:nth-child(3), #view-tasks .tableWrap td:nth-child(3){width:180px;} /* Lead */
#view-tasks .tableWrap th:nth-child(4), #view-tasks .tableWrap td:nth-child(4){width:130px;} /* Vencimento */
#view-tasks .tableWrap th:nth-child(6), #view-tasks .tableWrap td:nth-child(6){width:160px;} /* Ação */
#view-tasks .tableWrap th:nth-child(2), #view-tasks .tableWrap td:nth-child(2){width:auto;} /* Tarefa (wrap) */

.chartRow canvas{height:320px !important;}



/* Área de leads */
#view-leads .tableWrap{
  overflow-x:auto !important;
}
#view-leads .tableWrap::-webkit-scrollbar{height:0 !important;}
#view-leads .tableWrap{scrollbar-width:none !important;}
/* Force the Leads table to scroll instead of squeezing columns (prevents overlap) */
#view-leads .tableWrap table{
  table-layout:auto !important;
  min-width: 1180px !important; /* enough for Dates + Actions */
  width: max(1180px, 100%) !important;
}
#view-leads th, #view-leads td{
  white-space: nowrap;
}
#view-leads td:first-child, #view-leads th:first-child{
  white-space: normal; /* lead name can wrap */
}
#view-leads th:nth-last-child(2), #view-leads td:nth-last-child(2){ /* Datas */
  width: 180px !important;
}
#view-leads th:last-child, #view-leads td:last-child{ /* Ações */
  width: 190px !important;
}
#view-leads .actionsCell{
  display:flex;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
  min-width: 190px;
}
#view-leads .actionsCell .btnIcon,
#view-leads .actionsCell .miniBtn{
  flex: 0 0 auto;
}

/* Tasks: remove horizontal scrollbar by making the layout truly fixed-width */
#view-tasks .tableWrap{
  overflow-x:hidden !important;
}
#view-tasks table{
  width:100% !important;
  table-layout: fixed !important;
}
#view-tasks th, #view-tasks td{
  word-break: break-word;
}
#view-tasks th:nth-child(1), #view-tasks td:nth-child(1){width:110px !important;} /* Status */
#view-tasks th:nth-child(2), #view-tasks td:nth-child(2){width:340px !important;} /* Tarefa */
#view-tasks th:nth-child(3), #view-tasks td:nth-child(3){width:220px !important;} /* Lead */
#view-tasks th:nth-child(4), #view-tasks td:nth-child(4){width:130px !important;} /* Vencimento */
#view-tasks th:nth-child(5), #view-tasks td:nth-child(5){width:220px !important;} /* Obs */
#view-tasks th:nth-child(6), #view-tasks td:nth-child(6){width:160px !important;} /* Ação */


/* === Leads: layout em 2 linhas (Lead + Ações em cima; detalhes embaixo) === */
.leadsTableWrap table thead{ display:none; } /* os labels ficam no card */
.leadsTableWrap .leadsTable{ table-layout: auto; }
.leadsTableWrap .leadsTable th,
.leadsTableWrap .leadsTable td{ position: static !important; left:auto !important; right:auto !important; box-shadow:none !important; background:transparent !important; }
.leadCardRow > td{ padding: 10px 0 !important; border-bottom: none !important; }
.leadCard{
  background: var(--card);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 14px 14px;
}
:root.light .leadCard{
  border-color: rgba(0,0,0,.10);
}
.leadCardTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}
.leadCardLead{ min-width: 0; }
.leadCardName{
  font-weight: 800;
  font-size: 16px;
  line-height: 1.15;
  letter-spacing: .2px;
  word-break: break-word;
}
.leadCardSub{ margin-top: 6px; font-size: 12.5px; line-height: 1.2; }
.leadCardTags{ margin-top: 8px; display:flex; flex-wrap:wrap; gap:6px; }
.leadCardActions{ text-align:right; flex: 0 0 auto; }
.leadCardActionsTitle{
  font-size: 12px;
  margin-bottom: 8px;
}
.leadCardActions .actionsCell{
  display:flex !important;
  flex-direction: row !important;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
}
.leadReadOnly{ margin-left: 8px; font-size: 12px; }
.leadCardBottom{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px 12px;
}
:root.light .leadCardBottom{ border-top-color: rgba(0,0,0,.10); }
.leadField .lbl{
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  margin-bottom: 6px;
  opacity: .75;
}
:root.light .leadField .lbl{ opacity: .9; }
/* evita “sombra”/sobreposição visual no modo claro */
:root.light .leadCardActionsTitle,
:root.light .leadCardSub .muted,
:root.light .leadField .lbl{ color: rgba(0,0,0,.65) !important; }

/* --- Leads 2-row layout (no horizontal scroll) --- */
.leadsTable2row{table-layout:fixed;width:100%;}
.leadsTable2row th,.leadsTable2row td{white-space:normal;overflow-wrap:anywhere;}
.leadsTable2row thead th{font-weight:700;letter-spacing:.02em;}
.leadsTable2row .leadRowMain td{padding:14px 14px 10px;}
.leadsTable2row .leadRowSub td{padding:0 14px 14px;}
.leadsTable2row .leadRowSub td:first-child{border-bottom-left-radius:16px;}
.leadsTable2row .leadRowSub td:last-child{border-bottom-right-radius:16px;}
.leadsTable2row .leadRowMain td:first-child{border-top-left-radius:16px;}
.leadsTable2row .leadRowMain td:last-child{border-top-right-radius:16px;}

.leadsTableWrap .tableWrap{overflow-x:hidden;}
.leadsTable2row thead th:first-child,
.leadsTable2row tbody td:first-child,
.leadsTable2row thead th:last-child,
.leadsTable2row tbody td:last-child{position:static;left:auto;right:auto;box-shadow:none;}
/* Fix: no dark blocks on first/last columns in 2-row Leads layout */
.leadsTable2row tbody td:first-child,
.leadsTable2row tbody td:last-child{
  background: transparent !important;
}


.leadContactBox{display:flex;flex-direction:column;gap:6px;min-width:0;}
.leadName{font-size:18px;font-weight:800;line-height:1.15;}
.leadMetaRow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
/* Tighter spacing in Lead/Contato (removes that '???' empty gap) */
.leadContactBox{gap:3px;}
.leadMetaRow{margin-top:2px;}
.leadName{line-height:1.1;}
.leadPhone{line-height:1.1;}

.leadPhone{opacity:.9;font-weight:700;}

.leadSubCell{display:flex;align-items:center;gap:12px;justify-content:center;}
.leadSubActions{justify-content:flex-end;}
.subLabel{font-size:12px;letter-spacing:.12em;opacity:.7;font-weight:800;}
.leadActionsRow{display:flex;gap:10px;align-items:center;flex-wrap:nowrap;}
.iconBtn{width:40px;height:40px;border-radius:14px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;}
.iconBtn:hover{background:rgba(255,255,255,.08);}
.iconBtnOk{border-color:rgba(59,130,246,.35);}
.iconBtnDanger{border-color:rgba(239,68,68,.35);}

.statusPill{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);font-weight:800;}
.emptyCell{padding:28px;text-align:center;opacity:.7;}

:root.light .leadsTable2row thead th{background:rgba(0,0,0,.04);color:rgba(0,0,0,.85);}
:root.light .iconBtn{border-color:rgba(0,0,0,.12);background:rgba(0,0,0,.03);}
:root.light .iconBtn:hover{background:rgba(0,0,0,.06);}
:root.light .statusPill{background:rgba(0,0,0,.03);border-color:rgba(0,0,0,.10);}


/* Summary (Dashboard) */
.summaryTable{width:100%; border-collapse:separate; border-spacing:0; overflow:hidden; border-radius:14px;
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08);}
.summaryTable thead th{padding:12px 14px; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  background:rgba(255,255,255,.04); border-bottom:1px solid rgba(255,255,255,.07); color:rgba(255,255,255,.78);}
.summaryTable tbody td{padding:12px 14px; border-bottom:1px solid rgba(255,255,255,.06); color:rgba(255,255,255,.86); font-size:14px;}
.summaryTable tbody tr:last-child td{border-bottom:none;}
.summaryTable .right{text-align:right;}
:root.light .summaryTable{background:rgba(0,0,0,.03); border-color:rgba(0,0,0,.08);}
:root.light .summaryTable thead th{background:rgba(0,0,0,.04); border-bottom-color:rgba(0,0,0,.08); color:rgba(0,0,0,.62);}
:root.light .summaryTable tbody td{border-bottom-color:rgba(0,0,0,.06); color:rgba(0,0,0,.82);}

/* Tasks action buttons — keep fully visible */
.tasksTable th:last-child, .tasksTable td:last-child{min-width:260px; width:260px;}
.tasksTable .actionsRow{display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:nowrap;}
.tasksTable td:last-child{overflow:visible;}
.tasksTable td:last-child{padding-right:18px;}
.tasksTable{table-layout:fixed;}
.tasksTable th, .tasksTable td{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.tasksTable td:nth-child(2){white-space:normal;} /* tarefa text can wrap a bit */

/* Better column sizing: keep actions inside, allow task to wrap instead of squeezing */
.tasksTable{width:100%;}
.tasksTable th, .tasksTable td{white-space:normal;} /* allow wrapping by default */
.tasksTable th:nth-child(1), .tasksTable td:nth-child(1){width:110px;}
.tasksTable th:nth-child(2), .tasksTable td:nth-child(2){width:28%;} /* tarefa */
.tasksTable th:nth-child(3), .tasksTable td:nth-child(3){width:22%;} /* lead */
.tasksTable th:nth-child(4), .tasksTable td:nth-child(4){width:120px;} /* vencimento */
.tasksTable th:nth-child(5), .tasksTable td:nth-child(5){width:auto;} /* obs */
.tasksTable th:nth-child(6), .tasksTable td:nth-child(6){width:230px; min-width:230px;}
.tasksTable td:nth-child(6){padding-right:26px;}
.tasksTable .actionsRow{justify-content:flex-end; gap:10px;}
.tasksTable .actionsRow{flex-wrap:nowrap;}
.tasksTable td:nth-child(6) .btn{flex:0 0 auto;}
/* Keep 'Abrir lead' below icons */
.tasksTable td:nth-child(6) .actionsCol{display:flex; flex-direction:column; align-items:flex-end; gap:8px;}

/* Leads 2-row header contrast in light mode */
:root.light .leadsTable2row thead th{background:rgba(0,0,0,.06); color:rgba(0,0,0,.75); border-bottom-color:rgba(0,0,0,.08);}
:root.light .leadsTable2row{background:rgba(0,0,0,.03); border-color:rgba(0,0,0,.08);}


/* --- FIX15: Leads table (2-row layout) - evita quebra/colunas fantasmas --- */
#view-leads .tableWrap{ overflow-x:hidden !important; }
#view-leads table{ width:100% !important; table-layout:fixed; }
#view-leads thead th{ font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.78rem; opacity:.9; }
#view-leads tbody td{ vertical-align:middle; }
#view-leads .leadCell .leadName{ white-space:normal; overflow:visible; text-overflow:clip; }
#view-leads .row2 .actionsCell{ justify-content:flex-end; }
@media (max-width: 900px){
  #view-leads table{ table-layout:auto; }
}



/* === FIX layout dashboard resumo/leads filtrados === */

/* Evita 'Resumo por Status' engolir a tela e esconder os Leads filtrados */
#dashByStatus .tableWrap{max-height:none; overflow:visible;}
#dashPreview{max-height:none; overflow:visible;}
    /* ===== Dashboard: Resumo por Status + Leads filtrados ===== */
    .dashSplit{display:grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap:14px; align-items:start;}
    .dashSplit > .card{min-width:0;}

@media (max-width:900px){.dashSplit{grid-template-columns: 1fr;}}
#dashByStatusTable{ table-layout: fixed; width: 100%; }
#dashByStatusTable th:nth-child(1), #dashByStatusTable td:nth-child(1){ width:55%; text-align:left; }
#dashByStatusTable th:nth-child(2), #dashByStatusTable td:nth-child(2){ width:15%; text-align:right; }
#dashByStatusTable th:nth-child(3), #dashByStatusTable td:nth-child(3){ width:30%; text-align:right; }

#dashByStatusTable td, #dashByStatusTable th{color:inherit;}

/* Status grid fallback (more robust than table in some environments) */
.statusGrid{
  display:grid;
  grid-template-columns: 1.6fr .6fr 1fr;
  width:100%;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.02);
}

/* cells (headers + body) */
.statusGrid > div,
.statusGrid .sgRow > div{
  padding:14px 20px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:inherit;
}

:root.light .statusGrid > div,
:root.light .statusGrid .sgRow > div{
  border-bottom:1px solid rgba(17,24,39,.10);
}

.statusGrid > div.sgHead{
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:.78rem;
  opacity:.9;
  background:rgba(255,255,255,.03);
}

:root.light .statusGrid > div.sgHead{background:rgba(17,24,39,.03);}

.statusGrid .right{text-align:right;}
.statusGrid .center{text-align:center;}
.statusGrid .sgRow{display:contents;}
.statusGrid .sgRow:last-child > div{border-bottom:none;}
:root.light .statusGrid{background:rgba(17,24,39,.02);}
:root.light .statusGrid > div.sgHead{background:rgba(17,24,39,.04);}

:root.light #dashByStatusTable th{ color: rgba(0,0,0,.75); }

/* --- Summary table fit (no horizontal scroll) --- */
.tableWrap.noX{overflow-x:hidden;}
.summaryTable{width:100%; table-layout:fixed;}
.summaryTable th,.summaryTable td{padding:10px 12px;}
.summaryTable th:nth-child(2), .summaryTable td:nth-child(2){text-align:center;}
.summaryTable th:nth-child(3), .summaryTable td:nth-child(3){text-align:right;}
.summaryTable th,.summaryTable td{overflow:hidden; text-overflow:ellipsis;}
.summaryTable th:first-child,.summaryTable td:first-child{white-space:normal;}

    @media (max-width: 900px){ .dashSplit{grid-template-columns: 1fr;} }
    #dashStatusCard .tableWrap{overflow:visible; max-height:none;}
    #dashStatusCard table{width:100%; table-layout:fixed;}
    #dashStatusCard th:nth-child(1), #dashStatusCard td:nth-child(1){width:58%; text-align:left;}
    #dashStatusCard th:nth-child(2), #dashStatusCard td:nth-child(2){width:14%; text-align:center;}
    #dashStatusCard th:nth-child(3), #dashStatusCard td:nth-child(3){width:28%; text-align:right;}
    #dashStatusCard th, #dashStatusCard td{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
    #dashPreview{max-height:none; overflow:visible;}

/* Em telas menores, empilha bonito */
@media (max-width: 980px){
  .cols2{grid-template-columns:1fr;}
  #dashByStatus .tableWrap, #dashPreview{max-height:none;}
}



/* === FIX layout dashboard resumo/leads filtrados === */
html, body{overflow-x:hidden;}


/* === FIX layout dashboard resumo/leads filtrados === */

/* Light mode: garante fundos coerentes em tabelas/cartões */
html.light .tableWrap{background:var(--panel);}
html.light .tableWrap th{background:var(--panel2); color:var(--text);}
html.light .tableWrap td{background:transparent; color:var(--text);}
html.light .card, html.light .panel{background:var(--panel); color:var(--text);}



/* Área de leads */
#view-dashboard .grid.cols2{
  grid-template-columns: 50% 50%;
  gap: 12px;
  align-items: start;
}
@media (max-width: 980px){
  #view-dashboard .grid.cols2{ grid-template-columns: 1fr; }
}
#view-dashboard #dashStatusCard,
#view-dashboard #dashPreviewCard{ min-width: 0; }

/* Resumo por Status: sem scroll + colunas alinhadas */
#view-dashboard #dashStatusCard,
#view-dashboard #dashStatusCard .kpiCard,
#view-dashboard #dashStatusCard .tableWrap{
  overflow: hidden !important;
}
#view-dashboard #dashStatusCard .tableWrap{
  max-height: none !important;
  scrollbar-width: none; /* Firefox */
}
#view-dashboard #dashStatusCard .tableWrap::-webkit-scrollbar{
  width: 0; height: 0; /* Chrome/Edge */
}
#view-dashboard #dashStatusCard table{
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
}
#view-dashboard #dashStatusCard th,
#view-dashboard #dashStatusCard td{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#view-dashboard #dashStatusCard th:nth-child(1){ width: 45%; text-align:left; }
#view-dashboard #dashStatusCard th:nth-child(2),
#view-dashboard #dashStatusCard td:nth-child(2){ width: 15%; text-align: center; }
#view-dashboard #dashStatusCard th:nth-child(3),
#view-dashboard #dashStatusCard td:nth-child(3){ width: 40%; text-align: right; }
#view-dashboard #dashPreview{max-height:520px; overflow-y:auto; overflow-x:hidden; padding-right:4px;}

/* Prevent horizontal scroll caused by wide KPI/graph content */
html, body{ overflow-x: hidden; }


#dashByStatus table{ table-layout: fixed; width: 100%; }
#dashByStatus th:nth-child(1), #dashByStatus td:nth-child(1){ width:50%; text-align:left; }
#dashByStatus th:nth-child(2), #dashByStatus td:nth-child(2){ width:20%; text-align:center; }
#dashByStatus th:nth-child(3), #dashByStatus td:nth-child(3){ width:30%; text-align:right; }


/* ===== Parcelamentos ===== */
.instRow{border:1px solid var(--line); border-radius:14px; padding:12px; margin:10px 0; background:rgba(255,255,255,.02);}
.instHead{display:flex; gap:10px; align-items:flex-start; justify-content:space-between;}
.instName{font-weight:800;}
.instMeta{display:flex; gap:10px; flex-wrap:wrap; margin-top:6px;}
.chip{display:inline-flex; gap:6px; align-items:center; padding:6px 10px; border-radius:999px; border:1px solid var(--line); font-size:12px; color:var(--muted);}
.chip b{color:var(--text); font-weight:800;}
.instBtns{display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end;}
.instMeta.compact{margin-top:10px;}
.instSummary{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin-top:10px;}
.instMetric{border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:rgba(255,255,255,.03);min-width:0;}
.instMetricLabel{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px;}
.instMetric strong{display:block;color:var(--text);font-size:16px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.instMetric.is-ok strong{color:var(--ok);}
.instMetric.is-pending strong{color:var(--warn);}
.instMetric.is-late strong{color:var(--danger);}
.instAlert{margin-top:10px;padding:10px 12px;border-radius:14px;border:1px dashed var(--line);font-size:13px;font-weight:800;}
.instAlert.ok{color:var(--ok);background:rgba(34,197,94,.10);border-color:rgba(34,197,94,.25);}
.instAlert.pending{color:var(--warn);background:rgba(251,191,36,.10);border-color:rgba(251,191,36,.26);}
.instAlert.late{color:var(--danger);background:rgba(244,63,94,.10);border-color:rgba(244,63,94,.26);}
.instAlert.neutral{color:var(--muted);background:rgba(148,163,184,.06);border-color:rgba(148,163,184,.18);}
.instExtra{margin-top:10px;border-top:1px dashed var(--line);padding-top:10px;}
.instExtra summary{list-style:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-weight:800;color:var(--text);user-select:none;}
.instExtra summary::-webkit-details-marker{display:none;}
.instExtra summary::after{content:"▾";font-size:12px;opacity:.82;transition:transform .18s ease;}
.instExtra[open] summary::after{transform:rotate(180deg);}
.instExtra > .instMeta{margin-top:10px;}


@media (max-width: 980px){
  .instHead{flex-direction:column;}
  .instBtns{justify-content:flex-start;}
  .instSummary{grid-template-columns:repeat(2,minmax(140px,1fr));}
}
@media (max-width: 560px){
  .instSummary{grid-template-columns:1fr;}
}
.instBody{margin-top:10px; border-top:1px dashed var(--line); padding-top:10px; display:none;}
.instRow.open .instBody{display:block;}
.instTable{width:100%; border-collapse:collapse; font-size:13px;}
.instTable th,.instTable td{padding:8px 6px; border-bottom:1px solid rgba(255,255,255,.06); vertical-align:top;}
.badge{display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; font-size:12px; border:1px solid var(--line);}
.badge.ok{color:var(--ok);}
.badge.late{color:var(--danger);}
.badge.pending{color:var(--warn);}
.miniLink{color:var(--info); text-decoration:none; font-weight:700;}
.miniLink.waChargeBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:8px 14px;
  border-radius:12px;
  border:1px solid rgba(34,197,94,.38);
  background:rgba(34,197,94,.14);
  color:#86efac;
  line-height:1;
  box-shadow:none;
}
.miniLink.waChargeBtn:hover{
  filter:brightness(1.08);
  border-color:rgba(34,197,94,.55);
  background:rgba(34,197,94,.20);
}
html.light .miniLink.waChargeBtn,
body.light .miniLink.waChargeBtn,
:root.light .miniLink.waChargeBtn{
  color:#047857;
  background:rgba(16,185,129,.12);
  border-color:rgba(16,185,129,.32);
}


/* Ajustes visuais do Cronos */
.kpiGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;}
.topbar{flex-wrap:wrap;}
.topbar .actions{flex-wrap:wrap;}

/* ===== Tooltips (gráficos) ===== */
#chartTooltip{
  position:fixed; z-index:99999; pointer-events:none;
  background:rgba(0,0,0,0.82); color:#fff;
  padding:8px 10px; border-radius:10px;
  font-size:12px; line-height:1.25;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
  transform: translate(-50%, -120%);
  max-width: 260px;
  display:none;
}
:root.light #chartTooltip{background:rgba(30,30,30,0.9);}
#chartTooltip .ttTitle{font-weight:700; margin-bottom:4px;}
#chartTooltip .ttRow{display:flex; gap:8px; justify-content:space-between;}
#chartTooltip .ttDot{width:8px; height:8px; border-radius:99px; margin-top:4px;}
#chartTooltip .ttSources{margin:4px 0 2px 16px; opacity:.96; font-size:11px; line-height:1.25;}
#chartTooltip .ttSourceLine{display:flex; justify-content:space-between; gap:10px; max-width:230px;}
#chartTooltip .ttSourceMore{opacity:.78; margin-top:2px;}
#chartTooltip .ttHint{margin-top:6px; opacity:.72; font-size:11px; border-top:1px solid rgba(255,255,255,.16); padding-top:5px;}


/* KPI clicável */
.kpi[data-kpi]{cursor:pointer; user-select:none;}
.kpi[data-kpi]:hover{transform: translateY(-1px); box-shadow: 0 12px 30px rgba(0,0,0,.18);}
.kpi.kpiActive{outline:2px solid rgba(22,119,255,.90); box-shadow: 0 12px 30px rgba(22,119,255,.20);}
.tagList{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.tagPill{padding:6px 10px;border:1px solid var(--line);border-radius:999px;font-size:12px;background:rgba(255,255,255,.05);}
:root.light .tagPill{background:rgba(17,24,39,.05);}
:root.light .kpi[data-kpi]:hover{box-shadow: 0 12px 30px rgba(0,0,0,.12);}


/* ===== Leads (aba) em formato de cards ===== */

#view-leads .badge{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:800;
  padding:6px 10px; border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  white-space:nowrap;
}
#view-leads .badge.hot{border-color: rgba(255,82,82,.35); background: rgba(255,82,82,.10);}
#view-leads .badge.warm{border-color: rgba(255,200,87,.35); background: rgba(255,200,87,.10);}
#view-leads .badge.cold{border-color: rgba(90,184,255,.35); background: rgba(90,184,255,.10);}
#view-leads .badge.neutral{opacity:.8;}

#view-leads .leadsCards{display:flex; flex-direction:column; gap:12px;}
#view-leads .leadCard{
  background: linear-gradient(180deg, rgba(255,255,255,.035), transparent 55%), var(--panel2);
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
  padding:14px;
  box-shadow: 0 8px 26px rgba(0,0,0,.25);
}
#view-leads .leadCard:hover{border-color: rgba(22,119,255,.55); transform: translateY(-1px);}
#view-leads .leadCardTop{display:flex; align-items:flex-start; justify-content:space-between; gap:12px;}
#view-leads .leadTitle{display:flex; flex-direction:column; gap:6px; min-width:0;}
#view-leads .leadNameRow{display:flex; gap:10px; align-items:center; min-width:0;}
#view-leads .leadNameRow .name{font-weight:800; font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#view-leads .leadMeta{font-size:12px; color:var(--muted); display:flex; gap:10px; flex-wrap:wrap;}
#view-leads .leadGrid{display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:10px; margin-top:12px;}
#view-leads .kv{background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.06); border-radius:12px; padding:10px;}
:root.light #view-leads .kv{background:rgba(17,24,39,.03); border-color:rgba(17,24,39,.12); box-shadow: inset 0 1px 0 rgba(255,255,255,.55);}
#view-leads .kv .k{font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.7);}
:root.light #view-leads .kv .k{color:rgba(17,24,39,.70);}
:root.light .leadCard .kv .k{color:rgba(17,24,39,.78)!important;}

#view-leads .kv .v{margin-top:4px; font-weight:700; color:var(--text); word-break:break-word;}
:root.light .chip{background:rgba(17,24,39,.04); border-color:rgba(17,24,39,.12); color:rgba(17,24,39,.92);}
:root.light .chip .dot.st-yellow{background:#ca8a04;}
:root.light .chart-inline-value{color:var(--text);}
:root.light #view-dashboard .chartNote,
:root.light #view-dashboard .muted{color:rgba(15,23,42,.72);}
:root:not(.light) #view-dashboard .chart-inline-value{color:rgba(235,240,246,.95);}
#view-leads .leadCardBottom{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px;}
#view-leads .leadActionsRow{display:flex; gap:8px; align-items:center; flex-wrap:wrap;}
#view-leads .leadActionsRow .iconBtn{border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04);}
#view-leads .leadActionsRow .iconBtn:hover{border-color: rgba(22,119,255,.55);}
@media (max-width: 1100px){
  #view-leads .leadGrid{grid-template-columns: repeat(2, minmax(0,1fr));}
}
@media (max-width: 640px){
  #view-leads .leadGrid{grid-template-columns: 1fr;}
  #view-leads .leadCardBottom{flex-direction:column; align-items:stretch;}
}


/* ===== Tasks: action buttons alignment ===== */
.taskActionsCell{display:flex;flex-direction:column;gap:8px;align-items:flex-end;padding-right:16px;}
.taskActionsCell .miniBtn{flex:0 0 auto;}
.taskActionsCell .taskOpenLead{align-self:flex-end;}

.taskActionsRow{display:flex;gap:10px;justify-content:flex-end;flex-wrap:nowrap;}
.taskActionsRow .miniBtn{min-width:36px;}
#view-tasks td:last-child{padding-right:16px;}

/* Área de tarefas */
.taskActionsCell .taskOpenLead{
  align-self:flex-end;
  min-height:40px;
  padding:10px 16px;
  border-radius:14px;
  font-weight:800;
  justify-content:center;
}
.taskActionsRow.leadActionsRow{gap:10px;justify-content:flex-end;}
.taskActionsRow .iconBtn svg.cronos-action-icon{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
:root.light .taskActionsCell .taskOpenLead,
html.light .taskActionsCell .taskOpenLead,
body.light .taskActionsCell .taskOpenLead{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(37,99,235,.45) !important;
  background:linear-gradient(135deg,#2563eb,#06b6d4) !important;
  box-shadow:0 10px 22px rgba(37,99,235,.20) !important;
}
:root:not(.light) .taskActionsCell .taskOpenLead,
html:not(.light) .taskActionsCell .taskOpenLead,
body:not(.light) .taskActionsCell .taskOpenLead{
  color:#dbeafe !important;
  -webkit-text-fill-color:#dbeafe !important;
  border-color:rgba(96,165,250,.50) !important;
  background:rgba(37,99,235,.12) !important;
  box-shadow:0 10px 24px rgba(37,99,235,.10) !important;
}
.taskActionsCell .taskOpenLead:hover{filter:brightness(1.04);transform:translateY(-1px);}


/* Resumo por Status (Status | Total | Valor) */
.summaryTable{width:100%; border-collapse:separate; border-spacing:0;}
.summaryTable thead th, .summaryTable tbody td{padding:14px 20px;}
.summaryTable thead th:first-child, .summaryTable tbody td:first-child{padding-left:22px;}
.summaryTable thead th:last-child, .summaryTable tbody td:last-child{padding-right:22px;}
.summaryTable thead th:nth-child(2), .summaryTable tbody td:nth-child(2){text-align:center; width:90px;}
.summaryTable thead th:nth-child(3), .summaryTable tbody td:nth-child(3){text-align:right; width:170px;}

/* Tarefas – colunas e ações */
.tasksTable{width:100%; table-layout:fixed;}
.tasksTable th, .tasksTable td{vertical-align:top;}
.tasksTable th:nth-child(1), .tasksTable td:nth-child(1){width:140px;} /* Status */
.tasksTable th:nth-child(4), .tasksTable td:nth-child(4){width:130px;} /* Vencimento */
.tasksTable th:nth-child(6), .tasksTable td:nth-child(6){width:260px; min-width:260px;} /* Ação */
.tasksTable th:nth-child(2), .tasksTable td:nth-child(2){width:36%;} /* Tarefa */
.tasksTable th:nth-child(3), .tasksTable td:nth-child(3){width:24%;} /* Lead */
.tasksTable th:nth-child(5), .tasksTable td:nth-child(5){width:auto;} /* Obs */

.tasksTable td:nth-child(2){
  white-space:normal;
  word-break:break-word;
  overflow-wrap:anywhere;
  line-height:1.35;
}
.tasksTable td:nth-child(3), .tasksTable td:nth-child(5){white-space:normal;}

/* Aproxima Lead de Tarefa sem esmagar o resto */
.tasksTable th:nth-child(2), .tasksTable td:nth-child(2){padding-right:10px;}
.tasksTable th:nth-child(3), .tasksTable td:nth-child(3){padding-left:10px;}

/* Ações: ícones em cima, Abrir lead embaixo, sem cortar */
.tasksTable td:last-child{padding-right:28px; overflow:visible;}
.tasksTable td:last-child .actionsCol{align-items:flex-end;}
.tasksTable td:last-child .actionsRow{gap:8px; justify-content:flex-end; flex-wrap:nowrap;}



/* Área de tarefas */

/* Dashboard: Resumo por Status (grid) — alinhado tipo "tabela limpa" */
#dashByStatusGrid.statusGrid{
  grid-template-columns: 1.55fr .65fr 1fr !important;
}
#dashByStatusGrid.statusGrid > div.sgHead{
  padding:14px 20px !important;
}
#dashByStatusGrid.statusGrid > div.sgHead:nth-child(1){ text-align:left !important; }
#dashByStatusGrid.statusGrid > div.sgHead:nth-child(2){ text-align:center !important; }
#dashByStatusGrid.statusGrid > div.sgHead:nth-child(3){ text-align:right !important; }

#dashByStatusGrid.statusGrid .sgRow > div{
  padding:14px 20px !important;
}
#dashByStatusGrid.statusGrid .sgRow > div:nth-child(1){ text-align:left !important; }
#dashByStatusGrid.statusGrid .sgRow > div:nth-child(2){ text-align:center !important; }
#dashByStatusGrid.statusGrid .sgRow > div:nth-child(3){ text-align:right !important; }

/* Tarefas: evita cortar ações e melhora distribuição */
#view-tasks .tableWrap{ overflow-x:hidden !important; }
#view-tasks .tasksTable{ table-layout:fixed !important; width:100% !important; }
#view-tasks .tasksTable th:nth-child(6),
#view-tasks .tasksTable td:nth-child(6){
  width:300px !important;
  min-width:300px !important;
}
#view-tasks .tasksTable td:nth-child(6){
  padding-right:42px !important;
  overflow:visible !important;
}
#view-tasks .tasksTable th:nth-child(2),
#view-tasks .tasksTable td:nth-child(2){
  width:40% !important;
}
#view-tasks .tasksTable th:nth-child(3),
#view-tasks .tasksTable td:nth-child(3){
  width:22% !important;
}
#view-tasks .tasksTable td:nth-child(2){
  white-space:normal !important;
  word-break:break-word !important;
  overflow-wrap:anywhere !important;
  line-height:1.35 !important;
}
#view-tasks .tasksTable td:nth-child(3),
#view-tasks .tasksTable td:nth-child(5){
  white-space:normal !important;
}


.chart-inline-value{margin-left:10px;font-weight:800;letter-spacing:0.2px;color:rgba(235,240,255,0.95);} 

/* ===== Access guard / renewal ===== */
.accessGateCard{
  width:min(560px, 100%);
  border:1px solid var(--line);
  border-radius:26px;
  background: linear-gradient(180deg, rgba(255,255,255,.05), transparent 42%), var(--panel);
  box-shadow: var(--shadow);
  padding:20px 18px;
}
.accessGateHeader{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.accessGateBadge{
  width:44px;
  height:44px;
  border-radius:999px;
  display:grid;
  place-items:center;
  font-size:20px;
  background: rgba(255,255,255,.05);
  border:1px solid var(--line);
}
.accessGateTitle{
  margin:0;
  font-size:26px;
  line-height:1.02;
  letter-spacing:-.02em;
}
.accessGateText{
  margin:10px 0 0;
  color:var(--muted);
  line-height:1.5;
}
.accessGateMeta{
  margin-top:14px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.03);
  color:var(--text);
  display:grid;
  gap:8px;
}
.accessGateActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.accessGateActions .btn{
  flex:1 1 220px;
  justify-content:center;
}
.accessNotice{
  width:min(560px, 100%);
  border:1px solid var(--line);
  border-radius:22px;
  background: var(--panel2);
  box-shadow: 0 20px 60px rgba(17,24,39,.15);
  padding:18px 16px;
}
.accessNoticeHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}
.accessNoticeHead h3{
  margin:0;
  font-size:20px;
}
.accessNoticeText{
  color:var(--muted);
  line-height:1.5;
  margin:0 0 14px;
}
.accessNoticeActions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
}
.accessNoticeDays{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.04);
  color:var(--text);
  font-size:12px;
  font-weight:700;
}

.main{position:relative;}
.userRowPending{opacity:.56;filter:saturate(.72);}
.userRowInactive{opacity:.45;filter:saturate(.6);}
.chipWarn{background:rgba(251,191,36,.16);border:1px dashed rgba(251,191,36,.35);color:#ffd76b;}
.chipDanger{background:rgba(251,113,133,.16);border:1px dashed rgba(251,113,133,.35);color:#ff9aac;}
.nav button.feature-locked{
  opacity:.48 !important;
  filter:saturate(.65);
  border-style:dashed !important;
}
.nav button.feature-locked:hover{
  transform:none !important;
  background: rgba(255,255,255,.03) !important;
}
.nav button.feature-locked .featureLockTag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:24px;
  padding:0 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  font-size:11px;
  color:#ffe8a3;
  background:rgba(255,204,0,.10);
  margin-left:8px;
}
.nav button.feature-hidden{
  display:none !important;
}
body.feature-lock-active,
html.feature-lock-active{
  overflow:hidden !important;
}
#featureBlockedOverlay{
  position:fixed;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:9999;
  background:rgba(5,8,14,.84);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.05);
  border-radius:24px;
  inset:24px 24px 24px 324px;
}
#featureBlockedOverlay.show{display:flex;}
@media(max-width:980px){
  #featureBlockedOverlay{
    inset:16px;
  }
}
#featureBlockedOverlay .featureBlockedCard{
  width:min(760px, calc(100% - 24px));
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)), var(--panel);
  box-shadow:0 24px 60px rgba(0,0,0,.50);
  padding:30px 28px;
  text-align:center;
}
#featureBlockedOverlay .featureBlockedEyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(255,204,0,.22);
  background:rgba(255,204,0,.10);
  color:#ffe8a3;
  font-size:12px;
  font-weight:800;
  margin-bottom:14px;
}
#featureBlockedOverlay .featureBlockedTitle{
  margin:0 0 10px;
  font-size:34px;
  line-height:1.04;
}
#featureBlockedOverlay .featureBlockedText{
  margin:0;
  color:var(--text);
  font-size:18px;
  line-height:1.55;
}
#featureBlockedOverlay .featureBlockedText + .featureBlockedText{
  margin-top:10px;
  color:var(--muted);
}
:root.light #featureBlockedOverlay{
  background:rgba(255,255,255,.82);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
:root.light #featureBlockedOverlay .featureBlockedCard{
  background:rgba(255,255,255,.92);
  border-color:rgba(15,23,42,.12);
  box-shadow:0 24px 70px rgba(15,23,42,.14);
}
:root.light #featureBlockedOverlay .featureBlockedBadge{
  background:rgba(245,158,11,.22);
  color:#7c3e00;
  border-color:rgba(180,83,9,.32);
  font-weight:800;
}
:root.light #featureBlockedOverlay .featureBlockedTitle{
  color:#0f172a;
}
:root.light #featureBlockedOverlay .featureBlockedText{
  color:rgba(15,23,42,.82);
}
:root.light #featureBlockedOverlay .featureBlockedText + .featureBlockedText{
  color:rgba(15,23,42,.68);
}


/* Simulador de crédito */
html.light #view-creditSimulator,
html.light #view-creditSimulator *{
  color: var(--text) !important;
}
html.light #view-creditSimulator .credHero,
html.light #view-creditSimulator .credCard{
  background: var(--panel) !important;
  border-color: var(--line) !important;
  box-shadow: var(--shadow) !important;
}
html.light #view-creditSimulator .credMode button,
html.light #view-creditSimulator .credBtn,
html.light #view-creditSimulator .credForm input,
html.light #view-creditSimulator .credCard input,
html.light #view-creditSimulator .credSelected,
html.light #view-creditSimulator .credSuggestion,
html.light #view-creditSimulator .credPlan,
html.light #view-creditSimulator .credHistItem,
html.light #view-creditSimulator .credBox{
  background: rgba(255,255,255,.72) !important;
  border-color: rgba(17,24,39,.14) !important;
  color: var(--text) !important;
}
html.light #view-creditSimulator .credForm input[readonly]{
  background: rgba(17,24,39,.04) !important;
  color: rgba(15,23,42,.72) !important;
}
html.light #view-creditSimulator .credMuted,
html.light #view-creditSimulator .credPill{
  color: var(--muted) !important;
}
html.light #view-creditSimulator .credSuccess{
  background: rgba(6,182,212,.10) !important;
  border-color: rgba(6,182,212,.35) !important;
}
html.light #view-creditSimulator .credAlert{
  background: rgba(217,119,6,.10) !important;
  border-color: rgba(217,119,6,.30) !important;
}


/* Menu lateral e indicadores */
.brand{gap:8px; padding:10px 10px; min-width:0;}
.brand > div:not(.logoBox){min-width:0; flex:1 1 auto;}
.brand h1{font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:-.02em;}
.brand p{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.logoBox{width:40px; height:40px;}
.logoBox svg{width:28px; height:28px;}
.brand .iconBtn{width:38px; height:38px; border-radius:13px; flex:0 0 auto;}
@media(max-width:1100px){
  .brand h1{font-size:13px;}
  .logoBox{width:36px;height:36px;}
  .brand .iconBtn{width:36px;height:36px;}
}


/* Simulador de crédito */
#view-creditSimulator .credEntryPctBadge{display:none !important;}
#view-creditSimulator .credEntryPctGroup label{display:block !important;}
#view-creditSimulator .credEntryPctInline{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 94px !important;
  gap:10px !important;
  align-items:center !important;
}
#view-creditSimulator #credEntryPct{
  opacity:1 !important;
  text-align:center !important;
  font-weight:900 !important;
  color:#dbeafe !important;
  -webkit-text-fill-color:#dbeafe !important;
  background:rgba(96,165,250,.10) !important;
  border-color:rgba(147,197,253,.22) !important;
  cursor:default !important;
}
:root.light #view-creditSimulator #credEntryPct,
html.light #view-creditSimulator #credEntryPct,
body.light #view-creditSimulator #credEntryPct{
  opacity:1 !important;
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
  background:rgba(37,99,235,.12) !important;
  border-color:rgba(37,99,235,.30) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.65) !important;
}
@media(max-width:720px){
  #view-creditSimulator .credEntryPctInline{grid-template-columns:1fr !important;}
  #view-creditSimulator #credEntryPct{text-align:left !important;}
}

/* Ações rápidas da lateral */
.sideFooter .row button{
  font-weight:800;
  letter-spacing:-.01em;
  justify-content:center;
}
:root.light #btnNewLeadSide,
html.light #btnNewLeadSide,
body.light #btnNewLeadSide,
:root.light #btnRefreshNow,
html.light #btnRefreshNow,
body.light #btnRefreshNow{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(37,99,235,.45) !important;
  background:linear-gradient(135deg,#2563eb,#06b6d4) !important;
  box-shadow:0 10px 22px rgba(37,99,235,.20) !important;
}
:root.light #btnMyPasswordSide,
html.light #btnMyPasswordSide,
body.light #btnMyPasswordSide{
  color:#78350f !important;
  -webkit-text-fill-color:#78350f !important;
  border-color:rgba(245,158,11,.55) !important;
  background:linear-gradient(135deg,#fbbf24,#f59e0b) !important;
  box-shadow:0 10px 22px rgba(245,158,11,.18) !important;
}
:root.light #btnLogout,
html.light #btnLogout,
body.light #btnLogout{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(225,29,72,.55) !important;
  background:linear-gradient(135deg,#f43f5e,#e11d48) !important;
  box-shadow:0 10px 22px rgba(225,29,72,.20) !important;
}
:root:not(.light) #btnNewLeadSide,
html:not(.light) #btnNewLeadSide,
body:not(.light) #btnNewLeadSide{
  color:#dbeafe !important;
  -webkit-text-fill-color:#dbeafe !important;
  border-color:rgba(96,165,250,.55) !important;
  background:linear-gradient(135deg,rgba(37,99,235,.24),rgba(6,182,212,.14)) !important;
  box-shadow:0 10px 24px rgba(37,99,235,.13) !important;
}
:root:not(.light) #btnRefreshNow,
html:not(.light) #btnRefreshNow,
body:not(.light) #btnRefreshNow{
  color:#dbeafe !important;
  -webkit-text-fill-color:#dbeafe !important;
  border-color:rgba(96,165,250,.50) !important;
  background:rgba(37,99,235,.12) !important;
  box-shadow:0 10px 24px rgba(37,99,235,.10) !important;
}
:root:not(.light) #btnMyPasswordSide,
html:not(.light) #btnMyPasswordSide,
body:not(.light) #btnMyPasswordSide{
  color:#fde68a !important;
  -webkit-text-fill-color:#fde68a !important;
  border-color:rgba(245,158,11,.60) !important;
  background:rgba(245,158,11,.12) !important;
  box-shadow:0 10px 24px rgba(245,158,11,.09) !important;
}
:root:not(.light) #btnLogout,
html:not(.light) #btnLogout,
body:not(.light) #btnLogout{
  color:#fecdd3 !important;
  -webkit-text-fill-color:#fecdd3 !important;
  border-color:rgba(244,63,94,.70) !important;
  background:rgba(244,63,94,.10) !important;
  box-shadow:0 10px 24px rgba(244,63,94,.09) !important;
}
#btnNewLeadSide:hover,
#btnRefreshNow:hover,
#btnMyPasswordSide:hover,
#btnLogout:hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
}


/* Menu lateral e indicadores */
  html.light .sidebar .nav button.active,
  html.light .sidebar .nav button.active:hover,
  :root.light .sidebar .nav button.active,
  :root.light .sidebar .nav button.active:hover,
  body.light .sidebar .nav button.active,
  body.light .sidebar .nav button.active:hover{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    border-color:rgba(37,99,235,.64) !important;
    background:linear-gradient(135deg,#2563eb 0%,#0ea5e9 48%,#14b8a6 100%) !important;
    box-shadow:0 14px 30px rgba(37,99,235,.21),0 6px 16px rgba(20,184,166,.13),inset 0 0 0 1px rgba(255,255,255,.20) !important;
    transform:translateY(-1px) !important;
  }
  html.light .sidebar .nav button:not(.active):hover,
  :root.light .sidebar .nav button:not(.active):hover,
  body.light .sidebar .nav button:not(.active):hover{
    border-color:rgba(37,99,235,.34) !important;
    background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(20,184,166,.09)),rgba(255,255,255,.94) !important;
    box-shadow:0 10px 22px rgba(37,99,235,.10),inset 0 0 0 1px rgba(255,255,255,.62) !important;
  }
  html.light .sidebar .nav button.active .pill,
  html.light .sidebar .nav #navHojeCronos.active .todayNavBadge,
  :root.light .sidebar .nav button.active .pill,
  :root.light .sidebar .nav #navHojeCronos.active .todayNavBadge,
  body.light .sidebar .nav button.active .pill,
  body.light .sidebar .nav #navHojeCronos.active .todayNavBadge{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    background:rgba(255,255,255,.20) !important;
    border-color:rgba(255,255,255,.32) !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.08) !important;
  }
  html:not(.light) .sidebar .nav button.active,
  html:not(.light) .sidebar .nav button.active:hover,
  :root:not(.light) .sidebar .nav button.active,
  :root:not(.light) .sidebar .nav button.active:hover,
  body:not(.light) .sidebar .nav button.active,
  body:not(.light) .sidebar .nav button.active:hover{
    color:#f4fbff !important;
    -webkit-text-fill-color:#f4fbff !important;
    border-color:rgba(25,198,255,.50) !important;
    background:linear-gradient(135deg,rgba(22,119,255,.48) 0%,rgba(25,198,255,.38) 48%,rgba(46,230,166,.34) 100%),rgba(15,23,42,.58) !important;
    box-shadow:0 9px 18px rgba(22,119,255,.13),inset 0 0 0 1px rgba(255,255,255,.07) !important;
  }
  html:not(.light) .sidebar .nav #navHojeCronos:not(.active) .todayNavBadge,
  :root:not(.light) .sidebar .nav #navHojeCronos:not(.active) .todayNavBadge,
  body:not(.light) .sidebar .nav #navHojeCronos:not(.active) .todayNavBadge,
  html:not(.light) .sidebar .nav button:not(.active) .pill,
  :root:not(.light) .sidebar .nav button:not(.active) .pill,
  body:not(.light) .sidebar .nav button:not(.active) .pill{
    color:rgba(226,232,240,.74) !important;
    -webkit-text-fill-color:rgba(226,232,240,.74) !important;
    background:rgba(15,23,42,.26) !important;
    border-color:rgba(148,163,184,.20) !important;
    box-shadow:none !important;
    opacity:1 !important;
  }
  html.light .sidebar .nav #navHojeCronos:not(.active) .todayNavBadge,
  :root.light .sidebar .nav #navHojeCronos:not(.active) .todayNavBadge,
  body.light .sidebar .nav #navHojeCronos:not(.active) .todayNavBadge,
  html.light .sidebar .nav button:not(.active) .pill,
  :root.light .sidebar .nav button:not(.active) .pill,
  body.light .sidebar .nav button:not(.active) .pill{
    color:#475569 !important;
    -webkit-text-fill-color:#475569 !important;
    background:rgba(37,99,235,.065) !important;
    border-color:rgba(37,99,235,.14) !important;
    box-shadow:none !important;
    opacity:1 !important;
  }
  html.light #view-dashboard .kpis .kpi.kpiActive,
  html.light #view-dashboard .kpis .kpi.kpiActive:hover,
  html.light #view-dashboard .kpis .kpi[aria-pressed="true"],
  html.light #view-dashboard .kpis .kpi[aria-pressed="true"]:hover,
  :root.light #view-dashboard .kpis .kpi.kpiActive,
  :root.light #view-dashboard .kpis .kpi.kpiActive:hover,
  :root.light #view-dashboard .kpis .kpi[aria-pressed="true"],
  :root.light #view-dashboard .kpis .kpi[aria-pressed="true"]:hover,
  body.light #view-dashboard .kpis .kpi.kpiActive,
  body.light #view-dashboard .kpis .kpi.kpiActive:hover,
  body.light #view-dashboard .kpis .kpi[aria-pressed="true"],
  body.light #view-dashboard .kpis .kpi[aria-pressed="true"]:hover{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    border-color:rgba(37,99,235,.74) !important;
    background:linear-gradient(135deg,#2563eb 0%,#0ea5e9 52%,#14b8a6 100%) !important;
    box-shadow:0 16px 34px rgba(37,99,235,.22),0 7px 18px rgba(20,184,166,.14),inset 0 0 0 1px rgba(255,255,255,.18) !important;
  }
  html.light #view-dashboard .kpis .kpi.kpiActive .label, html.light #view-dashboard .kpis .kpi.kpiActive .hint, html.light #view-dashboard .kpis .kpi.kpiActive .value, html.light #view-dashboard .kpis .kpi[aria-pressed="true"] .label, html.light #view-dashboard .kpis .kpi[aria-pressed="true"] .hint, html.light #view-dashboard .kpis .kpi[aria-pressed="true"] .value,
  :root.light #view-dashboard .kpis .kpi.kpiActive .label, :root.light #view-dashboard .kpis .kpi.kpiActive .hint, :root.light #view-dashboard .kpis .kpi.kpiActive .value, :root.light #view-dashboard .kpis .kpi[aria-pressed="true"] .label, :root.light #view-dashboard .kpis .kpi[aria-pressed="true"] .hint, :root.light #view-dashboard .kpis .kpi[aria-pressed="true"] .value,
  body.light #view-dashboard .kpis .kpi.kpiActive .label, body.light #view-dashboard .kpis .kpi.kpiActive .hint, body.light #view-dashboard .kpis .kpi.kpiActive .value, body.light #view-dashboard .kpis .kpi[aria-pressed="true"] .label, body.light #view-dashboard .kpis .kpi[aria-pressed="true"] .hint, body.light #view-dashboard .kpis .kpi[aria-pressed="true"] .value{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
  }
  html:not(.light) #view-dashboard .kpis .kpi.kpiActive,
  html:not(.light) #view-dashboard .kpis .kpi.kpiActive:hover,
  html:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"],
  html:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"]:hover,
  :root:not(.light) #view-dashboard .kpis .kpi.kpiActive,
  :root:not(.light) #view-dashboard .kpis .kpi.kpiActive:hover,
  :root:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"],
  :root:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"]:hover,
  body:not(.light) #view-dashboard .kpis .kpi.kpiActive,
  body:not(.light) #view-dashboard .kpis .kpi.kpiActive:hover,
  body:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"],
  body:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"]:hover{
    color:#f4fbff !important;
    -webkit-text-fill-color:#f4fbff !important;
    border-color:rgba(25,198,255,.62) !important;
    background:linear-gradient(135deg,rgba(22,119,255,.54) 0%,rgba(25,198,255,.42) 50%,rgba(46,230,166,.38) 100%),rgba(17,24,39,.66) !important;
    box-shadow:0 12px 26px rgba(22,119,255,.17),0 4px 12px rgba(46,230,166,.09),inset 0 0 0 1px rgba(255,255,255,.08) !important;
    outline:0 !important;
  }
  html:not(.light) #view-dashboard .kpis .kpi.kpiActive .label, html:not(.light) #view-dashboard .kpis .kpi.kpiActive .hint, html:not(.light) #view-dashboard .kpis .kpi.kpiActive .value, html:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .label, html:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .hint, html:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .value,
  :root:not(.light) #view-dashboard .kpis .kpi.kpiActive .label, :root:not(.light) #view-dashboard .kpis .kpi.kpiActive .hint, :root:not(.light) #view-dashboard .kpis .kpi.kpiActive .value, :root:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .label, :root:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .hint, :root:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .value,
  body:not(.light) #view-dashboard .kpis .kpi.kpiActive .label, body:not(.light) #view-dashboard .kpis .kpi.kpiActive .hint, body:not(.light) #view-dashboard .kpis .kpi.kpiActive .value, body:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .label, body:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .hint, body:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .value{
    color:#f4fbff !important;
    -webkit-text-fill-color:#f4fbff !important;
  }
  html:not(.light) #view-dashboard .kpis .kpi.kpiActive .kpiPct,
  html:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .kpiPct,
  :root:not(.light) #view-dashboard .kpis .kpi.kpiActive .kpiPct,
  :root:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .kpiPct,
  body:not(.light) #view-dashboard .kpis .kpi.kpiActive .kpiPct,
  body:not(.light) #view-dashboard .kpis .kpi[aria-pressed="true"] .kpiPct{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    background:rgba(255,255,255,.13) !important;
    border-color:rgba(255,255,255,.20) !important;
    box-shadow:none !important;
  }

/* Copyright da lateral */
.sidebarCopyright{
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid rgba(148,163,184,.18);
  text-align:center;
  display:grid;
  gap:2px;
  color:var(--muted);
  opacity:.78;
}
.sidebarCopyright span{
  font-size:10.5px;
  font-weight:700;
  line-height:1.35;
}
.sidebarCopyright small{
  font-size:10px;
  line-height:1.35;
  font-weight:500;
}
:root.light .sidebarCopyright,
html.light .sidebarCopyright,
body.light .sidebarCopyright{
  color:rgba(71,85,105,.82);
  border-top-color:rgba(15,23,42,.08);
}
:root:not(.light) .sidebarCopyright,
html:not(.light) .sidebarCopyright,
body:not(.light) .sidebarCopyright{
  color:rgba(226,232,240,.58);
  border-top-color:rgba(255,255,255,.08);
}

/* Ajustes de produção: modais, cobranças e WhatsApp */
html.light .modalBg,
body.light .modalBg,
:root.light .modalBg{
  background: rgba(15, 23, 42, .42) !important;
  backdrop-filter: blur(8px) !important;
}

html.light .modal,
body.light .modal,
:root.light .modal{
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, .14) !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .22) !important;
}

#view-todayCronos .todayBtn.wa{
  background: linear-gradient(135deg, rgba(34,197,94,.22), rgba(20,184,166,.14)) !important;
  border-color: rgba(34,197,94,.48) !important;
  color: #dcfce7 !important;
}
html.light #view-todayCronos .todayBtn.wa,
body.light #view-todayCronos .todayBtn.wa,
:root.light #view-todayCronos .todayBtn.wa{
  background: linear-gradient(135deg, #16a34a, #22c55e) !important;
  border-color: rgba(22,163,74,.45) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(22,163,74,.18) !important;
}

.waChargeBtn,
.instTable a.waChargeBtn,
table a.waChargeBtn{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  padding: 9px 14px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(34,197,94,.46) !important;
  background: linear-gradient(135deg, rgba(34,197,94,.20), rgba(20,184,166,.12)) !important;
  color: #dcfce7 !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

.waChargeBtn:hover,
.instTable a.waChargeBtn:hover,
table a.waChargeBtn:hover{
  transform: translateY(-1px);
  filter: brightness(1.06);
  background: linear-gradient(135deg, rgba(34,197,94,.26), rgba(20,184,166,.18)) !important;
}

.waChargeIcon{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  font-size: 12px;
  color: #052e16;
  background: rgba(220,252,231,.95);
}

html.light .waChargeBtn,
body.light .waChargeBtn,
:root.light .waChargeBtn,
html.light .instTable a.waChargeBtn,
body.light .instTable a.waChargeBtn,
:root.light .instTable a.waChargeBtn,
html.light table a.waChargeBtn,
body.light table a.waChargeBtn,
:root.light table a.waChargeBtn{
  background: linear-gradient(135deg, #16a34a, #22c55e) !important;
  color: #ffffff !important;
  border-color: rgba(22,163,74,.45) !important;
  box-shadow: 0 8px 18px rgba(22,163,74,.16) !important;
}

html.light #view-creditSimulator .credBtn.wa,
body.light #view-creditSimulator .credBtn.wa,
:root.light #view-creditSimulator .credBtn.wa{
  background: linear-gradient(135deg, #16a34a, #22c55e) !important;
  color: #ffffff !important;
  border-color: rgba(22,163,74,.48) !important;
  box-shadow: 0 8px 18px rgba(22,163,74,.16) !important;
}

#view-creditSimulator .credBtn.wa{
  background: linear-gradient(135deg, rgba(34,197,94,.20), rgba(20,184,166,.12)) !important;
  color: #dcfce7 !important;
  border-color: rgba(34,197,94,.45) !important;
}

/* Modal e troca de tema */
html.themeSwitching *,
html.themeSwitching *::before,
html.themeSwitching *::after{
  transition-duration: 0.01ms !important;
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
}

html:not(.light) .modalBg,
body:not(.light) .modalBg,
:root:not(.light) .modalBg{
  background: rgba(3, 7, 18, .82) !important;
  backdrop-filter: blur(6px) saturate(.82) !important;
  -webkit-backdrop-filter: blur(6px) saturate(.82) !important;
}

html:not(.light) .modal,
body:not(.light) .modal,
:root:not(.light) .modal{
  background: linear-gradient(180deg, rgba(30, 41, 59, .98), rgba(15, 23, 42, .98)) !important;
  border-color: rgba(148, 163, 184, .22) !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .48) !important;
}

html:not(.light) #modalBody,
body:not(.light) #modalBody,
:root:not(.light) #modalBody{
  background: transparent !important;
}

html.light .modalBg,
body.light .modalBg,
:root.light .modalBg{
  background: rgba(15, 23, 42, .42) !important;
  backdrop-filter: blur(8px) saturate(.9) !important;
  -webkit-backdrop-filter: blur(8px) saturate(.9) !important;
}

html.light .modal,
body.light .modal,
:root.light .modal{
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, .14) !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .22) !important;
}

/* =====================================================
   Cronos — rolagem leve e estável
   ===================================================== */
html{ scroll-behavior:auto; }

/* Evita aplicar pintura de scrollbar em absolutamente tudo. Isso pesava em listas/cards no tema claro. */
html,
body,
.sidebar,
.main,
.tableWrap,
.hscrollTop,
#leadsTopScroll,
#dashPreview,
#creditAntList,
.fichaTableWrap,
.procSuggestMenu,
.perfTableScroll,
.modal-body,
.modalBody,
.drawerBody,
[data-cronos-scroll-key]{
  scrollbar-width:thin;
  scrollbar-color:rgba(148,163,184,.42) transparent;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.sidebar::-webkit-scrollbar,
.main::-webkit-scrollbar,
.tableWrap::-webkit-scrollbar,
.hscrollTop::-webkit-scrollbar,
#leadsTopScroll::-webkit-scrollbar,
#dashPreview::-webkit-scrollbar,
#creditAntList::-webkit-scrollbar,
.fichaTableWrap::-webkit-scrollbar,
.procSuggestMenu::-webkit-scrollbar,
.perfTableScroll::-webkit-scrollbar,
.modal-body::-webkit-scrollbar,
.modalBody::-webkit-scrollbar,
.drawerBody::-webkit-scrollbar,
[data-cronos-scroll-key]::-webkit-scrollbar{
  width:10px;
  height:10px;
}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.sidebar::-webkit-scrollbar-track,
.main::-webkit-scrollbar-track,
.tableWrap::-webkit-scrollbar-track,
.hscrollTop::-webkit-scrollbar-track,
#leadsTopScroll::-webkit-scrollbar-track,
#dashPreview::-webkit-scrollbar-track,
#creditAntList::-webkit-scrollbar-track,
.fichaTableWrap::-webkit-scrollbar-track,
.procSuggestMenu::-webkit-scrollbar-track,
.perfTableScroll::-webkit-scrollbar-track,
.modal-body::-webkit-scrollbar-track,
.modalBody::-webkit-scrollbar-track,
.drawerBody::-webkit-scrollbar-track,
[data-cronos-scroll-key]::-webkit-scrollbar-track{ background:transparent; }
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.sidebar::-webkit-scrollbar-thumb,
.main::-webkit-scrollbar-thumb,
.tableWrap::-webkit-scrollbar-thumb,
.hscrollTop::-webkit-scrollbar-thumb,
#leadsTopScroll::-webkit-scrollbar-thumb,
#dashPreview::-webkit-scrollbar-thumb,
#creditAntList::-webkit-scrollbar-thumb,
.fichaTableWrap::-webkit-scrollbar-thumb,
.procSuggestMenu::-webkit-scrollbar-thumb,
.perfTableScroll::-webkit-scrollbar-thumb,
.modal-body::-webkit-scrollbar-thumb,
.modalBody::-webkit-scrollbar-thumb,
.drawerBody::-webkit-scrollbar-thumb,
[data-cronos-scroll-key]::-webkit-scrollbar-thumb{
  border-radius:999px;
  border:3px solid transparent;
  background-clip:padding-box;
  background-color:rgba(148,163,184,.36);
}

:root.light,
html.light,
body.light{
  scrollbar-color:rgba(37,99,235,.28) rgba(15,23,42,.02);
}

.sidebar,
.main,
.tableWrap,
.hscrollTop,
#leadsTopScroll,
#dashPreview,
#creditAntList,
.fichaTableWrap,
.procSuggestMenu,
.perfTableScroll,
.modal-body,
.modalBody,
.drawerBody,
[data-cronos-scroll-key]{
  scroll-behavior:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
}

.tableWrap::-webkit-scrollbar:horizontal,
.hscrollTop::-webkit-scrollbar,
#leadsTopScroll::-webkit-scrollbar{ height:8px; }



/* =====================================================
   Cronos — base de performance para telas densas
   ===================================================== */
#view-dashboard .card,
#view-leads .leadCard,
#view-installments .instRow,
#view-kanban .kanCol,
#view-kanban .kanCard{
  backface-visibility:hidden;
}
#view-leads .leadCard,
#view-installments .instRow,
#view-kanban .kanCard{
  contain:layout paint style;
}
@supports (content-visibility:auto){
  #view-leads .leadCard,
  #view-installments .instRow,
  #view-kanban .kanCard{
    content-visibility:auto;
    contain-intrinsic-size:140px;
  }
}

/* =====================================================
   Cronos — Ficha/Prontuário mais leve sem quebrar o turbo geral
   Base: mantém a correção que já funcionou nas telas principais.
   Aqui o foco é só a ficha: odontograma, tabela e modal.
   ===================================================== */
#modalBg.show .modal.modalFichaWide,
.modalFichaWide{
  transform:translateZ(0);
  backface-visibility:hidden;
}

/* O blur do fundo do modal pesa durante a rolagem da ficha nos dois temas. */
html.cronos-ficha-open #modalBg.modalBg,
body.cronos-ficha-open #modalBg.modalBg,
#modalBg.show:has(.modalFichaWide){
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

.modalFichaWide #modalBody{
  scroll-behavior:auto !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  will-change:scroll-position;
}

/* A ficha usava o th global do Cronos: sticky + blur. Bonito, mas caro pra rolar. */
.modalFichaWide .fichaTable th{
  position:static !important;
  top:auto !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
}
.modalFichaWide .fichaTable th,
.modalFichaWide .fichaTable td{
  will-change:auto !important;
}

/* O odontograma carregava a versão clara e a escura ao mesmo tempo via opacity.
   Agora só a imagem do tema ativo participa da pintura. */
.modalFichaWide .odontoRefStage .odontoBaseLight{
  display:none !important;
  opacity:1 !important;
}
.modalFichaWide .odontoRefStage .odontoBaseDark{
  display:block !important;
  opacity:1 !important;
}
html.light .modalFichaWide .odontoRefStage .odontoBaseLight,
body.light .modalFichaWide .odontoRefStage .odontoBaseLight,
:root.light .modalFichaWide .odontoRefStage .odontoBaseLight{
  display:block !important;
}
html.light .modalFichaWide .odontoRefStage .odontoBaseDark,
body.light .modalFichaWide .odontoRefStage .odontoBaseDark,
:root.light .modalFichaWide .odontoRefStage .odontoBaseDark{
  display:none !important;
}

/* Remove transformação animada dos botões dos dentes, que repinta o odontograma inteiro em máquinas mais fracas. */
.modalFichaWide .toothOverlayBox{
  transition:background-color .12s ease, border-color .12s ease, color .12s ease, opacity .12s ease !important;
  box-shadow:none !important;
}
.modalFichaWide .toothOverlayBox:hover{
  transform:translate(-50%,0) !important;
}
.modalFichaWide .toothOverlayBox.active{
  box-shadow:0 0 0 3px rgba(22,119,255,.18) !important;
}

/* Só durante a rolagem da ficha: corta firula visual, sem tocar Dashboard/Leads/Recebimentos/Funil. */
html.cronos-ficha-scrolling .modalFichaWide,
body.cronos-ficha-scrolling .modalFichaWide{
  box-shadow:none !important;
}
html.cronos-ficha-scrolling .modalFichaWide .fichaHead .cardMini,
body.cronos-ficha-scrolling .modalFichaWide .fichaHead .cardMini,
html.cronos-ficha-scrolling .modalFichaWide .fichaAddWrap,
body.cronos-ficha-scrolling .modalFichaWide .fichaAddWrap,
html.cronos-ficha-scrolling .modalFichaWide .fichaPlanToolbar,
body.cronos-ficha-scrolling .modalFichaWide .fichaPlanToolbar,
html.cronos-ficha-scrolling .modalFichaWide .fichaTableWrap,
body.cronos-ficha-scrolling .modalFichaWide .fichaTableWrap,
html.cronos-ficha-scrolling .modalFichaWide .odontoFull,
body.cronos-ficha-scrolling .modalFichaWide .odontoFull,
html.cronos-ficha-scrolling .modalFichaWide .odontoPanel,
body.cronos-ficha-scrolling .modalFichaWide .odontoPanel,
html.cronos-ficha-scrolling .modalFichaWide .totalBox,
body.cronos-ficha-scrolling .modalFichaWide .totalBox{
  box-shadow:none !important;
  filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html.cronos-ficha-scrolling .modalFichaWide *,
body.cronos-ficha-scrolling .modalFichaWide *{
  animation:none !important;
}


/* =====================================================
   Cronos — seleção lateral instantânea, sem rastro de borda
   ===================================================== */
.sidebar .nav button{
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.sidebar .nav button:focus,
.sidebar .nav button:focus-visible{
  outline:0 !important;
}
body.cronos-nav-switching .sidebar .nav button,
body.cronos-nav-switching .sidebar .nav button *,
body.cronos-nav-switching .nav button,
body.cronos-nav-switching .nav button *{
  transition-duration:0s !important;
  transition-delay:0s !important;
}
body.cronos-nav-switching .sidebar .nav button:not(.active),
body.cronos-nav-switching .nav button:not(.active){
  box-shadow:none !important;
  transform:none !important;
  filter:none !important;
}
@media (hover:none), (pointer:coarse){
  .sidebar .nav button:not(.active):hover,
  .nav button:not(.active):hover,
  html.light .sidebar .nav button:not(.active):hover,
  :root.light .sidebar .nav button:not(.active):hover,
  body.light .sidebar .nav button:not(.active):hover,
  html:not(.light) .sidebar .nav button:not(.active):hover,
  :root:not(.light) .sidebar .nav button:not(.active):hover,
  body:not(.light) .sidebar .nav button:not(.active):hover{
    border-color:var(--line) !important;
    box-shadow:none !important;
    transform:none !important;
    filter:none !important;
  }
}


/* =====================================================
   Performance Visual V1 — troca de tema atômica
   Congela transições/gradientes durante 2 frames para impedir botões claros
   atrasados quando sai do modo claro para o escuro.
   ===================================================== */
html.cronos-theme-switching *,
html.cronos-theme-switching *::before,
html.cronos-theme-switching *::after,
body.cronos-theme-switching *,
body.cronos-theme-switching *::before,
body.cronos-theme-switching *::after,
html.themeSwitching *,
html.themeSwitching *::before,
html.themeSwitching *::after,
body.themeSwitching *,
body.themeSwitching *::before,
body.themeSwitching *::after{
  transition:none !important;
  animation:none !important;
  transition-delay:0s !important;
}

html.cronos-theme-switching:not(.light) .sidebar .nav button,
body.cronos-theme-switching:not(.light) .sidebar .nav button,
html.themeSwitching:not(.light) .sidebar .nav button,
body.themeSwitching:not(.light) .sidebar .nav button{
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(148,163,184,.18) !important;
  color:var(--text) !important;
  -webkit-text-fill-color:var(--text) !important;
  box-shadow:none !important;
  filter:none !important;
}

html.cronos-theme-switching:not(.light) .sidebar .nav button.active,
body.cronos-theme-switching:not(.light) .sidebar .nav button.active,
html.themeSwitching:not(.light) .sidebar .nav button.active,
body.themeSwitching:not(.light) .sidebar .nav button.active{
  color:#f4fbff !important;
  -webkit-text-fill-color:#f4fbff !important;
  border-color:rgba(25,198,255,.50) !important;
  background:linear-gradient(135deg,rgba(22,119,255,.48),rgba(25,198,255,.38),rgba(46,230,166,.34)),rgba(15,23,42,.58) !important;
  box-shadow:0 9px 18px rgba(22,119,255,.13),inset 0 0 0 1px rgba(255,255,255,.07) !important;
}

html.cronos-theme-switching:not(.light) .sidebar .sideFooter button,
body.cronos-theme-switching:not(.light) .sidebar .sideFooter button,
html.themeSwitching:not(.light) .sidebar .sideFooter button,
body.themeSwitching:not(.light) .sidebar .sideFooter button{
  background:rgba(255,255,255,.035) !important;
  color:var(--text) !important;
  -webkit-text-fill-color:var(--text) !important;
  border-color:rgba(148,163,184,.18) !important;
  box-shadow:none !important;
}

html.cronos-theme-switching.light .sidebar .nav button,
body.cronos-theme-switching.light .sidebar .nav button,
html.themeSwitching.light .sidebar .nav button,
body.themeSwitching.light .sidebar .nav button{
  background:linear-gradient(135deg, rgba(59,130,246,.13), rgba(6,182,212,.095)), rgba(255,255,255,.88) !important;
  border-color:rgba(37,99,235,.24) !important;
  color:var(--text) !important;
  -webkit-text-fill-color:var(--text) !important;
}

/* Cronos — explicações e rastreabilidade */
.labelInfoWrap,
.sectionTitleInfo{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.cronosInfo{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  min-width:18px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.07);
  color:var(--muted);
  font-size:11px;
  line-height:1;
  font-weight:900;
  font-style:normal;
  cursor:help;
  padding:0;
  vertical-align:middle;
  transition:transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.cronosInfo:hover,
.cronosInfo:focus-visible{
  transform:translateY(-1px);
  background:rgba(96,165,250,.16);
  border-color:rgba(96,165,250,.55);
  color:var(--text);
  outline:none;
}
.cronosInfo::after{
  content:attr(data-tip);
  position:absolute;
  left:50%;
  bottom:calc(100% + 10px);
  transform:translateX(-50%) translateY(4px);
  width:min(340px, 74vw);
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.28);
  background:rgba(15,23,42,.96);
  color:#f8fafc;
  font-size:12px;
  line-height:1.35;
  text-align:left;
  font-weight:600;
  white-space:pre-line;
  opacity:0;
  pointer-events:none;
  z-index:9999;
  box-shadow:0 18px 45px rgba(0,0,0,.32);
}
.cronosInfo:hover::after,
.cronosInfo:focus-visible::after{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}
:root.light .cronosInfo{
  background:rgba(15,23,42,.05);
  border-color:rgba(15,23,42,.12);
  color:rgba(15,23,42,.62);
}
:root.light .cronosInfo::after{
  background:rgba(15,23,42,.97);
  color:#fff;
}
.cronosAuditInfo{
  cursor:pointer;
  width:22px;
  height:22px;
  min-width:22px;
  color:var(--text);
  background:rgba(96,165,250,.12);
  border-color:rgba(96,165,250,.35);
}
.auditTimeline{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.auditItem{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:rgba(255,255,255,.03);
}
:root.light .auditItem{background:rgba(15,23,42,.03)}
.auditWhen{
  font-size:12px;
  color:var(--muted);
  margin-bottom:4px;
  font-weight:700;
}
.auditMain{
  display:flex;
  flex-direction:column;
  gap:3px;
  line-height:1.35;
}
.auditMain span{color:var(--muted);font-size:12px;}
.auditBy{
  margin-top:6px;
  font-size:12px;
  color:var(--muted);
}
#dashByStatusGrid .cronosInfo::after{
  left:auto;
  right:0;
  transform:translateY(4px);
}
#dashByStatusGrid .cronosInfo:hover::after,
#dashByStatusGrid .cronosInfo:focus-visible::after{
  transform:translateY(0);
}


/* Cronos — tooltip flutuante global (não fica preso dentro de tabelas/cards) */
.cronosInfo{
  cursor:pointer;
}
.cronosInfo::after{
  display:none !important;
  content:none !important;
}
.cronosFloatingTip{
  position:fixed;
  z-index:2147483000;
  max-width:min(360px, calc(100vw - 24px));
  min-width:180px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(148,163,184,.30);
  background:rgba(15,23,42,.97);
  color:#f8fafc;
  font-size:12px;
  line-height:1.38;
  text-align:left;
  font-weight:650;
  white-space:pre-line;
  opacity:0;
  pointer-events:none;
  transform:translateY(4px);
  transition:opacity .12s ease, transform .12s ease;
  box-shadow:0 20px 50px rgba(0,0,0,.42);
  backdrop-filter:blur(10px);
}
.cronosFloatingTip.is-visible{
  opacity:1;
  transform:translateY(0);
}
:root.light .cronosFloatingTip{
  background:rgba(15,23,42,.97);
  color:#fff;
  border-color:rgba(15,23,42,.18);
}


/* Ajuste Hoje no Cronos: WhatsApp e botões neutros por tema */
:root:not(.light) #view-todayCronos .todayBtn.wa,
html:not(.light) #view-todayCronos .todayBtn.wa,
body:not(.light) #view-todayCronos .todayBtn.wa,
:root:not(.light) #view-todayCronos a.todayBtn[href*="wa.me"],
html:not(.light) #view-todayCronos a.todayBtn[href*="wa.me"],
body:not(.light) #view-todayCronos a.todayBtn[href*="wa.me"],
:root:not(.light) #view-todayCronos a.todayBtn[href*="api.whatsapp.com"],
html:not(.light) #view-todayCronos a.todayBtn[href*="api.whatsapp.com"],
body:not(.light) #view-todayCronos a.todayBtn[href*="api.whatsapp.com"],
:root:not(.light) #view-todayCronos a.todayBtn[href*="web.whatsapp.com"],
html:not(.light) #view-todayCronos a.todayBtn[href*="web.whatsapp.com"],
body:not(.light) #view-todayCronos a.todayBtn[href*="web.whatsapp.com"]{
  background:linear-gradient(135deg, rgba(34,197,94,.24), rgba(20,184,166,.14)) !important;
  border-color:rgba(34,197,94,.50) !important;
  color:#dcfce7 !important;
}
:root.light #view-todayCronos .todayBtn.wa,
html.light #view-todayCronos .todayBtn.wa,
body.light #view-todayCronos .todayBtn.wa,
:root.light #view-todayCronos a.todayBtn[href*="wa.me"],
html.light #view-todayCronos a.todayBtn[href*="wa.me"],
body.light #view-todayCronos a.todayBtn[href*="wa.me"],
:root.light #view-todayCronos a.todayBtn[href*="api.whatsapp.com"],
html.light #view-todayCronos a.todayBtn[href*="api.whatsapp.com"],
body.light #view-todayCronos a.todayBtn[href*="api.whatsapp.com"],
:root.light #view-todayCronos a.todayBtn[href*="web.whatsapp.com"],
html.light #view-todayCronos a.todayBtn[href*="web.whatsapp.com"],
body.light #view-todayCronos a.todayBtn[href*="web.whatsapp.com"]{
  background:linear-gradient(135deg, #16a34a, #22c55e) !important;
  border-color:rgba(22,163,74,.65) !important;
  color:#ffffff !important;
  box-shadow:0 8px 18px rgba(22,163,74,.18) !important;
}
:root.light #view-todayCronos .todayBtn:not(.ok):not(.warn):not(.danger):not(.primary):not(.wa):not([onclick*="openLead"]):not([href*="wa.me"]):not([href*="api.whatsapp.com"]):not([href*="web.whatsapp.com"]),
html.light #view-todayCronos .todayBtn:not(.ok):not(.warn):not(.danger):not(.primary):not(.wa):not([onclick*="openLead"]):not([href*="wa.me"]):not([href*="api.whatsapp.com"]):not([href*="web.whatsapp.com"]),
body.light #view-todayCronos .todayBtn:not(.ok):not(.warn):not(.danger):not(.primary):not(.wa):not([onclick*="openLead"]):not([href*="wa.me"]):not([href*="api.whatsapp.com"]):not([href*="web.whatsapp.com"]){
  background:#e5e7eb !important;
  border-color:rgba(100,116,139,.32) !important;
  color:#334155 !important;
}

:root.light .instMetric,
html.light .instMetric,
body.light .instMetric{
  background:#ffffff !important;
  border-color:rgba(15,23,42,.10) !important;
}
:root.light .instAlert.ok,
html.light .instAlert.ok,
body.light .instAlert.ok{
  background:rgba(34,197,94,.12) !important;
  border-color:rgba(22,163,74,.28) !important;
}
:root.light .instAlert.pending,
html.light .instAlert.pending,
body.light .instAlert.pending{
  background:rgba(245,158,11,.12) !important;
  border-color:rgba(217,119,6,.28) !important;
}
:root.light .instAlert.late,
html.light .instAlert.late,
body.light .instAlert.late{
  background:rgba(244,63,94,.10) !important;
  border-color:rgba(225,29,72,.24) !important;
}
:root.light .instAlert.neutral,
html.light .instAlert.neutral,
body.light .instAlert.neutral{
  background:rgba(15,23,42,.035) !important;
  border-color:rgba(15,23,42,.10) !important;
  color:#475569 !important;
}
:root.light .instExtra summary,
html.light .instExtra summary,
body.light .instExtra summary{
  color:#0f172a !important;
}

/* Ajuste Recebimentos: status semântico também no modo claro */
:root.light .chip,
html.light .chip,
body.light .chip{
  background:rgba(15,23,42,.035) !important;
  border-color:rgba(15,23,42,.12) !important;
  color:#475569 !important;
}
:root.light .chip b,
html.light .chip b,
body.light .chip b{
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
}

:root.light .badge,
html.light .badge,
body.light .badge{
  font-weight:850;
  border-width:1px;
}

:root.light .badge.pending,
html.light .badge.pending,
body.light .badge.pending{
  color:#b45309 !important;
  -webkit-text-fill-color:#b45309 !important;
  background:rgba(245,158,11,.16) !important;
  border-color:rgba(217,119,6,.34) !important;
}

:root.light .badge.ok,
html.light .badge.ok,
body.light .badge.ok{
  color:#15803d !important;
  -webkit-text-fill-color:#15803d !important;
  background:rgba(34,197,94,.15) !important;
  border-color:rgba(22,163,74,.34) !important;
}

:root.light .badge.late,
html.light .badge.late,
body.light .badge.late{
  color:#be123c !important;
  -webkit-text-fill-color:#be123c !important;
  background:rgba(244,63,94,.13) !important;
  border-color:rgba(225,29,72,.34) !important;
}

:root.light #view-installments .badge.pending,
html.light #view-installments .badge.pending,
body.light #view-installments .badge.pending{
  color:#b45309 !important;
  -webkit-text-fill-color:#b45309 !important;
}
:root.light #view-installments .badge.ok,
html.light #view-installments .badge.ok,
body.light #view-installments .badge.ok{
  color:#15803d !important;
  -webkit-text-fill-color:#15803d !important;
}
:root.light #view-installments .badge.late,
html.light #view-installments .badge.late,
body.light #view-installments .badge.late{
  color:#be123c !important;
  -webkit-text-fill-color:#be123c !important;
}


/* Cronos — proteção contra fechamento acidental de modais */
.cronos-modal-pulse{
  animation: cronosModalPulse .34s ease both;
}
@keyframes cronosModalPulse{
  0%{ transform: scale(1); box-shadow: inherit; }
  35%{ transform: scale(1.012); box-shadow: 0 0 0 4px rgba(34, 184, 242, .18), 0 26px 70px rgba(0,0,0,.24); }
  70%{ transform: scale(.997); }
  100%{ transform: scale(1); }
}



/* === CRONOS THEME REFRESH — azul/ciano/verde === */
:root:not(.light){
  --bg:#060d1f;
  --panel:#0b1730;
  --panel2:#0f1d3d;
  --card:#0f1d3d;
  --brand:#1677ff;
  --brand2:#19c6ff;
  --brand3:#2ee6a6;
  --accent:#19c6ff;
  --line:rgba(183,212,255,.12);
}

:root:not(.light) .sidebar,
:root:not(.light) .card,
:root:not(.light) .authCard,
:root:not(.light) .modal,
:root:not(.light) .kanCard,
:root:not(.light) .kpi,
:root:not(.light) .stickyFilters{
  border-color:rgba(183,212,255,.12);
}

:root:not(.light) .nav button.active,
:root:not(.light) .btn.primary,
:root:not(.light) .btnGradient,
:root:not(.light) #btnNewLeadSide,
:root:not(.light) #btnRefreshNow{
  border-color:rgba(64,182,255,.36) !important;
  background:linear-gradient(135deg, rgba(22,119,255,.34) 0%, rgba(25,198,255,.24) 58%, rgba(46,230,166,.18) 100%) !important;
  box-shadow:0 14px 32px rgba(22,119,255,.18), 0 8px 24px rgba(25,198,255,.12), inset 0 1px 0 rgba(255,255,255,.10) !important;
}

:root:not(.light) .nav button.active,
:root:not(.light) .nav button.active > span:first-child,
:root:not(.light) .nav button.active .pill,
:root:not(.light) .nav button.active .todayNavBadge{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

:root:not(.light) .brand{
  background:linear-gradient(135deg, rgba(22,119,255,.16) 0%, rgba(25,198,255,.12) 56%, rgba(46,230,166,.10) 100%) !important;
}

:root:not(.light) .iconBtn:hover,
:root:not(.light) .miniBtn:hover,
:root:not(.light) .leadCard:hover,
:root:not(.light) .procNameSuggestPanel .miniBtn:hover,
:root:not(.light) .faceChip:hover,
:root:not(.light) .procSuggestItem:hover{
  border-color:rgba(22,119,255,.45) !important;
}

:root:not(.light) .kpi.kpiActive,
:root:not(.light) .toothBtn.sel,
:root:not(.light) .dentitionToggle button.active,
:root:not(.light) .faceChip.active,
:root:not(.light) .todayKpi.active b{
  border-color:rgba(22,119,255,.60) !important;
  box-shadow:0 12px 30px rgba(22,119,255,.18) !important;
}

:root:not(.light) .btn.ok,
:root:not(.light) .taskOk,
:root:not(.light) .miniBtn.ok,
:root:not(.light) .kanCard.kanSelected{
  border-color:rgba(46,230,166,.50) !important;
}


/* === CRONOS THEME POLISH V2 — botões discretos + modais no tema azul === */
:root:not(.light){
  --modal-bg:#08142a;
  --modal-surface:#0b1730;
  --modal-surface-2:#0f1d3d;
}

/* Ações rápidas da sidebar: menos gritantes, mais hierarquia */
:root:not(.light) .sideFooter #btnNewLeadSide,
html:not(.light) .sideFooter #btnNewLeadSide,
body:not(.light) .sideFooter #btnNewLeadSide{
  color:#eef6ff !important;
  -webkit-text-fill-color:#eef6ff !important;
  border-color:rgba(25,198,255,.42) !important;
  background:
    linear-gradient(135deg, rgba(22,119,255,.28) 0%, rgba(25,198,255,.18) 58%, rgba(46,230,166,.12) 100%),
    rgba(12,28,58,.54) !important;
  box-shadow:0 8px 18px rgba(22,119,255,.11), inset 0 0 0 1px rgba(255,255,255,.06) !important;
}
:root:not(.light) .sideFooter #btnRefreshNow,
html:not(.light) .sideFooter #btnRefreshNow,
body:not(.light) .sideFooter #btnRefreshNow{
  color:#cfe5ff !important;
  -webkit-text-fill-color:#cfe5ff !important;
  border-color:rgba(183,212,255,.20) !important;
  background:rgba(15,29,61,.42) !important;
  box-shadow:none !important;
}
:root:not(.light) .sideFooter #btnNewLeadSide:hover,
html:not(.light) .sideFooter #btnNewLeadSide:hover,
body:not(.light) .sideFooter #btnNewLeadSide:hover{
  border-color:rgba(25,198,255,.56) !important;
  background:
    linear-gradient(135deg, rgba(22,119,255,.34) 0%, rgba(25,198,255,.24) 58%, rgba(46,230,166,.16) 100%),
    rgba(12,28,58,.64) !important;
  box-shadow:0 10px 22px rgba(22,119,255,.14), inset 0 0 0 1px rgba(255,255,255,.07) !important;
}
:root:not(.light) .sideFooter #btnRefreshNow:hover,
html:not(.light) .sideFooter #btnRefreshNow:hover,
body:not(.light) .sideFooter #btnRefreshNow:hover{
  border-color:rgba(25,198,255,.34) !important;
  background:rgba(22,119,255,.12) !important;
}

/* Top/lista Novo Lead continua importante, mas sem parecer sirene */
:root:not(.light) #btnNewLeadTop,
:root:not(.light) #btnNewLeadList,
:root:not(.light) #btnNewLeadKanban,
html:not(.light) #btnNewLeadTop,
html:not(.light) #btnNewLeadList,
html:not(.light) #btnNewLeadKanban,
body:not(.light) #btnNewLeadTop,
body:not(.light) #btnNewLeadList,
body:not(.light) #btnNewLeadKanban{
  border-color:rgba(25,198,255,.42) !important;
  background:
    linear-gradient(135deg, rgba(22,119,255,.32) 0%, rgba(25,198,255,.22) 58%, rgba(46,230,166,.14) 100%),
    rgba(12,28,58,.58) !important;
  box-shadow:0 10px 24px rgba(22,119,255,.13), inset 0 0 0 1px rgba(255,255,255,.07) !important;
}

/* Modais no mesmo universo azul/ciano/verde do sistema */
:root:not(.light) .modalBg,
html:not(.light) .modalBg,
body:not(.light) .modalBg{
  background:
    radial-gradient(900px 520px at 50% 10%, rgba(22,119,255,.16), transparent 60%),
    radial-gradient(640px 420px at 88% 6%, rgba(46,230,166,.10), transparent 58%),
    rgba(3, 8, 20, .84) !important;
  backdrop-filter: blur(10px) saturate(.92) !important;
  -webkit-backdrop-filter: blur(10px) saturate(.92) !important;
}
:root:not(.light) .modal,
html:not(.light) .modal,
body:not(.light) .modal,
:root:not(.light) .modalInner,
html:not(.light) .modalInner,
body:not(.light) .modalInner,
:root:not(.light) .accessNotice,
html:not(.light) .accessNotice,
body:not(.light) .accessNotice{
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), transparent 48%),
    radial-gradient(720px 360px at 18% 0%, rgba(22,119,255,.16), transparent 62%),
    radial-gradient(620px 320px at 88% 4%, rgba(46,230,166,.10), transparent 60%),
    var(--modal-surface-2) !important;
  border-color:rgba(183,212,255,.14) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.52), 0 0 0 1px rgba(25,198,255,.035) inset !important;
  color:#eef6ff !important;
}
:root:not(.light) .modalHead,
html:not(.light) .modalHead,
body:not(.light) .modalHead,
:root:not(.light) .modalHeader,
html:not(.light) .modalHeader,
body:not(.light) .modalHeader,
:root:not(.light) .accessNoticeHead,
html:not(.light) .accessNoticeHead,
body:not(.light) .accessNoticeHead{
  border-color:rgba(183,212,255,.12) !important;
}
:root:not(.light) .modalFoot,
html:not(.light) .modalFoot,
body:not(.light) .modalFoot{
  border-top-color:rgba(183,212,255,.12) !important;
}
:root:not(.light) .modal input,
:root:not(.light) .modal select,
:root:not(.light) .modal textarea,
:root:not(.light) .modalInner input,
:root:not(.light) .modalInner select,
:root:not(.light) .modalInner textarea,
html:not(.light) .modal input,
html:not(.light) .modal select,
html:not(.light) .modal textarea,
body:not(.light) .modal input,
body:not(.light) .modal select,
body:not(.light) .modal textarea{
  background:rgba(8,20,42,.62) !important;
  border-color:rgba(183,212,255,.14) !important;
  color:#eef6ff !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025) !important;
}
:root:not(.light) .modal input:focus,
:root:not(.light) .modal select:focus,
:root:not(.light) .modal textarea:focus,
html:not(.light) .modal input:focus,
html:not(.light) .modal select:focus,
html:not(.light) .modal textarea:focus,
body:not(.light) .modal input:focus,
body:not(.light) .modal select:focus,
body:not(.light) .modal textarea:focus{
  border-color:rgba(25,198,255,.48) !important;
  box-shadow:0 0 0 3px rgba(25,198,255,.10), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}
:root:not(.light) .modal .card,
:root:not(.light) .modal .kpi,
:root:not(.light) .modal .chip,
:root:not(.light) .modal .tableWrap,
:root:not(.light) .modal table,
:root:not(.light) .modal .suggestBox,
html:not(.light) .modal .card,
html:not(.light) .modal .kpi,
html:not(.light) .modal .chip,
html:not(.light) .modal .tableWrap,
html:not(.light) .modal table,
html:not(.light) .modal .suggestBox,
body:not(.light) .modal .card,
body:not(.light) .modal .kpi,
body:not(.light) .modal .chip,
body:not(.light) .modal .tableWrap,
body:not(.light) .modal table,
body:not(.light) .modal .suggestBox{
  background:rgba(8,20,42,.42) !important;
  border-color:rgba(183,212,255,.12) !important;
}
:root:not(.light) .modal th,
html:not(.light) .modal th,
body:not(.light) .modal th{
  background:rgba(11,23,48,.88) !important;
  color:#9cb3d9 !important;
}
:root:not(.light) .modal .x,
:root:not(.light) .modal .btn:not(.primary):not(.ok):not(.danger),
:root:not(.light) .accessNotice .btn:not(.primary):not(.ok):not(.danger),
html:not(.light) .modal .x,
html:not(.light) .modal .btn:not(.primary):not(.ok):not(.danger),
body:not(.light) .modal .x,
body:not(.light) .modal .btn:not(.primary):not(.ok):not(.danger){
  background:rgba(15,29,61,.48) !important;
  border-color:rgba(183,212,255,.16) !important;
  color:#cfe5ff !important;
}
:root:not(.light) .modal .x:hover,
:root:not(.light) .modal .btn:not(.primary):not(.ok):not(.danger):hover,
:root:not(.light) .accessNotice .btn:not(.primary):not(.ok):not(.danger):hover,
html:not(.light) .modal .x:hover,
html:not(.light) .modal .btn:not(.primary):not(.ok):not(.danger):hover,
body:not(.light) .modal .x:hover,
body:not(.light) .modal .btn:not(.primary):not(.ok):not(.danger):hover{
  background:rgba(22,119,255,.13) !important;
  border-color:rgba(25,198,255,.34) !important;
}


/* === CRONOS V3 — gráficos premium + botões laterais discretos === */
:root:not(.light) .dashboardChartsShell{
  padding:16px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.035), transparent 48%),
    radial-gradient(720px 340px at 18% 4%, rgba(22,119,255,.10), transparent 64%),
    radial-gradient(620px 300px at 92% 6%, rgba(46,230,166,.07), transparent 62%),
    var(--panel2) !important;
}
.dashSectionHeader{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.dashSectionHeader h3{margin:0;font-size:18px;letter-spacing:-.02em;}
.dashSectionHeader p{margin:4px 0 0;font-size:12.5px;}

.dashboardChartsGrid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);
  gap:14px;
  align-items:stretch;
}
.dashboardChartCard{
  border:1px solid rgba(183,212,255,.11);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.012) 55%),
    rgba(8,20,42,.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035), 0 10px 28px rgba(0,0,0,.18);
  padding:14px;
  min-width:0;
}
:root:not(.light) .dashboardChartCard{
  border-color:rgba(183,212,255,.11) !important;
}
.dashboardChartMain{
  background:
    radial-gradient(620px 260px at 52% 52%, rgba(22,119,255,.13), transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01) 58%),
    rgba(7,18,40,.54);
}
.dashboardChartSide{
  background:
    radial-gradient(360px 220px at 48% 35%, rgba(25,198,255,.10), transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01) 58%),
    rgba(7,18,40,.50);
}
.chartPanelHead{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-bottom:8px;
}
.chartPanelHead.compact{margin-bottom:4px;}
.chartPanelIcon{
  width:34px;
  height:34px;
  border-radius:13px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  color:#dff6ff;
  background:
    linear-gradient(135deg, rgba(22,119,255,.24), rgba(25,198,255,.16) 60%, rgba(46,230,166,.12)),
    rgba(14,31,63,.52);
  border:1px solid rgba(64,182,255,.22);
  box-shadow:0 8px 20px rgba(22,119,255,.10), inset 0 1px 0 rgba(255,255,255,.08);
  font-weight:900;
}
.chartPanelHead h4{
  margin:0;
  font-size:14px;
  line-height:1.25;
  letter-spacing:-.01em;
  color:var(--text);
}
.chartPanelHead p{
  margin:3px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}
.cronosChartCanvas{
  width:100% !important;
  display:block;
}
.mainChartCanvas{height:320px !important;}
.statusChartCanvas{height:320px !important;}
.chart-inline-value{
  margin-left:8px;
  font-weight:900;
  color:#eaf6ff;
}
@media(max-width: 1100px){
  .dashboardChartsGrid{grid-template-columns:1fr;}
  .mainChartCanvas,.statusChartCanvas{height:280px !important;}
}

/* Ações laterais: menos grito, mais hierarquia */
:root:not(.light) #btnNewLeadSide,
html:not(.light) #btnNewLeadSide,
body:not(.light) #btnNewLeadSide{
  color:#eaf6ff !important;
  -webkit-text-fill-color:#eaf6ff !important;
  border-color:rgba(25,198,255,.30) !important;
  background:
    linear-gradient(135deg, rgba(22,119,255,.20) 0%, rgba(25,198,255,.13) 58%, rgba(46,230,166,.08) 100%),
    rgba(10,25,52,.45) !important;
  box-shadow:0 8px 20px rgba(22,119,255,.08), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
:root:not(.light) #btnRefreshNow,
html:not(.light) #btnRefreshNow,
body:not(.light) #btnRefreshNow{
  color:#cfe5ff !important;
  -webkit-text-fill-color:#cfe5ff !important;
  border-color:rgba(183,212,255,.16) !important;
  background:rgba(10,25,52,.28) !important;
  box-shadow:0 6px 16px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
:root:not(.light) #btnRefreshNow:hover,
html:not(.light) #btnRefreshNow:hover,
body:not(.light) #btnRefreshNow:hover{
  border-color:rgba(25,198,255,.26) !important;
  background:rgba(22,119,255,.10) !important;
}
:root:not(.light) #btnNewLeadSide:hover,
html:not(.light) #btnNewLeadSide:hover,
body:not(.light) #btnNewLeadSide:hover{
  border-color:rgba(25,198,255,.42) !important;
  background:
    linear-gradient(135deg, rgba(22,119,255,.25) 0%, rgba(25,198,255,.16) 58%, rgba(46,230,166,.10) 100%),
    rgba(10,25,52,.50) !important;
}

/* Modais e telas flutuantes: força o mesmo azul oficial */
:root:not(.light) .modal,
:root:not(.light) .modalContent,
:root:not(.light) .modalCard,
:root:not(.light) .dialog,
:root:not(.light) [role="dialog"],
html:not(.light) .modal,
html:not(.light) .modalContent,
html:not(.light) .modalCard,
html:not(.light) .dialog,
html:not(.light) [role="dialog"],
body:not(.light) .modal,
body:not(.light) .modalContent,
body:not(.light) .modalCard,
body:not(.light) .dialog,
body:not(.light) [role="dialog"]{
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), transparent 48%),
    radial-gradient(720px 360px at 18% 0%, rgba(22,119,255,.16), transparent 62%),
    radial-gradient(620px 320px at 88% 4%, rgba(46,230,166,.10), transparent 60%),
    #0f1d3d !important;
  border-color:rgba(183,212,255,.14) !important;
  color:#eef6ff !important;
}


/* === CRONOS V4 — equilíbrio dos gráficos + modo claro + donut status === */
.dashboardChartsGrid{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
}
.mainChartCanvas,
.statusChartCanvas{
  height:280px !important;
}
.dashboardChartMain,
.dashboardChartSide{
  min-width:0;
}
@media(max-width: 1100px){
  .dashboardChartsGrid{grid-template-columns:1fr !important;}
  .mainChartCanvas,.statusChartCanvas{height:260px !important;}
}

/* modo claro: os cards de gráfico seguem o tema, sem “dark perdido” */
:root.light .dashboardChartsShell,
html.light .dashboardChartsShell,
body.light .dashboardChartsShell{
  background:
    linear-gradient(180deg, rgba(255,255,255,.80), rgba(255,255,255,.62)),
    radial-gradient(720px 340px at 18% 4%, rgba(37,99,235,.10), transparent 64%),
    radial-gradient(620px 300px at 92% 6%, rgba(45,212,191,.10), transparent 62%) !important;
  border-color:rgba(37,99,235,.14) !important;
}
:root.light .dashboardChartCard,
html.light .dashboardChartCard,
body.light .dashboardChartCard{
  background:
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,252,255,.82)),
    radial-gradient(520px 240px at 52% 48%, rgba(37,99,235,.08), transparent 70%) !important;
  border-color:rgba(37,99,235,.13) !important;
  box-shadow:0 10px 28px rgba(15,23,42,.07), inset 0 1px 0 rgba(255,255,255,.90) !important;
}
:root.light .chartPanelIcon,
html.light .chartPanelIcon,
body.light .chartPanelIcon{
  color:#0f3b74 !important;
  background:linear-gradient(135deg, rgba(37,99,235,.14), rgba(20,184,214,.12) 60%, rgba(45,212,191,.12)) !important;
  border-color:rgba(37,99,235,.18) !important;
  box-shadow:none !important;
}
:root.light .chartPanelHead h4,
html.light .chartPanelHead h4,
body.light .chartPanelHead h4{
  color:#0f172a !important;
}
:root.light .chartPanelHead p,
html.light .chartPanelHead p,
body.light .chartPanelHead p,
:root.light .dashSectionHeader p,
html.light .dashSectionHeader p,
body.light .dashSectionHeader p{
  color:#475569 !important;
}
:root.light .chart-inline-value,
html.light .chart-inline-value,
body.light .chart-inline-value{
  color:#0f172a !important;
}

/* Donut no resumo: visual rápido, sem substituir a tabela */
.statusDonutPanel{
  margin-top:10px;
  border:1px solid rgba(183,212,255,.10);
  border-radius:16px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.026), rgba(255,255,255,.008)),
    rgba(8,20,42,.34);
  padding:10px;
}
.statusDonutCanvas{
  width:100% !important;
  height:168px !important;
  display:block;
}
:root.light .statusDonutPanel,
html.light .statusDonutPanel,
body.light .statusDonutPanel{
  background:rgba(255,255,255,.76) !important;
  border-color:rgba(37,99,235,.12) !important;
}
@media(max-width: 900px){
  .statusDonutCanvas{height:190px !important;}
}

/* Deixa o gráfico de barras mais legível quando tiver muitos status */
.dashboardChartSide{
  overflow:hidden;
}


/* === CRONOS V5 — lapidação final de gráficos === */
.statusDonutCanvas{ height:150px !important; }
:root.light .statusDonutCanvas,
html.light .statusDonutCanvas,
body.light .statusDonutCanvas{ height:150px !important; }
:root.light .dashSectionHeader p,
html.light .dashSectionHeader p,
body.light .dashSectionHeader p,
:root.light .chartPanelHead p,
html.light .chartPanelHead p,
body.light .chartPanelHead p,
:root.light .muted,
html.light .muted,
body.light .muted{
  color:#334155 !important;
}
:root.light .chart-inline-value,
html.light .chart-inline-value,
body.light .chart-inline-value{
  color:#0f172a !important;
}


/* === CRONOS LEADS V10 — central comercial premium (dark-first) === */
#view-leads .topbar{
  align-items:flex-start;
  margin-bottom:14px;
}
#view-leads .titleBlock h2{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:26px;
  letter-spacing:-.03em;
}
#view-leads .titleBlock h2::before{
  content:"";
  width:26px;
  height:26px;
  border-radius:10px;
  background:linear-gradient(135deg,rgba(22,119,255,.9),rgba(25,198,255,.65));
  -webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M16 11c1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3 1.34 3 3 3Zm-8 0c1.66 0 3-1.34 3-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3Zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13Zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.96 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5Z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M16 11c1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3 1.34 3 3 3Zm-8 0c1.66 0 3-1.34 3-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3Zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13Zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.96 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5Z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.leadsSummaryGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:10px 0 14px;
}
.leadsMetricCard{
  min-height:86px;
  border:1px solid rgba(183,212,255,.10);
  border-radius:18px;
  padding:14px;
  display:flex;
  align-items:center;
  gap:14px;
  background:
    radial-gradient(280px 120px at 12% 12%,rgba(22,119,255,.11),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 12px 28px rgba(0,0,0,.14);
}
.leadsMetricIcon{
  width:48px;
  height:48px;
  border-radius:17px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  font-size:25px;
  font-weight:950;
  border:1px solid rgba(255,255,255,.10);
}
.leadsMetricIcon svg{width:25px;height:25px;display:block}
.leadsMetricIcon.blue{color:#7ec8ff;background:rgba(22,119,255,.15);border-color:rgba(22,119,255,.25)}
.leadsMetricIcon.hot{color:#ff9b6a;background:rgba(255,90,122,.13);border-color:rgba(255,90,122,.22)}
.leadsMetricIcon.amber{color:#ffd166;background:rgba(245,158,11,.13);border-color:rgba(245,158,11,.22)}
.leadsMetricIcon.green{color:#62f3a8;background:rgba(46,230,166,.13);border-color:rgba(46,230,166,.22)}
.leadsMetricCard b{
  display:block;
  color:var(--text);
  font-size:25px;
  letter-spacing:-.03em;
  line-height:1;
  margin-bottom:4px;
}
.leadsMetricCard span{
  display:block;
  color:#dbeafe;
  font-weight:850;
  font-size:13px;
}
.leadsMetricCard small{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:4px;
}
.leadsListPanel{
  padding:14px !important;
  background:
    radial-gradient(650px 260px at 18% 0%,rgba(22,119,255,.11),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.026),rgba(255,255,255,.01)),
    var(--panel2) !important;
}
.leadsCards{
  display:grid;
  gap:14px;
}
.leadCardV2{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(300px,1.05fr) minmax(380px,1.25fr) minmax(190px,.55fr) minmax(150px,.46fr);
  grid-template-areas:
    "main info money primary"
    "main actions actions primary";
  gap:12px 14px;
  align-items:stretch;
  padding:18px 18px 16px 24px !important;
  border:1px solid rgba(183,212,255,.10) !important;
  border-radius:20px !important;
  background:
    radial-gradient(460px 180px at 12% 0%,rgba(22,119,255,.12),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    rgba(7,18,40,.52) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 30px rgba(0,0,0,.16);
}
.leadCardV2 .leadAccent{
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  border-radius:20px 0 0 20px;
  background:linear-gradient(180deg,#1677ff,#19c6ff);
  box-shadow:0 0 18px rgba(25,198,255,.35);
}
.leadCardV2.accent-hot .leadAccent{background:linear-gradient(180deg,#ff5a7a,#f59e0b);box-shadow:0 0 20px rgba(255,90,122,.34)}
.leadCardV2.accent-amber .leadAccent{background:linear-gradient(180deg,#f59e0b,#ffcc00);box-shadow:0 0 20px rgba(245,158,11,.30)}
.leadCardV2.accent-green .leadAccent{background:linear-gradient(180deg,#2ee6a6,#19c6ff);box-shadow:0 0 20px rgba(46,230,166,.30)}
.leadMainBlock{
  grid-area:main;
  display:grid;
  grid-template-columns:72px 1fr;
  gap:16px;
  align-items:center;
  min-width:0;
}
.leadAvatar{
  width:62px;
  height:62px;
  border-radius:22px;
  display:grid;
  place-items:center;
  color:#7ec8ff;
  background:linear-gradient(135deg,rgba(22,119,255,.16),rgba(25,198,255,.06));
  border:1px solid rgba(126,200,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.leadAvatar svg{width:33px;height:33px}
.leadIdentity .name{
  font-size:17px;
  font-weight:950;
  letter-spacing:-.02em;
  color:#f2f7ff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}
.leadPhone{
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:8px;
  color:#b8cef4;
  font-size:13px;
}
.leadPhone svg{width:15px;height:15px;color:#7ec8ff}
.leadChipRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.leadChip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  border-radius:999px;
  padding:5px 10px;
  font-size:12px;
  font-weight:900;
  border:1px solid rgba(255,255,255,.10);
}
.leadChip.status{background:rgba(46,230,166,.10);color:#62f3a8;border-color:rgba(46,230,166,.22)}
.leadChip.priority.hot{background:rgba(255,90,122,.12);color:#ffb16e;border-color:rgba(255,90,122,.24)}
.leadChip.priority.warm{background:rgba(245,158,11,.12);color:#ffd166;border-color:rgba(245,158,11,.22)}
.leadChip.priority.cold{background:rgba(148,163,184,.12);color:#cbd5e1;border-color:rgba(148,163,184,.18)}
.leadInfoGrid{
  grid-area:info;
  min-width:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  border:1px solid rgba(183,212,255,.09);
  border-radius:16px;
  background:rgba(7,18,40,.35);
  overflow:hidden;
}
.leadInfoItem{
  display:grid;
  grid-template-columns:32px 1fr;
  gap:10px;
  align-items:center;
  padding:12px 14px;
  min-width:0;
  border-bottom:1px solid rgba(183,212,255,.07);
}
.leadInfoItem:nth-child(1),
.leadInfoItem:nth-child(3){border-right:1px solid rgba(183,212,255,.07)}
.leadInfoWide{grid-column:1 / -1;border-bottom:none}
.leadInfoIcon{
  width:28px;
  height:28px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:#6ecbff;
  background:rgba(22,119,255,.10);
  border:1px solid rgba(22,119,255,.16);
}
.leadInfoIcon svg{width:17px;height:17px}
.leadInfoItem small,
.leadMoneyBox small{
  display:block;
  color:#9cb3d9;
  font-size:10.5px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:850;
  margin-bottom:3px;
}
.leadInfoItem strong{
  display:block;
  color:#f2f7ff;
  font-size:14px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.leadMoneyBox{
  grid-area:money;
  min-width:0;
  display:grid;
  grid-template-columns:32px 1fr;
  gap:10px;
  align-items:start;
  padding:12px 14px;
  border:1px solid rgba(183,212,255,.09);
  border-radius:16px;
  background:rgba(7,18,40,.35);
}
.leadPaid{
  color:#dbeafe;
  font-size:13px;
  margin-top:2px;
}
.leadOpen{
  font-size:14px;
  margin-top:6px;
  font-weight:850;
}
.leadOpen.danger{color:#ff6f8f}
.leadOpen.ok{color:#62f3a8}
.leadPrimaryActions{
  grid-area:primary;
  display:flex;
  flex-direction:column;
  gap:10px;
  justify-content:center;
}
.leadPrimaryBtn,
.leadWhatsBtn{
  width:100%;
  min-height:46px;
  border-radius:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-weight:950;
  cursor:pointer;
  transition:.16s ease;
}
.leadPrimaryBtn{
  color:#fff;
  border:1px solid rgba(65,151,255,.38);
  background:linear-gradient(135deg,#1677ff,#0f62fe);
  box-shadow:0 12px 24px rgba(22,119,255,.18);
}
.leadPrimaryBtn:hover,
.leadWhatsBtn:hover,
.leadActionSmall:hover{transform:translateY(-1px)}
.leadWhatsBtn{
  color:#75f6a7;
  border:1px solid rgba(46,230,166,.38);
  background:rgba(46,230,166,.08);
}
.leadPrimaryBtn svg,
.leadWhatsBtn svg{width:18px;height:18px}
.leadSecondaryActions{
  grid-area:actions;
  display:grid;
  grid-template-columns:repeat(5,minmax(82px,1fr));
  gap:10px;
}
.leadActionSmall{
  min-height:38px;
  border-radius:11px;
  border:1px solid rgba(183,212,255,.10);
  background:rgba(7,18,40,.34);
  color:#dbeafe;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:800;
  font-size:12px;
  cursor:pointer;
}
.leadActionSmall svg{width:16px;height:16px}
.leadActionSmall.danger{
  color:#ff6f8f;
  border-color:rgba(255,90,122,.18);
  background:rgba(255,90,122,.055);
}
.leadsPaginationModern{
  margin-top:15px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(183,212,255,.10);
  border-radius:16px;
  background:rgba(7,18,40,.30);
}
.leadsPaginationInfo{
  color:#b8cef4;
  font-size:13px;
}
.leadsPaginationControls{
  display:flex;
  align-items:center;
  gap:8px;
}
.leadsPageSize,
.leadsPageTotal{
  color:#9cb3d9;
  font-size:12px;
  border:1px solid rgba(183,212,255,.09);
  background:rgba(255,255,255,.03);
  border-radius:10px;
  padding:8px 10px;
}
.leadsPaginationControls .btn{
  min-width:38px;
  min-height:38px;
  padding:8px 10px;
}
.leadsPaginationControls .leadsPageActive{
  box-shadow:0 0 0 1px rgba(25,198,255,.30),0 8px 18px rgba(22,119,255,.16);
}
@media(max-width:1280px){
  .leadCardV2{
    grid-template-columns:1fr 1fr;
    grid-template-areas:
      "main primary"
      "info money"
      "actions actions";
  }
  .leadPrimaryActions{justify-content:start}
  .leadsSummaryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:780px){
  .leadCardV2{
    grid-template-columns:1fr;
    grid-template-areas:"main" "info" "money" "primary" "actions";
  }
  .leadMainBlock{grid-template-columns:56px 1fr}
  .leadAvatar{width:52px;height:52px;border-radius:18px}
  .leadInfoGrid{grid-template-columns:1fr}
  .leadInfoItem{border-right:none!important}
  .leadInfoWide{grid-column:auto}
  .leadSecondaryActions{grid-template-columns:repeat(2,minmax(0,1fr))}
  .leadsSummaryGrid{grid-template-columns:1fr}
  .leadsPaginationModern{flex-direction:column;align-items:stretch}
  .leadsPaginationControls{flex-wrap:wrap}
}


/* === CRONOS LEADS V10.1 — compacto, sem emojis e WhatsApp sem duplicidade === */
.leadsSummaryGrid{
  gap:10px !important;
  margin:8px 0 12px !important;
}
.leadsMetricCard{
  min-height:70px !important;
  padding:10px 12px !important;
  border-radius:16px !important;
}
.leadsMetricIcon{
  width:42px !important;
  height:42px !important;
  border-radius:14px !important;
  font-size:0 !important;
}
.leadsMetricIcon svg{
  width:21px !important;
  height:21px !important;
}
.leadsMetricCard b{
  font-size:22px !important;
  margin-bottom:2px !important;
}
.leadsMetricCard span{
  font-size:12px !important;
}
.leadsMetricCard small{
  font-size:11px !important;
  margin-top:2px !important;
}
.leadsListPanel{
  padding:10px !important;
}
.leadsCards{
  gap:10px !important;
}
.leadCardV2{
  grid-template-columns:minmax(250px,.9fr) minmax(360px,1.15fr) minmax(170px,.48fr) minmax(132px,.38fr) !important;
  gap:10px 12px !important;
  padding:13px 14px 12px 20px !important;
  border-radius:18px !important;
}
.leadMainBlock{
  grid-template-columns:54px 1fr !important;
  gap:12px !important;
}
.leadAvatar{
  width:46px !important;
  height:46px !important;
  border-radius:16px !important;
}
.leadAvatar svg{
  width:25px !important;
  height:25px !important;
}
.leadIdentity .name{
  font-size:15px !important;
}
.leadPhone{
  margin-top:5px !important;
  font-size:12px !important;
}
.leadChipRow{
  margin-top:8px !important;
  gap:6px !important;
}
.leadChip{
  min-height:24px !important;
  padding:4px 8px !important;
  font-size:11px !important;
  gap:5px !important;
}
.leadChip svg{
  width:13px !important;
  height:13px !important;
  flex:0 0 auto !important;
}
.leadInfoGrid{
  border-radius:14px !important;
}
.leadInfoItem{
  grid-template-columns:28px 1fr !important;
  gap:8px !important;
  padding:9px 11px !important;
}
.leadInfoIcon{
  width:24px !important;
  height:24px !important;
  border-radius:9px !important;
}
.leadInfoIcon svg{
  width:14px !important;
  height:14px !important;
}
.leadInfoItem small,
.leadMoneyBox small{
  font-size:9.5px !important;
  margin-bottom:2px !important;
}
.leadInfoItem strong{
  font-size:12.5px !important;
}
.leadMoneyBox{
  grid-template-columns:28px 1fr !important;
  gap:8px !important;
  padding:9px 11px !important;
  border-radius:14px !important;
}
.leadPaid{
  font-size:12px !important;
}
.leadOpen{
  font-size:12.5px !important;
  margin-top:4px !important;
}
.leadPrimaryActions{
  gap:8px !important;
}
.leadPrimaryBtn,
.leadWhatsBtn{
  min-height:38px !important;
  border-radius:12px !important;
  gap:7px !important;
  font-size:12.5px !important;
}
.leadPrimaryBtn svg,
.leadWhatsBtn svg{
  width:16px !important;
  height:16px !important;
  flex:0 0 auto !important;
}
.leadWhatsBtn::before,
.leadWhatsBtn::after,
.leadPrimaryBtn::before,
.leadPrimaryBtn::after{
  content:none !important;
  display:none !important;
}
.leadWhatsBtn .cronos-whatsapp-icon,
.leadWhatsBtn .cronos-whatsapp-icon-only::before,
.leadWhatsBtn .cronos-whatsapp-icon-only::after{
  display:none !important;
}
.leadSecondaryActions{
  grid-template-columns:repeat(5,minmax(68px,1fr)) !important;
  gap:8px !important;
}
.leadActionSmall{
  min-height:32px !important;
  border-radius:10px !important;
  gap:6px !important;
  font-size:11px !important;
}
.leadActionSmall svg{
  width:14px !important;
  height:14px !important;
}
.leadsPaginationModern{
  margin-top:10px !important;
  padding:9px 12px !important;
  border-radius:14px !important;
}
.leadsPaginationControls .btn{
  min-width:32px !important;
  min-height:32px !important;
  padding:6px 8px !important;
}
@media(max-width:1280px){
  .leadCardV2{
    grid-template-columns:1fr 1fr !important;
  }
}


/* === CRONOS FUNIL V11 — Kanban respirável com rolagem horizontal visível === */
#view-kanban .topbar{
  align-items:flex-start;
  margin-bottom:12px;
}
#view-kanban .titleBlock h2{
  font-size:25px;
  letter-spacing:-.03em;
}
.kanbanSummaryGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin:8px 0 12px;
}
.kanbanMetricCard{
  min-height:74px;
  border:1px solid rgba(183,212,255,.10);
  border-radius:16px;
  padding:11px 12px;
  display:flex;
  align-items:center;
  gap:12px;
  background:
    radial-gradient(260px 110px at 10% 0%,rgba(22,119,255,.10),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.13);
}
.kanbanMetricIcon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.10);
}
.kanbanMetricIcon svg{width:21px;height:21px;display:block}
.kanbanMetricIcon.blue{color:#7ec8ff;background:rgba(22,119,255,.14);border-color:rgba(22,119,255,.24)}
.kanbanMetricIcon.green{color:#62f3a8;background:rgba(46,230,166,.12);border-color:rgba(46,230,166,.22)}
.kanbanMetricIcon.amber{color:#ffd166;background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.22)}
.kanbanMetricIcon.cyan{color:#67e8f9;background:rgba(25,198,255,.12);border-color:rgba(25,198,255,.22)}
.kanbanMetricCard b{
  display:block;
  color:var(--text);
  font-size:20px;
  letter-spacing:-.03em;
  line-height:1;
  margin-bottom:4px;
}
.kanbanMetricCard span{
  display:block;
  color:#dbeafe;
  font-weight:900;
  font-size:12px;
}
.kanbanMetricCard small{
  display:block;
  color:var(--muted);
  font-size:11px;
  margin-top:3px;
}
.kanbanPanel{
  padding:12px !important;
  overflow:hidden;
  background:
    radial-gradient(700px 280px at 18% 0%,rgba(22,119,255,.10),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.026),rgba(255,255,255,.01)),
    var(--panel2) !important;
}
.kanbanPanelHead{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
  margin-bottom:10px;
}
.kanbanPanelHead strong{
  color:#f2f7ff;
  font-size:16px;
}
.kanbanHint{
  white-space:nowrap;
  border:1px solid rgba(25,198,255,.18);
  background:rgba(25,198,255,.07);
  color:#8be9ff;
  border-radius:999px;
  padding:8px 12px;
  font-size:12px;
  font-weight:900;
}
.kanbanTopScroll{
  width:100%;
  height:17px;
  overflow-x:scroll;
  overflow-y:hidden;
  border:1px solid rgba(183,212,255,.10);
  border-radius:999px;
  background:rgba(7,18,40,.42);
  margin:4px 0 10px;
  scrollbar-color:rgba(25,198,255,.72) rgba(255,255,255,.045);
  scrollbar-width:thin;
}
.kanbanTopScroll::-webkit-scrollbar{
  height:13px;
}
.kanbanTopScroll::-webkit-scrollbar-track{
  background:rgba(255,255,255,.045);
  border-radius:999px;
}
.kanbanTopScroll::-webkit-scrollbar-thumb{
  background:linear-gradient(90deg,#1677ff,#19c6ff,#2ee6a6);
  border-radius:999px;
  border:3px solid rgba(7,18,40,.85);
}
#kanbanTopScrollInner{
  height:1px;
}
.kanbanScrollArea{
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  padding-bottom:2px;
  scrollbar-color:rgba(25,198,255,.72) rgba(255,255,255,.045);
  scrollbar-width:thin;
}
.kanbanScrollArea::-webkit-scrollbar{
  height:10px;
}
.kanbanScrollArea::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035);
  border-radius:999px;
}
.kanbanScrollArea::-webkit-scrollbar-thumb{
  background:rgba(25,198,255,.54);
  border-radius:999px;
}
.kanbanWrap{
  display:flex !important;
  grid-template-columns:none !important;
  gap:12px !important;
  min-width:max-content;
  align-items:stretch;
}
.kanColV11{
  flex:0 0 304px;
  width:304px;
  max-width:304px;
  min-height:560px;
  height:min(66vh,650px);
  border:1px solid rgba(183,212,255,.10) !important;
  border-radius:18px !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    rgba(7,18,40,.48) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden !important;
}
.kanColV11 .kanHead{
  position:relative !important;
  top:auto !important;
  z-index:2;
  display:grid !important;
  grid-template-columns:1fr auto;
  align-items:start !important;
  gap:8px !important;
  padding:12px !important;
  border-bottom:1px solid rgba(183,212,255,.09) !important;
  background:
    radial-gradient(240px 120px at 12% 0%,rgba(22,119,255,.14),transparent 72%),
    rgba(255,255,255,.025) !important;
}
.kanHeadMain b{
  display:block;
  color:#f2f7ff;
  font-size:14px;
  font-weight:950;
  letter-spacing:-.02em;
}
.kanHeadMain span{
  display:block;
  color:#9cb3d9;
  margin-top:4px;
  font-size:11px;
  font-weight:800;
}
.kanHeadValue{
  justify-self:end;
  border:1px solid rgba(25,198,255,.18);
  background:rgba(25,198,255,.075);
  color:#8be9ff;
  border-radius:999px;
  padding:6px 8px;
  font-size:11px;
  font-weight:950;
  white-space:nowrap;
}
.kanHeadAlert{
  grid-column:1 / -1;
  display:inline-flex;
  width:max-content;
  color:#ffd166;
  border:1px solid rgba(245,158,11,.18);
  background:rgba(245,158,11,.08);
  border-radius:999px;
  padding:5px 8px;
  font-size:10.5px;
  font-weight:950;
}
.kanColV11 .kanList{
  padding:10px !important;
  gap:10px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  height:100%;
  scrollbar-color:rgba(25,198,255,.42) transparent;
  scrollbar-width:thin;
}
.kanColV11 .kanList::-webkit-scrollbar{width:7px}
.kanColV11 .kanList::-webkit-scrollbar-thumb{
  background:rgba(25,198,255,.42);
  border-radius:999px;
}
.kanCardV11{
  border:1px solid rgba(183,212,255,.10) !important;
  border-radius:16px !important;
  padding:11px !important;
  background:
    radial-gradient(250px 100px at 10% 0%,rgba(22,119,255,.11),transparent 75%),
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.012)),
    rgba(8,20,44,.58) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 8px 18px rgba(0,0,0,.13);
  cursor:grab;
}
.kanCardV11:active{cursor:grabbing}
.kanCardTop{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:start;
  gap:8px;
}
.kanCardName{
  min-width:0;
  color:#f2f7ff;
  font-size:14px;
  font-weight:950;
  letter-spacing:-.02em;
  line-height:1.14;
}
.kanOpenBtn{
  min-height:30px;
  border:1px solid rgba(25,198,255,.22);
  background:rgba(22,119,255,.12);
  color:#dbeafe;
  border-radius:10px;
  display:flex;
  align-items:center;
  gap:5px;
  padding:5px 8px;
  font-size:11px;
  font-weight:950;
  cursor:pointer;
}
.kanOpenBtn svg{width:13px;height:13px}
.kanPhone{
  display:flex;
  align-items:center;
  gap:6px;
  color:#b8cef4;
  font-size:12px;
  margin-top:6px;
}
.kanPhone svg{width:13px;height:13px;color:#7ec8ff;flex:0 0 auto}
.kanInfoStack{
  display:grid;
  gap:6px;
  margin-top:10px;
}
.kanMiniLine{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  color:#dbeafe;
  font-size:12px;
  line-height:1.25;
}
.kanMiniLine svg{
  width:14px;
  height:14px;
  flex:0 0 auto;
  color:#67e8f9;
}
.kanMiniLine span{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.kanAppointment{
  display:grid;
  grid-template-columns:20px 1fr auto;
  gap:7px;
  align-items:center;
  border:1px solid rgba(183,212,255,.10);
  background:rgba(255,255,255,.03);
  border-radius:12px;
  padding:8px;
}
.kanAppointment svg{
  width:15px;
  height:15px;
  color:#8be9ff;
}
.kanAppointment small{
  display:block;
  color:#9cb3d9;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:9.5px;
  font-weight:900;
  margin-bottom:2px;
}
.kanAppointment b{
  display:block;
  color:#f2f7ff;
  font-size:12px;
}
.kanAppointment em{
  font-style:normal;
  border-radius:999px;
  padding:4px 6px;
  font-size:9.5px;
  font-weight:950;
  white-space:nowrap;
}
.kanAppointment.late em{color:#ff8ca3;background:rgba(255,90,122,.12);border:1px solid rgba(255,90,122,.18)}
.kanAppointment.today em{color:#ffd166;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.18)}
.kanAppointment.soon em,
.kanAppointment.future em{color:#8be9ff;background:rgba(25,198,255,.10);border:1px solid rgba(25,198,255,.18)}
.kanAppointment.neutral em{color:#cbd5e1;background:rgba(148,163,184,.08);border:1px solid rgba(148,163,184,.14)}
.kanMoney{
  display:grid;
  gap:4px;
  margin-top:10px;
  color:#b8cef4;
  font-size:11.5px;
  line-height:1.25;
}
.kanMoney b{color:#f2f7ff}
.kanMoney .open,
.kanMoney .open b{color:#ff8ca3}
.kanMoney .ok,
.kanMoney .ok b{color:#62f3a8}
.kanCardActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:10px;
}
.kanFichaBtn,
.kanWhatsBtn{
  min-height:34px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:11.5px;
  font-weight:950;
  cursor:pointer;
}
.kanFichaBtn{
  color:#dbeafe;
  border:1px solid rgba(183,212,255,.12);
  background:rgba(255,255,255,.035);
}
.kanWhatsBtn{
  color:#75f6a7;
  border:1px solid rgba(46,230,166,.30);
  background:rgba(46,230,166,.08);
}
.kanFichaBtn svg,
.kanWhatsBtn svg{
  width:15px;
  height:15px;
}
.kanWhatsBtn::before,
.kanWhatsBtn::after{
  content:none !important;
  display:none !important;
}
.kanHiddenNotice,
.kanEmptyState{
  border:1px dashed rgba(183,212,255,.14);
  color:#9cb3d9;
  border-radius:14px;
  padding:12px;
  font-size:12px;
  line-height:1.35;
  background:rgba(255,255,255,.02);
}
@media(max-width:1280px){
  .kanbanSummaryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kanColV11{flex-basis:292px;width:292px;max-width:292px}
}
@media(max-width:760px){
  .kanbanSummaryGrid{grid-template-columns:1fr}
  .kanbanPanelHead{align-items:flex-start;flex-direction:column}
  .kanColV11{flex-basis:286px;width:286px;max-width:286px}
}


/* === CRONOS TAREFAS V13 — central operacional dark-first === */
#view-tasks{
  --task-blue:#1677ff;
  --task-cyan:#19c6ff;
  --task-green:#2ee6a6;
  --task-amber:#f59e0b;
  --task-red:#ff5a7a;
}
.tasksHero{
  border:1px solid rgba(183,212,255,.10);
  border-radius:22px;
  padding:18px;
  margin-bottom:12px;
  background:
    radial-gradient(760px 260px at 20% 0%,rgba(22,119,255,.16),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    var(--panel2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 36px rgba(0,0,0,.16);
}
.tasksHeroTitle{
  display:flex;
  align-items:center;
  gap:13px;
  margin-bottom:14px;
}
.tasksTitleIcon{
  width:42px;
  height:42px;
  border-radius:15px;
  display:grid;
  place-items:center;
  color:#8be9ff;
  background:linear-gradient(135deg,rgba(22,119,255,.16),rgba(25,198,255,.08));
  border:1px solid rgba(25,198,255,.18);
}
.tasksTitleIcon svg{width:22px;height:22px}
.tasksHero h2{
  margin:0;
  color:var(--text);
  font-size:26px;
  letter-spacing:-.03em;
}
.tasksHero p{
  margin:4px 0 0;
  color:var(--muted);
}
.tasksFilterRow{
  display:grid;
  grid-template-columns:220px minmax(260px,1fr) 260px auto;
  gap:12px;
  align-items:end;
}
.tasksField label{
  display:block;
  color:#9cb3d9;
  font-size:12px;
  font-weight:850;
  margin-bottom:6px;
}
.tasksField .input{
  min-height:46px;
}
.tasksNewBtn{
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:14px;
  padding:0 18px;
  box-shadow:0 14px 30px rgba(22,119,255,.18);
}
.tasksNewBtn svg{width:18px;height:18px}
.tasksSummaryGrid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin:12px 0;
}
.tasksMetricCard{
  min-height:94px;
  display:flex;
  align-items:center;
  gap:14px;
  border:1px solid rgba(183,212,255,.10);
  border-radius:18px;
  padding:14px;
  background:
    radial-gradient(280px 120px at 12% 0%,rgba(22,119,255,.11),transparent 72%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 12px 28px rgba(0,0,0,.13);
}
.tasksMetricIcon{
  width:52px;
  height:52px;
  border-radius:18px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.10);
}
.tasksMetricIcon svg{width:25px;height:25px}
.tasksMetricCard.pending .tasksMetricIcon{color:#7ec8ff;background:rgba(22,119,255,.14);border-color:rgba(22,119,255,.24)}
.tasksMetricCard.today .tasksMetricIcon{color:#ffd166;background:rgba(245,158,11,.12);border-color:rgba(245,158,11,.22)}
.tasksMetricCard.late .tasksMetricIcon{color:#ff8ca3;background:rgba(255,90,122,.12);border-color:rgba(255,90,122,.22)}
.tasksMetricCard.done .tasksMetricIcon{color:#62f3a8;background:rgba(46,230,166,.12);border-color:rgba(46,230,166,.22)}
.tasksMetricCard b{
  display:block;
  color:var(--text);
  font-size:27px;
  line-height:1;
  letter-spacing:-.03em;
  margin-bottom:5px;
}
.tasksMetricCard span{
  display:block;
  color:#dbeafe;
  font-weight:900;
  font-size:13px;
}
.tasksMetricCard small{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:4px;
}
.tasksWorkspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:12px;
  align-items:start;
}
.tasksListPanel,
.tasksSideCard{
  border:1px solid rgba(183,212,255,.10);
  border-radius:20px;
  background:
    radial-gradient(640px 260px at 16% 0%,rgba(22,119,255,.10),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.026),rgba(255,255,255,.01)),
    var(--panel2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}
.tasksListPanel{
  padding:12px;
}
.tasksListHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:4px 4px 12px;
}
.tasksListHead strong{
  color:#f2f7ff;
  font-size:17px;
}
.tasksListHead span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:8px;
  min-width:30px;
  height:26px;
  border-radius:999px;
  color:#8be9ff;
  border:1px solid rgba(25,198,255,.18);
  background:rgba(25,198,255,.08);
  font-size:12px;
  font-weight:950;
}
.tasksSortHint{
  color:#9cb3d9;
  font-size:12px;
}
.tasksCardsList{
  display:grid;
  gap:10px;
}
.taskCardV13{
  display:grid;
  grid-template-columns:130px minmax(280px,1fr) 126px minmax(210px,.65fr) 210px;
  gap:12px;
  align-items:center;
  border:1px solid rgba(183,212,255,.09);
  border-radius:17px;
  padding:12px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    rgba(7,18,40,.44);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.taskCardV13.late{
  border-color:rgba(255,90,122,.35);
  box-shadow:inset 4px 0 0 rgba(255,90,122,.55),inset 0 1px 0 rgba(255,255,255,.035);
}
.taskCardV13.today{
  border-color:rgba(245,158,11,.20);
}
.taskCardV13.done{
  opacity:.78;
}
.taskStatusPill{
  width:max-content;
  max-width:126px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:30px;
  border-radius:999px;
  padding:6px 10px;
  font-size:11.5px;
  font-weight:950;
  border:1px solid rgba(255,255,255,.10);
}
.taskStatusPill svg{
  width:14px;
  height:14px;
}
.taskStatusPill.pending{color:#7ec8ff;background:rgba(22,119,255,.10);border-color:rgba(22,119,255,.20)}
.taskStatusPill.today{color:#ffd166;background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.20)}
.taskStatusPill.late{color:#ff8ca3;background:rgba(255,90,122,.11);border-color:rgba(255,90,122,.22)}
.taskStatusPill.done{color:#62f3a8;background:rgba(46,230,166,.10);border-color:rgba(46,230,166,.20)}
.taskCardTitle{
  color:#f2f7ff;
  font-size:14px;
  font-weight:950;
  line-height:1.28;
}
.taskActionLabel{
  color:#9cb3d9;
  font-size:12px;
  margin-top:3px;
}
.taskLeadMeta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin-top:8px;
  color:#b8cef4;
  font-size:12px;
}
.taskLeadMeta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.taskLeadMeta b{
  color:#6ecbff;
}
.taskLeadMeta svg{
  width:14px;
  height:14px;
  color:#7ec8ff;
}
.taskDueBox,
.taskObsBox{
  border-left:1px solid rgba(183,212,255,.08);
  padding-left:12px;
}
.taskDueBox small,
.taskObsBox small{
  display:block;
  color:#9cb3d9;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:900;
  margin-bottom:5px;
}
.taskDueBox strong{
  display:inline-flex;
  color:#f2f7ff;
  font-size:13px;
  font-weight:950;
  border-radius:10px;
  padding:5px 8px;
  background:rgba(22,119,255,.10);
  border:1px solid rgba(22,119,255,.16);
}
.taskDueBox.today strong{color:#ffd166;background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.18)}
.taskDueBox.late strong{color:#ff8ca3;background:rgba(255,90,122,.10);border-color:rgba(255,90,122,.20)}
.taskDueBox.done strong{color:#62f3a8;background:rgba(46,230,166,.08);border-color:rgba(46,230,166,.16)}
.taskObsBox span{
  display:block;
  color:#c9d8f5;
  font-size:12px;
  line-height:1.35;
}
.taskCardActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  align-items:center;
}
.taskCardActions button{
  min-height:34px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-size:11.5px;
  font-weight:950;
  cursor:pointer;
}
.taskCardActions svg{
  width:14px;
  height:14px;
}
.taskBtnComplete{
  color:#84f5b4;
  border:1px solid rgba(46,230,166,.28);
  background:rgba(46,230,166,.08);
}
.taskBtnComplete.reopen{
  color:#8be9ff;
  border-color:rgba(25,198,255,.18);
  background:rgba(25,198,255,.07);
}
.taskBtnGhost{
  color:#dbeafe;
  border:1px solid rgba(183,212,255,.12);
  background:rgba(255,255,255,.035);
}
.taskBtnOpen{
  grid-column:1 / -1;
  color:#fff;
  border:1px solid rgba(22,119,255,.35);
  background:linear-gradient(135deg,#1677ff,#0f62fe);
  box-shadow:0 10px 22px rgba(22,119,255,.16);
}
.tasksSidePanel{
  display:grid;
  gap:12px;
}
.tasksSideCard{
  padding:14px;
}
.tasksSideTitle{
  display:flex;
  align-items:center;
  gap:9px;
  color:#f2f7ff;
  margin-bottom:10px;
}
.tasksSideTitle svg{
  width:18px;
  height:18px;
  color:#8be9ff;
}
.tasksSideTitle strong{
  font-size:15px;
}
.tasksSideCard p{
  margin:0 0 12px;
  color:#b8cef4;
  font-size:13px;
  line-height:1.4;
}
.tasksProgress{
  display:flex;
  align-items:center;
  gap:14px;
  margin:12px 0;
}
.tasksProgressRing{
  --p:0;
  width:70px;
  height:70px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#f2f7ff;
  font-weight:950;
  background:
    radial-gradient(circle at center,var(--panel2) 0 55%,transparent 57%),
    conic-gradient(var(--task-green) calc(var(--p) * 1%),rgba(255,255,255,.08) 0);
  border:1px solid rgba(183,212,255,.10);
}
.tasksProgress b{
  display:block;
  color:#f2f7ff;
  font-size:22px;
  line-height:1;
}
.tasksProgress small{
  display:block;
  color:#9cb3d9;
  margin-top:4px;
}
.tasksSideBtn{
  width:100%;
  min-height:38px;
  border-radius:12px;
  color:#dbeafe;
  border:1px solid rgba(22,119,255,.25);
  background:rgba(22,119,255,.12);
  font-weight:950;
  cursor:pointer;
}
.tasksQuickRows{
  display:grid;
  gap:9px;
}
.tasksQuickRows div{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  border-bottom:1px solid rgba(183,212,255,.07);
  padding-bottom:8px;
  color:#b8cef4;
  font-size:12.5px;
}
.tasksQuickRows div:last-child{
  border-bottom:none;
  padding-bottom:0;
}
.tasksQuickRows b{
  color:#f2f7ff;
  font-size:13px;
  text-align:right;
}
.tasksEmptyState{
  border:1px dashed rgba(183,212,255,.15);
  border-radius:16px;
  padding:22px;
  color:#9cb3d9;
  text-align:center;
  background:rgba(255,255,255,.02);
}
@media(max-width:1380px){
  .taskCardV13{
    grid-template-columns:120px minmax(260px,1fr) 116px minmax(180px,.65fr) 190px;
  }
}
@media(max-width:1180px){
  .tasksFilterRow{
    grid-template-columns:1fr 1fr;
  }
  .tasksNewBtn{
    grid-column:auto;
  }
  .tasksSummaryGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .tasksWorkspace{
    grid-template-columns:1fr;
  }
  .tasksSidePanel{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .taskCardV13{
    grid-template-columns:120px minmax(260px,1fr) 116px;
    grid-template-areas:
      "status main due"
      "status obs actions";
  }
  .taskStatusPill{grid-area:status}
  .taskCardMain{grid-area:main}
  .taskDueBox{grid-area:due}
  .taskObsBox{grid-area:obs;border-left:none;padding-left:0}
  .taskCardActions{grid-area:actions}
}
@media(max-width:820px){
  .tasksFilterRow,
  .tasksSummaryGrid,
  .tasksSidePanel{
    grid-template-columns:1fr;
  }
  .taskCardV13{
    grid-template-columns:1fr;
    grid-template-areas:none;
  }
  .taskStatusPill,
  .taskCardMain,
  .taskDueBox,
  .taskObsBox,
  .taskCardActions{grid-area:auto}
  .taskDueBox,
  .taskObsBox{
    border-left:none;
    padding-left:0;
  }
}


/* === CRONOS TAREFAS V15 CORRIGIDO — status integrado + apagar tarefa === */
.taskCardV15{
  display:grid;
  grid-template-columns:minmax(310px,1fr) 118px minmax(190px,.55fr) 224px;
  gap:10px;
  align-items:center;
  border:1px solid rgba(183,212,255,.09);
  border-radius:17px;
  padding:11px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    rgba(7,18,40,.44);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.taskCardV15.late{
  border-color:rgba(255,90,122,.35);
  box-shadow:inset 4px 0 0 rgba(255,90,122,.55),inset 0 1px 0 rgba(255,255,255,.035);
}
.taskCardV15.today{
  border-color:rgba(245,158,11,.20);
}
.taskCardV15.done{
  opacity:.78;
}
.taskCardV15 .taskMainTop{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:7px;
}
.taskCardV15 .taskStatusPill{
  width:auto;
  max-width:none;
  min-height:25px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  padding:4px 8px;
  font-size:11px;
  font-weight:950;
  border:1px solid rgba(255,255,255,.10);
}
.taskCardV15 .taskStatusPill svg{
  width:13px;
  height:13px;
}
.taskCardV15 .taskStatusPill.pending{color:#7ec8ff;background:rgba(22,119,255,.10);border-color:rgba(22,119,255,.20)}
.taskCardV15 .taskStatusPill.today{color:#ffd166;background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.20)}
.taskCardV15 .taskStatusPill.late{color:#ff8ca3;background:rgba(255,90,122,.11);border-color:rgba(255,90,122,.22)}
.taskCardV15 .taskStatusPill.done{color:#62f3a8;background:rgba(46,230,166,.10);border-color:rgba(46,230,166,.20)}
.taskCardV15 .taskActionLabel{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  border-radius:999px;
  border:1px solid rgba(183,212,255,.10);
  background:rgba(255,255,255,.035);
  padding:3px 8px;
  color:#b8cef4;
  font-size:11px;
  font-weight:850;
  margin-top:0;
}
.taskCardV15 .taskCardTitle{
  color:#f2f7ff;
  font-size:13.5px;
  font-weight:950;
  line-height:1.28;
}
.taskCardV15 .taskLeadMeta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin-top:7px;
  color:#b8cef4;
  font-size:12px;
}
.taskCardV15 .taskLeadMeta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.taskCardV15 .taskLeadMeta b{
  color:#6ecbff;
}
.taskCardV15 .taskLeadMeta svg{
  width:14px;
  height:14px;
  color:#7ec8ff;
}
.taskCardV15 .taskDueBox,
.taskCardV15 .taskObsBox{
  border-left:1px solid rgba(183,212,255,.08);
  padding-left:10px;
}
.taskCardV15 .taskDueBox small,
.taskCardV15 .taskObsBox small{
  display:block;
  color:#9cb3d9;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:900;
  margin-bottom:5px;
}
.taskCardV15 .taskDueBox strong{
  display:inline-flex;
  color:#f2f7ff;
  font-size:13px;
  font-weight:950;
  border-radius:10px;
  padding:5px 8px;
  background:rgba(22,119,255,.10);
  border:1px solid rgba(22,119,255,.16);
}
.taskCardV15 .taskDueBox.today strong{color:#ffd166;background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.18)}
.taskCardV15 .taskDueBox.late strong{color:#ff8ca3;background:rgba(255,90,122,.10);border-color:rgba(255,90,122,.20)}
.taskCardV15 .taskDueBox.done strong{color:#62f3a8;background:rgba(46,230,166,.08);border-color:rgba(46,230,166,.16)}
.taskCardV15 .taskObsBox span{
  display:block;
  color:#c9d8f5;
  font-size:12px;
  line-height:1.35;
}
.taskCardV15 .taskCardActions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  align-items:center;
}
.taskCardV15 .taskCardActions button{
  min-height:31px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:11px;
  font-weight:950;
  cursor:pointer;
}
.taskCardV15 .taskCardActions svg{
  width:14px;
  height:14px;
}
.taskCardV15 .taskBtnComplete{
  color:#84f5b4;
  border:1px solid rgba(46,230,166,.28);
  background:rgba(46,230,166,.08);
}
.taskCardV15 .taskBtnComplete.reopen{
  color:#8be9ff;
  border-color:rgba(25,198,255,.18);
  background:rgba(25,198,255,.07);
}
.taskCardV15 .taskBtnGhost{
  color:#dbeafe;
  border:1px solid rgba(183,212,255,.12);
  background:rgba(255,255,255,.035);
}
.taskCardV15 .taskBtnDelete{
  color:#ff8ca3;
  border:1px solid rgba(255,90,122,.24);
  background:rgba(255,90,122,.08);
}
.taskCardV15 .taskBtnOpen{
  grid-column:1 / -1;
  color:#fff;
  border:1px solid rgba(22,119,255,.35);
  background:linear-gradient(135deg,#1677ff,#0f62fe);
  box-shadow:0 10px 22px rgba(22,119,255,.16);
}
@media(max-width:1180px){
  .taskCardV15{
    grid-template-columns:minmax(260px,1fr) 116px;
    grid-template-areas:
      "main due"
      "obs actions";
  }
  .taskCardV15 .taskCardMain{grid-area:main}
  .taskCardV15 .taskDueBox{grid-area:due}
  .taskCardV15 .taskObsBox{grid-area:obs;border-left:none;padding-left:0}
  .taskCardV15 .taskCardActions{grid-area:actions}
}
@media(max-width:820px){
  .taskCardV15{
    grid-template-columns:1fr;
    grid-template-areas:none;
  }
  .taskCardV15 .taskCardMain,
  .taskCardV15 .taskDueBox,
  .taskCardV15 .taskObsBox,
  .taskCardV15 .taskCardActions{grid-area:auto}
  .taskCardV15 .taskDueBox,
  .taskCardV15 .taskObsBox{border-left:none;padding-left:0}
}


/* === CRONOS TAREFAS V16 — lateral sticky, lista com rolagem e CTA menos gritante === */
#view-tasks{
  min-height:calc(100vh - 24px);
}
#view-tasks .tasksNewBtn{
  min-height:42px !important;
  border-radius:13px !important;
  padding:0 16px !important;
  color:#dff7ff !important;
  border:1px solid rgba(25,198,255,.34) !important;
  background:
    linear-gradient(135deg,rgba(22,119,255,.38),rgba(25,198,255,.22)) !important;
  box-shadow:0 8px 18px rgba(22,119,255,.13), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#view-tasks .tasksNewBtn:hover{
  background:
    linear-gradient(135deg,rgba(22,119,255,.62),rgba(25,198,255,.36)) !important;
  box-shadow:0 12px 24px rgba(22,119,255,.18),0 0 0 1px rgba(25,198,255,.18) !important;
}
#view-tasks .tasksNewBtn svg{
  width:16px !important;
  height:16px !important;
}
#view-tasks .tasksMetricCard{
  min-height:82px !important;
  padding:12px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 20px rgba(0,0,0,.10) !important;
}
#view-tasks .tasksMetricIcon{
  width:46px !important;
  height:46px !important;
  border-radius:16px !important;
}
#view-tasks .tasksMetricIcon svg{
  width:22px !important;
  height:22px !important;
}
#view-tasks .tasksMetricCard b{
  font-size:24px !important;
}
#view-tasks .tasksWorkspace{
  align-items:start !important;
}
#view-tasks .tasksListPanel{
  max-height:calc(100vh - 390px);
  min-height:420px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
#view-tasks .tasksListHead{
  flex:0 0 auto;
  position:sticky;
  top:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(12,28,62,.96),rgba(12,28,62,.84));
  backdrop-filter:blur(10px);
  border-radius:14px;
  margin-bottom:8px;
}
#view-tasks .tasksCardsList{
  overflow-y:auto;
  padding-right:6px;
  flex:1 1 auto;
  scrollbar-color:rgba(25,198,255,.52) rgba(255,255,255,.035);
  scrollbar-width:thin;
}
#view-tasks .tasksCardsList::-webkit-scrollbar{
  width:8px;
}
#view-tasks .tasksCardsList::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035);
  border-radius:999px;
}
#view-tasks .tasksCardsList::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#1677ff,#19c6ff);
  border-radius:999px;
}
#view-tasks .tasksSidePanel{
  position:sticky;
  top:14px;
  align-self:start;
  max-height:calc(100vh - 28px);
  overflow-y:auto;
  padding-right:2px;
  scrollbar-width:thin;
  scrollbar-color:rgba(25,198,255,.42) transparent;
}
#view-tasks .tasksSidePanel::-webkit-scrollbar{
  width:6px;
}
#view-tasks .tasksSidePanel::-webkit-scrollbar-thumb{
  background:rgba(25,198,255,.42);
  border-radius:999px;
}
#view-tasks .tasksSideCard{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 22px rgba(0,0,0,.10) !important;
}
@media(max-width:1180px){
  #view-tasks .tasksListPanel{
    max-height:none;
    min-height:0;
    overflow:visible;
  }
  #view-tasks .tasksCardsList{
    overflow:visible;
    padding-right:0;
  }
  #view-tasks .tasksSidePanel{
    position:static;
    max-height:none;
    overflow:visible;
    padding-right:0;
  }
}


/* === CRONOS TAREFAS V19 — volta para a base visual boa + Ver mais === */
/* Mantém os cards azuis da v16, mas tira a rolagem interna precoce */
#view-tasks .tasksListPanel{
  max-height:none !important;
  min-height:0 !important;
  overflow:visible !important;
  display:block !important;
}
#view-tasks .tasksListHead{
  position:static !important;
  top:auto !important;
  z-index:auto !important;
  background:transparent !important;
  backdrop-filter:none !important;
  border-radius:0 !important;
  margin-bottom:8px !important;
}
#view-tasks .tasksCardsList{
  overflow:visible !important;
  padding-right:0 !important;
  flex:none !important;
  display:grid !important;
  gap:10px !important;
}
#view-tasks .tasksCardsList::-webkit-scrollbar,
#view-tasks .tasksListPanel::-webkit-scrollbar{
  display:none !important;
}

/* Lateral continua fixa enquanto a tela rola */
#view-tasks .tasksSidePanel{
  position:sticky !important;
  top:14px !important;
  align-self:start !important;
  max-height:calc(100vh - 28px) !important;
  overflow-y:auto !important;
  padding-right:2px !important;
}

/* Botão Nova tarefa fica discreto, sem roubar cena */
#view-tasks .tasksNewBtn{
  min-height:40px !important;
  border-radius:12px !important;
  padding:0 14px !important;
  color:#dff7ff !important;
  background:
    linear-gradient(135deg,rgba(22,119,255,.30),rgba(25,198,255,.16)) !important;
  border:1px solid rgba(25,198,255,.26) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 18px rgba(22,119,255,.10) !important;
}
#view-tasks .tasksNewBtn:hover{
  background:
    linear-gradient(135deg,rgba(22,119,255,.42),rgba(25,198,255,.22)) !important;
  border-color:rgba(25,198,255,.36) !important;
}

/* Mantém a vibe azul aprovada, só sem exagerar feito v18 */
#view-tasks .taskCardV15{
  border-color:rgba(126,200,255,.12) !important;
  background:
    radial-gradient(320px 120px at 10% 0%,rgba(25,198,255,.12),transparent 72%),
    linear-gradient(135deg,rgba(22,119,255,.16),rgba(18,42,92,.68) 58%,rgba(8,20,44,.70)) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 20px rgba(0,0,0,.10) !important;
}
#view-tasks .taskCardV15:hover{
  border-color:rgba(25,198,255,.22) !important;
}

/* Botão Ver mais no mesmo idioma visual da versão boa */
#view-tasks .tasksSeeMoreBtn{
  width:100%;
  min-height:42px;
  border-radius:14px;
  border:1px solid rgba(25,198,255,.20);
  background:
    linear-gradient(135deg,rgba(22,119,255,.16),rgba(25,198,255,.08));
  color:#dff7ff;
  font-weight:900;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 8px 18px rgba(22,119,255,.08);
}
#view-tasks .tasksSeeMoreBtn span{
  min-width:24px;
  height:22px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#8be9ff;
  background:rgba(25,198,255,.12);
  border:1px solid rgba(25,198,255,.16);
  font-size:12px;
}
#view-tasks .tasksSeeMoreBtn:hover{
  background:
    linear-gradient(135deg,rgba(22,119,255,.24),rgba(25,198,255,.12));
  border-color:rgba(25,198,255,.30);
}
#view-tasks .tasksSeeMoreBtn.ghost{
  background:rgba(255,255,255,.035);
  color:#b8cef4;
  box-shadow:none;
}

@media(max-width:1180px){
  #view-tasks .tasksSidePanel{
    position:static !important;
    max-height:none !important;
    overflow:visible !important;
    padding-right:0 !important;
  }
}


/* === CRONOS V21 — Tarefas: ações sem vazar em 100% === */
#view-tasks .tasksWorkspace{
  grid-template-columns:minmax(0,1fr) 292px !important;
}
#view-tasks .tasksListPanel{
  min-width:0 !important;
}
#view-tasks .tasksCardsList{
  min-width:0 !important;
}
#view-tasks .taskCardV15{
  min-width:0 !important;
  grid-template-columns:minmax(220px,1fr) 102px minmax(132px,.50fr) 178px !important;
  gap:8px !important;
  padding:10px !important;
}
#view-tasks .taskCardV15 > *{
  min-width:0 !important;
}
#view-tasks .taskCardV15 .taskCardTitle,
#view-tasks .taskCardV15 .taskObsBox span,
#view-tasks .taskCardV15 .taskLeadMeta{
  overflow:hidden !important;
}
#view-tasks .taskCardV15 .taskCardTitle{
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
}
#view-tasks .taskCardV15 .taskObsBox span{
  display:-webkit-box !important;
  -webkit-line-clamp:3 !important;
  -webkit-box-orient:vertical !important;
}
#view-tasks .taskCardV15 .taskLeadMeta{
  white-space:nowrap !important;
  text-overflow:ellipsis !important;
}
#view-tasks .taskCardV15 .taskCardActions{
  min-width:0 !important;
  grid-template-columns:1fr 1fr !important;
  gap:6px !important;
}
#view-tasks .taskCardV15 .taskCardActions button{
  min-width:0 !important;
  padding:0 8px !important;
  font-size:10.5px !important;
}
#view-tasks .taskCardV15 .taskCardActions button span{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
#view-tasks .taskCardV15 .taskBtnOpen{
  grid-column:1 / -1 !important;
}
@media(max-width:1380px){
  #view-tasks .tasksWorkspace{
    grid-template-columns:minmax(0,1fr) 270px !important;
    gap:10px !important;
  }
  #view-tasks .taskCardV15{
    grid-template-columns:minmax(210px,1fr) 98px minmax(120px,.45fr) 168px !important;
    gap:7px !important;
  }
  #view-tasks .taskCardV15 .taskCardActions button{
    padding:0 6px !important;
    font-size:10px !important;
  }
  #view-tasks .tasksSideCard{
    padding:12px !important;
  }
}
@media(max-width:1240px){
  #view-tasks .tasksWorkspace{
    grid-template-columns:1fr !important;
  }
  #view-tasks .tasksSidePanel{
    position:static !important;
    max-height:none !important;
    overflow:visible !important;
    padding-right:0 !important;
  }
  #view-tasks .taskCardV15{
    grid-template-columns:minmax(240px,1fr) 105px minmax(150px,.6fr) 180px !important;
  }
}


/* === CRONOS V22 — Leads: botão Campanha no lugar de Editar === */
.leadActionSmall.campaignToggle{
  color:#ffd166;
  border-color:rgba(245,158,11,.28);
  background:rgba(245,158,11,.075);
}
.leadActionSmall.campaignToggle:hover{
  border-color:rgba(245,158,11,.42);
  background:rgba(245,158,11,.12);
}
.leadActionSmall.campaignToggle.active{
  color:#7cf3b0;
  border-color:rgba(46,230,166,.34);
  background:rgba(46,230,166,.09);
}
.leadChip.campaign{
  color:#ffd166;
  border-color:rgba(245,158,11,.24);
  background:rgba(245,158,11,.09);
}
.leadChip.campaign svg{
  width:13px;
  height:13px;
}


/* === CRONOS V23 — Atalho de tarefa pelo card do Lead === */
.taskLeadFixedBox{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:12px 14px;
  border:1px solid rgba(126,200,255,.18);
  border-radius:14px;
  background:
    radial-gradient(260px 90px at 8% 0%,rgba(25,198,255,.10),transparent 72%),
    rgba(8,20,44,.46);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.taskLeadFixedBox strong{
  color:var(--text);
  font-weight:900;
  line-height:1.15;
}
.taskLeadFixedBox span{
  color:var(--muted);
  font-size:12px;
  line-height:1.3;
}


/* === CRONOS V36 — Recebimentos redesenhado === */
#view-installments.receivablesV36{
  --recv-blue:#1b7cff;
  --recv-cyan:#19d3ff;
  --recv-green:#2ee6a6;
  --recv-red:#ff4d7d;
  --recv-yellow:#ffbf3f;
}
#view-installments .receivablesHero{
  align-items:flex-start;
  gap:18px;
  padding:22px 24px;
  border:1px solid rgba(126,200,255,.13);
  border-radius:22px;
  background:
    radial-gradient(560px 180px at 14% 0%, rgba(25,198,255,.12), transparent 72%),
    linear-gradient(135deg, rgba(23,75,175,.28), rgba(5,12,30,.26) 56%, rgba(5,12,30,.10));
}
#view-installments .receivablesTitleBlock{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:260px;
}
#view-installments .receivablesTitleBlock h2{
  margin:0;
  font-size:28px;
  letter-spacing:-.02em;
}
#view-installments .receivablesTitleBlock p{
  margin:4px 0 0;
}
#view-installments .moduleIcon.moneyIcon{
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-size:24px;
  font-weight:950;
  color:#fff;
  background:
    radial-gradient(circle at 30% 20%, rgba(25,211,255,.55), transparent 54%),
    linear-gradient(135deg, rgba(29,78,216,.88), rgba(8,28,75,.88));
  border:1px solid rgba(126,200,255,.22);
  box-shadow:0 14px 30px rgba(0,0,0,.18), 0 0 24px rgba(25,198,255,.12);
}
#view-installments .receivablesFilters{
  flex:1;
  display:grid!important;
  grid-template-columns:180px minmax(260px, 1fr) 220px auto;
  gap:12px!important;
  align-items:end;
}
#view-installments .receivablesKpiGrid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:14px;
}
#view-installments .receivableKpi{
  position:relative;
  min-height:118px;
  padding:18px 18px;
  overflow:hidden;
  border-radius:18px;
  background:
    radial-gradient(280px 100px at 8% 0%,rgba(25,198,255,.10),transparent 70%),
    rgba(8,20,44,.40);
}
#view-installments .receivableKpi::after{
  content:"";
  position:absolute;
  inset:auto 18px 0 18px;
  height:3px;
  border-radius:999px;
  opacity:.76;
}
#view-installments .receivableKpi.is-received::after{background:linear-gradient(90deg,var(--recv-green),var(--recv-cyan));}
#view-installments .receivableKpi.is-late{
  border-color:rgba(255,77,125,.30);
  background:radial-gradient(240px 120px at 20% 0%,rgba(255,77,125,.12),transparent 72%), rgba(8,20,44,.40);
}
#view-installments .receivableKpi.is-late::after{background:linear-gradient(90deg,#ff4d7d,#ff7a9d);}
#view-installments .receivableKpi.is-soon{
  border-color:rgba(255,191,63,.28);
  background:radial-gradient(240px 120px at 20% 0%,rgba(255,191,63,.13),transparent 72%), rgba(8,20,44,.40);
}
#view-installments .receivableKpi.is-soon::after{background:linear-gradient(90deg,#ffbf3f,#ffe083);}
#view-installments .receivableKpi.is-future::after{background:linear-gradient(90deg,#1b7cff,#19d3ff);}
#view-installments .kpiMiniIcon{
  position:absolute;
  top:16px;
  right:16px;
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  font-weight:950;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(126,200,255,.16);
}
#view-installments .receivablesQuickTabs{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:0;
  margin-top:14px;
  border:1px solid rgba(126,200,255,.13);
  border-radius:18px;
  padding:4px;
  background:rgba(6,13,31,.36);
  overflow:hidden;
}
#view-installments .receivablesQuickTabs button{
  height:42px;
  border:0;
  border-radius:14px;
  background:transparent;
  color:var(--muted);
  font-weight:850;
  cursor:pointer;
}
#view-installments .receivablesQuickTabs button:hover{
  background:rgba(255,255,255,.04);
  color:var(--text);
}
#view-installments .receivablesQuickTabs button.active{
  color:#fff;
  background:linear-gradient(135deg,rgba(29,78,216,.96),rgba(25,198,255,.58));
  box-shadow:0 10px 22px rgba(29,78,216,.20);
}
#view-installments .receivablesListCard{
  margin-top:14px;
  padding:16px;
  background:
    radial-gradient(520px 160px at 16% 0%,rgba(25,198,255,.10),transparent 72%),
    rgba(8,20,44,.36);
}
#view-installments .receivablesListHeadV36{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  padding:6px 0 18px;
}
#view-installments .receivablesListHeadV36 h3{
  margin:0;
  font-size:24px;
  letter-spacing:-.02em;
}
#view-installments .receivablesListHeadV36 p{
  margin:4px 0 0;
}
#view-installments .receivablesHeadActions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
#view-installments .receivablePatientCard{
  position:relative;
  padding:0;
  margin:0 0 14px;
  border-radius:18px;
  border:1px solid rgba(126,200,255,.14);
  background:
    radial-gradient(460px 120px at 6% 0%, rgba(25,198,255,.10), transparent 70%),
    rgba(8,20,44,.42);
  overflow:hidden;
}
#view-installments .receivablePatientCard::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:linear-gradient(180deg,#1b7cff,#19d3ff);
}
#view-installments .receivablePatientCard.is-overdue{
  border-color:rgba(255,77,125,.22);
}
#view-installments .receivablePatientCard.is-overdue::before{
  background:linear-gradient(180deg,#ff4d7d,#ff7a9d);
}
#view-installments .receivablePatientCard.is-soon{
  border-color:rgba(255,191,63,.22);
}
#view-installments .receivablePatientCard.is-soon::before{
  background:linear-gradient(180deg,#ffbf3f,#ffe083);
}
#view-installments .receivablePatientCard.is-paid::before{
  background:linear-gradient(180deg,#2ee6a6,#19d3ff);
}
#view-installments .receivablePatientHead{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:start;
  padding:18px 18px 16px 22px;
}
#view-installments .receivablePatientMain{
  min-width:0;
}
#view-installments .receivablePatientTop{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
#view-installments .receivablePatientTop .instName{
  font-size:17px;
  line-height:1.25;
}
#view-installments .receivablePatientTop .muted{
  font-size:14px;
}
#view-installments .receivableStatusChip{
  display:inline-flex;
  align-items:center;
  height:24px;
  padding:0 9px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  color:#ffecf2;
  border:1px solid rgba(255,77,125,.36);
  background:rgba(255,77,125,.11);
}
#view-installments .receivablePatientCard.is-soon .receivableStatusChip{
  color:#ffe8a6;
  border-color:rgba(255,191,63,.38);
  background:rgba(255,191,63,.11);
}
#view-installments .receivablePatientCard.is-paid .receivableStatusChip{
  color:#bdffe1;
  border-color:rgba(46,230,166,.32);
  background:rgba(46,230,166,.10);
}
#view-installments .receivablePatientCard.is-open .receivableStatusChip{
  color:#bfe8ff;
  border-color:rgba(25,198,255,.28);
  background:rgba(25,198,255,.08);
}
#view-installments .receivableMetrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(135px,1fr));
  gap:8px;
  margin-top:10px;
}
#view-installments .receivableMetrics .instMetric{
  min-height:58px;
  border-radius:12px;
  background:rgba(255,255,255,.032);
}
#view-installments .instAlert{
  margin-top:10px;
  border-radius:13px;
  padding:10px 12px;
  font-weight:850;
}
#view-installments .instAlert.late{
  color:#ffc4d3;
  background:linear-gradient(90deg,rgba(255,77,125,.16),rgba(255,77,125,.06));
  border:1px solid rgba(255,77,125,.20);
}
#view-installments .instAlert.soon,
#view-installments .instAlert.pending{
  color:#ffe4a2;
  background:linear-gradient(90deg,rgba(255,191,63,.14),rgba(255,191,63,.05));
  border:1px solid rgba(255,191,63,.18);
}
#view-installments .instAlert.ok{
  color:#b9ffde;
  background:linear-gradient(90deg,rgba(46,230,166,.13),rgba(46,230,166,.04));
  border:1px solid rgba(46,230,166,.16);
}
#view-installments .receivableExtra{
  margin-top:10px;
}
#view-installments .receivableExtra summary{
  font-weight:850;
  cursor:pointer;
  color:var(--text);
}
#view-installments .receivableActions{
  display:grid!important;
  grid-template-columns:repeat(2, minmax(118px,1fr));
  gap:8px!important;
  align-content:start;
  min-width:270px;
}
#view-installments .receivableActions .btn{
  height:38px;
  justify-content:center;
  text-align:center;
}
#view-installments .btn.charge{
  color:#ffd0dc;
  border-color:rgba(255,77,125,.34);
  background:rgba(255,77,125,.08);
  text-decoration:none;
}
#view-installments .btn.charge:hover{
  background:rgba(255,77,125,.14);
}
#view-installments .btn.charge:disabled{
  opacity:.55;
  cursor:not-allowed;
}
#view-installments .receivablesPagerV36{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}
#view-installments .instPager{
  border-top:1px solid rgba(126,200,255,.10);
  padding-top:12px;
}
:root.light #view-installments .receivablesHero,
:root.light #view-installments .receivablesListCard,
:root.light #view-installments .receivablePatientCard,
:root.light #view-installments .receivableKpi{
  background:rgba(255,255,255,.78);
}
@media(max-width:1280px){
  #view-installments .receivablesFilters{
    grid-template-columns:1fr 1fr;
  }
  #view-installments .receivablesKpiGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  #view-installments .receivablesQuickTabs{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  #view-installments .receivablePatientHead{
    grid-template-columns:1fr;
  }
  #view-installments .receivableActions{
    min-width:0;
    grid-template-columns:repeat(4,minmax(110px,1fr));
  }
}
@media(max-width:760px){
  #view-installments .receivablesFilters,
  #view-installments .receivablesKpiGrid,
  #view-installments .receivablesQuickTabs,
  #view-installments .receivableMetrics,
  #view-installments .receivableActions{
    grid-template-columns:1fr;
  }
  #view-installments .receivablesHero{
    padding:16px;
  }
}


/* === CRONOS V37 — Recebimentos ajustes de carregamento e hierarquia === */
#view-installments .receivablesHeadActions .btn,
#view-installments .receivableActions .btn{
  box-shadow:none!important;
  filter:none!important;
}
#view-installments .receivablesHeadActions .btn.primary,
#view-installments .receivablesHeadActions .btn.ok{
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(126,200,255,.18)!important;
  color:var(--text)!important;
}
#view-installments .receivablesHeadActions .btn.primary:hover,
#view-installments .receivablesHeadActions .btn.ok:hover{
  background:rgba(25,198,255,.09)!important;
  border-color:rgba(25,198,255,.30)!important;
}
#view-installments .receivablesHeadActions .btn.primary::before{
  content:"+";
  margin-right:6px;
  font-weight:900;
}
#view-installments .receivablePatientHead{
  grid-template-columns:1fr!important;
  gap:12px!important;
}
#view-installments .receivableActions{
  min-width:0!important;
  width:100%!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:8px!important;
  padding-top:2px!important;
}
#view-installments .receivableActions .btn{
  min-width:118px!important;
  height:36px!important;
  padding:0 14px!important;
  border-radius:13px!important;
}
#view-installments .receivableActions .btn.primary{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(126,200,255,.18)!important;
  color:var(--text)!important;
}
#view-installments .receivableActions .btn.primary:hover{
  background:rgba(25,198,255,.08)!important;
  border-color:rgba(25,198,255,.30)!important;
}
#view-installments .receivableActions .btn.charge{
  background:rgba(46,230,166,.10)!important;
  border-color:rgba(46,230,166,.25)!important;
  color:#caffea!important;
}
#view-installments .receivableActions .btn.ok,
#view-installments .receivableActions .btn.compactLow{
  background:rgba(255,191,63,.07)!important;
  border-color:rgba(255,191,63,.22)!important;
  color:#ffe7ac!important;
}
#view-installments .receivableActions .btn.danger{
  background:rgba(255,77,125,.06)!important;
  border-color:rgba(255,77,125,.22)!important;
}
#view-installments .receivablesListCard{
  padding:18px!important;
}
#view-installments .receivablePatientCard{
  margin-bottom:12px!important;
}
#view-installments .receivableMetrics{
  grid-template-columns:repeat(4,minmax(120px,1fr))!important;
}
#view-installments .instAlert{
  padding:9px 12px!important;
}
#view-installments .receivableExtra{
  border-top:1px solid rgba(126,200,255,.10);
  padding-top:8px;
}
@media(max-width:1180px){
  #view-installments .receivableActions{
    justify-content:flex-start!important;
  }
}
@media(max-width:760px){
  #view-installments .receivableActions .btn{
    min-width:0!important;
    width:100%!important;
  }
}


/* === CRONOS V38 — Recebimentos com regras claras de mês x acumulado === */
#view-installments .receivablesRuleHint{
  margin-top:10px;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid rgba(126,200,255,.14);
  background:rgba(6,13,31,.34);
  color:var(--muted);
  font-weight:700;
  line-height:1.35;
}
#view-installments .receivablesRuleHint strong{
  color:var(--text);
}
#view-installments .receivablesQuickTabs{
  grid-template-columns:1.05fr 1.25fr 1.15fr 1.1fr 1.1fr 1.1fr;
}
#view-installments .receivablesQuickTabs button{
  font-size:14px;
  padding:0 8px;
}
#view-installments .receivableKpi.is-late .muted:first-of-type,
#view-installments .receivableKpi.is-soon .muted:first-of-type,
#view-installments .receivableKpi.is-future .muted:first-of-type{
  color:var(--text);
}
@media(max-width:1280px){
  #view-installments .receivablesQuickTabs{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media(max-width:760px){
  #view-installments .receivablesQuickTabs{
    grid-template-columns:1fr;
  }
}


/* === CRONOS V39 — Refino do Simulador de crédito === */
#view-creditSimulator .credHeroV39{
  padding:20px 22px!important;
  border-radius:22px!important;
  background:
    radial-gradient(520px 140px at 8% 0%,rgba(25,198,255,.13),transparent 72%),
    linear-gradient(135deg,rgba(22,119,255,.12),rgba(255,255,255,.020)),
    var(--panel2,#151a28)!important;
}
#view-creditSimulator .credHeroTitleV39{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0!important;
}
#view-creditSimulator .credHeroIconV39{
  width:54px!important;
  height:54px!important;
  border-radius:18px!important;
  display:grid!important;
  place-items:center!important;
  font-size:24px!important;
  font-weight:950!important;
  color:#fff!important;
  background:
    radial-gradient(circle at 30% 20%,rgba(25,211,255,.55),transparent 54%),
    linear-gradient(135deg,rgba(29,78,216,.88),rgba(8,28,75,.88))!important;
  border:1px solid rgba(126,200,255,.22)!important;
  box-shadow:0 14px 30px rgba(0,0,0,.18),0 0 24px rgba(25,198,255,.12)!important;
}
#view-creditSimulator .credStepCard{
  position:relative!important;
  overflow:hidden!important;
}
#view-creditSimulator .credStepLabel{
  display:inline-flex!important;
  align-items:center!important;
  height:24px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.02em!important;
  text-transform:uppercase!important;
  color:#9fefff!important;
  background:rgba(25,198,255,.09)!important;
  border:1px solid rgba(25,198,255,.20)!important;
  margin-bottom:10px!important;
}
#view-creditSimulator .credCalcCardV39{
  background:
    radial-gradient(520px 150px at 8% 0%,rgba(25,198,255,.10),transparent 72%),
    var(--panel2,#151a28)!important;
}
#view-creditSimulator .credAutoField input[readonly]{
  background:rgba(148,163,184,.060)!important;
  border-color:rgba(148,163,184,.15)!important;
  color:rgba(226,232,240,.75)!important;
  -webkit-text-fill-color:rgba(226,232,240,.75)!important;
}
#view-creditSimulator .credPaymentField input[readonly]{
  font-weight:950!important;
  color:#dbfaff!important;
  -webkit-text-fill-color:#dbfaff!important;
  background:linear-gradient(135deg,rgba(25,198,255,.14),rgba(46,230,166,.08))!important;
  border-color:rgba(25,198,255,.36)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.025) inset!important;
}
#view-creditSimulator .credBtn.subtle{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(126,200,255,.16)!important;
  box-shadow:none!important;
  color:var(--text,#eef2ff)!important;
}
#view-creditSimulator .credBtn.subtle:hover{
  background:rgba(25,198,255,.08)!important;
  border-color:rgba(25,198,255,.28)!important;
  filter:none!important;
}
#view-creditSimulator .riskPanelV39{
  background:
    radial-gradient(540px 170px at 12% 0%,rgba(46,230,166,.08),transparent 72%),
    var(--panel2,#151a28)!important;
}
#view-creditSimulator .riskActionsV39 .credBtn{
  box-shadow:none!important;
}
#view-creditSimulator .riskActionsV39 .credBtn.primary{
  background:linear-gradient(135deg,#2563eb,#06b6d4)!important;
  border-color:rgba(37,99,235,.78)!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(37,99,235,.14)!important;
}
#view-creditSimulator .riskActionsV39 .credBtn.subtle{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(126,200,255,.16)!important;
  color:var(--text,#eef2ff)!important;
}
#view-creditSimulator .riskEmptyV39{
  min-height:250px!important;
  background:linear-gradient(135deg,rgba(25,198,255,.07),rgba(255,255,255,.018))!important;
}
:root.light #view-creditSimulator .credStepLabel,
html.light #view-creditSimulator .credStepLabel,
body.light #view-creditSimulator .credStepLabel{
  color:#075985!important;
  background:rgba(37,99,235,.10)!important;
  border-color:rgba(37,99,235,.18)!important;
}
:root.light #view-creditSimulator .credBtn.subtle,
html.light #view-creditSimulator .credBtn.subtle,
body.light #view-creditSimulator .credBtn.subtle{
  background:rgba(255,255,255,.72)!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#0f172a!important;
  box-shadow:none!important;
}
:root.light #view-creditSimulator .credPaymentField input[readonly],
html.light #view-creditSimulator .credPaymentField input[readonly],
body.light #view-creditSimulator .credPaymentField input[readonly]{
  color:#075985!important;
  -webkit-text-fill-color:#075985!important;
  background:linear-gradient(135deg,rgba(37,99,235,.12),rgba(6,182,212,.08))!important;
  border-color:rgba(37,99,235,.24)!important;
}
@media(max-width:920px){
  #view-creditSimulator .credHeroTitleV39{
    align-items:flex-start!important;
  }
}
@media(max-width:720px){
  #view-creditSimulator .credHeroTitleV39{
    flex-direction:column!important;
  }
}


/* === CRONOS V40 — Equipe e acessos === */
#view-users.usersV40{
  --user-blue:#1b7cff;
  --user-cyan:#19d3ff;
  --user-green:#2ee6a6;
  --user-purple:#8b5cf6;
  --user-yellow:#ffbf3f;
  --user-red:#ff4d7d;
}
#view-users .usersHeroV40{
  align-items:center;
  gap:18px;
  padding:22px 24px;
  border:1px solid rgba(126,200,255,.13);
  border-radius:22px;
  background:
    radial-gradient(560px 180px at 14% 0%, rgba(25,198,255,.11), transparent 72%),
    linear-gradient(135deg, rgba(23,75,175,.24), rgba(5,12,30,.20) 56%, rgba(5,12,30,.08));
}
#view-users .usersTitleV40{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
}
#view-users .usersTitleV40 h2{
  margin:0;
  font-size:28px;
  letter-spacing:-.02em;
}
#view-users .usersTitleV40 p{
  margin:4px 0 0;
}
#view-users .usersIconV40{
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-size:22px;
  font-weight:950;
  color:#fff;
  background:
    radial-gradient(circle at 30% 20%, rgba(25,211,255,.48), transparent 54%),
    linear-gradient(135deg, rgba(29,78,216,.86), rgba(8,28,75,.88));
  border:1px solid rgba(126,200,255,.22);
  box-shadow:0 14px 30px rgba(0,0,0,.18), 0 0 24px rgba(25,198,255,.10);
}
#view-users .userNewBtnV40{
  min-width:138px;
  height:44px;
  background:linear-gradient(135deg,rgba(37,99,235,.92),rgba(6,182,212,.78))!important;
  box-shadow:0 12px 24px rgba(37,99,235,.16)!important;
  border-color:rgba(37,99,235,.58)!important;
}
#view-users .userNewBtnV40::before{
  content:"+";
  margin-right:7px;
  font-weight:950;
}
#view-users .usersKpiGridV40{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:14px;
}
#view-users .usersKpiV40{
  position:relative;
  min-height:118px;
  padding:18px 18px 16px 82px;
  overflow:hidden;
  border-radius:18px;
  background:
    radial-gradient(280px 100px at 8% 0%,rgba(25,198,255,.10),transparent 70%),
    rgba(8,20,44,.40);
}
#view-users .usersKpiV40::after{
  content:"";
  position:absolute;
  inset:auto 18px 0 18px;
  height:3px;
  border-radius:999px;
  opacity:.78;
  background:linear-gradient(90deg,var(--user-blue),var(--user-cyan));
}
#view-users .usersKpiV40.is-pending{
  border-color:rgba(255,191,63,.22);
  background:
    radial-gradient(260px 120px at 12% 0%,rgba(255,191,63,.12),transparent 72%),
    rgba(8,20,44,.40);
}
#view-users .usersKpiV40.is-pending::after{
  background:linear-gradient(90deg,var(--user-yellow),#ffe083);
}
#view-users .usersKpiIconV40{
  position:absolute;
  top:18px;
  left:18px;
  width:42px;
  height:42px;
  border-radius:15px;
  display:grid;
  place-items:center;
  font-weight:950;
  color:#dff7ff;
  background:rgba(25,198,255,.10);
  border:1px solid rgba(126,200,255,.16);
}
#view-users .usersKpiSubV40{
  margin-top:8px;
  font-size:12px;
}
#view-users .usersPanelV40{
  margin-top:14px;
  padding:16px;
  background:
    radial-gradient(520px 160px at 16% 0%,rgba(25,198,255,.10),transparent 72%),
    rgba(8,20,44,.36);
}
#view-users .usersFiltersV40{
  display:grid;
  grid-template-columns:minmax(280px,1.2fr) minmax(180px,.55fr) minmax(210px,.65fr) 150px;
  gap:12px;
  align-items:end;
  margin-bottom:16px;
}
#view-users .usersFiltersV40 label{
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:6px;
  font-weight:750;
}
#view-users .usersSearchV40{
  min-width:0;
}
#view-users .usersRefreshBtnV40{
  height:44px;
  box-shadow:none!important;
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(126,200,255,.16)!important;
}
#view-users .usersTableWrapV40{
  border:1px solid rgba(126,200,255,.10);
  border-radius:16px;
  overflow:auto;
  background:rgba(6,13,31,.18);
}
#view-users .usersTableV40{
  min-width:980px;
  width:100%;
  border-collapse:collapse;
}
#view-users .usersTableV40 th{
  font-size:12px;
  text-transform:none;
  letter-spacing:.01em;
  color:var(--muted);
  padding:16px 16px;
  background:rgba(6,13,31,.18);
}
#view-users .usersTableV40 td{
  padding:15px 16px;
  vertical-align:middle;
  border-top:1px solid rgba(126,200,255,.10);
}
#view-users .usersRowV40:hover{
  background:rgba(25,198,255,.035);
}
#view-users .usersLoginV40{
  color:#dce8ff;
}
#view-users .usersSubV40,
#view-users .usersReasonV40{
  margin-top:5px;
  font-size:12px;
}
#view-users .userChipV40{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:26px;
  padding:0 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.01em;
  white-space:nowrap;
}
#view-users .userChipV40.role-master{
  color:#bdeaff;
  background:rgba(25,198,255,.10);
  border:1px solid rgba(25,198,255,.24);
}
#view-users .userChipV40.role-gerente{
  color:#d7ccff;
  background:rgba(139,92,246,.11);
  border:1px solid rgba(139,92,246,.24);
}
#view-users .userChipV40.role-secretaria{
  color:#ddceff;
  background:rgba(139,92,246,.13);
  border:1px solid rgba(139,92,246,.27);
}
#view-users .userChipV40.status-active{
  color:#bdffe1;
  background:rgba(46,230,166,.11);
  border:1px solid rgba(46,230,166,.24);
}
#view-users .userChipV40.status-pending{
  color:#ffe7ac;
  background:rgba(255,191,63,.12);
  border:1px solid rgba(255,191,63,.28);
}
#view-users .userChipV40.status-inactive{
  color:#ffc2d0;
  background:rgba(255,77,125,.10);
  border:1px solid rgba(255,77,125,.25);
}
#view-users .usersActionsV40{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
#view-users .usersMiniActionV40{
  min-width:72px;
  height:34px;
  border-radius:12px;
  font-size:12px;
  font-weight:850;
}
#view-users .usersMiniActionV40.danger,
#view-users .miniBtn.danger.usersMiniActionV40{
  color:#ff9db5;
  border-color:rgba(255,77,125,.30);
  background:rgba(255,77,125,.07);
}
#view-users .usersEmptyV40{
  padding:18px;
  color:var(--muted);
  font-weight:750;
}
:root.light #view-users .usersHeroV40,
:root.light #view-users .usersKpiV40,
:root.light #view-users .usersPanelV40{
  background:rgba(255,255,255,.78);
}
:root.light #view-users .usersLoginV40{
  color:#0f172a;
}
@media(max-width:1220px){
  #view-users .usersKpiGridV40{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  #view-users .usersFiltersV40{
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:760px){
  #view-users .usersHeroV40{
    padding:16px;
    align-items:flex-start;
  }
  #view-users .usersTitleV40{
    align-items:flex-start;
  }
  #view-users .usersKpiGridV40,
  #view-users .usersFiltersV40{
    grid-template-columns:1fr;
  }
  #view-users .userNewBtnV40{
    width:100%;
  }
}


/* === CRONOS V42 — Usuários: ícones refinados nas KPIs === */
#view-users .usersKpiGridV40{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
#view-users .usersKpiV40{
  padding-left:72px!important;
}
#view-users .usersKpiIconV40{
  width:38px!important;
  height:38px!important;
}
#view-users .userChipV40.role-gerente{
  color:#c7f9ff!important;
  background:rgba(25,198,255,.12)!important;
  border:1px solid rgba(25,198,255,.26)!important;
}
@media(max-width:1380px){
  #view-users .usersKpiGridV40{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:920px){
  #view-users .usersKpiGridV40{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:620px){
  #view-users .usersKpiGridV40{
    grid-template-columns:1fr!important;
  }
}


/* === CRONOS V42 — Ícones reais nas KPIs de Usuários === */
#view-users .usersIconV40 svg,
#view-users .usersKpiIconV40 svg{
  width:20px;
  height:20px;
  display:block;
}
#view-users .usersIconV40{
  font-size:0;
}
#view-users .usersKpiIconV40{
  font-size:0!important;
  color:#dff7ff;
}
#view-users .usersKpiIconV40.is-total{
  background:rgba(25,198,255,.10);
  border-color:rgba(126,200,255,.18);
  color:#c8f4ff;
}
#view-users .usersKpiIconV40.is-masters{
  background:rgba(59,130,246,.12);
  border-color:rgba(96,165,250,.20);
  color:#dbeafe;
}
#view-users .usersKpiIconV40.is-gerentes{
  background:rgba(34,197,94,.10);
  border-color:rgba(74,222,128,.20);
  color:#dcfce7;
}
#view-users .usersKpiIconV40.is-secretarias{
  background:rgba(168,85,247,.10);
  border-color:rgba(196,181,253,.20);
  color:#f3e8ff;
}
#view-users .usersKpiIconV40.is-pending{
  background:rgba(255,191,63,.12);
  border-color:rgba(255,214,102,.24);
  color:#ffe7ab;
}


/* === CRONOS V45 — Usuários: KPIs compactas e linha inferior centralizada === */
#view-users .usersKpiGridV40{
  display:flex!important;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
  margin-top:14px;
}
#view-users .usersKpiV40{
  flex:0 1 calc((100% - 42px) / 4);
  max-width:calc((100% - 42px) / 4);
  min-width:220px;
  min-height:100px;
  padding:14px 16px 14px 68px!important;
  border-radius:16px;
}
#view-users .usersKpiV40::after{
  inset:auto 16px 0 16px;
  height:3px;
}
#view-users .usersKpiIconV40{
  top:14px;
  left:16px;
  width:36px!important;
  height:36px!important;
  border-radius:12px;
}
#view-users .usersKpiIconV40 svg{
  width:18px;
  height:18px;
}
#view-users .usersKpiV40 .kpiVal{
  font-size:30px;
  line-height:1;
  margin-bottom:3px;
}
#view-users .usersKpiV40 .muted{
  line-height:1.15;
}
#view-users .usersKpiSubV40{
  margin-top:6px;
  font-size:11px;
}
#view-users .usersKpiIconV40.is-crc{
  background:rgba(245,158,11,.12);
  border-color:rgba(251,191,36,.22);
  color:#fde68a;
}
#view-users .usersKpiIconV40.is-dentistas{
  background:rgba(16,185,129,.11);
  border-color:rgba(52,211,153,.22);
  color:#d1fae5;
}
#view-users .userChipV40.role-crc{
  color:#ffe7ab;
  background:rgba(245,158,11,.12);
  border:1px solid rgba(251,191,36,.26);
}
#view-users .userChipV40.role-dentista{
  color:#d1fae5;
  background:rgba(16,185,129,.10);
  border:1px solid rgba(52,211,153,.24);
}
@media(max-width:1380px){
  #view-users .usersKpiV40{
    flex-basis:calc((100% - 28px) / 3);
    max-width:calc((100% - 28px) / 3);
  }
}
@media(max-width:920px){
  #view-users .usersKpiV40{
    flex-basis:calc((100% - 14px) / 2);
    max-width:calc((100% - 14px) / 2);
  }
}
@media(max-width:620px){
  #view-users .usersKpiV40{
    flex-basis:100%;
    max-width:100%;
    min-width:0;
  }
}


/* === CRONOS V60 — Recebimentos: modal mais compacto, tabela cheia e alerta vermelho === */

/* Lista principal de Recebimentos: atraso precisa parecer atraso, não aviso roxo */
.receivablePatientCard.is-overdue{
  border-left-color:#ef4444!important;
}
.receivablePatientCard.is-overdue .receivableStatusChip{
  background:rgba(239,68,68,.16)!important;
  border-color:rgba(248,113,113,.72)!important;
  color:#fecaca!important;
}
.receivablePatientCard.is-overdue .instMetric.is-late strong,
.receivablePatientCard.is-overdue .instMetric.is-late{
  color:#fca5a5!important;
}
.receivablePatientCard .instAlert.late,
.instAlert.late{
  background:linear-gradient(90deg,rgba(127,29,29,.72),rgba(239,68,68,.32))!important;
  border:1px solid rgba(248,113,113,.44)!important;
  color:#fee2e2!important;
  box-shadow:inset 4px 0 0 rgba(248,113,113,.90)!important;
}

/* Modal Gerenciar recebimento */
#newFinancialInstallmentApp{
  --newfin-panel: rgba(255,255,255,.028);
  --newfin-line: rgba(125,174,255,.14);
}
#newFinancialInstallmentApp .card,
#newFinancialInstallmentApp .selectedPlanPaymentEditor{
  border-color:var(--newfin-line)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#newFinancialInstallmentApp .selectedPlanPaymentEditor{
  padding:14px!important;
}

/* O editor não fica mais grudado só na esquerda */
#newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayLayout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:14px!important;
  align-items:end!important;
  width:100%!important;
  max-width:none!important;
}
#newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayTopGrid{
  grid-template-columns:145px 165px minmax(120px,1fr) 78px!important;
}
#newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayObsGrid{
  grid-template-columns:130px minmax(220px,1fr)!important;
}

/* Tabela ocupa a largura útil do modal, removendo o vazio à direita */
#newFinancialInstallmentApp .financialPaymentTable{
  width:100%!important;
  max-width:none!important;
  min-width:820px!important;
}
#newFinancialInstallmentApp .financialPaymentTable th,
#newFinancialInstallmentApp .financialPaymentTable td{
  padding:10px 12px!important;
}
#newFinancialInstallmentApp .financialPaymentTable td:last-child{
  min-width:170px!important;
}

/* Botões menos neon */
#newFinancialInstallmentApp .newFinCreatePlanBtn,
#newFinancialInstallmentApp .newFinAddPaymentBtn,
#newFinancialInstallmentApp .newFinSelectPlanBtn.selected{
  background:rgba(14,165,233,.13)!important;
  background-image:none!important;
  border:1px solid rgba(125,211,252,.50)!important;
  color:#bae6fd!important;
  box-shadow:none!important;
  text-shadow:none!important;
  filter:none!important;
}
#newFinancialInstallmentApp .newFinCreatePlanBtn:hover,
#newFinancialInstallmentApp .newFinAddPaymentBtn:hover,
#newFinancialInstallmentApp .newFinSelectPlanBtn.selected:hover{
  background:rgba(14,165,233,.20)!important;
}
#newFinancialInstallmentApp .newFinSelectPlanBtn:not(.selected),
#newFinancialInstallmentApp .newFinUseBalanceBtn{
  background:rgba(148,163,184,.065)!important;
  border-color:rgba(148,163,184,.26)!important;
  color:#e2e8f0!important;
  box-shadow:none!important;
}
#newFinancialInstallmentApp .newFinSelectPlanBtn{
  min-width:108px!important;
}
#newFinancialInstallmentApp .newFinAddPaymentBtn{
  min-height:38px!important;
  border-radius:13px!important;
}

/* Cards de recebimento selecionado: destaca sem parecer botão farol alto */
#newFinancialInstallmentApp .btn.primary,
#newFinancialInstallmentApp .btn.ok{
  box-shadow:none!important;
}

/* Reduz sensação de modal gigante vazio */
#newFinancialInstallmentApp h3{
  letter-spacing:-.02em;
}
#newFinancialInstallmentApp .chip{
  border-color:rgba(125,174,255,.13)!important;
}

/* Responsivo */
@media(max-width:980px){
  #newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayLayout{
    grid-template-columns:1fr!important;
  }
  #newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayTopGrid,
  #newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayObsGrid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:680px){
  #newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayTopGrid,
  #newFinancialInstallmentApp .selectedPlanPaymentEditor .newPayObsGrid{
    grid-template-columns:1fr!important;
  }
}


/* === CRONOS V61 — aprovação financeira obrigatória + alerta vermelho premium === */
.receivablePatientCard .instAlert.late,
.instAlert.late{
  background:linear-gradient(
    90deg,
    rgba(239,68,68,.24) 0%,
    rgba(239,68,68,.13) 52%,
    rgba(239,68,68,.055) 100%
  )!important;
  border:1px solid rgba(248,113,113,.34)!important;
  color:#fee2e2!important;
  box-shadow:inset 4px 0 0 rgba(248,113,113,.72)!important;
}
.receivablePatientCard.is-overdue{
  border-left-color:rgba(248,113,113,.82)!important;
}
.receivablePatientCard.is-overdue .receivableStatusChip{
  background:rgba(239,68,68,.13)!important;
  border-color:rgba(248,113,113,.48)!important;
  color:#fecaca!important;
}
#newFinancialInstallmentApp .newFinApprovalLock{
  display:flex;
  align-items:flex-start;
  gap:8px;
  flex-direction:column;
  margin:0 0 12px;
  padding:11px 13px;
  border-radius:14px;
  border:1px solid rgba(245,158,11,.32);
  background:linear-gradient(90deg,rgba(245,158,11,.12),rgba(245,158,11,.045));
  color:#fde68a;
}
#newFinancialInstallmentApp .newFinApprovalLock span{
  color:#fef3c7;
  font-size:12px;
}
#newFinancialInstallmentApp .newFinApprovePlanBtn{
  background:rgba(245,158,11,.10)!important;
  border-color:rgba(245,158,11,.50)!important;
  color:#fde68a!important;
  box-shadow:none!important;
}
#newFinancialInstallmentApp .newFinApprovedBtn{
  background:rgba(34,197,94,.12)!important;
  border-color:rgba(74,222,128,.42)!important;
  color:#bbf7d0!important;
  opacity:1!important;
}
#newFinancialInstallmentApp button:disabled{
  opacity:.62!important;
  cursor:not-allowed!important;
}
.receivableActions .btn:disabled{
  opacity:.58!important;
  cursor:not-allowed!important;
  filter:saturate(.75)!important;
}


/* === CRONOS V64 — Fluxo assistido volta aos cards de Leads === */
.leadCardV2 .leadPrimaryActions{
  justify-content:flex-start!important;
  padding-top:4px!important;
}
.leadCardV2 .leadPrimaryBtn,
.leadCardV2 .leadWhatsBtn,
.leadCardV2 .leadFlowBtn{
  width:100%;
}
.leadCardV2 .leadFlowBtn{
  min-height:42px;
  border-radius:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font-weight:900;
  cursor:pointer;
  transition:.16s ease;
  color:#9ff6ff;
  border:1px solid rgba(103,232,249,.40);
  background:rgba(34,211,238,.10);
  box-shadow:0 10px 22px rgba(34,211,238,.07);
}
.leadCardV2 .leadFlowBtn:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}
.leadCardV2 .leadFlowBtn svg{
  width:18px;
  height:18px;
  flex:0 0 auto;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
:root.light .leadCardV2 .leadFlowBtn{
  color:#ffffff;
  border-color:rgba(37,99,235,.55);
  background:linear-gradient(135deg,#38bdf8,#2563eb);
  box-shadow:0 10px 22px rgba(37,99,235,.18);
}
@media(max-width:980px){
  .leadCardV2 .leadPrimaryActions{
    padding-top:0!important;
  }
}


/* === CRONOS V65 — botão Fluxo assistido compacto === */
.leadCardV2 .leadFlowBtn{
  min-height:46px!important;
  height:46px!important;
  max-height:46px!important;
  padding:0 10px!important;
  font-size:13px!important;
  font-weight:850!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
}
.leadCardV2 .leadFlowBtn span{
  display:inline-block!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.leadCardV2 .leadFlowBtn svg{
  width:17px!important;
  height:17px!important;
}


/* === CRONOS V66 — Fluxo assistido como ação secundária do lead === */
.leadCardV2 .leadPrimaryActions{
  justify-content:center!important;
  padding-top:0!important;
}
.leadCardV2 .leadPrimaryActions .leadFlowBtn{
  display:none!important;
}
.leadCardV2 .leadSecondaryActions{
  grid-template-columns:repeat(6,minmax(70px,1fr))!important;
  gap:8px!important;
}
.leadCardV2 .leadSecondaryActions .leadFlowSmall{
  color:#9ff6ff!important;
  border-color:rgba(103,232,249,.30)!important;
  background:rgba(34,211,238,.065)!important;
  box-shadow:none!important;
}
.leadCardV2 .leadSecondaryActions .leadFlowSmall:hover{
  background:rgba(34,211,238,.10)!important;
}
.leadCardV2 .leadSecondaryActions .leadFlowSmall svg{
  width:16px!important;
  height:16px!important;
  flex:0 0 auto!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.leadCardV2 .leadSecondaryActions .leadFlowSmall span{
  white-space:nowrap!important;
}
@media(max-width:1180px){
  .leadCardV2 .leadSecondaryActions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:760px){
  .leadCardV2 .leadSecondaryActions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


/* === CRONOS V72 — Ícones nas KPIs do Dashboard sem mudar layout === */
#view-dashboard .kpis .kpi.kpiWithIcon{
  position:relative!important;
  overflow:hidden!important;
  padding-left:58px!important;
}
#view-dashboard .kpis .kpi .kpiVisualIcon{
  position:absolute!important;
  left:12px!important;
  top:13px!important;
  width:34px!important;
  height:34px!important;
  border-radius:14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:var(--kpi-icon-color, #60a5fa)!important;
  border:1px solid var(--kpi-icon-border, rgba(96,165,250,.24))!important;
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.18), transparent 48%),
    var(--kpi-icon-bg, rgba(96,165,250,.12))!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.045),
    0 10px 20px var(--kpi-icon-shadow, rgba(0,0,0,.10))!important;
  pointer-events:none!important;
}
#view-dashboard .kpis .kpi .kpiVisualIcon svg{
  width:18px!important;
  height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.15!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
#view-dashboard .kpis .kpiIconTotal{--kpi-icon-color:#60a5fa;--kpi-icon-bg:rgba(96,165,250,.13);--kpi-icon-border:rgba(96,165,250,.28);--kpi-icon-shadow:rgba(37,99,235,.12)}
#view-dashboard .kpis .kpiIconPos{--kpi-icon-color:#34d399;--kpi-icon-bg:rgba(52,211,153,.13);--kpi-icon-border:rgba(52,211,153,.28);--kpi-icon-shadow:rgba(16,185,129,.12)}
#view-dashboard .kpis .kpiIconBad{--kpi-icon-color:#fb923c;--kpi-icon-bg:rgba(251,146,60,.13);--kpi-icon-border:rgba(251,146,60,.30);--kpi-icon-shadow:rgba(249,115,22,.12)}
#view-dashboard .kpis .kpiIconSched{--kpi-icon-color:#a78bfa;--kpi-icon-bg:rgba(167,139,250,.14);--kpi-icon-border:rgba(167,139,250,.30);--kpi-icon-shadow:rgba(124,58,237,.12)}
#view-dashboard .kpis .kpiIconTicket{--kpi-icon-color:#38bdf8;--kpi-icon-bg:rgba(56,189,248,.12);--kpi-icon-border:rgba(56,189,248,.28);--kpi-icon-shadow:rgba(14,165,233,.10)}
#view-dashboard .kpis .kpiIconBudget{--kpi-icon-color:#22c55e;--kpi-icon-bg:rgba(34,197,94,.12);--kpi-icon-border:rgba(34,197,94,.28);--kpi-icon-shadow:rgba(22,163,74,.10)}
#view-dashboard .kpis .kpiIconReceived{--kpi-icon-color:#60a5fa;--kpi-icon-bg:rgba(96,165,250,.13);--kpi-icon-border:rgba(96,165,250,.28);--kpi-icon-shadow:rgba(37,99,235,.12)}
#view-dashboard .kpis .kpiIconOpen{--kpi-icon-color:#fb7185;--kpi-icon-bg:rgba(251,113,133,.12);--kpi-icon-border:rgba(251,113,133,.28);--kpi-icon-shadow:rgba(225,29,72,.10)}

:root.light #view-dashboard .kpis .kpi .kpiVisualIcon,
html.light #view-dashboard .kpis .kpi .kpiVisualIcon,
body.light #view-dashboard .kpis .kpi .kpiVisualIcon{
  background:
    radial-gradient(circle at 30% 0%, rgba(255,255,255,.92), transparent 50%),
    var(--kpi-icon-bg-light, var(--kpi-icon-bg))!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.72),
    0 10px 20px var(--kpi-icon-shadow-light, rgba(37,99,235,.10))!important;
}
:root.light #view-dashboard .kpis .kpiIconTotal,
html.light #view-dashboard .kpis .kpiIconTotal,
body.light #view-dashboard .kpis .kpiIconTotal{--kpi-icon-color:#2563eb;--kpi-icon-bg-light:rgba(37,99,235,.12);--kpi-icon-border:rgba(37,99,235,.20)}
:root.light #view-dashboard .kpis .kpiIconPos,
html.light #view-dashboard .kpis .kpiIconPos,
body.light #view-dashboard .kpis .kpiIconPos{--kpi-icon-color:#059669;--kpi-icon-bg-light:rgba(16,185,129,.13);--kpi-icon-border:rgba(5,150,105,.20)}
:root.light #view-dashboard .kpis .kpiIconBad,
html.light #view-dashboard .kpis .kpiIconBad,
body.light #view-dashboard .kpis .kpiIconBad{--kpi-icon-color:#d97706;--kpi-icon-bg-light:rgba(245,158,11,.14);--kpi-icon-border:rgba(217,119,6,.22)}
:root.light #view-dashboard .kpis .kpiIconSched,
html.light #view-dashboard .kpis .kpiIconSched,
body.light #view-dashboard .kpis .kpiIconSched{--kpi-icon-color:#7c3aed;--kpi-icon-bg-light:rgba(124,58,237,.12);--kpi-icon-border:rgba(124,58,237,.20)}
:root.light #view-dashboard .kpis .kpiIconTicket,
html.light #view-dashboard .kpis .kpiIconTicket,
body.light #view-dashboard .kpis .kpiIconTicket{--kpi-icon-color:#0284c7;--kpi-icon-bg-light:rgba(14,165,233,.12);--kpi-icon-border:rgba(2,132,199,.20)}
:root.light #view-dashboard .kpis .kpiIconBudget,
html.light #view-dashboard .kpis .kpiIconBudget,
body.light #view-dashboard .kpis .kpiIconBudget{--kpi-icon-color:#047857;--kpi-icon-bg-light:rgba(16,185,129,.12);--kpi-icon-border:rgba(4,120,87,.20)}
:root.light #view-dashboard .kpis .kpiIconReceived,
html.light #view-dashboard .kpis .kpiIconReceived,
body.light #view-dashboard .kpis .kpiIconReceived{--kpi-icon-color:#1d4ed8;--kpi-icon-bg-light:rgba(59,130,246,.12);--kpi-icon-border:rgba(29,78,216,.20)}
:root.light #view-dashboard .kpis .kpiIconOpen,
html.light #view-dashboard .kpis .kpiIconOpen,
body.light #view-dashboard .kpis .kpiIconOpen{--kpi-icon-color:#e11d48;--kpi-icon-bg-light:rgba(244,63,94,.11);--kpi-icon-border:rgba(225,29,72,.20)}

#view-dashboard .kpis .kpi.kpiActive .kpiVisualIcon,
#view-dashboard .kpis .kpi[aria-pressed="true"] .kpiVisualIcon{
  color:#ffffff!important;
  border-color:rgba(255,255,255,.30)!important;
  background:rgba(255,255,255,.18)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)!important;
}

@media(max-width:520px){
  #view-dashboard .kpis .kpi.kpiWithIcon{
    padding-left:52px!important;
  }
  #view-dashboard .kpis .kpi .kpiVisualIcon{
    width:30px!important;
    height:30px!important;
    border-radius:12px!important;
  }
  #view-dashboard .kpis .kpi .kpiVisualIcon svg{
    width:16px!important;
    height:16px!important;
  }
}


/* === CRONOS V73 — ajuste fino dashboard claro/escuro === */
.chartPanelIcon svg{
  width:18px;
  height:18px;
  stroke:currentColor;
  fill:none;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#view-dashboard .kpis .kpi.kpiWithIcon{
  min-height:132px !important;
  display:flex !important;
  flex-direction:column !important;
}
#view-dashboard .kpis .kpi .kpiHead{
  min-height:24px;
}
#view-dashboard .kpis .kpi .value{
  line-height:1.1;
}
#view-dashboard .kpis .kpi .hint{
  line-height:1.35;
  min-height:32px;
}
@media(max-width:700px){
  #view-dashboard .kpis .kpi.kpiWithIcon{
    min-height:124px !important;
  }
  #view-dashboard .kpis .kpi .hint{
    min-height:28px;
  }
}

#cronosChartHoverTip{
  position:fixed;
  z-index:99999;
  pointer-events:none;
  transform:translate(-50%, calc(-100% - 10px));
  padding:8px 10px;
  border-radius:12px;
  max-width:240px;
  font-size:12px;
  line-height:1.35;
  background:rgba(7,18,38,.94);
  color:#eef6ff;
  border:1px solid rgba(148,163,184,.22);
  box-shadow:0 12px 32px rgba(2,8,23,.28);
  opacity:0;
  visibility:hidden;
  transition:opacity .12s ease, visibility .12s ease;
}
#cronosChartHoverTip.show{
  opacity:1;
  visibility:visible;
}
:root.light #cronosChartHoverTip,
html.light #cronosChartHoverTip,
body.light #cronosChartHoverTip{
  background:rgba(255,255,255,.98);
  color:#0f172a;
  border-color:rgba(37,99,235,.16);
  box-shadow:0 12px 28px rgba(15,23,42,.14);
}


/* === CRONOS V74 — correções finais do dashboard === */
#view-dashboard .kpis .kpi.kpiWithIcon{min-height:unset !important;display:block !important;}
#view-dashboard .kpis .kpi .kpiHead{min-height:unset !important;}
#view-dashboard .kpis .kpi .value{line-height:1.06;margin-top:5px;}
#view-dashboard .kpis .kpi .hint{line-height:1.22;font-size:11px;min-height:unset !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media(max-width:1100px){#view-dashboard .kpis .kpi .hint{white-space:normal;overflow:visible;text-overflow:clip;}}


/* === CRONOS V75 — KPIs: evita quebra do título/info === */
#view-dashboard .kpis .kpi.kpiWithIcon{
  padding:10px 12px 10px 50px!important;
}
#view-dashboard .kpis .kpi .kpiVisualIcon{
  left:10px!important;
  top:12px!important;
  width:30px!important;
  height:30px!important;
  border-radius:12px!important;
}
#view-dashboard .kpis .kpi .kpiVisualIcon svg{
  width:16px!important;
  height:16px!important;
}
#view-dashboard .kpis .kpi .kpiHead{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:8px!important;
  margin-bottom:1px!important;
}
#view-dashboard .kpis .kpi .labelInfoWrap{
  min-width:0!important;
  max-width:100%!important;
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  flex-wrap:nowrap!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#view-dashboard .kpis .kpi .labelInfoWrap .cronosInfo{
  flex:0 0 auto!important;
}
#view-dashboard .kpis .kpi .labelInfoWrap{
  font-size:11.5px!important;
}
#view-dashboard .kpis .kpi .kpiPct{
  flex:0 0 auto!important;
  white-space:nowrap!important;
  min-height:22px!important;
  padding:2px 7px!important;
  font-size:11.5px!important;
}
#view-dashboard .kpis .kpi .value{
  font-size:19px!important;
  margin-top:4px!important;
}
#view-dashboard .kpis .kpi .hint{
  font-size:11px!important;
  line-height:1.2!important;
}
@media(max-width:1120px){
  #view-dashboard .kpis .kpi .labelInfoWrap{
    font-size:11px!important;
  }
  #view-dashboard .kpis .kpi .kpiPct{
    font-size:11px!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
}

/* === CRONOS V96 — Tarefas no modo claro, agora sem cosplay de Batman === */
:root.light #view-tasks .tasksHero h2,
:root.light #view-tasks .tasksListHead strong,
:root.light #view-tasks .tasksSideTitle,
:root.light #view-tasks .tasksSideTitle strong{
  color:#0f172a;
}

:root.light #view-tasks .tasksHero p,
:root.light #view-tasks .tasksField label,
:root.light #view-tasks .tasksSortHint,
:root.light #view-tasks .tasksSideCard p,
:root.light #view-tasks .tasksQuickRows div,
:root.light #view-tasks .tasksProgress small,
:root.light #view-tasks .tasksEmptyState{
  color:#475569;
}

:root.light #view-tasks .tasksNewBtn{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(37,99,235,.35) !important;
  background:linear-gradient(135deg,#2563eb,#14b8d6) !important;
  box-shadow:0 12px 26px rgba(37,99,235,.20) !important;
}
:root.light #view-tasks .tasksNewBtn:hover{
  filter:brightness(1.03);
  box-shadow:0 14px 28px rgba(37,99,235,.24) !important;
}

:root.light #view-tasks .tasksMetricCard{
  background:#ffffff !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 8px 20px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .tasksMetricCard.pending{background:linear-gradient(180deg,#ffffff,#f8fbff) !important;}
:root.light #view-tasks .tasksMetricCard.today{background:linear-gradient(180deg,#ffffff,#fffaf0) !important;}
:root.light #view-tasks .tasksMetricCard.late{background:linear-gradient(180deg,#ffffff,#fff5f7) !important;}
:root.light #view-tasks .tasksMetricCard.done{background:linear-gradient(180deg,#ffffff,#f4fff8) !important;}
:root.light #view-tasks .tasksMetricCard b,
:root.light #view-tasks .tasksMetricCard span{
  color:#0f172a !important;
}
:root.light #view-tasks .tasksMetricCard small{
  color:#475569 !important;
}
:root.light #view-tasks .tasksMetricIcon{
  border-width:1px !important;
}
:root.light #view-tasks .tasksMetricCard.pending .tasksMetricIcon{color:#2563eb;background:#eff6ff;border-color:#bfdbfe;}
:root.light #view-tasks .tasksMetricCard.today .tasksMetricIcon{color:#b45309;background:#fff7ed;border-color:#fdba74;}
:root.light #view-tasks .tasksMetricCard.late .tasksMetricIcon{color:#be123c;background:#fff1f2;border-color:#fda4af;}
:root.light #view-tasks .tasksMetricCard.done .tasksMetricIcon{color:#15803d;background:#f0fdf4;border-color:#86efac;}

:root.light #view-tasks .tasksListPanel,
:root.light #view-tasks .tasksSideCard{
  background:#ffffff !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .tasksListHead{
  background:transparent !important;
}
:root.light #view-tasks .tasksListHead span{
  color:#2563eb;
  border-color:#bfdbfe;
  background:#eff6ff;
}

:root.light #view-tasks .tasksCardsList::-webkit-scrollbar-track,
:root.light #view-tasks .tasksSidePanel::-webkit-scrollbar-track{
  background:#e2e8f0;
  border-radius:999px;
}
:root.light #view-tasks .tasksCardsList::-webkit-scrollbar-thumb,
:root.light #view-tasks .tasksSidePanel::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#60a5fa,#14b8d6);
  border-radius:999px;
}
:root.light #view-tasks .tasksCardsList,
:root.light #view-tasks .tasksSidePanel{
  scrollbar-color:#60a5fa #e2e8f0;
}

:root.light #view-tasks .taskCardV15{
  background:#ffffff !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15:hover{
  border-color:rgba(37,99,235,.24) !important;
  box-shadow:0 12px 24px rgba(37,99,235,.10) !important;
}
:root.light #view-tasks .taskCardV15.late{
  border-color:rgba(225,29,72,.22) !important;
  box-shadow:inset 4px 0 0 rgba(244,63,94,.80), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.today{
  border-color:rgba(217,119,6,.20) !important;
}
:root.light #view-tasks .taskCardV15.done{
  opacity:1;
  background:#f8fafc !important;
}

:root.light #view-tasks .taskCardV15 .taskCardTitle,
:root.light #view-tasks .taskCardV15 .taskDueBox strong,
:root.light #view-tasks .tasksProgress b,
:root.light #view-tasks .tasksQuickRows b{
  color:#0f172a !important;
}
:root.light #view-tasks .taskCardV15 .taskActionLabel{
  color:#475569;
  border-color:rgba(15,23,42,.10);
  background:#f8fafc;
}
:root.light #view-tasks .taskCardV15 .taskLeadMeta,
:root.light #view-tasks .taskCardV15 .taskObsBox span{
  color:#334155 !important;
}
:root.light #view-tasks .taskCardV15 .taskLeadMeta b{
  color:#0f172a;
}
:root.light #view-tasks .taskCardV15 .taskLeadMeta svg{
  color:#64748b;
}
:root.light #view-tasks .taskCardV15 .taskDueBox,
:root.light #view-tasks .taskCardV15 .taskObsBox{
  border-left-color:rgba(15,23,42,.08);
}
:root.light #view-tasks .taskCardV15 .taskDueBox small,
:root.light #view-tasks .taskCardV15 .taskObsBox small{
  color:#64748b;
}

:root.light #view-tasks .taskCardV15 .taskStatusPill.pending{color:#2563eb;background:#eff6ff;border-color:#bfdbfe;}
:root.light #view-tasks .taskCardV15 .taskStatusPill.today{color:#b45309;background:#fff7ed;border-color:#fdba74;}
:root.light #view-tasks .taskCardV15 .taskStatusPill.late{color:#be123c;background:#fff1f2;border-color:#fda4af;}
:root.light #view-tasks .taskCardV15 .taskStatusPill.done{color:#15803d;background:#f0fdf4;border-color:#86efac;}

:root.light #view-tasks .taskCardV15 .taskDueBox strong{
  background:#eff6ff;
  border-color:#bfdbfe;
}
:root.light #view-tasks .taskCardV15 .taskDueBox.today strong{color:#b45309;background:#fff7ed;border-color:#fdba74;}
:root.light #view-tasks .taskCardV15 .taskDueBox.late strong{color:#be123c;background:#fff1f2;border-color:#fda4af;}
:root.light #view-tasks .taskCardV15 .taskDueBox.done strong{color:#15803d;background:#f0fdf4;border-color:#86efac;}

:root.light #view-tasks .taskCardV15 .taskBtnComplete{
  color:#15803d;
  border-color:#86efac;
  background:#f0fdf4;
}
:root.light #view-tasks .taskCardV15 .taskBtnComplete.reopen{
  color:#0f766e;
  border-color:#99f6e4;
  background:#ecfeff;
}
:root.light #view-tasks .taskCardV15 .taskBtnGhost{
  color:#334155;
  border-color:rgba(15,23,42,.12);
  background:#ffffff;
}
:root.light #view-tasks .taskCardV15 .taskBtnDelete{
  color:#be123c;
  border-color:#fda4af;
  background:#fff1f2;
}
:root.light #view-tasks .taskCardV15 .taskBtnOpen,
:root.light #view-tasks .tasksSideBtn,
:root.light #view-tasks .tasksSeeMoreBtn{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(37,99,235,.35) !important;
  background:linear-gradient(135deg,#2563eb,#14b8d6) !important;
  box-shadow:0 10px 22px rgba(37,99,235,.16) !important;
}
:root.light #view-tasks .tasksSeeMoreBtn span{
  color:#2563eb;
  background:#eff6ff;
  border-color:#bfdbfe;
}
:root.light #view-tasks .tasksSeeMoreBtn.ghost{
  color:#334155 !important;
  background:#f8fafc !important;
  border-color:rgba(15,23,42,.10) !important;
  box-shadow:none !important;
}

:root.light #view-tasks .tasksSideTitle svg{
  color:#2563eb;
}
:root.light #view-tasks .tasksProgressRing{
  color:#0f172a;
  background:
    radial-gradient(circle at center,#ffffff 0 55%,transparent 57%),
    conic-gradient(#16a34a calc(var(--p) * 1%),#e2e8f0 0);
  border-color:rgba(15,23,42,.10);
}
:root.light #view-tasks .tasksQuickRows div{
  border-bottom-color:rgba(15,23,42,.08);
}
:root.light #view-tasks .tasksEmptyState{
  background:#f8fafc;
  border-color:rgba(15,23,42,.12);
}


/* === CRONOS V97 — Tarefas claro com cards levemente tonalizados por status === */
:root.light #view-tasks .taskCardV15{
  background:linear-gradient(180deg,#ffffff,#f8fbff) !important;
  border:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.pending{
  background:linear-gradient(180deg,#ffffff,#f5f9ff) !important;
  border-color:rgba(59,130,246,.18) !important;
  box-shadow:inset 4px 0 0 rgba(59,130,246,.82), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.today{
  background:linear-gradient(180deg,#ffffff,#fff8ee) !important;
  border-color:rgba(217,119,6,.20) !important;
  box-shadow:inset 4px 0 0 rgba(245,158,11,.90), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.late{
  background:linear-gradient(180deg,#ffffff,#fff4f7) !important;
  border-color:rgba(225,29,72,.22) !important;
  box-shadow:inset 4px 0 0 rgba(244,63,94,.84), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.done{
  opacity:1;
  background:linear-gradient(180deg,#ffffff,#f2fcf6) !important;
  border-color:rgba(34,197,94,.18) !important;
  box-shadow:inset 4px 0 0 rgba(34,197,94,.80), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(37,99,235,.10) !important;
}
:root.light #view-tasks .taskCardV15.pending:hover{
  box-shadow:inset 4px 0 0 rgba(59,130,246,.88), 0 14px 28px rgba(37,99,235,.10) !important;
}
:root.light #view-tasks .taskCardV15.today:hover{
  box-shadow:inset 4px 0 0 rgba(245,158,11,.95), 0 14px 28px rgba(217,119,6,.10) !important;
}
:root.light #view-tasks .taskCardV15.late:hover{
  box-shadow:inset 4px 0 0 rgba(244,63,94,.88), 0 14px 28px rgba(225,29,72,.10) !important;
}
:root.light #view-tasks .taskCardV15.done:hover{
  box-shadow:inset 4px 0 0 rgba(34,197,94,.84), 0 14px 28px rgba(22,163,74,.10) !important;
}
:root.light #view-tasks .taskCardV15 .taskBtnGhost{
  background:#ffffffc9;
}

/* === CRONOS V98 — Tarefas claro: reforço do ícone do título + estados visuais consistentes === */
:root.light #view-tasks .tasksTitleIcon{
  color:#2563eb !important;
  background:linear-gradient(135deg,#eff6ff 0%,#e0f2fe 100%) !important;
  border:1px solid #93c5fd !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 10px 22px rgba(37,99,235,.12) !important;
}
:root.light #view-tasks .tasksTitleIcon svg{
  color:#2563eb !important;
}

:root.light #view-tasks .taskCardV15.pending{
  background:linear-gradient(180deg,#ffffff 0%,#f4f8ff 100%) !important;
  border-color:rgba(59,130,246,.20) !important;
  box-shadow:inset 4px 0 0 rgba(59,130,246,.86), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.today{
  background:linear-gradient(180deg,#ffffff 0%,#fff8eb 100%) !important;
  border-color:rgba(245,158,11,.22) !important;
  box-shadow:inset 4px 0 0 rgba(245,158,11,.92), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.late{
  background:linear-gradient(180deg,#ffffff 0%,#fff3f6 100%) !important;
  border-color:rgba(244,63,94,.22) !important;
  box-shadow:inset 4px 0 0 rgba(244,63,94,.86), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.done{
  opacity:1 !important;
  background:linear-gradient(180deg,#ffffff 0%,#f1fcf5 100%) !important;
  border-color:rgba(34,197,94,.20) !important;
  box-shadow:inset 4px 0 0 rgba(34,197,94,.82), 0 8px 18px rgba(15,23,42,.06) !important;
}
:root.light #view-tasks .taskCardV15.pending:hover{
  box-shadow:inset 4px 0 0 rgba(59,130,246,.90), 0 14px 28px rgba(37,99,235,.10) !important;
}
:root.light #view-tasks .taskCardV15.today:hover{
  box-shadow:inset 4px 0 0 rgba(245,158,11,.96), 0 14px 28px rgba(217,119,6,.10) !important;
}
:root.light #view-tasks .taskCardV15.late:hover{
  box-shadow:inset 4px 0 0 rgba(244,63,94,.90), 0 14px 28px rgba(225,29,72,.10) !important;
}
:root.light #view-tasks .taskCardV15.done:hover{
  box-shadow:inset 4px 0 0 rgba(34,197,94,.86), 0 14px 28px rgba(22,163,74,.10) !important;
}


/* === CRONOS V100 — Leads claro: rodapé/paginação + fundo durante rolagem === */
/* Mantém Campanha ativo sólido, pois indica paciente em campanha. */

/* Rodapé/listagem dos Leads no modo claro */
:root.light #view-leads .leadsFooter,
:root.light #view-leads .pagination,
:root.light #view-leads .listFooter,
:root.light #view-leads .tableFooter,
:root.light #view-leads [class*="Footer"],
html.light #view-leads .leadsFooter,
html.light #view-leads .pagination,
html.light #view-leads .listFooter,
html.light #view-leads .tableFooter,
html.light #view-leads [class*="Footer"],
body.light #view-leads .leadsFooter,
body.light #view-leads .pagination,
body.light #view-leads .listFooter,
body.light #view-leads .tableFooter,
body.light #view-leads [class*="Footer"]{
  color:#475569 !important;
  opacity:1 !important;
}

/* Botões/números da paginação no modo claro */
:root.light #view-leads .pagination button,
:root.light #view-leads .pagination .pageBtn,
:root.light #view-leads .pagination .active,
:root.light #view-leads [class*="Pagination"] button,
:root.light #view-leads [class*="pagination"] button,
html.light #view-leads .pagination button,
html.light #view-leads .pagination .pageBtn,
html.light #view-leads .pagination .active,
html.light #view-leads [class*="Pagination"] button,
html.light #view-leads [class*="pagination"] button,
body.light #view-leads .pagination button,
body.light #view-leads .pagination .pageBtn,
body.light #view-leads .pagination .active,
body.light #view-leads [class*="Pagination"] button,
body.light #view-leads [class*="pagination"] button{
  background:#ffffff !important;
  border:1px solid rgba(37,99,235,.18) !important;
  color:#1d4ed8 !important;
  opacity:1 !important;
  box-shadow:0 8px 18px rgba(15,23,42,.06) !important;
}

:root.light #view-leads .pagination .active,
:root.light #view-leads .pagination button.active,
:root.light #view-leads [class*="Pagination"] .active,
:root.light #view-leads [class*="pagination"] .active,
html.light #view-leads .pagination .active,
html.light #view-leads .pagination button.active,
html.light #view-leads [class*="Pagination"] .active,
html.light #view-leads [class*="pagination"] .active,
body.light #view-leads .pagination .active,
body.light #view-leads .pagination button.active,
body.light #view-leads [class*="Pagination"] .active,
body.light #view-leads [class*="pagination"] .active{
  background:linear-gradient(135deg,#2563eb,#14b8d6) !important;
  border-color:rgba(37,99,235,.28) !important;
  color:#ffffff !important;
}

/* Texto do rodapé: "Mostrando..." / "Itens por página..." */
:root.light #view-leads .leadsFooter *,
:root.light #view-leads .listFooter *,
:root.light #view-leads .tableFooter *,
:root.light #view-leads [class*="Footer"] *,
html.light #view-leads .leadsFooter *,
html.light #view-leads .listFooter *,
html.light #view-leads .tableFooter *,
html.light #view-leads [class*="Footer"] *,
body.light #view-leads .leadsFooter *,
body.light #view-leads .listFooter *,
body.light #view-leads .tableFooter *,
body.light #view-leads [class*="Footer"] *{
  color:inherit;
  opacity:1 !important;
}

/* Evita o fundo branco cru aparecendo atrás dos cards durante rolagem */
:root.light #view-leads,
html.light #view-leads,
body.light #view-leads{
  background:
    radial-gradient(900px 420px at 85% 0%, rgba(45,212,191,.18), transparent 72%),
    linear-gradient(180deg,#eaf8ff 0%,#eef9f6 100%) !important;
}

:root.light #view-leads .leadsList,
:root.light #view-leads .leadsListWrap,
:root.light #view-leads .leadsResults,
:root.light #view-leads .leadsCards,
:root.light #view-leads .leadsContainer,
:root.light #view-leads .cardsList,
:root.light #view-leads [class*="leadList"],
:root.light #view-leads [class*="LeadList"],
html.light #view-leads .leadsList,
html.light #view-leads .leadsListWrap,
html.light #view-leads .leadsResults,
html.light #view-leads .leadsCards,
html.light #view-leads .leadsContainer,
html.light #view-leads .cardsList,
html.light #view-leads [class*="leadList"],
html.light #view-leads [class*="LeadList"],
body.light #view-leads .leadsList,
body.light #view-leads .leadsListWrap,
body.light #view-leads .leadsResults,
body.light #view-leads .leadsCards,
body.light #view-leads .leadsContainer,
body.light #view-leads .cardsList,
body.light #view-leads [class*="leadList"],
body.light #view-leads [class*="LeadList"]{
  background:transparent !important;
}

/* Mesmo durante a classe de otimização de scroll, manter o fundo do Leads coerente */
:root.light body.cronos-is-scrolling #view-leads,
html.light body.cronos-is-scrolling #view-leads,
body.light.cronos-is-scrolling #view-leads{
  background:
    radial-gradient(900px 420px at 85% 0%, rgba(45,212,191,.18), transparent 72%),
    linear-gradient(180deg,#eaf8ff 0%,#eef9f6 100%) !important;
}

:root.light body.cronos-is-scrolling #view-leads .leadCard,
:root.light body.cronos-is-scrolling #view-leads .leadCardV2,
:root.light body.cronos-is-scrolling #view-leads .leadCardV11,
:root.light body.cronos-is-scrolling #view-leads [class*="leadCard"],
html.light body.cronos-is-scrolling #view-leads .leadCard,
html.light body.cronos-is-scrolling #view-leads .leadCardV2,
html.light body.cronos-is-scrolling #view-leads .leadCardV11,
html.light body.cronos-is-scrolling #view-leads [class*="leadCard"],
body.light.cronos-is-scrolling #view-leads .leadCard,
body.light.cronos-is-scrolling #view-leads .leadCardV2,
body.light.cronos-is-scrolling #view-leads .leadCardV11,
body.light.cronos-is-scrolling #view-leads [class*="leadCard"]{
  background:linear-gradient(180deg,#ffffff,#f8fbff) !important;
  box-shadow:0 12px 26px rgba(15,23,42,.065) !important;
}


/* === CRONOS V101 — Leads claro: rodapé inspirado no escuro === */
html.light #view-leads .leadsListPanel,
:root.light #view-leads .leadsListPanel,
body.light #view-leads .leadsListPanel{
  background:
    radial-gradient(720px 220px at 14% 0%, rgba(59,130,246,.10), transparent 70%),
    radial-gradient(620px 240px at 100% 100%, rgba(20,184,166,.08), transparent 72%),
    linear-gradient(180deg,#f7fbff 0%, #eef9f6 100%) !important;
  border:1px solid rgba(148,163,184,.16) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.06) !important;
}
html.light #view-leads .leadsCardsWrap,
:root.light #view-leads .leadsCardsWrap,
body.light #view-leads .leadsCardsWrap,
html.light #view-leads .leadsCards,
:root.light #view-leads .leadsCards,
body.light #view-leads .leadsCards{
  background:transparent !important;
}
html.light #view-leads .leadsPaginationModern,
:root.light #view-leads .leadsPaginationModern,
body.light #view-leads .leadsPaginationModern{
  background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(247,252,255,.92)) !important;
  border:1px solid rgba(148,163,184,.14) !important;
  box-shadow:0 10px 24px rgba(15,23,42,.045) !important;
}
html.light #view-leads .leadsPaginationInfo,
:root.light #view-leads .leadsPaginationInfo,
body.light #view-leads .leadsPaginationInfo{
  color:#475569 !important;
}
html.light #view-leads .leadsPageSize,
html.light #view-leads .leadsPageTotal,
:root.light #view-leads .leadsPageSize,
:root.light #view-leads .leadsPageTotal,
body.light #view-leads .leadsPageSize,
body.light #view-leads .leadsPageTotal{
  color:#475569 !important;
  border:1px solid rgba(148,163,184,.16) !important;
  background:linear-gradient(180deg,#ffffff,#f8fbff) !important;
}
html.light #view-leads .leadsPaginationControls .btn,
:root.light #view-leads .leadsPaginationControls .btn,
body.light #view-leads .leadsPaginationControls .btn{
  background:linear-gradient(180deg,#ffffff,#f8fbff) !important;
  border:1px solid rgba(37,99,235,.18) !important;
  color:#1d4ed8 !important;
  box-shadow:0 8px 18px rgba(15,23,42,.05) !important;
}
html.light #view-leads .leadsPaginationControls .btn:hover,
:root.light #view-leads .leadsPaginationControls .btn:hover,
body.light #view-leads .leadsPaginationControls .btn:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 22px rgba(15,23,42,.08) !important;
}
html.light #view-leads .leadsPaginationControls .leadsPageActive,
html.light #view-leads .leadsPaginationControls .btn.active,
:root.light #view-leads .leadsPaginationControls .leadsPageActive,
:root.light #view-leads .leadsPaginationControls .btn.active,
body.light #view-leads .leadsPaginationControls .leadsPageActive,
body.light #view-leads .leadsPaginationControls .btn.active{
  background:linear-gradient(135deg,#2563eb,#14b8d6) !important;
  color:#ffffff !important;
  border-color:rgba(37,99,235,.28) !important;
  box-shadow:0 0 0 1px rgba(37,99,235,.10), 0 10px 24px rgba(37,99,235,.18) !important;
}
html.light body.cronos-is-scrolling #view-leads .leadsListPanel,
:root.light body.cronos-is-scrolling #view-leads .leadsListPanel,
body.light.cronos-is-scrolling #view-leads .leadsListPanel,
html.light body.cronos-is-scrolling #view-leads .leadsPaginationModern,
:root.light body.cronos-is-scrolling #view-leads .leadsPaginationModern,
body.light.cronos-is-scrolling #view-leads .leadsPaginationModern{
  background:
    radial-gradient(720px 220px at 14% 0%, rgba(59,130,246,.10), transparent 70%),
    radial-gradient(620px 240px at 100% 100%, rgba(20,184,166,.08), transparent 72%),
    linear-gradient(180deg,#f7fbff 0%, #eef9f6 100%) !important;
}

/* === CRONOS V105 — Recebimentos claro alinhado ao modo escuro === */
/* Modo claro com a mesma hierarquia do escuro: card-mãe visível, cards internos com profundidade e abas mais limpas. */
html.light #view-installments,
:root.light #view-installments,
body.light #view-installments{
  --recv-light-line: rgba(37,99,235,.14);
  --recv-light-line-strong: rgba(37,99,235,.22);
  --recv-light-surface: rgba(255,255,255,.88);
  --recv-light-surface-2: rgba(248,252,255,.92);
  --recv-light-text: #0f172a;
  --recv-light-muted: #475569;
  --recv-light-shadow: 0 16px 34px rgba(15,23,42,.075);
}

html.light #view-installments .receivablesHero,
:root.light #view-installments .receivablesHero,
body.light #view-installments .receivablesHero{
  background:
    radial-gradient(780px 260px at 10% -18%, rgba(37,99,235,.18), transparent 72%),
    radial-gradient(620px 220px at 92% 0%, rgba(20,184,166,.13), transparent 74%),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(239,248,255,.88) 56%, rgba(232,251,246,.82)) !important;
  border:1px solid rgba(37,99,235,.16) !important;
  box-shadow:0 18px 38px rgba(15,23,42,.075), inset 0 1px 0 rgba(255,255,255,.74) !important;
  color:var(--recv-light-text) !important;
}

html.light #view-installments .receivablesTitleBlock h2,
:root.light #view-installments .receivablesTitleBlock h2,
body.light #view-installments .receivablesTitleBlock h2{
  color:#0f172a !important;
}
html.light #view-installments .receivablesTitleBlock p,
:root.light #view-installments .receivablesTitleBlock p,
body.light #view-installments .receivablesTitleBlock p,
html.light #view-installments .muted,
:root.light #view-installments .muted,
body.light #view-installments .muted{
  color:#475569 !important;
}

html.light #view-installments .moduleIcon.moneyIcon,
:root.light #view-installments .moduleIcon.moneyIcon,
body.light #view-installments .moduleIcon.moneyIcon{
  background:
    radial-gradient(circle at 28% 18%, rgba(34,211,238,.62), transparent 54%),
    linear-gradient(135deg, #2563eb, #0ea5e9 54%, #14b8d6) !important;
  border-color:rgba(37,99,235,.24) !important;
  box-shadow:0 14px 28px rgba(37,99,235,.20), 0 0 0 6px rgba(37,99,235,.055) !important;
}

html.light #view-installments .receivablesFilters label,
:root.light #view-installments .receivablesFilters label,
body.light #view-installments .receivablesFilters label{
  color:#334155 !important;
  font-weight:750 !important;
}
html.light #view-installments .receivablesFilters input,
html.light #view-installments .receivablesFilters select,
:root.light #view-installments .receivablesFilters input,
:root.light #view-installments .receivablesFilters select,
body.light #view-installments .receivablesFilters input,
body.light #view-installments .receivablesFilters select{
  background:rgba(255,255,255,.78) !important;
  border-color:rgba(37,99,235,.15) !important;
  color:#0f172a !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72), 0 8px 18px rgba(15,23,42,.035) !important;
}
html.light #view-installments .receivablesFilters input::placeholder,
:root.light #view-installments .receivablesFilters input::placeholder,
body.light #view-installments .receivablesFilters input::placeholder{
  color:#64748b !important;
}
html.light #view-installments #btnInstRefresh,
:root.light #view-installments #btnInstRefresh,
body.light #view-installments #btnInstRefresh{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,248,255,.92)) !important;
  border-color:rgba(37,99,235,.18) !important;
  color:#1d4ed8 !important;
  box-shadow:0 10px 20px rgba(15,23,42,.055) !important;
}

html.light #view-installments .receivableKpi,
:root.light #view-installments .receivableKpi,
body.light #view-installments .receivableKpi{
  background:
    radial-gradient(320px 130px at 10% -12%, rgba(37,99,235,.085), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,252,255,.90)) !important;
  border:1px solid rgba(37,99,235,.13) !important;
  box-shadow:0 14px 28px rgba(15,23,42,.065), inset 0 1px 0 rgba(255,255,255,.76) !important;
  color:#0f172a !important;
}
html.light #view-installments .receivableKpi .kpiVal,
:root.light #view-installments .receivableKpi .kpiVal,
body.light #view-installments .receivableKpi .kpiVal{
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
}
html.light #view-installments .receivableKpi .kpiMiniIcon,
:root.light #view-installments .receivableKpi .kpiMiniIcon,
body.light #view-installments .receivableKpi .kpiMiniIcon{
  background:rgba(37,99,235,.075) !important;
  border-color:rgba(37,99,235,.16) !important;
  color:#2563eb !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72) !important;
}
html.light #view-installments .receivableKpi.is-received,
:root.light #view-installments .receivableKpi.is-received,
body.light #view-installments .receivableKpi.is-received{
  background:radial-gradient(320px 130px at 12% -10%, rgba(34,197,94,.13), transparent 72%), linear-gradient(180deg, rgba(255,255,255,.96), rgba(239,253,246,.90)) !important;
  border-color:rgba(22,163,74,.18) !important;
}
html.light #view-installments .receivableKpi.is-late,
:root.light #view-installments .receivableKpi.is-late,
body.light #view-installments .receivableKpi.is-late{
  background:radial-gradient(320px 130px at 12% -10%, rgba(244,63,94,.13), transparent 72%), linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,241,244,.90)) !important;
  border-color:rgba(225,29,72,.19) !important;
}
html.light #view-installments .receivableKpi.is-soon,
:root.light #view-installments .receivableKpi.is-soon,
body.light #view-installments .receivableKpi.is-soon{
  background:radial-gradient(320px 130px at 12% -10%, rgba(245,158,11,.16), transparent 72%), linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,250,235,.91)) !important;
  border-color:rgba(217,119,6,.20) !important;
}
html.light #view-installments .receivableKpi.is-future,
:root.light #view-installments .receivableKpi.is-future,
body.light #view-installments .receivableKpi.is-future{
  background:radial-gradient(320px 130px at 12% -10%, rgba(14,165,233,.13), transparent 72%), linear-gradient(180deg, rgba(255,255,255,.96), rgba(239,248,255,.91)) !important;
  border-color:rgba(14,165,233,.18) !important;
}
html.light #view-installments .receivableKpi.is-received .kpiMiniIcon,
:root.light #view-installments .receivableKpi.is-received .kpiMiniIcon,
body.light #view-installments .receivableKpi.is-received .kpiMiniIcon{color:#15803d !important;background:rgba(34,197,94,.10) !important;border-color:rgba(22,163,74,.20) !important;}
html.light #view-installments .receivableKpi.is-late .kpiMiniIcon,
:root.light #view-installments .receivableKpi.is-late .kpiMiniIcon,
body.light #view-installments .receivableKpi.is-late .kpiMiniIcon{color:#be123c !important;background:rgba(244,63,94,.10) !important;border-color:rgba(225,29,72,.20) !important;}
html.light #view-installments .receivableKpi.is-soon .kpiMiniIcon,
:root.light #view-installments .receivableKpi.is-soon .kpiMiniIcon,
body.light #view-installments .receivableKpi.is-soon .kpiMiniIcon{color:#b45309 !important;background:rgba(245,158,11,.12) !important;border-color:rgba(217,119,6,.22) !important;}
html.light #view-installments .receivableKpi.is-future .kpiMiniIcon,
:root.light #view-installments .receivableKpi.is-future .kpiMiniIcon,
body.light #view-installments .receivableKpi.is-future .kpiMiniIcon{color:#0369a1 !important;background:rgba(14,165,233,.10) !important;border-color:rgba(14,165,233,.20) !important;}

html.light #view-installments .receivablesQuickTabs,
:root.light #view-installments .receivablesQuickTabs,
body.light #view-installments .receivablesQuickTabs{
  background:linear-gradient(180deg, rgba(232,244,255,.94), rgba(220,239,248,.86)) !important;
  border:1px solid rgba(37,99,235,.15) !important;
  box-shadow:0 12px 24px rgba(15,23,42,.055), inset 0 1px 0 rgba(255,255,255,.72) !important;
}
html.light #view-installments .receivablesQuickTabs button,
:root.light #view-installments .receivablesQuickTabs button,
body.light #view-installments .receivablesQuickTabs button{
  color:#334155 !important;
}
html.light #view-installments .receivablesQuickTabs button:hover,
:root.light #view-installments .receivablesQuickTabs button:hover,
body.light #view-installments .receivablesQuickTabs button:hover{
  background:rgba(255,255,255,.54) !important;
  color:#0f172a !important;
}
html.light #view-installments .receivablesQuickTabs button.active,
:root.light #view-installments .receivablesQuickTabs button.active,
body.light #view-installments .receivablesQuickTabs button.active{
  background:linear-gradient(135deg, #2563eb, #0ea5e9 58%, #14b8d6) !important;
  border:1px solid rgba(255,255,255,.36) !important;
  color:#ffffff !important;
  box-shadow:0 10px 22px rgba(37,99,235,.20), inset 0 1px 0 rgba(255,255,255,.22) !important;
}

html.light #view-installments .receivablesRuleHint,
:root.light #view-installments .receivablesRuleHint,
body.light #view-installments .receivablesRuleHint{
  background:linear-gradient(180deg, rgba(239,248,255,.92), rgba(230,244,250,.86)) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  color:#334155 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.68) !important;
}
html.light #view-installments .receivablesRuleHint strong,
:root.light #view-installments .receivablesRuleHint strong,
body.light #view-installments .receivablesRuleHint strong{ color:#0f172a !important; }

html.light #view-installments .receivablesListCard,
:root.light #view-installments .receivablesListCard,
body.light #view-installments .receivablesListCard{
  background:
    radial-gradient(760px 240px at 12% 0%, rgba(37,99,235,.095), transparent 70%),
    radial-gradient(620px 220px at 98% 100%, rgba(20,184,166,.075), transparent 72%),
    linear-gradient(180deg, rgba(248,252,255,.92), rgba(240,250,247,.86)) !important;
  border:1px solid rgba(37,99,235,.13) !important;
  border-radius:22px !important;
  box-shadow:0 16px 34px rgba(15,23,42,.065), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
html.light #view-installments .receivablesListHeadV36 h3,
:root.light #view-installments .receivablesListHeadV36 h3,
body.light #view-installments .receivablesListHeadV36 h3{
  color:#0f172a !important;
}
html.light #view-installments .receivablesHeadActions .btn,
:root.light #view-installments .receivablesHeadActions .btn,
body.light #view-installments .receivablesHeadActions .btn,
html.light #view-installments .receivableActions .btn,
:root.light #view-installments .receivableActions .btn,
body.light #view-installments .receivableActions .btn{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,248,255,.92)) !important;
  border-color:rgba(37,99,235,.18) !important;
  color:#1e3a8a !important;
  box-shadow:0 8px 18px rgba(15,23,42,.045) !important;
}
html.light #view-installments .receivablesHeadActions .btn.primary,
:root.light #view-installments .receivablesHeadActions .btn.primary,
body.light #view-installments .receivablesHeadActions .btn.primary{
  background:linear-gradient(135deg, #2563eb, #0ea5e9) !important;
  border-color:rgba(37,99,235,.30) !important;
  color:#ffffff !important;
  box-shadow:0 10px 22px rgba(37,99,235,.18) !important;
}
html.light #view-installments .receivablesHeadActions .btn.ok,
:root.light #view-installments .receivablesHeadActions .btn.ok,
body.light #view-installments .receivablesHeadActions .btn.ok{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(238,253,246,.92)) !important;
  border-color:rgba(22,163,74,.22) !important;
  color:#166534 !important;
}

html.light #view-installments .receivablePatientCard,
:root.light #view-installments .receivablePatientCard,
body.light #view-installments .receivablePatientCard{
  background:
    radial-gradient(520px 150px at 12% -14%, rgba(37,99,235,.080), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.94)) !important;
  border:1px solid rgba(37,99,235,.13) !important;
  box-shadow:0 12px 26px rgba(15,23,42,.065), inset 0 1px 0 rgba(255,255,255,.76) !important;
  color:#0f172a !important;
}
html.light #view-installments .receivablePatientCard.is-overdue,
:root.light #view-installments .receivablePatientCard.is-overdue,
body.light #view-installments .receivablePatientCard.is-overdue{
  border-color:rgba(225,29,72,.25) !important;
  background:radial-gradient(520px 150px at 12% -14%, rgba(244,63,94,.10), transparent 72%), linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,248,.94)) !important;
}
html.light #view-installments .receivablePatientCard.is-soon,
:root.light #view-installments .receivablePatientCard.is-soon,
body.light #view-installments .receivablePatientCard.is-soon{
  border-color:rgba(217,119,6,.24) !important;
  background:radial-gradient(520px 150px at 12% -14%, rgba(245,158,11,.12), transparent 72%), linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,251,235,.94)) !important;
}
html.light #view-installments .receivablePatientTop .instName,
:root.light #view-installments .receivablePatientTop .instName,
body.light #view-installments .receivablePatientTop .instName,
html.light #view-installments .receivablePatientTop .instName .muted,
:root.light #view-installments .receivablePatientTop .instName .muted,
body.light #view-installments .receivablePatientTop .instName .muted{
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
}
html.light #view-installments .receivableStatusChip,
:root.light #view-installments .receivableStatusChip,
body.light #view-installments .receivableStatusChip{
  color:#1d4ed8 !important;
  background:rgba(37,99,235,.09) !important;
  border-color:rgba(37,99,235,.22) !important;
}
html.light #view-installments .receivablePatientCard.is-overdue .receivableStatusChip,
:root.light #view-installments .receivablePatientCard.is-overdue .receivableStatusChip,
body.light #view-installments .receivablePatientCard.is-overdue .receivableStatusChip{
  color:#be123c !important;
  background:rgba(244,63,94,.105) !important;
  border-color:rgba(225,29,72,.26) !important;
}
html.light #view-installments .receivablePatientCard.is-soon .receivableStatusChip,
:root.light #view-installments .receivablePatientCard.is-soon .receivableStatusChip,
body.light #view-installments .receivablePatientCard.is-soon .receivableStatusChip{
  color:#b45309 !important;
  background:rgba(245,158,11,.12) !important;
  border-color:rgba(217,119,6,.25) !important;
}
html.light #view-installments .receivablePatientCard.is-paid .receivableStatusChip,
:root.light #view-installments .receivablePatientCard.is-paid .receivableStatusChip,
body.light #view-installments .receivablePatientCard.is-paid .receivableStatusChip{
  color:#15803d !important;
  background:rgba(34,197,94,.11) !important;
  border-color:rgba(22,163,74,.23) !important;
}
html.light #view-installments .receivableMetrics .instMetric,
:root.light #view-installments .receivableMetrics .instMetric,
body.light #view-installments .receivableMetrics .instMetric{
  background:rgba(255,255,255,.78) !important;
  border-color:rgba(37,99,235,.12) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.70) !important;
}
html.light #view-installments .instMetricLabel,
:root.light #view-installments .instMetricLabel,
body.light #view-installments .instMetricLabel{
  color:#64748b !important;
}
html.light #view-installments .instMetric strong,
:root.light #view-installments .instMetric strong,
body.light #view-installments .instMetric strong{
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
}
html.light #view-installments .instMetric.is-late strong,
:root.light #view-installments .instMetric.is-late strong,
body.light #view-installments .instMetric.is-late strong{color:#be123c !important;-webkit-text-fill-color:#be123c !important;}
html.light #view-installments .instMetric.is-soon strong,
html.light #view-installments .instMetric.is-pending strong,
:root.light #view-installments .instMetric.is-soon strong,
:root.light #view-installments .instMetric.is-pending strong,
body.light #view-installments .instMetric.is-soon strong,
body.light #view-installments .instMetric.is-pending strong{color:#b45309 !important;-webkit-text-fill-color:#b45309 !important;}

html.light #view-installments .instAlert.late,
:root.light #view-installments .instAlert.late,
body.light #view-installments .instAlert.late{
  background:linear-gradient(90deg, rgba(244,63,94,.14), rgba(244,63,94,.065)) !important;
  border-color:rgba(225,29,72,.24) !important;
  color:#be123c !important;
  box-shadow:inset 4px 0 0 rgba(225,29,72,.70) !important;
}
html.light #view-installments .instAlert.soon,
html.light #view-installments .instAlert.pending,
:root.light #view-installments .instAlert.soon,
:root.light #view-installments .instAlert.pending,
body.light #view-installments .instAlert.soon,
body.light #view-installments .instAlert.pending{
  background:linear-gradient(90deg, rgba(245,158,11,.15), rgba(245,158,11,.06)) !important;
  border-color:rgba(217,119,6,.23) !important;
  color:#b45309 !important;
  box-shadow:inset 4px 0 0 rgba(217,119,6,.55) !important;
}
html.light #view-installments .instAlert.ok,
:root.light #view-installments .instAlert.ok,
body.light #view-installments .instAlert.ok{
  background:linear-gradient(90deg, rgba(34,197,94,.14), rgba(34,197,94,.055)) !important;
  border-color:rgba(22,163,74,.22) !important;
  color:#15803d !important;
  box-shadow:inset 4px 0 0 rgba(22,163,74,.55) !important;
}

/* A rolagem do modo claro não derruba a hierarquia visual do módulo. */
html.light body.cronos-is-scrolling #view-installments .receivablesHero,
:root.light body.cronos-is-scrolling #view-installments .receivablesHero,
body.light.cronos-is-scrolling #view-installments .receivablesHero,
html.light body.cronos-is-scrolling #view-installments .receivableKpi,
:root.light body.cronos-is-scrolling #view-installments .receivableKpi,
body.light.cronos-is-scrolling #view-installments .receivableKpi,
html.light body.cronos-is-scrolling #view-installments .receivablesQuickTabs,
:root.light body.cronos-is-scrolling #view-installments .receivablesQuickTabs,
body.light.cronos-is-scrolling #view-installments .receivablesQuickTabs,
html.light body.cronos-is-scrolling #view-installments .receivablesRuleHint,
:root.light body.cronos-is-scrolling #view-installments .receivablesRuleHint,
body.light.cronos-is-scrolling #view-installments .receivablesRuleHint,
html.light body.cronos-is-scrolling #view-installments .receivablesListCard,
:root.light body.cronos-is-scrolling #view-installments .receivablesListCard,
body.light.cronos-is-scrolling #view-installments .receivablesListCard,
html.light body.cronos-is-scrolling #view-installments .receivablePatientCard,
:root.light body.cronos-is-scrolling #view-installments .receivablePatientCard,
body.light.cronos-is-scrolling #view-installments .receivablePatientCard,
html.light body.cronos-is-scrolling #view-installments .receivableMetrics .instMetric,
:root.light body.cronos-is-scrolling #view-installments .receivableMetrics .instMetric,
body.light.cronos-is-scrolling #view-installments .receivableMetrics .instMetric{
  background-image:inherit;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}


/* V105 — preserva o card-mãe e os cards de pacientes durante a rolagem no modo claro. */
html.light body.cronos-is-scrolling #view-installments .receivablesListCard,
:root.light body.cronos-is-scrolling #view-installments .receivablesListCard,
body.light.cronos-is-scrolling #view-installments .receivablesListCard{
  background:
    radial-gradient(760px 240px at 12% 0%, rgba(37,99,235,.095), transparent 70%),
    radial-gradient(620px 220px at 98% 100%, rgba(20,184,166,.075), transparent 72%),
    linear-gradient(180deg, rgba(248,252,255,.92), rgba(240,250,247,.86)) !important;
  border-color:rgba(37,99,235,.13) !important;
  box-shadow:0 16px 34px rgba(15,23,42,.065), inset 0 1px 0 rgba(255,255,255,.70) !important;
}
html.light body.cronos-is-scrolling #view-installments .receivablePatientCard,
:root.light body.cronos-is-scrolling #view-installments .receivablePatientCard,
body.light.cronos-is-scrolling #view-installments .receivablePatientCard{
  background:
    radial-gradient(520px 150px at 12% -14%, rgba(37,99,235,.080), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.94)) !important;
  border-color:rgba(37,99,235,.13) !important;
  box-shadow:0 12px 26px rgba(15,23,42,.065), inset 0 1px 0 rgba(255,255,255,.76) !important;
}
html.light body.cronos-is-scrolling #view-installments .receivablePatientCard.is-overdue,
:root.light body.cronos-is-scrolling #view-installments .receivablePatientCard.is-overdue,
body.light.cronos-is-scrolling #view-installments .receivablePatientCard.is-overdue{
  background:
    radial-gradient(520px 150px at 12% -14%, rgba(244,63,94,.10), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,247,248,.94)) !important;
  border-color:rgba(225,29,72,.25) !important;
}
html.light body.cronos-is-scrolling #view-installments .receivablePatientCard.is-soon,
:root.light body.cronos-is-scrolling #view-installments .receivablePatientCard.is-soon,
body.light.cronos-is-scrolling #view-installments .receivablePatientCard.is-soon{
  background:
    radial-gradient(520px 150px at 12% -14%, rgba(245,158,11,.12), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,251,235,.94)) !important;
  border-color:rgba(217,119,6,.24) !important;
}



/* === CRONOS V106 — Recebimentos claro: pago verde + botões de ação com cor e ícone visível === */
#view-installments .receivableActions .btn.charge,
#view-installments .receivableActions .btn.charge:disabled{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
#view-installments .receivableActions .btn .cronos-whatsapp-icon{
  width:16px!important;
  height:16px!important;
  flex:0 0 16px!important;
  display:inline-block!important;
}

html.light #view-installments .instMetric.is-ok strong,
:root.light #view-installments .instMetric.is-ok strong,
body.light #view-installments .instMetric.is-ok strong{
  color:#15803d !important;
  -webkit-text-fill-color:#15803d !important;
}

html.light #view-installments .receivableActions .btn,
:root.light #view-installments .receivableActions .btn,
body.light #view-installments .receivableActions .btn{
  background:linear-gradient(180deg, rgba(248,252,255,.98), rgba(236,245,255,.94)) !important;
  border-color:rgba(37,99,235,.18) !important;
  color:#1e3a8a !important;
  box-shadow:0 8px 18px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.78) !important;
}
html.light #view-installments .receivableActions .btn.charge,
:root.light #view-installments .receivableActions .btn.charge,
body.light #view-installments .receivableActions .btn.charge{
  background:linear-gradient(180deg, rgba(240,253,244,.98), rgba(220,252,231,.94)) !important;
  border-color:rgba(22,163,74,.28) !important;
  color:#166534 !important;
}
html.light #view-installments .receivableActions .btn.ok,
html.light #view-installments .receivableActions .btn.compactLow,
:root.light #view-installments .receivableActions .btn.ok,
:root.light #view-installments .receivableActions .btn.compactLow,
body.light #view-installments .receivableActions .btn.ok,
body.light #view-installments .receivableActions .btn.compactLow{
  background:linear-gradient(180deg, rgba(255,251,235,.98), rgba(254,243,199,.95)) !important;
  border-color:rgba(217,119,6,.28) !important;
  color:#a16207 !important;
}
html.light #view-installments .receivableActions .btn.primary,
:root.light #view-installments .receivableActions .btn.primary,
body.light #view-installments .receivableActions .btn.primary{
  background:linear-gradient(135deg, #2563eb, #0ea5e9 58%, #14b8d6) !important;
  border-color:rgba(37,99,235,.30) !important;
  color:#ffffff !important;
  box-shadow:0 10px 22px rgba(37,99,235,.18), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
html.light #view-installments .receivableActions .btn:disabled,
:root.light #view-installments .receivableActions .btn:disabled,
body.light #view-installments .receivableActions .btn:disabled{
  opacity:.72 !important;
}


/* === CRONOS V107 — Recebimentos claro: botão WhatsApp mais legível === */
html.light #view-installments .receivableActions .btn.charge,
html.light #view-installments .receivableActions .btn.charge:disabled,
:root.light #view-installments .receivableActions .btn.charge,
:root.light #view-installments .receivableActions .btn.charge:disabled,
body.light #view-installments .receivableActions .btn.charge,
body.light #view-installments .receivableActions .btn.charge:disabled{
  background:linear-gradient(180deg, #ecfdf3, #dff7ea) !important;
  border:1px solid rgba(22,163,74,.34) !important;
  color:#166534 !important;
  opacity:1 !important;
  filter:none !important;
  font-weight:800 !important;
  font-size:14px !important;
  line-height:1 !important;
  white-space:nowrap !important;
  min-width:132px !important;
  padding:0 16px !important;
  box-shadow:0 8px 18px rgba(22,163,74,.10), inset 0 1px 0 rgba(255,255,255,.80) !important;
}
html.light #view-installments .receivableActions .btn.charge span,
html.light #view-installments .receivableActions .btn.charge:disabled span,
:root.light #view-installments .receivableActions .btn.charge span,
:root.light #view-installments .receivableActions .btn.charge:disabled span,
body.light #view-installments .receivableActions .btn.charge span,
body.light #view-installments .receivableActions .btn.charge:disabled span{
  display:inline-block !important;
  color:#166534 !important;
}
html.light #view-installments .receivableActions .btn.charge .cronos-whatsapp-icon,
html.light #view-installments .receivableActions .btn.charge:disabled .cronos-whatsapp-icon,
:root.light #view-installments .receivableActions .btn.charge .cronos-whatsapp-icon,
:root.light #view-installments .receivableActions .btn.charge:disabled .cronos-whatsapp-icon,
body.light #view-installments .receivableActions .btn.charge .cronos-whatsapp-icon,
body.light #view-installments .receivableActions .btn.charge:disabled .cronos-whatsapp-icon{
  width:17px !important;
  height:17px !important;
  min-width:17px !important;
  min-height:17px !important;
  color:#16a34a !important;
  fill:currentColor !important;
  opacity:1 !important;
  display:inline-block !important;
  visibility:visible !important;
}


/* === CRONOS V108 — Recebimentos claro: ícone do WhatsApp garantido por CSS === */
html.light #view-installments .receivableActions .btn.charge,
html.light #view-installments .receivableActions .btn.charge:disabled,
:root.light #view-installments .receivableActions .btn.charge,
:root.light #view-installments .receivableActions .btn.charge:disabled,
body.light #view-installments .receivableActions .btn.charge,
body.light #view-installments .receivableActions .btn.charge:disabled{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
}
html.light #view-installments .receivableActions .btn.charge::before,
html.light #view-installments .receivableActions .btn.charge:disabled::before,
:root.light #view-installments .receivableActions .btn.charge::before,
:root.light #view-installments .receivableActions .btn.charge:disabled::before,
body.light #view-installments .receivableActions .btn.charge::before,
body.light #view-installments .receivableActions .btn.charge:disabled::before{
  content:"" !important;
  width:18px !important;
  height:18px !important;
  flex:0 0 18px !important;
  display:inline-block !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:18px 18px !important;
  opacity:1 !important;
  visibility:visible !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2316a34a'%3E%3Cpath d='M12.04 2C6.58 2 2.13 6.45 2.13 11.91c0 1.75.46 3.46 1.34 4.96L2 22l5.25-1.38a9.86 9.86 0 0 0 4.79 1.22h.01c5.46 0 9.91-4.45 9.91-9.91C21.96 6.45 17.51 2 12.04 2Zm0 18.15h-.01a8.22 8.22 0 0 1-4.19-1.15l-.3-.18-3.12.82.83-3.04-.2-.31a8.18 8.18 0 0 1-1.25-4.38c0-4.55 3.7-8.25 8.25-8.25a8.25 8.25 0 0 1 8.25 8.25c0 4.55-3.7 8.24-8.26 8.24Zm4.52-6.18c-.25-.12-1.47-.72-1.7-.81-.23-.08-.4-.12-.57.13-.17.25-.65.81-.8.98-.15.17-.3.19-.55.06-.25-.12-1.05-.39-2-1.24-.74-.66-1.24-1.47-1.38-1.72-.14-.25-.02-.38.11-.5.11-.11.25-.3.37-.45.12-.15.17-.25.25-.42.08-.17.04-.32-.02-.45-.06-.12-.57-1.37-.78-1.88-.21-.5-.42-.43-.57-.44h-.49c-.17 0-.45.06-.68.32-.23.25-.89.87-.89 2.12 0 1.25.91 2.46 1.04 2.63.12.17 1.79 2.73 4.34 3.83.61.26 1.08.42 1.45.54.61.19 1.16.16 1.6.1.49-.07 1.47-.6 1.68-1.18.21-.58.21-1.08.15-1.18-.06-.1-.23-.16-.48-.28Z'/%3E%3C/svg%3E") !important;
}
html.light #view-installments .receivableActions .btn.charge .cronos-whatsapp-icon,
html.light #view-installments .receivableActions .btn.charge:disabled .cronos-whatsapp-icon,
:root.light #view-installments .receivableActions .btn.charge .cronos-whatsapp-icon,
:root.light #view-installments .receivableActions .btn.charge:disabled .cronos-whatsapp-icon,
body.light #view-installments .receivableActions .btn.charge .cronos-whatsapp-icon,
body.light #view-installments .receivableActions .btn.charge:disabled .cronos-whatsapp-icon{
  display:none !important;
}


/* === CRONOS V109 — Gerenciar recebimento (modo claro) alinhado ao escuro === */
html.light .modal:has(#newFinancialInstallmentApp),
body.light .modal:has(#newFinancialInstallmentApp),
:root.light .modal:has(#newFinancialInstallmentApp){
  background:
    radial-gradient(980px 320px at 8% -12%, rgba(37,99,235,.16), transparent 72%),
    radial-gradient(760px 300px at 100% 0%, rgba(20,184,166,.12), transparent 76%),
    linear-gradient(180deg, #f8fbff 0%, #eef7ff 56%, #effbf6 100%) !important;
  border:1px solid rgba(37,99,235,.18) !important;
  box-shadow:0 28px 80px rgba(15,23,42,.22), inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.light .modal:has(#newFinancialInstallmentApp) #modalBody,
body.light .modal:has(#newFinancialInstallmentApp) #modalBody,
:root.light .modal:has(#newFinancialInstallmentApp) #modalBody{
  background:transparent !important;
}
html.light .modal:has(#newFinancialInstallmentApp) .x,
body.light .modal:has(#newFinancialInstallmentApp) .x,
:root.light .modal:has(#newFinancialInstallmentApp) .x{
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(240,247,255,.86)) !important;
  border-color:rgba(37,99,235,.16) !important;
  color:#475569 !important;
}
html.light .modal:has(#newFinancialInstallmentApp) .x:hover,
body.light .modal:has(#newFinancialInstallmentApp) .x:hover,
:root.light .modal:has(#newFinancialInstallmentApp) .x:hover{
  color:#0f172a !important;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(232,243,255,.92)) !important;
}

html.light #newFinancialInstallmentApp,
body.light #newFinancialInstallmentApp,
:root.light #newFinancialInstallmentApp{
  --newfin-light-line: rgba(37,99,235,.14);
  --newfin-light-line-strong: rgba(37,99,235,.22);
  --newfin-light-surface: rgba(255,255,255,.88);
  --newfin-light-surface-2: rgba(246,250,255,.92);
  --newfin-light-surface-3: rgba(237,247,255,.92);
  --newfin-light-text: #0f172a;
  --newfin-light-muted: #475569;
}
html.light #newFinancialInstallmentApp,
html.light #newFinancialInstallmentApp *:not(svg):not(path),
body.light #newFinancialInstallmentApp,
body.light #newFinancialInstallmentApp *:not(svg):not(path),
:root.light #newFinancialInstallmentApp,
:root.light #newFinancialInstallmentApp *:not(svg):not(path){
  color:inherit;
}
html.light #newFinancialInstallmentApp .card,
body.light #newFinancialInstallmentApp .card,
:root.light #newFinancialInstallmentApp .card,
html.light #newFinancialInstallmentApp .selectedPlanPaymentEditor,
body.light #newFinancialInstallmentApp .selectedPlanPaymentEditor,
:root.light #newFinancialInstallmentApp .selectedPlanPaymentEditor{
  background:
    radial-gradient(780px 220px at 10% -16%, rgba(37,99,235,.09), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,250,255,.94)) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  border-radius:20px !important;
  box-shadow:0 14px 30px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.8) !important;
}
html.light #newFinancialInstallmentApp h3,
body.light #newFinancialInstallmentApp h3,
:root.light #newFinancialInstallmentApp h3{
  color:#0f172a !important;
}
html.light #newFinancialInstallmentApp label,
body.light #newFinancialInstallmentApp label,
:root.light #newFinancialInstallmentApp label{
  color:#334155 !important;
  font-weight:750 !important;
}
html.light #newFinancialInstallmentApp .muted,
body.light #newFinancialInstallmentApp .muted,
:root.light #newFinancialInstallmentApp .muted,
html.light #newFinancialInstallmentApp .small.muted,
body.light #newFinancialInstallmentApp .small.muted,
:root.light #newFinancialInstallmentApp .small.muted{
  color:#64748b !important;
}
html.light #newFinancialInstallmentApp input,
html.light #newFinancialInstallmentApp select,
html.light #newFinancialInstallmentApp textarea,
body.light #newFinancialInstallmentApp input,
body.light #newFinancialInstallmentApp select,
body.light #newFinancialInstallmentApp textarea,
:root.light #newFinancialInstallmentApp input,
:root.light #newFinancialInstallmentApp select,
:root.light #newFinancialInstallmentApp textarea{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.94)) !important;
  border:1px solid rgba(37,99,235,.16) !important;
  color:#0f172a !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.84), 0 8px 18px rgba(15,23,42,.035) !important;
}
html.light #newFinancialInstallmentApp input::placeholder,
html.light #newFinancialInstallmentApp textarea::placeholder,
body.light #newFinancialInstallmentApp input::placeholder,
body.light #newFinancialInstallmentApp textarea::placeholder,
:root.light #newFinancialInstallmentApp input::placeholder,
:root.light #newFinancialInstallmentApp textarea::placeholder{
  color:#94a3b8 !important;
}
html.light #newFinancialInstallmentApp input:focus,
html.light #newFinancialInstallmentApp select:focus,
html.light #newFinancialInstallmentApp textarea:focus,
body.light #newFinancialInstallmentApp input:focus,
body.light #newFinancialInstallmentApp select:focus,
body.light #newFinancialInstallmentApp textarea:focus,
:root.light #newFinancialInstallmentApp input:focus,
:root.light #newFinancialInstallmentApp select:focus,
:root.light #newFinancialInstallmentApp textarea:focus{
  border-color:rgba(37,99,235,.34) !important;
  box-shadow:0 0 0 4px rgba(37,99,235,.10), inset 0 1px 0 rgba(255,255,255,.88), 0 10px 20px rgba(15,23,42,.045) !important;
}

html.light #newFinancialInstallmentApp .recebFichaItem,
body.light #newFinancialInstallmentApp .recebFichaItem,
:root.light #newFinancialInstallmentApp .recebFichaItem{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.95)) !important;
  border-color:rgba(37,99,235,.13) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.light #newFinancialInstallmentApp [data-cronos-scroll-key="new-fin-ficha-items"],
body.light #newFinancialInstallmentApp [data-cronos-scroll-key="new-fin-ficha-items"],
:root.light #newFinancialInstallmentApp [data-cronos-scroll-key="new-fin-ficha-items"]{
  border-radius:14px !important;
}

html.light #newFinancialInstallmentApp .chip,
body.light #newFinancialInstallmentApp .chip,
:root.light #newFinancialInstallmentApp .chip{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,248,255,.92)) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  color:#334155 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.light #newFinancialInstallmentApp .badge.ok,
body.light #newFinancialInstallmentApp .badge.ok,
:root.light #newFinancialInstallmentApp .badge.ok{
  background:rgba(34,197,94,.12) !important;
  border:1px solid rgba(22,163,74,.22) !important;
  color:#15803d !important;
}
html.light #newFinancialInstallmentApp .badge.pending,
body.light #newFinancialInstallmentApp .badge.pending,
:root.light #newFinancialInstallmentApp .badge.pending{
  background:rgba(245,158,11,.12) !important;
  border:1px solid rgba(217,119,6,.22) !important;
  color:#a16207 !important;
}
html.light #newFinancialInstallmentApp .badge.late,
body.light #newFinancialInstallmentApp .badge.late,
:root.light #newFinancialInstallmentApp .badge.late{
  background:rgba(244,63,94,.10) !important;
  border:1px solid rgba(225,29,72,.22) !important;
  color:#be123c !important;
}

html.light #newFinancialInstallmentApp .newFinApprovalLock,
body.light #newFinancialInstallmentApp .newFinApprovalLock,
:root.light #newFinancialInstallmentApp .newFinApprovalLock{
  background:linear-gradient(90deg, rgba(245,158,11,.14), rgba(251,191,36,.06)) !important;
  border-color:rgba(217,119,6,.24) !important;
  color:#92400e !important;
}
html.light #newFinancialInstallmentApp .newFinApprovalLock span,
body.light #newFinancialInstallmentApp .newFinApprovalLock span,
:root.light #newFinancialInstallmentApp .newFinApprovalLock span{
  color:#a16207 !important;
}

html.light #newFinancialInstallmentApp .newFinCreatePlanBtn,
html.light #newFinancialInstallmentApp .newFinAddPaymentBtn,
html.light #newFinancialInstallmentApp .newFinSelectPlanBtn.selected,
body.light #newFinancialInstallmentApp .newFinCreatePlanBtn,
body.light #newFinancialInstallmentApp .newFinAddPaymentBtn,
body.light #newFinancialInstallmentApp .newFinSelectPlanBtn.selected,
:root.light #newFinancialInstallmentApp .newFinCreatePlanBtn,
:root.light #newFinancialInstallmentApp .newFinAddPaymentBtn,
:root.light #newFinancialInstallmentApp .newFinSelectPlanBtn.selected{
  background:linear-gradient(135deg, #2563eb, #0ea5e9 58%, #14b8d6) !important;
  border:1px solid rgba(37,99,235,.30) !important;
  color:#ffffff !important;
  box-shadow:0 12px 24px rgba(37,99,235,.17), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
html.light #newFinancialInstallmentApp .newFinSelectPlanBtn:not(.selected),
html.light #newFinancialInstallmentApp .newFinUseBalanceBtn,
body.light #newFinancialInstallmentApp .newFinSelectPlanBtn:not(.selected),
body.light #newFinancialInstallmentApp .newFinUseBalanceBtn,
:root.light #newFinancialInstallmentApp .newFinSelectPlanBtn:not(.selected),
:root.light #newFinancialInstallmentApp .newFinUseBalanceBtn{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(241,248,255,.92)) !important;
  border:1px solid rgba(37,99,235,.16) !important;
  color:#1e3a8a !important;
  box-shadow:0 8px 18px rgba(15,23,42,.04) !important;
}
html.light #newFinancialInstallmentApp .newFinApprovePlanBtn,
body.light #newFinancialInstallmentApp .newFinApprovePlanBtn,
:root.light #newFinancialInstallmentApp .newFinApprovePlanBtn{
  background:linear-gradient(180deg, rgba(255,251,235,.98), rgba(254,243,199,.94)) !important;
  border-color:rgba(217,119,6,.26) !important;
  color:#a16207 !important;
}
html.light #newFinancialInstallmentApp .newFinApprovedBtn,
body.light #newFinancialInstallmentApp .newFinApprovedBtn,
:root.light #newFinancialInstallmentApp .newFinApprovedBtn{
  background:linear-gradient(180deg, rgba(240,253,244,.98), rgba(220,252,231,.94)) !important;
  border-color:rgba(22,163,74,.24) !important;
  color:#15803d !important;
}
html.light #newFinancialInstallmentApp .btn.small.danger,
body.light #newFinancialInstallmentApp .btn.small.danger,
:root.light #newFinancialInstallmentApp .btn.small.danger,
html.light #newFinancialInstallmentApp .miniBtn.danger,
body.light #newFinancialInstallmentApp .miniBtn.danger,
:root.light #newFinancialInstallmentApp .miniBtn.danger{
  background:linear-gradient(180deg, rgba(255,241,242,.98), rgba(255,228,230,.94)) !important;
  border-color:rgba(225,29,72,.24) !important;
  color:#be123c !important;
}
html.light #newFinancialInstallmentApp button:disabled,
body.light #newFinancialInstallmentApp button:disabled,
:root.light #newFinancialInstallmentApp button:disabled{
  opacity:.76 !important;
  filter:none !important;
}

html.light #newFinancialInstallmentApp .financialPaymentTable,
body.light #newFinancialInstallmentApp .financialPaymentTable,
:root.light #newFinancialInstallmentApp .financialPaymentTable{
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:rgba(255,255,255,.88) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:0 10px 24px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable th,
body.light #newFinancialInstallmentApp .financialPaymentTable th,
:root.light #newFinancialInstallmentApp .financialPaymentTable th{
  background:linear-gradient(180deg, rgba(232,243,255,.96), rgba(220,238,250,.90)) !important;
  color:#334155 !important;
  border-bottom:1px solid rgba(37,99,235,.14) !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable td,
body.light #newFinancialInstallmentApp .financialPaymentTable td,
:root.light #newFinancialInstallmentApp .financialPaymentTable td{
  background:rgba(255,255,255,.78) !important;
  color:#0f172a !important;
  border-bottom:1px solid rgba(226,232,240,.74) !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable tbody tr:hover td,
body.light #newFinancialInstallmentApp .financialPaymentTable tbody tr:hover td,
:root.light #newFinancialInstallmentApp .financialPaymentTable tbody tr:hover td{
  background:rgba(241,248,255,.94) !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable tbody tr:last-child td,
body.light #newFinancialInstallmentApp .financialPaymentTable tbody tr:last-child td,
:root.light #newFinancialInstallmentApp .financialPaymentTable tbody tr:last-child td{
  border-bottom:none !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable .miniLink,
body.light #newFinancialInstallmentApp .financialPaymentTable .miniLink,
:root.light #newFinancialInstallmentApp .financialPaymentTable .miniLink{
  color:#2563eb !important;
  font-weight:800 !important;
  text-decoration:none !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable .btn.ok.compactLow,
body.light #newFinancialInstallmentApp .financialPaymentTable .btn.ok.compactLow,
:root.light #newFinancialInstallmentApp .financialPaymentTable .btn.ok.compactLow{
  background:linear-gradient(180deg, rgba(255,251,235,.98), rgba(254,243,199,.94)) !important;
  border-color:rgba(217,119,6,.24) !important;
  color:#a16207 !important;
}


/* === CRONOS V110 — Gerenciar recebimento claro: performance de rolagem === */
/* O v109 ficou bonito, mas pesado: removemos blur/gradientes/sombras caras do modal de Gerenciar para a rolagem acompanhar a barra. */
html.light #modalBg:has(#newFinancialInstallmentApp),
body.light #modalBg:has(#newFinancialInstallmentApp),
:root.light #modalBg:has(#newFinancialInstallmentApp),
html.light .modalBg:has(#newFinancialInstallmentApp),
body.light .modalBg:has(#newFinancialInstallmentApp),
:root.light .modalBg:has(#newFinancialInstallmentApp){
  background:rgba(15,23,42,.34) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

html.light .modal:has(#newFinancialInstallmentApp),
body.light .modal:has(#newFinancialInstallmentApp),
:root.light .modal:has(#newFinancialInstallmentApp){
  background:linear-gradient(180deg,#f8fbff 0%,#eef7ff 100%) !important;
  border:1px solid rgba(37,99,235,.16) !important;
  box-shadow:0 18px 42px rgba(15,23,42,.18) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

html.light .modal:has(#newFinancialInstallmentApp) #modalBody,
body.light .modal:has(#newFinancialInstallmentApp) #modalBody,
:root.light .modal:has(#newFinancialInstallmentApp) #modalBody{
  background:transparent !important;
  scroll-behavior:auto !important;
  will-change:scroll-position !important;
  overscroll-behavior:contain !important;
}

html.light #newFinancialInstallmentApp,
html.light #newFinancialInstallmentApp *,
html.light #newFinancialInstallmentApp *::before,
html.light #newFinancialInstallmentApp *::after,
body.light #newFinancialInstallmentApp,
body.light #newFinancialInstallmentApp *,
body.light #newFinancialInstallmentApp *::before,
body.light #newFinancialInstallmentApp *::after,
:root.light #newFinancialInstallmentApp,
:root.light #newFinancialInstallmentApp *,
:root.light #newFinancialInstallmentApp *::before,
:root.light #newFinancialInstallmentApp *::after{
  transition:none !important;
  animation:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  filter:none !important;
  text-shadow:none !important;
}

html.light #newFinancialInstallmentApp .card,
body.light #newFinancialInstallmentApp .card,
:root.light #newFinancialInstallmentApp .card,
html.light #newFinancialInstallmentApp .selectedPlanPaymentEditor,
body.light #newFinancialInstallmentApp .selectedPlanPaymentEditor,
:root.light #newFinancialInstallmentApp .selectedPlanPaymentEditor{
  background:#ffffff !important;
  border:1px solid rgba(37,99,235,.13) !important;
  box-shadow:0 6px 16px rgba(15,23,42,.045) !important;
}

html.light #newFinancialInstallmentApp .card .card,
body.light #newFinancialInstallmentApp .card .card,
:root.light #newFinancialInstallmentApp .card .card{
  box-shadow:none !important;
}

html.light #newFinancialInstallmentApp input,
html.light #newFinancialInstallmentApp select,
html.light #newFinancialInstallmentApp textarea,
body.light #newFinancialInstallmentApp input,
body.light #newFinancialInstallmentApp select,
body.light #newFinancialInstallmentApp textarea,
:root.light #newFinancialInstallmentApp input,
:root.light #newFinancialInstallmentApp select,
:root.light #newFinancialInstallmentApp textarea{
  background:#ffffff !important;
  border:1px solid rgba(37,99,235,.15) !important;
  box-shadow:none !important;
}

html.light #newFinancialInstallmentApp input:focus,
html.light #newFinancialInstallmentApp select:focus,
html.light #newFinancialInstallmentApp textarea:focus,
body.light #newFinancialInstallmentApp input:focus,
body.light #newFinancialInstallmentApp select:focus,
body.light #newFinancialInstallmentApp textarea:focus,
:root.light #newFinancialInstallmentApp input:focus,
:root.light #newFinancialInstallmentApp select:focus,
:root.light #newFinancialInstallmentApp textarea:focus{
  border-color:rgba(37,99,235,.34) !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.08) !important;
}

html.light #newFinancialInstallmentApp .chip,
body.light #newFinancialInstallmentApp .chip,
:root.light #newFinancialInstallmentApp .chip{
  background:#f8fbff !important;
  box-shadow:none !important;
}

html.light #newFinancialInstallmentApp .financialPaymentTable,
body.light #newFinancialInstallmentApp .financialPaymentTable,
:root.light #newFinancialInstallmentApp .financialPaymentTable{
  background:#ffffff !important;
  box-shadow:none !important;
  border:1px solid rgba(37,99,235,.13) !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable th,
body.light #newFinancialInstallmentApp .financialPaymentTable th,
:root.light #newFinancialInstallmentApp .financialPaymentTable th{
  background:#eef7ff !important;
}
html.light #newFinancialInstallmentApp .financialPaymentTable td,
body.light #newFinancialInstallmentApp .financialPaymentTable td,
:root.light #newFinancialInstallmentApp .financialPaymentTable td{
  background:#ffffff !important;
}

/* Durante a rolagem do modal, deixa tudo ainda mais flat para não engasgar. */
html.light body.cronos-newfin-scrolling .modal:has(#newFinancialInstallmentApp),
body.light.cronos-newfin-scrolling .modal:has(#newFinancialInstallmentApp),
:root.light body.cronos-newfin-scrolling .modal:has(#newFinancialInstallmentApp){
  background:#f8fbff !important;
  box-shadow:none !important;
}
html.light body.cronos-newfin-scrolling #newFinancialInstallmentApp .card,
html.light body.cronos-newfin-scrolling #newFinancialInstallmentApp .selectedPlanPaymentEditor,
html.light body.cronos-newfin-scrolling #newFinancialInstallmentApp .financialPaymentTable,
body.light.cronos-newfin-scrolling #newFinancialInstallmentApp .card,
body.light.cronos-newfin-scrolling #newFinancialInstallmentApp .selectedPlanPaymentEditor,
body.light.cronos-newfin-scrolling #newFinancialInstallmentApp .financialPaymentTable,
:root.light body.cronos-newfin-scrolling #newFinancialInstallmentApp .card,
:root.light body.cronos-newfin-scrolling #newFinancialInstallmentApp .selectedPlanPaymentEditor,
:root.light body.cronos-newfin-scrolling #newFinancialInstallmentApp .financialPaymentTable{
  box-shadow:none !important;
  background:#ffffff !important;
}


/* === CRONOS V111 — Simulador: refinamento do modo claro e ações compactas === */
:root.light #view-creditSimulator .credHeroIconV39,
html.light #view-creditSimulator .credHeroIconV39,
body.light #view-creditSimulator .credHeroIconV39{
  color:#ffffff !important;
  background:
    radial-gradient(circle at 32% 22%, rgba(125,211,252,.72), transparent 56%),
    linear-gradient(135deg, #2563eb, #0ea5e9 62%, #22c55e) !important;
  border-color:rgba(37,99,235,.24) !important;
  box-shadow:0 10px 24px rgba(37,99,235,.16), 0 0 0 1px rgba(255,255,255,.56) inset !important;
}

:root.light #view-creditSimulator .credAutoField input[readonly],
html.light #view-creditSimulator .credAutoField input[readonly],
body.light #view-creditSimulator .credAutoField input[readonly]{
  color:#334155 !important;
  -webkit-text-fill-color:#334155 !important;
  background:rgba(241,245,249,.96) !important;
  border-color:rgba(148,163,184,.26) !important;
  font-weight:800 !important;
  opacity:1 !important;
}

#view-creditSimulator .credActionsV41{
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:10px !important;
  align-items:center !important;
  overflow-x:auto !important;
  padding-bottom:2px !important;
  scrollbar-width:thin;
}
#view-creditSimulator .credActionsV41 .credBtn{
  min-height:42px !important;
  padding:10px 14px !important;
  border-radius:14px !important;
  font-size:14px !important;
  line-height:1 !important;
  white-space:nowrap !important;
  flex:0 0 auto !important;
}
#view-creditSimulator .credActionsV41 .credBtn.primary{
  padding-inline:16px !important;
}
#view-creditSimulator .credActionsV41 .credBtn.iconOnly{
  width:42px !important;
  min-width:42px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}
#view-creditSimulator .credActionsV41 .credBtn.iconOnly svg{
  width:20px !important;
  height:20px !important;
  display:block !important;
}
#view-creditSimulator .credActionsV41 .printBtnV41{
  color:var(--text,#eef2ff) !important;
}
:root.light #view-creditSimulator .credActionsV41 .printBtnV41,
html.light #view-creditSimulator .credActionsV41 .printBtnV41,
body.light #view-creditSimulator .credActionsV41 .printBtnV41{
  color:#0f172a !important;
}
@media (max-width: 900px){
  #view-creditSimulator .credActionsV41{
    flex-wrap:wrap !important;
    overflow-x:visible !important;
  }
}


/* === CRONOS V112 — Usuários: modo claro alinhado ao escuro === */
:root.light #view-users.usersV40,
html.light #view-users.usersV40,
body.light #view-users.usersV40{
  --users-light-line: rgba(37,99,235,.14);
  --users-light-line-strong: rgba(37,99,235,.22);
  --users-light-surface: rgba(255,255,255,.90);
  --users-light-surface-2: rgba(247,251,255,.94);
  --users-light-shadow: 0 14px 28px rgba(15,23,42,.055);
}

:root.light #view-users .usersHeroV40,
html.light #view-users .usersHeroV40,
body.light #view-users .usersHeroV40{
  background:
    radial-gradient(620px 180px at 10% 0%, rgba(37,99,235,.12), transparent 72%),
    radial-gradient(460px 170px at 100% 0%, rgba(20,184,166,.10), transparent 76%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,250,255,.94)) !important;
  border:1px solid rgba(37,99,235,.16) !important;
  box-shadow:var(--users-light-shadow), inset 0 1px 0 rgba(255,255,255,.82) !important;
}
:root.light #view-users .usersTitleV40 h2,
html.light #view-users .usersTitleV40 h2,
body.light #view-users .usersTitleV40 h2{
  color:#0f172a !important;
}
:root.light #view-users .usersTitleV40 p,
html.light #view-users .usersTitleV40 p,
body.light #view-users .usersTitleV40 p{
  color:#475569 !important;
}
:root.light #view-users .usersIconV40,
html.light #view-users .usersIconV40,
body.light #view-users .usersIconV40{
  color:#ffffff !important;
  background:
    radial-gradient(circle at 32% 22%, rgba(125,211,252,.74), transparent 56%),
    linear-gradient(135deg, #2563eb, #0ea5e9 62%, #14b8d6) !important;
  border-color:rgba(37,99,235,.22) !important;
  box-shadow:0 10px 24px rgba(37,99,235,.16), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
:root.light #view-users .userNewBtnV40,
html.light #view-users .userNewBtnV40,
body.light #view-users .userNewBtnV40{
  color:#ffffff !important;
  background:linear-gradient(135deg,#2563eb,#0ea5e9 60%, #14b8d6) !important;
  border-color:rgba(37,99,235,.28) !important;
  box-shadow:0 12px 22px rgba(37,99,235,.18), inset 0 1px 0 rgba(255,255,255,.16) !important;
}

:root.light #view-users .usersKpiV40,
html.light #view-users .usersKpiV40,
body.light #view-users .usersKpiV40{
  background:
    radial-gradient(340px 110px at 10% 0%, rgba(37,99,235,.08), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,250,255,.94)) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  box-shadow:0 12px 24px rgba(15,23,42,.045), inset 0 1px 0 rgba(255,255,255,.84) !important;
}
:root.light #view-users .usersKpiV40.is-pending,
html.light #view-users .usersKpiV40.is-pending,
body.light #view-users .usersKpiV40.is-pending{
  background:
    radial-gradient(260px 120px at 12% 0%, rgba(245,158,11,.10), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,251,235,.94)) !important;
  border-color:rgba(217,119,6,.18) !important;
}
:root.light #view-users .usersKpiV40 .kpiVal,
html.light #view-users .usersKpiV40 .kpiVal,
body.light #view-users .usersKpiV40 .kpiVal{
  color:#0f172a !important;
}
:root.light #view-users .usersKpiV40 .muted,
:root.light #view-users .usersKpiSubV40,
html.light #view-users .usersKpiV40 .muted,
html.light #view-users .usersKpiSubV40,
body.light #view-users .usersKpiV40 .muted,
body.light #view-users .usersKpiSubV40{
  color:#64748b !important;
}
:root.light #view-users .usersKpiIconV40,
html.light #view-users .usersKpiIconV40,
body.light #view-users .usersKpiIconV40{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.74) !important;
}
:root.light #view-users .usersKpiIconV40.is-total,
html.light #view-users .usersKpiIconV40.is-total,
body.light #view-users .usersKpiIconV40.is-total{ background:rgba(37,99,235,.10) !important; border-color:rgba(37,99,235,.18) !important; color:#2563eb !important; }
:root.light #view-users .usersKpiIconV40.is-masters,
html.light #view-users .usersKpiIconV40.is-masters,
body.light #view-users .usersKpiIconV40.is-masters{ background:rgba(59,130,246,.11) !important; border-color:rgba(59,130,246,.18) !important; color:#1d4ed8 !important; }
:root.light #view-users .usersKpiIconV40.is-gerentes,
html.light #view-users .usersKpiIconV40.is-gerentes,
body.light #view-users .usersKpiIconV40.is-gerentes{ background:rgba(34,197,94,.10) !important; border-color:rgba(34,197,94,.18) !important; color:#15803d !important; }
:root.light #view-users .usersKpiIconV40.is-secretarias,
html.light #view-users .usersKpiIconV40.is-secretarias,
body.light #view-users .usersKpiIconV40.is-secretarias{ background:rgba(168,85,247,.11) !important; border-color:rgba(168,85,247,.18) !important; color:#7c3aed !important; }
:root.light #view-users .usersKpiIconV40.is-crc,
html.light #view-users .usersKpiIconV40.is-crc,
body.light #view-users .usersKpiIconV40.is-crc{ background:rgba(245,158,11,.11) !important; border-color:rgba(245,158,11,.18) !important; color:#b45309 !important; }
:root.light #view-users .usersKpiIconV40.is-dentistas,
html.light #view-users .usersKpiIconV40.is-dentistas,
body.light #view-users .usersKpiIconV40.is-dentistas{ background:rgba(16,185,129,.11) !important; border-color:rgba(16,185,129,.18) !important; color:#0f766e !important; }
:root.light #view-users .usersKpiIconV40.is-pending,
html.light #view-users .usersKpiIconV40.is-pending,
body.light #view-users .usersKpiIconV40.is-pending{ background:rgba(245,158,11,.12) !important; border-color:rgba(245,158,11,.20) !important; color:#a16207 !important; }

:root.light #view-users .usersPanelV40,
html.light #view-users .usersPanelV40,
body.light #view-users .usersPanelV40{
  background:
    radial-gradient(620px 180px at 14% 0%, rgba(37,99,235,.08), transparent 74%),
    linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,250,255,.95)) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  box-shadow:var(--users-light-shadow), inset 0 1px 0 rgba(255,255,255,.84) !important;
}
:root.light #view-users .usersFiltersV40 label,
html.light #view-users .usersFiltersV40 label,
body.light #view-users .usersFiltersV40 label{
  color:#475569 !important;
}
:root.light #view-users .usersPanelV40 input,
:root.light #view-users .usersPanelV40 select,
html.light #view-users .usersPanelV40 input,
html.light #view-users .usersPanelV40 select,
body.light #view-users .usersPanelV40 input,
body.light #view-users .usersPanelV40 select{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,252,255,.94)) !important;
  border:1px solid rgba(37,99,235,.15) !important;
  color:#0f172a !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.84), 0 8px 16px rgba(15,23,42,.03) !important;
}
:root.light #view-users .usersPanelV40 input::placeholder,
html.light #view-users .usersPanelV40 input::placeholder,
body.light #view-users .usersPanelV40 input::placeholder{
  color:#94a3b8 !important;
}
:root.light #view-users .usersPanelV40 input:focus,
:root.light #view-users .usersPanelV40 select:focus,
html.light #view-users .usersPanelV40 input:focus,
html.light #view-users .usersPanelV40 select:focus,
body.light #view-users .usersPanelV40 input:focus,
body.light #view-users .usersPanelV40 select:focus{
  border-color:rgba(37,99,235,.30) !important;
  box-shadow:0 0 0 4px rgba(37,99,235,.10), inset 0 1px 0 rgba(255,255,255,.86) !important;
}
:root.light #view-users .usersRefreshBtnV40,
html.light #view-users .usersRefreshBtnV40,
body.light #view-users .usersRefreshBtnV40{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(241,248,255,.93)) !important;
  border-color:rgba(37,99,235,.16) !important;
  color:#1e3a8a !important;
  box-shadow:0 8px 16px rgba(15,23,42,.03), inset 0 1px 0 rgba(255,255,255,.84) !important;
}

:root.light #view-users .usersTableWrapV40,
html.light #view-users .usersTableWrapV40,
body.light #view-users .usersTableWrapV40{
  background:rgba(255,255,255,.88) !important;
  border:1px solid rgba(37,99,235,.14) !important;
  box-shadow:0 10px 22px rgba(15,23,42,.04), inset 0 1px 0 rgba(255,255,255,.84) !important;
}
:root.light #view-users .usersTableV40 th,
html.light #view-users .usersTableV40 th,
body.light #view-users .usersTableV40 th{
  background:linear-gradient(180deg, rgba(232,242,255,.96), rgba(223,238,252,.92)) !important;
  color:#475569 !important;
}
:root.light #view-users .usersTableV40 td,
html.light #view-users .usersTableV40 td,
body.light #view-users .usersTableV40 td{
  color:#0f172a !important;
  border-top:1px solid rgba(226,232,240,.84) !important;
}
:root.light #view-users .usersRowV40:hover,
html.light #view-users .usersRowV40:hover,
body.light #view-users .usersRowV40:hover{
  background:rgba(239,246,255,.90) !important;
}
:root.light #view-users .usersSubV40,
:root.light #view-users .usersReasonV40,
html.light #view-users .usersSubV40,
html.light #view-users .usersReasonV40,
body.light #view-users .usersSubV40,
body.light #view-users .usersReasonV40{
  color:#64748b !important;
}

:root.light #view-users .userChipV40.role-master,
html.light #view-users .userChipV40.role-master,
body.light #view-users .userChipV40.role-master{ color:#1d4ed8 !important; background:rgba(37,99,235,.10) !important; border-color:rgba(37,99,235,.18) !important; }
:root.light #view-users .userChipV40.role-gerente,
html.light #view-users .userChipV40.role-gerente,
body.light #view-users .userChipV40.role-gerente{ color:#0f766e !important; background:rgba(20,184,166,.10) !important; border-color:rgba(20,184,166,.18) !important; }
:root.light #view-users .userChipV40.role-secretaria,
html.light #view-users .userChipV40.role-secretaria,
body.light #view-users .userChipV40.role-secretaria{ color:#7c3aed !important; background:rgba(168,85,247,.10) !important; border-color:rgba(168,85,247,.18) !important; }
:root.light #view-users .userChipV40.role-crc,
html.light #view-users .userChipV40.role-crc,
body.light #view-users .userChipV40.role-crc{ color:#b45309 !important; background:rgba(245,158,11,.11) !important; border-color:rgba(245,158,11,.18) !important; }
:root.light #view-users .userChipV40.role-dentista,
html.light #view-users .userChipV40.role-dentista,
body.light #view-users .userChipV40.role-dentista{ color:#0f766e !important; background:rgba(16,185,129,.10) !important; border-color:rgba(16,185,129,.18) !important; }
:root.light #view-users .userChipV40.status-active,
html.light #view-users .userChipV40.status-active,
body.light #view-users .userChipV40.status-active{ color:#15803d !important; background:rgba(34,197,94,.10) !important; border-color:rgba(34,197,94,.18) !important; }
:root.light #view-users .userChipV40.status-pending,
html.light #view-users .userChipV40.status-pending,
body.light #view-users .userChipV40.status-pending{ color:#a16207 !important; background:rgba(245,158,11,.12) !important; border-color:rgba(245,158,11,.20) !important; }
:root.light #view-users .userChipV40.status-inactive,
html.light #view-users .userChipV40.status-inactive,
body.light #view-users .userChipV40.status-inactive{ color:#be123c !important; background:rgba(244,63,94,.10) !important; border-color:rgba(244,63,94,.18) !important; }

:root.light #view-users .usersMiniActionV40,
html.light #view-users .usersMiniActionV40,
body.light #view-users .usersMiniActionV40{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(241,248,255,.93)) !important;
  border-color:rgba(37,99,235,.16) !important;
  color:#1e3a8a !important;
  box-shadow:0 8px 14px rgba(15,23,42,.03), inset 0 1px 0 rgba(255,255,255,.84) !important;
}
:root.light #view-users .usersMiniActionV40.danger,
:root.light #view-users .miniBtn.danger.usersMiniActionV40,
html.light #view-users .usersMiniActionV40.danger,
html.light #view-users .miniBtn.danger.usersMiniActionV40,
body.light #view-users .usersMiniActionV40.danger,
body.light #view-users .miniBtn.danger.usersMiniActionV40{
  color:#be123c !important;
  background:linear-gradient(180deg, rgba(255,241,242,.98), rgba(255,228,230,.94)) !important;
  border-color:rgba(225,29,72,.22) !important;
}


/* === CRONOS V113 — Usuários: menos cinza, mais linguagem do sistema === */
:root.light #view-users .usersPanelV40,
html.light #view-users .usersPanelV40,
body.light #view-users .usersPanelV40{
  background:
    radial-gradient(700px 220px at 12% 0%, rgba(37,99,235,.10), transparent 72%),
    radial-gradient(520px 180px at 100% 0%, rgba(20,184,166,.08), transparent 76%),
    linear-gradient(180deg, rgba(250,253,255,.99), rgba(240,249,255,.96)) !important;
}
:root.light #view-users .usersTableWrapV40,
html.light #view-users .usersTableWrapV40,
body.light #view-users .usersTableWrapV40{
  background:
    linear-gradient(180deg, rgba(250,253,255,.98), rgba(241,248,255,.96)) !important;
  border:1px solid rgba(37,99,235,.16) !important;
}
:root.light #view-users .usersTableV40,
html.light #view-users .usersTableV40,
body.light #view-users .usersTableV40{
  background:transparent !important;
}
:root.light #view-users .usersTableV40 th,
html.light #view-users .usersTableV40 th,
body.light #view-users .usersTableV40 th{
  background:linear-gradient(180deg, rgba(220,236,255,.98), rgba(208,229,250,.93)) !important;
  color:#334155 !important;
  border-bottom:1px solid rgba(37,99,235,.12) !important;
}
:root.light #view-users .usersTableV40 td,
html.light #view-users .usersTableV40 td,
body.light #view-users .usersTableV40 td{
  background:rgba(247,251,255,.70) !important;
  color:#0f172a !important;
  border-top:1px solid rgba(216,228,242,.88) !important;
}
:root.light #view-users .usersTableV40 tbody tr:nth-child(even) td,
html.light #view-users .usersTableV40 tbody tr:nth-child(even) td,
body.light #view-users .usersTableV40 tbody tr:nth-child(even) td{
  background:rgba(242,248,255,.80) !important;
}
:root.light #view-users .usersRowV40:hover td,
html.light #view-users .usersRowV40:hover td,
body.light #view-users .usersRowV40:hover td{
  background:rgba(232,243,255,.96) !important;
}
:root.light #view-users .usersPanelV40 input,
:root.light #view-users .usersPanelV40 select,
html.light #view-users .usersPanelV40 input,
html.light #view-users .usersPanelV40 select,
body.light #view-users .usersPanelV40 input,
body.light #view-users .usersPanelV40 select{
  background:linear-gradient(180deg, rgba(255,255,255,.99), rgba(243,249,255,.95)) !important;
}
:root.light #view-users .usersRefreshBtnV40,
html.light #view-users .usersRefreshBtnV40,
body.light #view-users .usersRefreshBtnV40{
  background:linear-gradient(180deg, rgba(255,255,255,.99), rgba(235,245,255,.95)) !important;
}


/* =========================================================
   Cronos v439 — Login comercial responsivo
   ========================================================= */
.srOnly{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
#authView.authV439{
  min-height:100vh;
  padding:0;
  display:block;
  overflow:hidden;
  background:#07101f;
}
#authView.authV439.hidden{display:none!important}
.authShellV439{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);position:relative}
.authBrandPanelV439{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:72px clamp(46px,7vw,118px);background:radial-gradient(circle at 18% 18%,rgba(14,165,233,.22),transparent 34%),radial-gradient(circle at 72% 78%,rgba(46,230,166,.12),transparent 35%),linear-gradient(145deg,#071426 0%,#0b2442 55%,#082238 100%);color:#f8fbff;isolation:isolate}
.authBrandPanelV439:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to right,#000,transparent 85%);z-index:-2}
.authBrandGlowV439{position:absolute;width:540px;height:540px;border-radius:50%;left:-250px;top:-220px;background:radial-gradient(circle,rgba(14,165,233,.27),rgba(14,165,233,0) 68%);filter:blur(4px);z-index:-1}
.authOrbit{position:absolute;border:1px solid rgba(103,232,249,.12);border-radius:50%;z-index:-1;pointer-events:none}.authOrbitOne{width:620px;height:620px;right:-380px;bottom:-240px}.authOrbitTwo{width:390px;height:390px;right:-220px;bottom:-125px;border-color:rgba(46,230,166,.13)}
.authBrandContentV439{position:relative;z-index:2;max-width:700px}.authBrandLogoV439{display:block;margin:0 0 42px;filter:drop-shadow(0 12px 30px rgba(0,0,0,.25))}.authBrandLogoV439>img{display:block;width:clamp(340px,31vw,500px);max-width:100%;height:auto;object-fit:contain}.authBrandEyebrowV439{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:900;letter-spacing:.19em;color:#67e8f9;margin-bottom:17px}.authBrandEyebrowV439:before{content:"";width:28px;height:2px;border-radius:99px;background:linear-gradient(90deg,#38bdf8,#2ee6a6)}.authBrandContentV439 h1{font-size:clamp(38px,4.7vw,70px);line-height:1.02;letter-spacing:-.045em;margin:0 0 22px;font-weight:900;max-width:760px}.authBrandContentV439 h1 span{background:linear-gradient(90deg,#67e8f9 0%,#2ee6a6 70%);-webkit-background-clip:text;background-clip:text;color:transparent}.authBrandContentV439>p{font-size:clamp(16px,1.5vw,20px);line-height:1.65;color:rgba(229,240,255,.76);max-width:640px;margin:0 0 38px}.authBenefitsV439{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;max-width:780px}.authBenefitV439{display:flex;align-items:flex-start;gap:12px;padding:15px;border:1px solid rgba(148,215,255,.13);background:rgba(6,18,35,.42);border-radius:18px;backdrop-filter:blur(10px)}.authBenefitIconV439{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:#67e8f9;background:linear-gradient(145deg,rgba(56,189,248,.17),rgba(46,230,166,.09));border:1px solid rgba(103,232,249,.18);flex:0 0 auto}.authBenefitIconV439 svg{width:21px;height:21px}.authBenefitV439 b{display:block;font-size:13px;color:#f4faff;margin:1px 0 4px}.authBenefitV439 small{display:block;font-size:11px;line-height:1.45;color:rgba(218,232,248,.62)}.authBrandFooterV439{position:absolute;left:clamp(46px,7vw,118px);bottom:26px;font-size:11px;color:rgba(207,224,242,.47);letter-spacing:.04em}.authBrandFooterV439 span{color:#2ee6a6;margin:0 4px}
.authAccessPanelV439{display:grid;place-items:center;padding:64px clamp(28px,5vw,82px);position:relative;background:radial-gradient(circle at 82% 15%,rgba(14,165,233,.11),transparent 28%),linear-gradient(160deg,#0b1423 0%,#0a1220 100%)}.authAccessPanelV439:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(56,189,248,.035),transparent 22%)}.authThemeV439{position:absolute;right:24px;top:24px;z-index:8;background:rgba(255,255,255,.045);border-color:rgba(148,215,255,.16)}
#authView .authCardV439{position:relative;z-index:2;width:min(500px,100%);padding:clamp(26px,4vw,42px);border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022)),#0d1929;border:1px solid rgba(148,215,255,.14);box-shadow:0 36px 90px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.05)}.authWelcomeV439{display:flex;align-items:center;gap:15px;margin-bottom:28px}.authWelcomeMarkV439{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(56,189,248,.16),rgba(46,230,166,.10));border:1px solid rgba(103,232,249,.16);box-shadow:0 12px 30px rgba(2,132,199,.12)}.authWelcomeMarkV439 img{width:34px;height:34px;object-fit:contain}.authWelcomeKickerV439{font-size:10px;font-weight:900;letter-spacing:.16em;color:#67e8f9;margin-bottom:5px}.authWelcomeV439 h2{font-size:27px;line-height:1.1;margin:0 0 5px;letter-spacing:-.025em}.authWelcomeV439 p{margin:0;color:var(--muted);font-size:13px}.authLoginGridV439{grid-template-columns:1fr!important;gap:15px}.authCardV439 label{font-size:12px;font-weight:800;letter-spacing:.015em;margin-bottom:7px}.authCardV439 input,.authCardV439 select{min-height:50px;border-radius:15px;background:rgba(5,13,24,.56);border-color:rgba(148,215,255,.13);padding-left:15px}.authCardV439 input:focus,.authCardV439 select:focus{border-color:rgba(56,189,248,.65);box-shadow:0 0 0 4px rgba(14,165,233,.11)}.authCardV439 .authPassToggle{bottom:11px;right:14px}.authActionsV439{display:flex;gap:10px;margin-top:20px}.authActionsV439 #btnLogin{width:100%;flex:1;min-height:52px!important;border-radius:15px!important}.authHelpToggleV439{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;margin-top:16px;border:0;background:transparent;color:#8bdaf5;font-size:12px;font-weight:800;cursor:pointer;padding:8px}.authHelpToggleV439 svg{width:15px;height:15px;transition:transform .2s ease}.authHelpToggleV439[aria-expanded="true"] svg{transform:rotate(90deg)}.authHelpPanelV439{margin-top:5px;padding:13px 14px;border-radius:14px;background:rgba(14,165,233,.075);border:1px solid rgba(56,189,248,.14);font-size:12px;line-height:1.5;color:var(--muted)}.authHelpPanelV439 b{display:block;color:var(--text);margin-bottom:3px}.authHelpPanelV439 p{margin:0}.authSecurityV439{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:17px;color:rgba(184,207,230,.52);font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:800}.authSecurityV439 svg{width:14px;height:14px}.authCardV439 .authStatus{margin-top:14px}
:root.light #authView.authV439{background:#eef5fb}.light .authAccessPanelV439{background:radial-gradient(circle at 80% 10%,rgba(14,165,233,.10),transparent 28%),#f4f8fc}.light #authView .authCardV439{background:rgba(255,255,255,.96);border-color:rgba(28,91,135,.12);box-shadow:0 30px 80px rgba(20,55,86,.15)}.light .authCardV439 input,.light .authCardV439 select{background:#f7fafc;border-color:rgba(28,91,135,.14)}.light .authThemeV439{background:rgba(255,255,255,.8);border-color:rgba(28,91,135,.14)}
#view-users .usersMiniActionV40.password{color:#8ee9ff;border-color:rgba(56,189,248,.30);background:rgba(56,189,248,.08)}
.passwordResetNoticeV439{padding:12px 14px;border-radius:14px;background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.17);font-size:12px;line-height:1.5;color:var(--muted)}
.passwordResetNoticeV439 b{color:var(--text)}
@media(max-width:1100px){.authShellV439{grid-template-columns:minmax(0,1fr) minmax(390px,.9fr)}.authBrandPanelV439{padding:62px 42px}.authBenefitsV439{grid-template-columns:1fr}.authBenefitV439:nth-child(3){display:none}.authBrandFooterV439{left:42px}.authBrandContentV439 h1{font-size:46px}}
@media(max-width:820px){#authView.authV439{overflow:auto}.authShellV439{display:block}.authBrandPanelV439{min-height:310px;padding:46px 28px 42px;justify-content:flex-start}.authBrandLogoV439{margin-bottom:28px}.authBrandLogoV439>img{width:min(430px,86vw);height:auto}.authBrandContentV439 h1{font-size:38px;max-width:560px}.authBrandContentV439>p{font-size:15px;margin-bottom:0}.authBenefitsV439,.authBrandFooterV439{display:none}.authAccessPanelV439{padding:30px 18px 48px;min-height:auto}.authThemeV439{top:17px;right:17px}}
@media(max-width:520px){.authBrandPanelV439{min-height:250px;padding:35px 20px 30px}.authBrandLogoV439{margin-bottom:20px}.authBrandLogoV439>img{width:min(340px,91vw);height:auto}.authBrandEyebrowV439{font-size:9px}.authBrandContentV439 h1{font-size:31px}.authBrandContentV439>p{font-size:13px;line-height:1.55}.authAccessPanelV439{padding:22px 12px 34px}#authView .authCardV439{padding:24px 18px;border-radius:22px}.authWelcomeMarkV439{display:none}.authWelcomeV439 h2{font-size:24px}}


/* =========================================================
   Cronos v442 — página de login com tema escuro fixo
   A preferência claro/escuro continua disponível dentro do sistema.
   ========================================================= */
#authView.authV439{
  --bg:#07101f;
  --panel:#0d1929;
  --panel2:#101f33;
  --text:#eef6ff;
  --muted:#9cb3d9;
  --line:rgba(148,215,255,.14);
  --accent:#38bdf8;
  color:#eef6ff;
  color-scheme:dark;
  background:#07101f!important;
}
#authView .authThemeV439{display:none!important}

/* Neutraliza exclusivamente no login as regras globais do modo claro. */
:root.light #authView.authV439,
html.light #authView.authV439,
body.light #authView.authV439{
  background:#07101f!important;
  color:#eef6ff!important;
}
:root.light #authView .authAccessPanelV439,
html.light #authView .authAccessPanelV439,
body.light #authView .authAccessPanelV439{
  background:
    radial-gradient(circle at 82% 15%,rgba(14,165,233,.11),transparent 28%),
    linear-gradient(160deg,#0b1423 0%,#0a1220 100%)!important;
  color:#eef6ff!important;
}
:root.light #authView .authCardV439,
html.light #authView .authCardV439,
body.light #authView .authCardV439{
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022)),#0d1929!important;
  border-color:rgba(148,215,255,.14)!important;
  box-shadow:0 36px 90px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.05)!important;
  color:#eef6ff!important;
}
#authView .authBrandContentV439 h1,
:root.light #authView .authBrandContentV439 h1,
html.light #authView .authBrandContentV439 h1,
body.light #authView .authBrandContentV439 h1{
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
}
#authView .authBrandContentV439 h1 span,
:root.light #authView .authBrandContentV439 h1 span,
html.light #authView .authBrandContentV439 h1 span,
body.light #authView .authBrandContentV439 h1 span{
  background:linear-gradient(90deg,#67e8f9 0%,#2ee6a6 70%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}
#authView .authWelcomeV439 h2,
#authView .authCardV439 label,
#authView .authHelpPanelV439 b{
  color:#eef6ff!important;
  -webkit-text-fill-color:#eef6ff!important;
}
#authView .authWelcomeV439 p,
#authView .authHelpPanelV439,
#authView .authCardV439 .authStatus{
  color:#9cb3d9!important;
}
:root.light #authView .authCardV439 input,
:root.light #authView .authCardV439 select,
html.light #authView .authCardV439 input,
html.light #authView .authCardV439 select,
body.light #authView .authCardV439 input,
body.light #authView .authCardV439 select,
#authView .authCardV439 input,
#authView .authCardV439 select{
  background:rgba(5,13,24,.56)!important;
  border-color:rgba(148,215,255,.13)!important;
  color:#eef6ff!important;
  -webkit-text-fill-color:#eef6ff!important;
  color-scheme:dark;
}
#authView .authCardV439 input::placeholder{
  color:rgba(202,218,238,.58)!important;
  -webkit-text-fill-color:rgba(202,218,238,.58)!important;
  opacity:1;
}
#authView .authCardV439 select option{
  background:#101f33!important;
  color:#eef6ff!important;
}
#authView .authPassToggle{color:#9cb3d9!important}
#authView .authPassToggle:hover{color:#eef6ff!important}
#authView .authHelpToggleV439{color:#8bdaf5!important}
#authView .authSecurityV439{color:rgba(184,207,230,.52)!important}