/* ==========================================================================
   POLIZAS — Familia pol-*, movimientos, exclusion. Ver §6.9.
   Archivo 5 de 9. El ORDEN de los nueve importa: Docs/DESIGN-LANGUAGE.md.
   ========================================================================== */
/* Pólizas agrupadas por cliente: recorta el padding de la fila expandida (grid anidado) */
.policies-grouped-grid .mud-table-child-content{
    padding: 4px 8px;
}
/* Plato informativo, no de alerta: es una consecuencia esperada. Ver §6.9. */
.impact-note{
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--status-info-bg);
    color: var(--status-info-fg);
    font-size: 13.5px;
    line-height: 1.45;
}
/* Identificadores que se ESCANEAN y se comparan entre filas. Ver §6.9. */
.fld-code input,
.fld-code .mud-input-slot{
    font-family: var(--font-code);
    letter-spacing: 0.02em;
}
/* Parte un formulario de 25 campos sin un punto de descanso. Ver §6.9. */
.fld-section{
    margin: 6px 0 2px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gh-label-2);
    border-bottom: 1px solid var(--gh-line-divider);
    padding-bottom: 5px;
}
/* El UNICO rojo solido del modulo. Ver §6.9 y §2.5. */
.btn-danger-strong{
    background: var(--danger-bg-strong) !important;
    color: var(--control-on-ink) !important;
}
.btn-danger-strong:hover:not(:disabled){
    background: var(--danger-bg-strong-hover) !important;
}
/* Contorneado: el rojo sólido queda para la confirmación, que es donde la acción se
   vuelve irreversible. */
.btn-danger-outline{
    border-color: var(--danger-bg-strong) !important;
    color: var(--danger-bg-strong) !important;
}
/* Panel de items asegurados en modo POLIZA — otro layout para otra tarea, no una
   variante de las clases de Ordenes. Ver §6.9. */
/* ── Bloque colapsable (configuración y carga masiva) ───────────────────────── */
.pol-block{
    border: 1px solid var(--gh-line-card);
    border-radius: 14px;
    background: var(--gh-row-1);
    overflow: hidden;
}
/* Un button real, no un div con @onclick: orden de tabulacion y aria-expanded. Ver §6.9. */
.pol-block__head{
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 16px;
    border: 0;
    background: var(--surf-item);
    text-align: left;
    cursor: pointer;
    font: inherit;
    color: inherit;
}
.pol-block__head:hover{
    background: var(--gh-surf-hover);
}
.pol-block__head:focus-visible{
    outline: 2px solid var(--status-info-dot);
    outline-offset: -2px;
}
.pol-block__mark{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--surf-chip-neutral);
    color: var(--gh-label-2);
}
/* Par de control seleccionado (§2.5). Antes usaba --btn-primary-bg, que NO existe:
   pintaba su fallback literal, y por eso no invertia en dark. */
