/* Hoy (js/vistas/hoy.js), la mesa del día de design-system/pages/crm.md. Celular primero; dos columnas desde 880 px de
   contenedor (.crm-vista, que se angosta con la conversación abierta en computadora). Todo dentro de .crm-hoy, salvo las
   hojas de pagos y fallas (.crm-hb-pago), que viven en #crm-hoja. */

/* ============ Cabecera ============ */
.crm-hoy .crm-hoy-cab .crm-cab-fila{gap:12px}
.crm-hoy-seg{width:150px;flex:none}
.crm-hoy-yo>.crm-av{width:40px;height:40px;color:var(--texto)}
.crm-hoy .crm-cab-sub{font-variant-numeric:tabular-nums}

/* ============ Rejilla ============ */
.crm-hoy-grid{display:grid;gap:14px;padding:2px 16px 0;min-width:0}
.crm-hoy-principal,.crm-hoy-lado{display:flex;flex-direction:column;gap:14px;min-width:0}
.crm-hoy-lado{display:none}
.crm-hoy-principal>.crm-esq{margin:0!important}
.crm-hoy-hueco{display:contents}

/* ============ Cifras del día ============ */
.crm-hoy .crm-cifras{padding:14px 16px 12px}
.crm-cifras-fila{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.crm-cifras-fila>div{display:flex;flex-direction:column;min-width:0}
.crm-cifras-fila b{font-size:22px;font-weight:750;letter-spacing:-.03em;line-height:1.15;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-cifras-fila span{font-size:13px;color:var(--suave);line-height:1.25}
.crm-cifras-lanz{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;width:100%;margin-top:12px;padding-top:12px;border-top:1px solid var(--linea);font-size:14px;align-items:center;min-height:44px;border-radius:0 0 8px 8px}
.crm-cifras-lanz>span:first-child{min-width:0;overflow-wrap:anywhere}
.crm-cifras-lanz .crm-suave{font-size:13.5px;white-space:nowrap}
.crm-cifras-lanz .crm-barra{grid-column:1/-1}
@media (hover:hover){.crm-cifras-lanz:hover b{text-decoration:underline;text-underline-offset:3px}}

/* ============ Aviso del sistema (el bot dejó de contestar) ============ */
.crm-hoy .crm-alerta{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;padding:14px 16px;border-radius:var(--r2);background:var(--error-fondo);box-shadow:inset 0 0 0 1px var(--error-borde)}
.crm-alerta-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--error);color:#fff;flex:none}
.crm-hoy .crm-alerta h3{font-size:17px;color:var(--error);letter-spacing:-.015em}
.crm-hoy .crm-alerta p{font-size:14.5px;color:var(--texto);margin-top:2px;line-height:1.4;overflow-wrap:anywhere}
.crm-alerta-acc{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.crm-alerta-acc .crm-btn{flex:1 1 auto}
.crm-alerta-acc .crm-btn[aria-disabled="true"]{opacity:.5}
.crm-hoy .crm-alerta.crm-resuelta{background:var(--ok-fondo);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 25%,transparent)}
.crm-hoy .crm-alerta.crm-resuelta .crm-alerta-ic{background:var(--verde-fijo)}
.crm-hoy .crm-alerta.crm-resuelta h3{color:var(--ok-texto)}
.crm-hoy .crm-alerta.crm-resuelta .crm-btn-texto{color:var(--texto);padding:0}
@container (min-width:560px){.crm-alerta-acc{grid-column:2}.crm-alerta-acc .crm-btn{flex:0 0 auto}}

/* ============ Grupos por urgencia ============ */
.crm-hoy .crm-grupo{overflow:hidden}
.crm-grupo-cab{display:flex;align-items:center;gap:10px;padding:14px 16px 8px;min-width:0}
.crm-grupo-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--tinte);color:var(--acento-texto);flex:none}
.crm-grupo-ic .crm-i{width:17px;height:17px}
.crm-grupo-cab h2{font-size:17px;font-weight:700;letter-spacing:-.015em;min-width:0;overflow-wrap:anywhere;line-height:1.25}
.crm-grupo-n{font-size:14px;font-weight:700;color:var(--suave);font-variant-numeric:tabular-nums;flex:none}
.crm-grupo-meta{margin-left:auto;font-size:14px;color:var(--suave);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.crm-hoy .crm-grupo.crm-urgente .crm-grupo-ic{background:var(--error-fondo);color:var(--error)}
.crm-hoy .crm-item{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px;padding:0 12px 0 0;transition:background-color .15s,opacity .22s var(--curva),transform .22s var(--curva)}
.crm-hoy .crm-item+.crm-item::before{content:"";position:absolute;top:0;left:68px;right:0;height:1px;background:var(--linea)}
.crm-item-abrir{display:flex;align-items:center;gap:12px;min-height:68px;padding:10px 0 10px 16px;min-width:0;width:100%;text-align:left;cursor:pointer;border-radius:0}
.crm-item-abrir:focus-visible{outline-offset:-2px}
.crm-item-txt{display:flex;flex-direction:column;min-width:0}
.crm-item-nom{font-size:16px;font-weight:650;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.crm-item-det{font-size:14.5px;line-height:1.35;color:var(--texto);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.crm-item-meta{font-size:13px;color:var(--suave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums;line-height:1.35}
.crm-item-meta .crm-tarde{color:var(--error);font-weight:600}
.crm-hoy .crm-item.crm-sel{background:var(--tinte)}
.crm-hoy .crm-item.crm-saliendo{opacity:0;transform:translateX(24px)}
.crm-hoy .crm-item>.crm-btn{flex:none}
.crm-hoy .crm-item>.crm-btn[aria-disabled="true"]{opacity:.5}
@media (hover:hover){.crm-item-abrir:hover .crm-item-nom{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}}

/* Pie: lo resuelto hoy */
.crm-mesa-pie{display:flex;align-items:center;gap:12px;padding:14px 16px}
.crm-mesa-pie>.crm-i{color:var(--ok-texto)}
.crm-mesa-pie-t{font-size:14px;color:var(--suave);white-space:nowrap;font-variant-numeric:tabular-nums}
.crm-mesa-pie .crm-barra{flex:1;min-width:40px}

/* Todo al día */
.crm-hoy-aldia{padding:28px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.crm-hoy-aldia-ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--ok-fondo);color:var(--ok-texto);margin-bottom:6px}
.crm-hoy-aldia h2{font-size:19px;font-weight:750;letter-spacing:-.02em}
.crm-hoy-aldia p{font-size:15px;max-width:420px}

/* ============ Columna derecha: lanzamiento, embudo y equipo ============ */
.crm-lanz{padding:16px;display:flex;flex-direction:column;gap:12px}
.crm-lanz-cab{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}
.crm-lanz-cab h3{font-size:17px;letter-spacing:-.015em}
.crm-lanz-cab .crm-suave{font-size:13.5px}
.crm-lanz-big{font-size:34px;font-weight:800;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.crm-lanz-sub{font-size:14px;color:var(--suave);margin-top:4px}
.crm-lanz-dato{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.crm-lanz-dato>div{background:var(--campo);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;min-width:0}
.crm-lanz-dato b{font-size:19px;font-weight:750;letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-lanz-dato span{font-size:12.5px;color:var(--suave);line-height:1.3}
.crm-barras{display:flex;align-items:flex-end;gap:4px;height:64px}
.crm-barras i{flex:1;border-radius:3px 3px 0 0;background:var(--tinte-2);min-height:3px}
.crm-barras i.crm-hoy-barra{background:var(--acento-relleno)}
.crm-barras-ejes{display:flex;justify-content:space-between;font-size:12.5px;color:var(--suave);margin-top:4px}
.crm-lanz-prev{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}
.crm-lado-tit{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 16px 2px;min-height:44px}
.crm-lado-tit h3{font-size:16px;min-width:0;overflow-wrap:anywhere}
.crm-lado-tit .crm-suave{font-size:13.5px;white-space:nowrap}
.crm-resumen-emb{padding:2px 0 8px}
.crm-re-fila{display:grid;grid-template-columns:132px minmax(0,1fr) 36px;align-items:center;gap:10px;min-height:36px;padding:0 16px;font-size:14px;width:100%}
.crm-re-nom{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-re-auto{color:var(--suave)}
.crm-re-fila b{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}
.crm-re-fila .crm-barra{height:8px}
.crm-re-fila .crm-barra.crm-auto>i{opacity:.55}
@media (hover:hover){.crm-re-fila:hover{background:var(--campo)}}
.crm-hoy-eq{padding-bottom:6px}
.crm-eq-fila{display:flex;align-items:center;gap:10px;padding:8px 16px;font-size:14.5px;min-width:0}
.crm-eq-fila>div{min-width:0}
.crm-eq-fila>div>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-eq-fila small{display:block;font-size:13px;color:var(--suave)}
.crm-eq-fila .crm-av{width:34px;height:34px;font-size:12px;color:var(--texto)}
.crm-eq-fila .crm-presencia{box-shadow:0 0 0 2px var(--hoja)}

/* Con la conversación abierta y menos de 380 px: el botón baja bajo el texto */
@container (max-width:379px){
  .crm-hoy .crm-item{grid-template-columns:minmax(0,1fr);padding-bottom:10px}
  .crm-hoy .crm-item>.crm-btn{justify-self:start;margin:-6px 0 0 68px}
  /* El título no se corta: puede ocupar dos renglones y la suma pasa abajo, alineada con el texto. */
  .crm-grupo-cab{flex-wrap:wrap;row-gap:2px}
  .crm-grupo-cab h2{flex:1 1 0;min-width:0}
  .crm-grupo-meta{flex-basis:100%;margin-left:40px;white-space:normal}
  .crm-cifras-lanz{grid-template-columns:minmax(0,1fr)}
  .crm-cifras-fila b{font-size:18px}
  .crm-cifras-fila span{font-size:12.5px}
  .crm-hoy-seg{width:132px}
}
/* Computadora: dos columnas con la de la derecha fija al bajar */
@container (min-width:880px){
  .crm-hoy-grid{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:24px}
  /* La columna de la derecha se queda a la vista al bajar; si es más alta que la ventana, desplaza por su cuenta. */
  .crm-hoy-lado{display:flex;position:sticky;top:16px;max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:2px 6px 8px;margin:-2px -6px 0}
  .crm-hoy-grid.crm-con-lanz .crm-cifras{display:none}
}
@media (min-width:1000px){.crm-hoy-grid{padding:4px 28px 0}}

/* ============ Hojas de Hoy: pagos y fallas ============ */
.crm-hb-pago .crm-hb-quien{display:flex;align-items:center;gap:12px;margin-bottom:12px;min-width:0}
.crm-hb-pago .crm-hb-quien>div{min-width:0}
.crm-hb-pago .crm-hb-quien b{display:block;font-size:16px;font-weight:650;overflow-wrap:anywhere}
.crm-hb-pago .crm-hb-quien small{display:block;font-size:13px;color:var(--suave)}
.crm-hb-ped{padding:12px 14px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--linea)}
.crm-hb-ped-tit{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:16px}
.crm-hb-ped-tit b{font-weight:750}
.crm-hb-ped-tit .crm-chip{margin-left:auto}
.crm-hb-ped>p{font-size:13.5px;margin-top:2px}
.crm-hb-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.crm-hb-nums>div{background:var(--campo);border-radius:12px;padding:8px 10px;display:flex;flex-direction:column;min-width:0}
.crm-hb-nums b{font-size:16px;font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-hb-nums span{font-size:12.5px;color:var(--suave)}
.crm-hb-comps{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.crm-hb-comp{display:block;border-radius:12px;overflow:hidden;background:var(--campo);max-width:320px}
.crm-hb-comp img{width:100%;max-height:260px;object-fit:contain;background:var(--campo)}
.crm-hb-comp-doc{display:flex;align-items:center;gap:10px;min-height:52px;padding:8px 14px;border-radius:12px;background:var(--campo);font-size:15px;font-weight:550;min-width:0}
.crm-hb-comp-doc>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.crm-hb-texto{font-size:14.5px;line-height:1.4;overflow-wrap:anywhere;cursor:pointer;border-radius:8px}
.crm-hb-texto.crm-plegado{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.crm-hb-check{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:8px;font-size:15px;cursor:pointer}
.crm-hb-aviso{display:flex;align-items:flex-start;gap:8px;margin-top:14px;padding:12px 14px;border-radius:12px;background:var(--campo);font-size:14px;color:var(--suave);line-height:1.4}
.crm-hb-aviso .crm-i{margin-top:2px}
.crm-hb-error{display:flex;align-items:flex-start;gap:8px;padding:12px 14px;border-radius:12px;background:var(--error-fondo);box-shadow:inset 0 0 0 1px var(--error-borde);font-size:15px;line-height:1.4;margin-bottom:10px;overflow-wrap:anywhere}
.crm-hb-error .crm-i{color:var(--error);margin-top:3px}
.crm-hb-pago .crm-btn-texto{margin-top:8px}
.crm-hb-pago .crm-hoja-pie .crm-btn[aria-disabled="true"]{opacity:.5}