/* crm.css — 08/10 · lo que sumamos del CRM de Jero (crm.js): panel de la ficha, 💸 Cuotas, 👥 Equipo, 📘 Guía y el filtro por fecha de Mi día. */

/* ---------- Mi día: filtro por fecha y aviso de cuotas ---------- */
.d-fechas{align-items:center}
.d-fechas>b{font-size:15px;margin-right:2px}
.d-fechas button{border-color:#8A8A84}
.d-fechas label{display:inline-flex;gap:6px;align-items:center;font-weight:700;font-size:15px}
.d-fechas input[type=date]{min-height:44px;border:1.5px solid #8A8A84;border-radius:12px;padding:6px 10px;font-size:16px}
.d-cuotas{display:block;background:#111;color:#FFD600;border-radius:var(--radio);padding:12px 16px;margin:0 0 12px;font-size:16px;font-weight:700;text-decoration:none}
.d-cuotas b{color:#fff}

/* ---------- 🧾 ficha: «Todo lo que sabemos de ella» ---------- */
.cr-saber h4{margin:14px 0 6px;font-size:17px;font-weight:800}
.cr-saber .acc{margin:6px 0 4px}
.cr-ig{margin:6px 0 0;padding-left:20px}
.cr-ig li{margin:4px 0;font-size:16px}
.cr-nota{background:var(--panel);border-radius:12px;padding:10px 12px;font-size:15px;line-height:1.45;margin:6px 0;white-space:pre-wrap;overflow-wrap:anywhere}
.cr-tags{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}

/* ---------- panel al costado (compu) / pantalla entera (celular) ---------- */
#cr-panel{position:fixed;inset:0;z-index:60}
.cr-fondo{position:absolute;inset:0;background:rgba(17,17,17,.35)}
.cr-panel{position:absolute;top:0;right:0;bottom:0;width:min(560px,100%);background:#fff;box-shadow:-18px 0 40px -20px rgba(17,17,17,.45);display:flex;flex-direction:column}
.cr-barra{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;background:#111;padding:10px 14px}
.cr-barra .btn{background:#fff;min-height:44px}
.cr-cuerpo{overflow-y:auto;padding:14px 16px 40px;flex:1;overscroll-behavior:contain}
.cr-cuerpo .f-volver{display:none}
.cr-cuerpo .ficha-cab h1{font-size:26px;margin-top:4px}
.cr-cuerpo .dos{grid-template-columns:1fr}
@media (max-width:1023px){.cr-panel{width:100%}}

/* ---------- 💸 Cuotas ---------- */
.cu-fecha{position:relative;overflow:hidden}
.cu-fecha input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.cu-mas{margin-top:8px}
.cu-mas summary{cursor:pointer;font-weight:800;font-size:14px;color:var(--muted);min-height:36px;display:flex;align-items:center}
.cu-mas ul{margin:4px 0;padding-left:18px;font-size:14px}

/* ---------- 👥 Equipo ---------- */
.eq-tot{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0 0 14px}
.eq-n{background:var(--panel2);border:1.5px solid var(--linea);border-radius:var(--radio);padding:12px 14px}
.eq-n small{display:block;font-size:13px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.8px}
.eq-n b{font-size:26px;font-variant-numeric:tabular-nums}
.eq-n.oro-n{background:#111;border-color:#111}
.eq-n.oro-n small{color:#ddb65f}
.eq-n.oro-n b{color:#FFD600}
.eq-t{font-variant-numeric:tabular-nums}
.bloque:has(.eq-t){overflow-x:auto}
.rojo{color:var(--rojo)}

/* ---------- 📘 Guía ---------- */
.gu-marco{position:relative;width:100%;max-width:960px;aspect-ratio:16/9;border-radius:var(--radio);overflow:hidden;background:#111;margin:0 0 12px}
.gu-marco iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.gu-f{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin-top:10px}
.gu-f label{display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:14px;flex:1;min-width:240px}
.gu-f input{min-height:44px;border:1.5px solid #8A8A84;border-radius:12px;padding:8px 12px;font-size:16px}