.pol-block__mark--done{
    background: var(--control-on);
    color: var(--control-on-ink);
}
.pol-block__titles{
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
}
.pol-block__title{
    font-size: 14.5px;
    font-weight: 700;
    color: var(--gh-strong);
}
/* Si al cerrar el resumen no dice lo suficiente, el colapso solo agrego un clic. Ver §6.9. */
.pol-block__sub{
    font-size: 12.5px;
    color: var(--gh-label-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pol-block__chevron.mud-icon-root{
    flex: 0 0 auto;
    color: var(--gh-icon-chevron);
}
.pol-block__body{
    padding: 16px;
    border-top: 1px solid var(--gh-line-divider);
}
/* ── Tarjeta del detalle normalizado ────────────────────────────────────────── */
.pol-items-card{
    border: 1px solid var(--gh-line-card);
    border-radius: 14px;
    background: var(--gh-row-1);
    overflow: hidden;
}
.pol-items-card__head{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 16px;
}
.pol-items-card__head-icon.mud-icon-root{
    color: var(--gh-title);
}
.pol-items-card__title{
    font-size: 15px;
    font-weight: 700;
    color: var(--gh-strong);
}
.pol-items-card__empty{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 22px 16px;
    font-size: 13.5px;
    color: var(--gh-label-2);
    border-top: 1px solid var(--gh-line-divider);
}
/* ── Buscador y filtros ─────────────────────────────────────────────────────── */
.pol-items-filters{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 0 16px 12px;
}
.pol-items-filters__search{
    flex: 1 1 260px;
    min-width: 200px;
}
.pol-items-filters__select{
    flex: 0 0 auto;
    width: 190px;
}
/* La clase de arriba cae en el control interno de MudSelect; el hijo flex es este
   wrapper y crecía libre, dejando el hueco. */
.pol-items-filters > .mud-select{
    flex: 0 0 190px;
}
/* ── Tabla ──────────────────────────────────────────────────────────────────── */
/* Grid CSS y no MudTable: los anchos son deliberados. Ver §6.9. */
.pol-items-table{
    border-top: 1px solid var(--gh-line-divider);
    overflow-x: auto;
}
/* 1092px es el mínimo intrínseco con casillas; también rige la fila de total, que
   si no queda más corta y desalinea el importe. */
.pol-items-row{
    display: grid;
    grid-template-columns: 44px 92px 100px minmax(200px, 1fr) 130px 110px 150px 150px;
    align-items: center;
    gap: 12px;
    min-width: 1092px;
    padding: 10px 16px;
    border-bottom: 1px solid var(--gh-line-divider);
    font-size: 13.5px;
    color: var(--gh-body);
}
/* Sin columna de casillas el grid tiene una columna menos. Ver §6.9. */
.pol-items-row:not(:has(.pol-items-row__check)){
    grid-template-columns: 92px 100px minmax(200px, 1fr) 130px 110px 150px 150px;
}
.pol-items-row--head{
    background: var(--surf-item);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--gh-head);
}
.pol-items-row:not(.pol-items-row--head):not(.pol-items-row--total):hover{
    background: var(--gh-surf-hover);
}
.pol-items-row--selected{
    background: var(--status-info-bg);
}
.pol-items-row__check{
    display: inline-flex;
    align-items: center;
}
.pol-items-row__insured{
    font-weight: 600;
    color: var(--gh-strong);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* Referencias que se ESCANEAN y se comparan entre filas. Ver §6.9. */
.pol-items-row__ref{
    font-family: var(--font-code);
    font-size: 12.5px;
    letter-spacing: 0.02em;
}
.pol-items-row__amount{
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px;
    text-align: right;
}
.pol-items-row__currency{
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--gh-label-2);
}
.pol-items-row__value{
    font-weight: 700;
    color: var(--gh-strong);
    font-variant-numeric: tabular-nums;
}
.pol-items-row--total{
    grid-template-columns: 1fr auto;
    background: var(--surf-item);
    border-bottom: 0;
}
.pol-items-row--total:not(:has(.pol-items-row__check)){
    grid-template-columns: 1fr auto;
}
.pol-items-total__label{
    font-size: 13px;
    font-weight: 700;
    color: var(--gh-strong);
}
/* ── Diálogo de exclusión ───────────────────────────────────────────────────── */
.excl-dlg__head{
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.excl-dlg__icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--status-danger-bg);
    color: var(--danger-bg-strong);
}
.excl-dlg__lead{
    color: var(--gh-label-2);
    margin-top: 2px;
}
/* Scroll, nunca un «y N más»: el ítem que sobra de la selección es justamente el que
   hay que poder ver antes de aceptar. */
.excl-dlg__items{
    max-height: 190px;
    overflow-y: auto;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--surf-item);
}
.excl-dlg__item{
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex-wrap: wrap;
    padding: 3px 0;
    font-size: 13px;
    color: var(--gh-body);
}
.excl-dlg__item-ref{
    font-family: var(--font-code);
    font-size: 12.5px;
    color: var(--gh-label-2);
}
.excl-dlg__item-name{
    font-weight: 600;
    color: var(--gh-strong);
}
.excl-dlg__item-plan{
    color: var(--gh-label-2);
}
.excl-dlg__fields{
    display: flex;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
}
.excl-dlg__fields > *{
    flex: 1 1 190px;
}
/* Derivada, no editable. Subrayado punteado en vez de caja de input: la diferencia
   tiene que verse ANTES de intentar escribir en ella. */
