/* ============================================================
   Tira de compañías del dashboard (logos, grilla y estados).
   ============================================================
   Extraído VERBATIM de styles.css el 20-ago-2026, espejando `js/dashboard-companias.js`.
   ⚠⚠ EL ORDEN DE CARGA ES LA CASCADA: va DESPUÉS de styles.css y en el mismo orden
   RELATIVO que tenía adentro (ver los <link> de index.html). Este par va entre
   polizas-recuotificar y mobile porque ahí estaba en el archivo original.
   ============================================================ */
.dash-cias { margin-bottom:14px; background:linear-gradient(180deg,#eff6ff,#eef2ff);
             border:1.5px solid #93c5fd; border-radius:16px; padding:14px 16px 16px; }
.dash-cias-head { font-size:13px; color:#1e40af; font-weight:500; margin-bottom:10px; }
.dash-cias-head span { color:#3b82f6; font-weight:400; }
/* Tamaño FIJO, no estirado al ancho: así la tira se ve igual en un tenant con 1 compañía (vigier =
   Zurich) que en uno con 10 — nunca un logo gigante y solo. Tiles ANCHOS porque el logo es el
   COMPLETO (con el nombre de la compañía adentro), no el isotipo (decisión de Martín, 17-jul): se
   identifica sola, sin depender del tooltip. Los logos van de 4:1 a 7:1 → `contain` los centra a
   distinta altura dentro del mismo tile, que es lo correcto. Entran ~5-6 por fila; más, envuelve. */
/* `center`: el bloque de logos va centrado → el margen a la izquierda del primero y a la derecha
   del último son IGUALES (con `flex-start` el izquierdo era el padding y el derecho todo el
   sobrante — asimétrico). Los gaps internos quedan fijos en 10px. */
.dash-cias-logos { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
/* Grilla de N columnas por fila (flag TIRA_COLS en js/dashboard-companias.js; 0 = volver al flex
   de arriba). Los tiles pasan a ancho ELÁSTICO — con 150px fijos, 10 columnas necesitarían 1590px
   y no entran en ningún dashboard. `minmax(0,1fr)` y no `1fr`: el `min-width:auto` por defecto de
   una columna de grid la empuja más allá del contenedor cuando el contenido no se puede encoger.
   La tira ya está OCULTA abajo de 820px, así que sólo tiene que resolver desktop; entre 820 y
   1200px se baja a 5 columnas porque a 10 el tile queda más angosto que el logo más apretado. */
.dash-cias-logos.is-grilla { display:grid; grid-template-columns:repeat(var(--tira-cols,10), minmax(0,1fr));
                             gap:10px; justify-content:stretch; }
.dash-cias-logos.is-grilla .dash-cia-logo { width:auto; }
@media (max-width: 1200px){ .dash-cias-logos.is-grilla { grid-template-columns:repeat(5, minmax(0,1fr)); } }
/* Tile BLANCO para todos: los logos están hechos para fondo claro. El estado lo dice el logo
   (color vs. gris), no el fondo. El `color`/`font-size` es para el respaldo de iniciales. */
/* --cia-logo-max-h vive ACÁ, pegado al `height` del tile, porque es su derivado: la caja útil es
   58 − 16 de padding − 2 de borde = 40px, y el tope son sus 70%. Separarlos hace que cambiar el
   alto del tile deje el tope apuntando a un número que ya no existe. */
.dash-cia-logo { position:relative; width:150px; height:58px; border-radius:12px; --cia-logo-max-h:28px;
                 display:flex; align-items:center; justify-content:center;
                 background:#fff; border:1px solid #dbeafe; padding:8px; box-sizing:border-box;
                 color:#1e40af; font-size:13px; font-weight:600; }
/* ⚠ El tope de ALTO es 70%, no 100%, y eso NO es "achicar los logos": es lo único que empareja
   la tira. `object-fit:contain` normaliza la CAJA, no la marca — cada logo topa contra el eje que
   se le acaba primero, y los canvas van de 1,7:1 (pax) a 7:1 (galicia). Con el alto libre, un
   logo apaisado se queda sin ANCHO a los 20px de alto mientras uno casi cuadrado llega a los 40:
   el doble, al lado. Bajando el techo a 28px, los que topaban el alto (Experta ART, PAX, Assist
   Card, Provincia ART, Berkley, Andina, Insur) bajan al pelotón y los apaisados no se mueven —
   siguen limitados por el ancho. Medido: el desparejo pasa de 2,0× a 1,4×.
   ⚠ Y es SENSIBLE AL ANCHO DE LA CAJA: cuanto más ancho el tile, más se separan los dos grupos
   (por eso saltó a la vista al pasar de 10 a 9 columnas). Al tocar TIRA_COLS, volver a mirar acá.
   Sube y baja de a poco: abajo de ~22px los lockups de dos líneas (Berkley, Andina ART) dejan de
   leerse. A/B de las 4 variantes: scripts/probe-logos-tira-altura.mjs
   ⚠⚠ El tope va en px ABSOLUTOS, NUNCA en %. Un porcentaje de alto necesita que el bloque
   contenedor ya tenga alto resuelto, y el dashboard se muestra alternando `hidden`: en el frame
   en que la vista deja de estar oculta el tile todavía no tiene caja, WebKit trata el % como
   `none` y pinta la imagen a su tamaño natural — "aparece grande y luego se achica" al entrar al
   dashboard (reportado por Martín, Safari; 30-jul-2026). El estado final era el correcto, así que
   NO se ve como un bug de CSS sino como un parpadeo del browser. ⚠ Y no se caza muestreando desde
   Playwright: dura un frame y `getBoundingClientRect()` FUERZA el layout, o sea que medirlo lo
   arregla. Regla general: si un valor tiene que estar bien en el PRIMER frame, no lo hagas
   depender de un layout previo. */
.dash-cia-img { max-width:100%; max-height:var(--cia-logo-max-h,28px); object-fit:contain; }
/* Excepción POR LOGO al tope de arriba (`data-key` lo pone el render de la tira y el de la réplica
   arrastrable de la vista Compañías, así que las dos superficies se ven igual). El tope común
   empareja el ALTO DE LA CAJA, no el tamaño percibido de la marca: un lockup de DOS LÍNEAS reparte
   esos 28px entre dos renglones + el interlineado, así que su texto queda a ~la mitad del de un
   logo de una línea con la misma caja. Andina ART es el caso extremo (canvas 235×96, dos líneas)
   y se veía chico al lado de Prevención ART / Asociart. El techo duro sigue siendo la caja útil
   del tile: 58 − 16 de padding − 2 de borde = 40px. No convertir esto en una tabla por compañía:
   la excepción se justifica por el LOCKUP de dos líneas, no por gusto. */
.dash-cia-logo[data-key="andinaart"] { --cia-logo-max-h:34px; }
/* Sin alta (incluye "ya pedida"): el logo se ve, pero desaturado — el gesto universal de "esto
   está apagado", sin ningún texto que lo explique. Va en la IMG, no en el botón (el botón lleva
   el ✓ de "pedida", que NO debe desaturarse). */
.dash-cia-logo.is-gris .dash-cia-img { filter:grayscale(1); opacity:.45; }
.dash-cia-logo.can-pedir { cursor:pointer; }
.dash-cia-logo.can-pedir:hover { border-color:#3b82f6; }
.dash-cia-logo.can-pedir:hover .dash-cia-img { filter:grayscale(1); opacity:.7; }
/* Ya pedida: se MANTIENE gris (decisión de Martín 17-jul — el amarillo confundía), y un ✓ chico
   verde en la esquina la distingue de una que todavía se puede pedir. Sin volver a un 3er color. */
.dash-cia-logo.is-pedida::after { content:"✓"; position:absolute; top:3px; right:5px;
   font-size:11px; font-weight:700; color:#15803d; line-height:1; }
/* Cartelito CUSTOM al pasar el mouse (decisión de Martín 17-jul): instantáneo, a diferencia del
   `title` nativo que tarda ~1s y en Safari no aparece. Sale del `data-tip` del botón. */
.dash-cia-logo::before { content:attr(data-tip); position:absolute; bottom:calc(100% + 6px); left:50%;
   transform:translateX(-50%); background:#1e293b; color:#fff; font-size:11px; font-weight:500;
   padding:4px 9px; border-radius:6px; white-space:nowrap; pointer-events:none; z-index:5;
   opacity:0; transition:opacity .08s; }
.dash-cia-logo:hover::before { opacity:1; }
@media (max-width: 820px){ .dash-cias { display:none; } }

/* Alta de póliza por PDF (js/polizas-captar.js) — modal sobre el patrón .sol-modal-ov/.sol-modal */