/* ADV Studio — skin "Vidro" (liquid glass), etapa 1 — 29/10/2026.
   Camada de VISUAL por cima do painel: só cores, superfícies, botões, campos e sombras.
   Nada aqui muda fluxo, HTML ou funções. Tudo escopado em html[data-skin="vidro"] e ligado por
   /assets/vidro/skin.js (?skin=vidro liga, ?skin=off desliga). Tons: data-tone amarelo | azul | vermelho.
   Referência: docs/redesign-2026-10/06-vidro-claro-v2.html (preview aprovado pelo Daniel). */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Barlow+Condensed:wght@600;700;800&display=swap');

/* ---------- tokens: o painel inteiro lê daqui ---------- */
html[data-skin="vidro"]{
  --vd-bg:#efe1b8; --vd-b1:#fbd25c; --vd-b2:#ffb27a; --vd-b3:#f08a7a; --vd-b4:#fff7e0; --vd-b5:#f6cf6a; --vd-bo:.8;
  --vd-glass:rgba(255,255,255,.38); --vd-glass-hi:rgba(255,255,255,.8); --vd-glass-b:rgba(255,255,255,.7);
  --vd-sheen1:rgba(255,255,255,.6); --vd-sheen2:rgba(255,255,255,.1); --vd-sheen3:rgba(255,255,255,.3);
  --vd-sub:rgba(255,255,255,.42); --vd-sub-b:rgba(255,255,255,.55); --vd-sub2:rgba(0,0,0,.05);
  --vd-shadow:0 24px 54px -26px rgba(60,30,0,.45);
  --vd-yellow:#fcc10a; --vd-red:#e62f1f; --vd-ok:#1c8a6d;
  --vd-ff:"Montserrat","Geist","Inter",-apple-system,sans-serif; --vd-cond:"Barlow Condensed","Montserrat",sans-serif;
  /* tokens do painel */
  --bg-0:transparent; --bg-1:var(--vd-glass); --bg-2:var(--vd-sub); --bg-3:rgba(255,255,255,.6);
  --ink-0:#141414; --ink-1:#3a352c; --ink-2:rgba(20,20,20,.62); --ink-3:rgba(20,20,20,.42);
  --line:rgba(0,0,0,.09); --line-soft:rgba(0,0,0,.06);
  --accent:#141414; --accent-hot:#000; --accent-light:rgba(252,193,10,.28);
  --today-bg:rgba(252,193,10,.16); --today-line:#fcc10a;
  --st-pago:#1c8a6d; --st-sinal:#8a6400; --st-pendente:#c2271a;
  --shadow:0 10px 30px -18px rgba(60,30,0,.35); --shadow-lg:var(--vd-shadow);
  --radius-sm:10px; --radius-md:14px; --radius-lg:20px; --radius-xl:28px;
  --ff-ui:var(--vd-ff);
  --tag-vip:#8a6400; --tag-recorrente:#1c8a6d; --tag-novo:#2b5fc2; --tag-inativo:rgba(20,20,20,.45); --tag-aniver:#b8245e;
}
html[data-skin="vidro"][data-tone="azul"]{
  --vd-bg:#1c2846; --vd-b1:#e9b93a; --vd-b2:#3b6fd6; --vd-b3:#0e1430; --vd-b4:#5a8fe8; --vd-b5:#c8463a; --vd-bo:.75;
  --vd-glass:rgba(255,255,255,.12); --vd-glass-hi:rgba(28,40,70,.86); --vd-glass-b:rgba(255,255,255,.26);
  --vd-sheen1:rgba(255,255,255,.22); --vd-sheen2:rgba(255,255,255,.04); --vd-sheen3:rgba(255,255,255,.1);
  --vd-sub:rgba(255,255,255,.12); --vd-sub-b:rgba(255,255,255,.2); --vd-sub2:rgba(255,255,255,.08);
  --vd-shadow:0 24px 54px -26px rgba(0,0,0,.7);
  --bg-1:var(--vd-glass); --bg-2:var(--vd-sub); --bg-3:rgba(255,255,255,.2);
  --ink-0:#f6f4ee; --ink-1:#d8d4c8; --ink-2:rgba(246,244,238,.64); --ink-3:rgba(246,244,238,.42);
  --line:rgba(255,255,255,.12); --line-soft:rgba(255,255,255,.08);
  --accent:#fff; --accent-hot:#fff; --today-bg:rgba(252,193,10,.14);
  --st-pago:#7fe0c3; --st-sinal:#ffd45c; --st-pendente:#ff9a90;
  --tag-vip:#ffd45c; --tag-recorrente:#7fe0c3; --tag-novo:#9fc4ec; --tag-inativo:rgba(246,244,238,.4); --tag-aniver:#ff9ac0;
}
html[data-skin="vidro"][data-tone="vermelho"]{ --vd-bg:#f3d5c2; --vd-b1:#ef7a68; --vd-b2:#fbd25c; --vd-b3:#b5473a; --vd-b4:#ffe9d8; --vd-b5:#ffb27a; --vd-shadow:0 24px 54px -26px rgba(90,10,0,.5) }

/* ---------- fundo de cor atrás de tudo; o vidro deixa passar ---------- */
html[data-skin="vidro"], html[data-skin="vidro"] body{background:var(--vd-bg)!important;color:var(--ink-0)}
html[data-skin="vidro"] body{font-family:var(--vd-ff)}
html[data-skin="vidro"] .vd-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--vd-bg);pointer-events:none}
/* 30/10: manchas paradas. Em movimento, cada painel de vidro refazia o desfoque a cada quadro (≈22 fps parado, troca de tela 2x mais lenta) */
html[data-skin="vidro"] .vd-bg i{position:absolute;border-radius:50%;opacity:var(--vd-bo)}
html[data-skin="vidro"] .vd-bg .b1{width:95vmax;height:95vmax;left:-32vmax;top:-48vmax;background:radial-gradient(circle,var(--vd-b1) 0%,var(--vd-b1) 16%,transparent 62%)}
html[data-skin="vidro"] .vd-bg .b2{width:85vmax;height:85vmax;right:-32vmax;bottom:-38vmax;background:radial-gradient(circle,var(--vd-b2) 0%,transparent 60%)}
html[data-skin="vidro"] .vd-bg .b3{width:60vmax;height:60vmax;right:0;top:-28vmax;background:radial-gradient(circle,var(--vd-b3) 0%,transparent 60%)}
html[data-skin="vidro"] .vd-bg .b4{width:64vmax;height:64vmax;left:18vmax;top:4vmax;background:radial-gradient(circle,var(--vd-b4) 0%,transparent 60%)}
html[data-skin="vidro"] .vd-bg .b5{width:50vmax;height:50vmax;left:-14vmax;bottom:-22vmax;background:radial-gradient(circle,var(--vd-b5) 0%,transparent 60%)}
html[data-skin="vidro"] .app{background:transparent!important;position:relative;z-index:1}
html[data-skin="vidro"] .main,html[data-skin="vidro"] .page-content,html[data-skin="vidro"] .calendar-container,html[data-skin="vidro"] .page-body{background:transparent!important}