.excl-dlg__derived{
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-bottom: 6px;
    border-bottom: 1px dashed var(--line-input);
}
.excl-dlg__derived-label{
    font-size: 11.5px;
    color: var(--gh-label-2);
}
.excl-dlg__derived-value{
    font-size: 15px;
    font-weight: 700;
    color: var(--gh-strong);
    font-variant-numeric: tabular-nums;
}
/* ── Configuración en SOLO LECTURA (bloqueada por ítems activos, diseño 05) ──── */
.pol-cfg__usage{
    flex: 0 0 auto;
    padding: 3px 10px;
    border-radius: var(--r-chip);
    background: var(--surf-chip-neutral);
    font-size: 11.5px;
    font-weight: 600;
    color: var(--gh-label-2);
    white-space: nowrap;
}
.pol-cfg__plans{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
/* Chip estático: mismo contorno que el editable para que se lea como el mismo objeto,
   pero sin ✕ y con el contador de uso adentro. */
.pol-cfg__plan{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    border: 1px solid var(--gh-line-card);
    border-radius: var(--r-chip);
    background: var(--gh-row-1);
    font-size: 12.5px;
}
.pol-cfg__plan-name{
    font-weight: 600;
    color: var(--gh-strong);
}
.pol-cfg__plan-currency{
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--gh-label-2);
}
.pol-cfg__plan-sep{
    width: 1px;
    height: 14px;
    background: var(--gh-line-divider);
}
.pol-cfg__plan-usage{
    color: var(--gh-body);
}
.pol-cfg__plan-usage--idle{
    color: var(--text-placeholder, #93A1B5);
    font-style: italic;
}
/* ── Etapas de la carga masiva en modo Póliza (diseño 05) ───────────────────── */
/* Las dos etapas siempre visibles: la poliza ya existe, no hay nada que desbloquear. Ver §6.9. */
.pol-stages{
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.pol-stage{
    border: 1px solid var(--gh-line-divider);
    border-radius: 12px;
    background: var(--gh-row-1);
    overflow: hidden;
}
.pol-stage__head{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 14px;
}
.pol-stage__num{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    border: 1.5px solid var(--gh-title);
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    color: var(--gh-title);
}
.pol-stage__title{
    font-size: 14px;
    font-weight: 700;
    color: var(--gh-strong);
}
.pol-stage__body{
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0 14px 14px;
}
.pol-stage__idle{
    padding: 14px;
    border-radius: 10px;
    background: var(--surf-item);
    font-size: 13px;
    color: var(--gh-label-2);
}
.pol-stage__delta{
    margin-left: auto;
    font-size: 12.5px;
    font-weight: 600;
    white-space: nowrap;
}
.pol-stage__footer{
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 12px;
    border-top: 1px solid var(--gh-line-divider);
}
.pol-stage__footer-note{
    flex: 1 1 auto;
    font-size: 12.5px;
    color: var(--gh-label-2);
}
/* Navegación entre naturalezas en solo lectura. Sin relleno sólido ni checkmark: no se
   está eligiendo nada, se está cambiando de pestaña. */
.pol-nature-tabs{
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: wrap;
    width: 100%;
}
.pol-nature-tab{
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    font: inherit;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--gh-body);
    cursor: pointer;
}
.pol-nature-tab:hover:not(:disabled){
    background: var(--gh-tray-1);
}
.pol-nature-tab--active{
    background: var(--gh-tray-1);
    color: var(--gh-strong);
}
/* Un tipo sin productos no es seleccionable. Se atenúa con COLOR propio, no con
   `opacity`, que multiplicaría sobre el fondo y hundiría el contraste. */
.pol-nature-tab:disabled{
    color: var(--gh-empty);
    cursor: not-allowed;
}
.pol-nature-tab .mud-icon-root{
    font-size: 17px;
}
.pol-nature-tabs__hint{
    margin-left: auto;
    font-size: 12.5px;
    color: var(--gh-label-2);
}
/* Nombre y conteo de planes en una línea dentro de la tarjeta bloqueada. */
.pol-cfg__product-title{
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    min-width: 0;
    flex: 1;
}
.pol-cfg__product-name{
    font-size: 15px;
    font-weight: 700;
    color: var(--gh-strong);
}
.pol-stage__tiles{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}
.pol-tile{
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--field-fill);
}
.pol-tile__label{
    font-size: 12px;
    color: var(--gh-label-1);
}
.pol-tile__value{
    font-size: 19px;
    font-weight: 600;
    color: var(--gh-strong);
}
.pol-tile__unit{
    margin-right: 5px;
    font-size: 13px;
    font-weight: 500;
    color: var(--gh-label-1);
}
/* Dato ausente, no dato en cero. Se ve distinto de una cifra a propósito. */
.pol-tile__unknown{
    font-size: 13px;
    font-weight: 400;
    color: var(--gh-label-2);
}
/* La tabla puede tener cinco columnas en un diálogo angosto: que scrollee ELLA y no
   la página entera. */
