/* Demo 10 · Reactivación de clientes antiguos: lista de clientes (filtro, encaje y elección) → agenda de la persona del equipo */
.dr2-vistas{ flex:1; min-width:0; position:relative; overflow:hidden; }
.dr2-va, .dr2-vb{ position:absolute; inset:0; display:flex; flex-direction:column; gap:10px; padding:14px 18px; }
.dr2-vistas.v2 .dr2-va{ display:none; }
.dr2-vistas:not(.v2) .dr2-vb{ display:none; }
.dr2-vistas.v2 .dr2-vb{ animation:entra .5s var(--ease) both; }

/* Lista */
.dr2-cab{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.dr2-cab > b{ font-size:16px; font-weight:600; letter-spacing:-.015em; }
.dr2-n{ font-size:12px; color:var(--tinta-60); border-radius:4px; padding:1px 4px; }
.dr2-filtros{ display:flex; gap:6px; flex-wrap:wrap; }
.dr2-chip{ display:inline-flex; align-items:center; gap:6px; height:26px; padding:0 10px; border-radius:999px; border:1px dashed var(--linea-fuerte); font-size:11.5px; color:var(--tinta-45); transition:all .35s; }
.dr2-chip .ico{ width:12px; height:12px; }
.dr2-chip.on{ border-style:solid; border-color:transparent; background:var(--tinta); color:#fff; }
.dr2-chip.on .ico{ color:var(--verde); }
.dr2-tabla{ display:flex; flex-direction:column; border:1px solid var(--linea); border-radius:8px; overflow:hidden; }
.dr2-fila{ display:grid; grid-template-columns:1.3fr 1.3fr .5fr 1.3fr; gap:8px; align-items:center; padding:5px 10px; font-size:11.6px; line-height:1.25; color:var(--tinta-80); border-top:1px solid var(--linea); transition:opacity .4s, background .4s, box-shadow .4s; }
.dr2-fila:first-child{ border-top:0; }
.dr2-th{ background:var(--nieve); font-size:10px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; color:var(--tinta-45); padding-block:6px; }
.dr2-cli{ display:flex; align-items:center; gap:7px; min-width:0; }
.dr2-cli b{ font-weight:500; color:var(--tinta); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dr2-av{ width:20px; height:20px; border-radius:50%; background:var(--nieve-2); color:var(--tinta-60); font-size:9px; font-weight:600; display:grid; place-items:center; flex:none; }
.dr2-serv{ color:var(--tinta-60); line-height:1.25; }
.dr2-hace{ color:var(--tinta-60); white-space:nowrap; }
.dr2-enc span{ display:inline-block; border-radius:4px; font-weight:500; color:var(--verde-osc); line-height:1.25; }
.dr2-enc .vacio, .dr2-sin{ color:var(--tinta-30) !important; font-weight:400 !important; }
.dr2-fila.fuera{ opacity:.35; }
.dr2-fila.elegida{ background:var(--verde-agua); box-shadow:inset 3px 0 0 var(--verde); }
.dr2-fila.elegida .dr2-av{ background:var(--verde); color:var(--tinta); }

/* Plan para el elegido */
.dr2-plan{ display:flex; flex-direction:column; gap:8px; padding:10px 14px 12px; border-radius:10px; border:1px solid var(--linea); background:#fff; box-shadow:var(--sombra-2); }
.dr2-plan-cab{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.dr2-plan-l{ display:flex; flex-direction:column; margin:0; }
.dr2-plan-l > div{ display:grid; grid-template-columns:78px 1fr; gap:10px; padding:3px 0; }
.dr2-plan-l > div + div{ border-top:1px dashed var(--linea); }
.dr2-plan-l dt{ font-size:11px; color:var(--tinta-45); }
.dr2-plan-l dd{ margin:0; font-size:12.2px; line-height:1.35; font-weight:500; color:var(--tinta); }
.dr2-pasos{ margin-top:2px; }

/* Agenda (piezas .ag-* de agentes.css) en la segunda vista */
.dr2-vb .ag{ --fila:20px; }
.dr2-vb .ag-cita{ padding:8px 12px; }
.dr2-vb .ag-cita span{ line-height:1.35; }
.dr2-vb .ag-dia > b{ font-size:10.5px; }
.dr2-vb .ag-ev, .dr2-vb .ag-libre{ font-size:9.5px; }
.dr2-vb .ag-pie{ padding-top:8px; }

/* El aviso final, arriba sobre la app (abajo taparía los recordatorios de la agenda) */
.d-rea .toast{ top:36px; bottom:auto; left:auto; right:38px; margin:0; }