/* ---------- a receita do vidro ---------- */
html[data-skin="vidro"] .sidebar,
html[data-skin="vidro"] .header,
html[data-skin="vidro"] .dash-v2 .dash-topbar,html[data-skin="vidro"] .cli-v2 .clv-topbar,html[data-skin="vidro"] .equipe-v2 .eqv-topbar,
html[data-skin="vidro"] .card,html[data-skin="vidro"] .agenda-card,html[data-skin="vidro"] .kpi,html[data-skin="vidro"] .clv-kpi,html[data-skin="vidro"] .eqv-kpi,html[data-skin="vidro"] .pd-kpi,html[data-skin="vidro"] .summary-card,html[data-skin="vidro"] .kpi-mini,html[data-skin="vidro"] .set-block,html[data-skin="vidro"] .int-card,html[data-skin="vidro"] .tpl-card,html[data-skin="vidro"] .equipe-v2 .pcard,html[data-skin="vidro"] .estoque-kpis>*,
html[data-skin="vidro"] .ctx-panel,html[data-skin="vidro"] .eqv-ctx-menu,html[data-skin="vidro"] .agp-pop,html[data-skin="vidro"] .tweaks-panel,
html[data-skin="vidro"] .login-card,html[data-skin="vidro"] .login-overlay>div{
  background:linear-gradient(118deg,var(--vd-sheen1) 0%,var(--vd-sheen2) 34%,transparent 58%,var(--vd-sheen3) 100%),var(--vd-glass)!important;
  -webkit-backdrop-filter:blur(24px) saturate(185%);backdrop-filter:blur(24px) saturate(185%);
  border:1px solid var(--vd-glass-b)!important;
  box-shadow:var(--vd-shadow),inset 0 1px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(255,255,255,.25)!important;
  border-radius:var(--radius-xl)!important;color:var(--ink-0);
}
html[data-skin="vidro"][data-tone="azul"] .sidebar,html[data-skin="vidro"][data-tone="azul"] .card,html[data-skin="vidro"][data-tone="azul"] .kpi,html[data-skin="vidro"][data-tone="azul"] .header{box-shadow:var(--vd-shadow),inset 0 1px 0 rgba(255,255,255,.28)!important}
/* abas laterais e modais: vidro mais fechado para ler bem */
html[data-skin="vidro"] .drawer,html[data-skin="vidro"] .client-drawer,html[data-skin="vidro"] .napp-drawer,html[data-skin="vidro"] .notif-panel,html[data-skin="vidro"] .artist-drawer,html[data-skin="vidro"] .cycle-drawer,html[data-skin="vidro"] .ecm-detail,html[data-skin="vidro"] .pvx-drawer,
html[data-skin="vidro"] .modal,html[data-skin="vidro"] .ap-modal,html[data-skin="vidro"] .adv-modal,html[data-skin="vidro"] .ap-pay-modal,html[data-skin="vidro"] .ap-pix-modal,html[data-skin="vidro"] .cmdk,html[data-skin="vidro"] .cmdk-panel,html[data-skin="vidro"] .napp-picker,html[data-skin="vidro"] .napp-qc,html[data-skin="vidro"] .ap-wa-popover,html[data-skin="vidro"] .ap-wa-preview{
  background:linear-gradient(118deg,var(--vd-sheen1) 0%,var(--vd-sheen2) 34%,transparent 58%,var(--vd-sheen3) 100%),var(--vd-glass-hi)!important;
  -webkit-backdrop-filter:blur(28px) saturate(185%);backdrop-filter:blur(28px) saturate(185%);
  border:1px solid var(--vd-glass-b)!important;box-shadow:var(--vd-shadow),inset 0 1px 0 rgba(255,255,255,.85)!important;color:var(--ink-0);
  font-family:var(--vd-ff)!important;
}
html[data-skin="vidro"] .drawer,html[data-skin="vidro"] .client-drawer,html[data-skin="vidro"] .napp-drawer,html[data-skin="vidro"] .notif-panel,html[data-skin="vidro"] .artist-drawer{top:12px!important;bottom:12px!important;height:auto!important;border-radius:28px!important}
html[data-skin="vidro"] .drawer.open{right:12px!important}
html[data-skin="vidro"] .client-drawer,html[data-skin="vidro"] .napp-drawer,html[data-skin="vidro"] .notif-panel,html[data-skin="vidro"] .artist-drawer{right:12px!important}
html[data-skin="vidro"] .modal,html[data-skin="vidro"] .ap-modal,html[data-skin="vidro"] .adv-modal{border-radius:28px!important}
html[data-skin="vidro"] .drawer-overlay,html[data-skin="vidro"] .client-drawer-overlay,html[data-skin="vidro"] .modal-overlay,html[data-skin="vidro"] .ap-modal-overlay,html[data-skin="vidro"] .notif-overlay,html[data-skin="vidro"] .napp-overlay,html[data-skin="vidro"] .adv-modal-overlay,html[data-skin="vidro"] .ap-pay-overlay,html[data-skin="vidro"] .ap-pix-overlay,html[data-skin="vidro"] .cmdk-overlay,html[data-skin="vidro"] .pvx-scrim{background:rgba(20,16,0,.28)!important;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
@media (prefers-reduced-transparency:reduce){html[data-skin="vidro"] .sidebar,html[data-skin="vidro"] .card,html[data-skin="vidro"] .kpi,html[data-skin="vidro"] .header,html[data-skin="vidro"] .drawer,html[data-skin="vidro"] .modal{background:rgba(255,250,236,.96)!important;-webkit-backdrop-filter:none;backdrop-filter:none}}

/* ---------- trilho lateral: pílula estreita, ativo em círculo preto, badge vermelho ---------- */
html[data-skin="vidro"] .sidebar{margin:12px 0 12px 12px;height:calc(100vh - 24px);border-right:0!important;border-radius:30px!important;padding:10px 0;display:flex;flex-direction:column;align-items:center;gap:4px;width:var(--sidebar-w)}
html[data-skin="vidro"] .sidebar-logo{width:40px!important;height:40px!important;border-radius:50%!important;background-size:cover!important;margin:4px 0 8px!important;box-shadow:0 0 0 2px rgba(255,255,255,.7)}
html[data-skin="vidro"] .sidebar-nav{display:flex;flex-direction:column;align-items:center;gap:3px;flex:1;justify-content:center;width:100%}
html[data-skin="vidro"] .sidebar-bottom{display:flex;flex-direction:column;align-items:center;gap:4px;padding-bottom:4px}
html[data-skin="vidro"] .nav-item{width:44px!important;height:44px!important;border-radius:50%!important;display:grid!important;place-items:center;color:var(--ink-0)!important;opacity:.74;background:transparent!important;margin:0!important;transition:.15s}
html[data-skin="vidro"] .nav-item:hover{background:var(--vd-sub)!important;opacity:1}
html[data-skin="vidro"] .nav-item.active{background:var(--ink-0)!important;color:var(--vd-bg)!important;opacity:1;box-shadow:0 8px 18px -8px rgba(0,0,0,.6)}
html[data-skin="vidro"][data-tone="azul"] .nav-item.active{background:#fff!important;color:#000!important}
html[data-skin="vidro"] .nav-item.active::before{display:none!important}
html[data-skin="vidro"] .nav-item svg{width:21px;height:21px;stroke-width:1.8}
html[data-skin="vidro"] .nav-item .tooltip{left:54px;background:var(--ink-0);color:var(--vd-bg);border-radius:10px;font-weight:600;font-family:var(--vd-ff)}
html[data-skin="vidro"] .nav-badge,html[data-skin="vidro"] .hub-badge{background:var(--vd-red)!important;color:#fff!important;border:2px solid #fff;border-radius:9px;min-width:18px;height:18px;font-size:10px;font-weight:700;top:-2px;right:-4px}
html[data-skin="vidro"] .sidebar-avatar{background:var(--ink-0)!important;color:var(--vd-bg)!important;border-radius:50%!important;font-family:var(--vd-ff)}

/* ---------- barras de cima ---------- */
html[data-skin="vidro"] .header{margin:12px 12px 0 0;height:66px!important;border-radius:24px!important;padding:0 12px 0 16px!important}
html[data-skin="vidro"] .dash-v2 .dash-topbar,html[data-skin="vidro"] .cli-v2 .clv-topbar,html[data-skin="vidro"] .equipe-v2 .eqv-topbar{margin:12px 12px 10px 0;border-radius:24px!important;padding:10px 16px!important}
html[data-skin="vidro"] .page-header{background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none}
html[data-skin="vidro"] .page-title,html[data-skin="vidro"] .dash-topbar h1,html[data-skin="vidro"] .dash-topbar .title,html[data-skin="vidro"] .clv-topbar h1,html[data-skin="vidro"] .eqv-topbar h1{font-family:var(--vd-cond)!important;font-size:32px!important;font-weight:700!important;letter-spacing:-.01em;line-height:1;color:var(--ink-0)}
html[data-skin="vidro"] .top-search,html[data-skin="vidro"] .clv-search,html[data-skin="vidro"] .eqv-search,html[data-skin="vidro"] .search-input,html[data-skin="vidro"] .cmdk-input{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:999px!important;color:var(--ink-0)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
html[data-skin="vidro"] .date-label,html[data-skin="vidro"] #dateLabel{font-family:var(--vd-cond);font-size:26px;font-weight:700;letter-spacing:-.01em}
html[data-skin="vidro"] .view-selector,html[data-skin="vidro"] .seg,html[data-skin="vidro"] .eqv-tabbar,html[data-skin="vidro"] .subnav{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:999px!important;padding:3px!important}
html[data-skin="vidro"] .view-btn,html[data-skin="vidro"] .seg-btn,html[data-skin="vidro"] .eqv-tab,html[data-skin="vidro"] .subnav-tab{border-radius:999px!important;color:var(--ink-2)!important;font-weight:600;background:transparent!important;border:0!important}
html[data-skin="vidro"] .view-btn.active,html[data-skin="vidro"] .seg-btn.active,html[data-skin="vidro"] .eqv-tab.on,html[data-skin="vidro"] .subnav-tab.active{background:var(--ink-0)!important;color:var(--vd-bg)!important;box-shadow:0 2px 6px rgba(0,0,0,.12)}
html[data-skin="vidro"][data-tone="azul"] .view-btn.active,html[data-skin="vidro"][data-tone="azul"] .seg-btn.active,html[data-skin="vidro"][data-tone="azul"] .subnav-tab.active{background:#fff!important;color:#000!important}

/* ---------- botões ---------- */
html[data-skin="vidro"] .btn,html[data-skin="vidro"] .btn-ghost,html[data-skin="vidro"] .btn-today,html[data-skin="vidro"] .icon-btn,html[data-skin="vidro"] .btn-icon,html[data-skin="vidro"] .nav-arrow,html[data-skin="vidro"] .clv-icbtn,html[data-skin="vidro"] .filter-dropdown{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:999px!important;color:var(--ink-0)!important;font-weight:600;font-family:var(--vd-ff);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
html[data-skin="vidro"] .btn-primary,html[data-skin="vidro"] .btn-add,html[data-skin="vidro"] .clv-btn-add,html[data-skin="vidro"] .eqv-btn-add{background:var(--ink-0)!important;color:var(--vd-bg)!important;border-color:transparent!important;box-shadow:0 10px 24px -12px rgba(0,0,0,.5)!important}
html[data-skin="vidro"][data-tone="azul"] .btn-primary,html[data-skin="vidro"][data-tone="azul"] .btn-add{background:#fff!important;color:#000!important}
html[data-skin="vidro"] .btn-pend,html[data-skin="vidro"] .btn-warn{background:var(--vd-yellow)!important;color:#000!important;border-color:transparent!important}
html[data-skin="vidro"] .btn-danger{background:var(--vd-red)!important;color:#fff!important;border-color:transparent!important}
html[data-skin="vidro"] .btn-link{background:transparent!important;border:0!important;box-shadow:none!important;color:var(--ink-0)!important}

/* ---------- campos ---------- */
html[data-skin="vidro"] .form-input,html[data-skin="vidro"] select.form-input,html[data-skin="vidro"] textarea.form-input,html[data-skin="vidro"] .am-input,html[data-skin="vidro"] .am-select,html[data-skin="vidro"] .am-textarea,html[data-skin="vidro"] .napp-drawer input,html[data-skin="vidro"] .napp-drawer select,html[data-skin="vidro"] .napp-drawer textarea{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:12px!important;color:var(--ink-0)!important;font-family:var(--vd-ff)}
html[data-skin="vidro"] .form-input:focus,html[data-skin="vidro"] .am-input:focus{border-color:var(--ink-0)!important;box-shadow:0 0 0 3px rgba(252,193,10,.35)!important}
html[data-skin="vidro"] .form-label{color:var(--ink-2);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700}
html[data-skin="vidro"] .toggle input:checked+span{background:var(--ink-0)!important}
html[data-skin="vidro"] .radio-pills .pill,html[data-skin="vidro"] .chip,html[data-skin="vidro"] .clv-chip{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:999px!important;color:var(--ink-0)!important}
html[data-skin="vidro"] .radio-pills .pill.checked,html[data-skin="vidro"] .chip.active,html[data-skin="vidro"] .clv-chip.on{background:var(--ink-0)!important;color:var(--vd-bg)!important;border-color:transparent!important}

/* ---------- cards, listas, tabelas ---------- */
html[data-skin="vidro"] .card,html[data-skin="vidro"] .agenda-card,html[data-skin="vidro"] .equipe-v2 .pcard,html[data-skin="vidro"] .set-block,html[data-skin="vidro"] .int-card,html[data-skin="vidro"] .tpl-card{border-radius:24px!important}
html[data-skin="vidro"] .kpi,html[data-skin="vidro"] .clv-kpi,html[data-skin="vidro"] .eqv-kpi,html[data-skin="vidro"] .pd-kpi,html[data-skin="vidro"] .summary-card,html[data-skin="vidro"] .kpi-mini{border-radius:22px!important}
html[data-skin="vidro"] .kpi-label,html[data-skin="vidro"] .card-head h3,html[data-skin="vidro"] .card-head h2,html[data-skin="vidro"] .card-title{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
html[data-skin="vidro"] .kpi-value,html[data-skin="vidro"] .big-mono{font-family:var(--vd-ff)!important;font-weight:800;letter-spacing:-.03em;color:var(--ink-0)}
html[data-skin="vidro"] .dth-item,html[data-skin="vidro"] .top-item,html[data-skin="vidro"] .alert,html[data-skin="vidro"] .notif-item,html[data-skin="vidro"] .cmdk-result,html[data-skin="vidro"] .ap-fila-row,html[data-skin="vidro"] .clv-row,html[data-skin="vidro"] .estoque-tr,html[data-skin="vidro"] .ecm-row{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:14px!important;color:var(--ink-0)}
html[data-skin="vidro"] .clv-row.head{background:transparent!important;border:0!important}
html[data-skin="vidro"] .table th{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);border-bottom:1px solid var(--line)}
html[data-skin="vidro"] .table td{border-bottom:1px solid var(--line);color:var(--ink-0)}
html[data-skin="vidro"] .skeleton{background:var(--vd-sub)!important}

/* ---------- chips de estado (cores por tom) ---------- */
html[data-skin="vidro"] .badge,html[data-skin="vidro"] .tag,html[data-skin="vidro"] .status-badge,html[data-skin="vidro"] .appt-status-pill,html[data-skin="vidro"] .unit-badge,html[data-skin="vidro"] .ap-fila-tag,html[data-skin="vidro"] .ficha-badge{border-radius:999px!important;font-weight:600;font-size:11px;padding:3px 9px;border:0!important}
html[data-skin="vidro"] .appt-status-pill.pago,html[data-skin="vidro"] .status-finalizado,html[data-skin="vidro"] .badge-green{background:rgba(47,174,143,.16)!important;color:var(--st-pago)!important}
html[data-skin="vidro"] .appt-status-pill.sinal,html[data-skin="vidro"] .badge-orange,html[data-skin="vidro"] .status-andamento{background:rgba(252,193,10,.3)!important;color:var(--st-sinal)!important}
html[data-skin="vidro"] .appt-status-pill.pendente,html[data-skin="vidro"] .status-cancelado,html[data-skin="vidro"] .badge-accent{background:rgba(230,47,31,.14)!important;color:var(--st-pendente)!important}
html[data-skin="vidro"] .status-agendado,html[data-skin="vidro"] .status-confirmado,html[data-skin="vidro"] .badge-blue{background:rgba(59,111,214,.14)!important;color:#2b5fc2!important}
html[data-skin="vidro"][data-tone="azul"] .status-agendado,html[data-skin="vidro"][data-tone="azul"] .badge-blue{color:#9fc4ec!important}
html[data-skin="vidro"] .unit-badge.unit-vila_mariana{background:rgba(127,164,210,.3)!important;color:#2d5f8a!important}
html[data-skin="vidro"] .unit-badge.unit-osasco{background:rgba(212,176,106,.35)!important;color:#7a5a12!important}

/* ---------- agenda ---------- */
html[data-skin="vidro"] .cal-grid,html[data-skin="vidro"] .cal-headcell,html[data-skin="vidro"] .cal-tat-cell,html[data-skin="vidro"] .cal-slot{background:transparent!important}
html[data-skin="vidro"] .cal-headcell,html[data-skin="vidro"] .cal-tat-cell{background:var(--vd-sub)!important;border-color:var(--line)!important;color:var(--ink-0)!important;font-family:var(--vd-ff)}
html[data-skin="vidro"] .cal-appt,html[data-skin="vidro"] .appt,html[data-skin="vidro"] .appt-block{background:rgba(255,255,255,.62)!important;border:1px solid rgba(255,255,255,.7)!important;border-left:4px solid var(--c,var(--pro,var(--vd-yellow)))!important;border-radius:12px!important;box-shadow:0 4px 12px -8px rgba(0,0,0,.25)!important;color:var(--ink-0)!important}
html[data-skin="vidro"][data-tone="azul"] .cal-appt,html[data-skin="vidro"][data-tone="azul"] .appt,html[data-skin="vidro"][data-tone="azul"] .appt-block{background:rgba(255,255,255,.14)!important;border-color:rgba(255,255,255,.2)!important}
html[data-skin="vidro"] .agenda-kpis .kpi-mini{padding:12px 16px}
html[data-skin="vidro"] .cal-today,html[data-skin="vidro"] .is-today{background:var(--today-bg)!important}

/* ---------- notificações e toast ---------- */
html[data-skin="vidro"] .notif-count-pill{background:var(--vd-red)!important;color:#fff!important;border-radius:999px}
html[data-skin="vidro"] .notif-ico{width:38px;height:38px;border-radius:12px;background:#141414;color:#fff;display:grid;place-items:center;font-size:17px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 14px -8px rgba(0,0,0,.55)}
html[data-skin="vidro"] .toast{background:rgba(20,20,20,.92)!important;color:#fff!important;border-radius:14px!important;font-family:var(--vd-ff);box-shadow:0 10px 30px rgba(0,0,0,.3)!important}

/* ---------- login (PIN) ---------- */
html[data-skin="vidro"] .login-overlay{background:radial-gradient(70% 55% at 6% 0%,var(--vd-b1),transparent 60%),radial-gradient(50% 45% at 100% 100%,var(--vd-b2),transparent 60%),radial-gradient(40% 40% at 90% 5%,var(--vd-b3),transparent 60%),var(--vd-bg)!important}
html[data-skin="vidro"] .login-card .login-logo{background:var(--ink-0)!important;color:var(--vd-bg)!important;border-radius:18px!important}
html[data-skin="vidro"] .login-card input{background:var(--vd-sub)!important;border:1px solid var(--vd-sub-b)!important;border-radius:14px!important;color:var(--ink-0)!important}
/* fechados, os painéis que escondem por translateX precisam sumir inteiros (têm 12px de margem) */
html[data-skin="vidro"] .client-drawer:not(.open),html[data-skin="vidro"] .notif-panel:not(.open),html[data-skin="vidro"] .artist-drawer:not(.open),html[data-skin="vidro"] .cycle-drawer:not(.open),html[data-skin="vidro"] .ecm-detail:not(.open){transform:translateX(calc(100% + 16px))!important}

/* ---------- iPad: a pílula lateral fica mais larga, como o painel já faz ---------- */
html[data-skin="vidro"][data-ipad="1"] .sidebar{width:var(--sidebar-w)}
html[data-skin="vidro"][data-ipad="1"] .nav-item{width:var(--tap)!important;height:var(--tap)!important}