.pol-preview-table__scroll{
    overflow-x: auto;
    border: 1px solid var(--gh-line-card);
    border-radius: 10px;
}
.pol-preview-table{
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
}
.pol-preview-table th{
    padding: 9px 14px;
    background: var(--gh-tray-1);
    border-bottom: 1px solid var(--gh-line-card);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gh-label-2);
    text-align: left;
    white-space: nowrap;
}
.pol-preview-table td{
    padding: 10px 14px;
    border-bottom: 1px solid var(--gh-line-divider);
    color: var(--gh-body);
}
.pol-preview-table tbody tr:last-child td{
    border-bottom: 0;
}
.pol-preview-table__strong{
    font-weight: 600;
    color: var(--gh-strong);
}
/* Los montos se comparan en vertical: alineados a la derecha, los dígitos se apilan. */
.pol-preview-table__num{
    text-align: right;
    white-space: nowrap;
}
.pol-match{
    display: inline-block;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    white-space: nowrap;
}
.pol-match--new{
    background: var(--status-ok-bg);
    color: var(--status-ok-fg);
}
.pol-match--changed{
    background: var(--status-warn-bg);
    color: var(--status-warn-fg);
}
/* Sin cambios es el estado más silencioso: no pasa nada al confirmar. Gris neutro, que
   es justamente lo que significa. */
.pol-match--same{
    background: var(--gh-tray-1);
    color: var(--gh-label-2);
}
.pol-preview-table__changes{
    margin: 6px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.pol-preview-table__changes li{
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 12px;
}
.pol-preview-table__change-field{
    color: var(--gh-label-1);
}
/* El valor que se va, tachado; el que entra, en negrita. La flecha sola no alcanza para
   decir cuál de los dos queda. */
.pol-preview-table__change-old{
    color: var(--gh-empty);
    text-decoration: line-through;
}
.pol-preview-table__change-arrow{
    color: var(--gh-label-1);
}
.pol-preview-table__change-new{
    font-weight: 600;
    color: var(--gh-strong);
}
/* Pie del tile: matiza la cifra grande sin competirle. */
.pol-tile__foot{
    font-size: 11.5px;
    color: var(--gh-label-2);
}
.pol-stage__note{
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--gh-tray-1);
    font-size: 13px;
    line-height: 1.45;
    color: var(--gh-body);
}
.pol-stage__note .mud-icon-root{
    flex: 0 0 auto;
    color: var(--gh-label-1);
}
/* Ajustes de superficie del modulo Polizas — todo scopeado. */
.policies-grouped-grid .mud-input.mud-input-outlined,
.movements-approved-grid .mud-input.mud-input-outlined,
.policy-items-dialog .mud-input.mud-input-outlined{
    background-color: transparent;
}
/* El valor pedido es el de un token, no un literal: --surf-item invierte en oscuro. Ver §6.9. */
.policy-items-dialog .pol-items-filters__select .mud-input.mud-input-outlined{
    background-color: var(--surf-item);
}
/* --gh-row-1 y no #FFFFFF clavado: en oscuro quedaba blanco sobre blanco. Ver §6.9. */
.policy-items-dialog .items-escape-bar .mud-button-outlined,
.policy-items-dialog .items-selection-bar .mud-button-outlined,
.pol-detail__foot .mud-button-outlined{
    background-color: var(--gh-row-1);
}
.movements-approved-grid .movement-row--origin > td{
    background-color: var(--surf-item);
}
/* ─── Editor de ítem asegurado (diseño 06) ───────────────────────────────────── */
.fld-title-badge{
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--field-fill);
    font-size: 12.5px;
    font-weight: 600;
    color: var(--gh-body);
    white-space: nowrap;
}
.fld-section--split{
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}
.fld-section__hint{
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: var(--gh-label-2);
}
.fld-check{
    display: flex;
    align-items: center;
    height: 100%;
    min-height: 48px;
    padding: 0 10px;
    border: 1px solid var(--gh-line-card);
    border-radius: 8px;
}
.fld-check .mud-checkbox{
    margin: 0;
}
/* Acortar vigencia devuelve dinero, no destruye la póliza: ámbar, no rojo. El rojo
   queda para anular el movimiento una vez registrado. */
.impact-note--warn{
    background: var(--status-warn-bg);
    color: var(--status-warn-fg);
}
.mod-strip{
    display: flex;
    flex-wrap: wrap;
    gap: 10px 28px;
    padding: 14px 16px;
    margin-bottom: 8px;
    border-radius: var(--gh-r-tray-1);
    background: var(--gh-tray-1);
}
.mod-strip__cell{
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.mod-strip__k{
    font-size: 11.5px;
    color: var(--gh-label-1);
}
.mod-strip__v{
    font-size: 14px;
    font-weight: 500;
    color: var(--gh-title);
}
.mod-strip__v--code{
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    letter-spacing: .02em;
}
.mod-strip__v--ro{
    border-bottom: 1px dashed var(--gh-line-tray-2);
    padding-bottom: 2px;
}
.mod-tray{
    padding: 6px 14px;
    margin: 4px 0 12px;
    border-radius: var(--gh-r-tray-1);
    background: var(--gh-tray-1);
}
.mod-tray__row{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    cursor: pointer;
}
.mod-tray__row + .mod-tray__row{
    border-top: 1px solid var(--gh-line-tray-2);
}
.mod-tray__text{
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}
.mod-tray__t{
    font-size: 14px;
    font-weight: 600;
    color: var(--gh-title);
}
.mod-tray__d{
    font-size: 12px;
    color: var(--gh-label-1);
}
.mod-tray__side{
    margin-left: auto;
    min-width: 120px;
    text-align: right;
}
.mod-tray__ghost{
    font-size: 13px;
    color: var(--gh-label-2);
}
.mod-diff{
    padding: 12px 16px;
    margin-top: 8px;
    border: 1px solid var(--gh-line-card);
    border-radius: var(--gh-r-tray-1);
}
.mod-diff__row{
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 6px 0;
    font-size: 14px;
}
.mod-diff__k{
    min-width: 170px;
    color: var(--gh-body);
}
.mod-diff__from{
    color: var(--gh-label-1);
    text-decoration: line-through;
}
.mod-diff__arrow{
    color: var(--gh-label-1);
}
.mod-diff__to{
    font-weight: 600;
    color: var(--gh-title);
}
.mod-diff__note{
    margin: 2px 0 6px;
    font-size: 12.5px;
    color: var(--gh-label-1);
}
.impact-note{
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
/* ── Modificación de póliza: ajustes de detalle contra la propuesta ────────── */
/* El nro. de orden es el identificador del movimiento: pesa más que sus vecinos. */
.mod-strip__v--code{
    font-weight: 700;
}
/* La tira es contexto, no contenido: su fondo baja a la mitad del tono. */
.mod-strip{
    background: color-mix(in srgb, var(--gh-tray-1) 50%, var(--mud-palette-surface));
}
/* El bloque de cambios necesita plano propio para separarse de la razón. */
.mod-diff{
    margin-top: 2px;
    background: color-mix(in srgb, var(--gh-tray-1) 32%, var(--mud-palette-surface));
}