/* ==========================================================================
   PARAMETROS — Lo propio del modulo, bajo .pr. Archivo 11 de 11. Ver §6.12.
   Handoff: mudblazor/handoff_modulo_parametros_blazor.
   ========================================================================== */
/* Va tras 10-credits sin colisiones: otro scope. 09-motion gana igual con
   !important. Antes de mover el orden, ver «El orden ES el contrato». */

/* --------------------------------------------------------------------------
   §0 — Normalizacion de MudText. Su body1 trae letter-spacing y tamaño
   propios; en este modulo los manda la clase de cada parte.
   -------------------------------------------------------------------------- */
.bl.pr .mud-typography{
    letter-spacing: normal;
}
/* Los dos textos del pie no llevan clase propia: los manda la caja. */
.bl.pr .pr-foot .mud-typography{
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}

/* --------------------------------------------------------------------------
   §1 — Cabeza unibody: el titular y la tira de pestañas comparten la cabeza
   de la tarjeta. La tira ES la tabbar de MudTabs. Ver §6.12.
   -------------------------------------------------------------------------- */
/* 06-grid deja la tabbar en `0 32px`; aca lleva el padding de la cabeza. */
.bl.pr .grid-page-card .mud-tabs-tabbar{
    padding: 22px 32px 18px;
    border-bottom: 1px solid var(--dc-line-card);
    background: var(--dc-surface);
}
/* La tabbar-inner viene en fila: el titular va arriba y la tira debajo. */
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tabs-tabbar-inner{
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
    min-height: 0;
}
/* La forma le da `flex:1` al h1 para una cabeza en fila; aca crecia en vertical. */
.bl.pr .grid-page-card__head .titleHeader{
    flex: 0 0 auto;
}
.bl.pr .pr-head__row{
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.bl.pr .pr-head__titles{
    gap: 4px;
    min-width: 0;
}
.bl.pr .pr-sub{
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--dc-text-muted);
}
/* Hueco reservado para «Ultima modificacion»: el dato no existe aun. Ver §6.12. */
.bl.pr .pr-stamp{
    flex: 0 0 auto;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--dc-text-muted);
    white-space: nowrap;
}

/* --------------------------------------------------------------------------
   §2 — Tira de pestañas. Caja blanca con borde, y pastilla navy en la activa.
   -------------------------------------------------------------------------- */
/* La caja de la tira es el contenedor de la tabbar, que ya viene al 100%. */
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tabs-tabbar-content{
    display: block;
    overflow: visible;
    border: 1px solid var(--dc-line-card);
    border-radius: 12px;
    padding: 6px;
    background: var(--dc-surface);
}
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tabs-tabbar-wrapper{
    width: auto;
    gap: 6px;
    flex-wrap: wrap;
}
/* La tira envuelve como en el mock, asi que los botones de scroll no aplican. */
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tabs-scroll-button{
    display: none;
}
/* 06-grid separa los tabs 28/30px para el badge, que aca no se usa. */
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tab{
    width: auto;
    min-height: 0;
    margin-right: 0;
    padding: 10px 16px;
    gap: 10px;
    border-radius: 8px;
    justify-content: flex-start;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    color: var(--dc-text-2);
    /* 02-base baja los inactivos a .72; el mock los quiere a color pleno. */
    opacity: 1;
    transition: background-color var(--motion-fast) var(--motion-ease),
                color var(--motion-fast) var(--motion-ease);
}
/* El hover del mock pisaba la activa: es un bug del prototipo. Ver §6.12. */
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tab:not(.pr-tab--on):hover{
    background: var(--dc-hover);
}
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tab.pr-tab--on{
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
    font-weight: 700;
    opacity: 1;
}
.bl.pr .grid-page-card .mud-tabs-tabbar .mud-tab:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}
.bl.pr .pr-pill{
    height: auto;
    padding: 1px 8px;
    border-radius: 999px;
    background: var(--dc-fill);
    color: var(--dc-navy);
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.35;
}
.bl.pr .pr-pill > .mud-chip-content{
    height: auto;
    padding: 0;
}
.bl.pr .mud-tab.pr-tab--on .pr-pill{
    background: var(--pr-pill-wash);
    color: var(--dc-navy-ink);
}

/* --------------------------------------------------------------------------
   §3 — Cuerpo de la pestaña: cabecera descriptiva, barra de acciones, lista.
   -------------------------------------------------------------------------- */
.bl.pr .pr-desc{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 22px 0;
}
.bl.pr .pr-desc__ico{
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    border-radius: 10px;
    background: var(--dc-fill);
    color: var(--dc-navy);
}
.bl.pr .pr-desc__ico .mud-icon-root{
    font-size: 18px;
    color: var(--dc-navy);
}
.bl.pr .pr-desc__txt{
    gap: 3px;
    min-width: 0;
}
.bl.pr .pr-desc__t{
    font-size: 17px;
    font-weight: 800;
    line-height: 1.3;
    color: var(--dc-text);
}
.bl.pr .pr-desc__d{
    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;
    color: var(--dc-text-muted);
}

.bl.pr .pr-bar{
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 16px 22px 18px;
    border-bottom: 1px solid var(--dc-line-card);
}
.bl.pr .pr-bar__count{
    font-size: 12.5px;
    font-weight: 600;
    color: var(--dc-text-muted);
    white-space: nowrap;
}
/* Buscador RELLENO, no el `.grid-search` outlined de §6.8: el mock lo pide lleno. */
.bl.pr .pr-search{
    flex: 1 1 220px;
    min-width: 220px;
    margin: 0;
}
.bl.pr .pr-search .mud-input.mud-input-filled{
    height: 42px;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: var(--dc-fill);
}
.bl.pr .pr-search .mud-input.mud-input-filled:hover{
    background: var(--dc-fill);
}
.bl.pr .pr-search .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    height: auto;
    padding: 0;
    font-size: 14px;
    color: var(--dc-text);
}
.bl.pr .pr-search .mud-input-slot::placeholder{
    color: var(--dc-placeholder);
    opacity: 1;
}
.bl.pr .pr-search .mud-input-adornment{
    margin: 0;
}
.bl.pr .pr-search .mud-input-adornment .mud-icon-root{
    font-size: 16px;
    color: var(--dc-text-muted);
}
.bl.pr .pr-search .mud-input.mud-input-filled:focus-within{
    outline: 2px solid var(--dc-navy);
    outline-offset: 1px;
}

/* --------------------------------------------------------------------------
   §4 — Lista de aseguradoras. Un solo vector de columnas para cabecera y fila.
   -------------------------------------------------------------------------- */
.bl.pr .pr-thead,
.bl.pr .pr-row{
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) 36px;
    gap: 12px;
    border-bottom: 1px solid var(--pr-line-row);
}
.bl.pr .pr-thead{
    padding: 10px 22px;
}
.bl.pr .pr-th{
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .6px;
    line-height: 1.3;
    text-transform: uppercase;
    color: var(--dc-text-muted);
}
.bl.pr .pr-row{
    align-items: center;
    width: 100%;
    padding: 12px 22px;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color var(--motion-fast) var(--motion-ease);
}
.bl.pr .pr-row:hover{
    background: var(--dc-panel);
}
.bl.pr .pr-row:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: -2px;
}
.bl.pr .pr-row__name{
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.bl.pr .pr-mono{
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: 8px;
    background: var(--dc-fill);
    color: var(--dc-navy);
    font-size: 12px;
    font-weight: 800;
}
.bl.pr .pr-name{
    overflow: hidden;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--dc-text);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bl.pr .pr-code{
    font-size: 13.5px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--dc-text);
}
/* Sin codigo de mediador no se puede emitir: es un dato faltante, no un guion. */
.bl.pr .pr-code--missing{
    color: var(--dc-error);
}
.bl.pr .pr-products{
    font-size: 13px;
    font-weight: 600;
    color: var(--dc-text-muted);
}
.bl.pr .pr-pencil{
    justify-self: center;
    font-size: 16px;
    color: var(--dc-placeholder);
}
.bl.pr .pr-empty,
.bl.pr .pr-soon{
    padding: 32px 22px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dc-text-muted);
    text-align: center;
}
.bl.pr .pr-foot{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 22px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--dc-text-muted);
}

/* --------------------------------------------------------------------------
   §5 — Botones del modulo. Sin `Color=`: las clases de tema de MudBlazor
   traen !important en el color. Ver §8, trampa 6.
   -------------------------------------------------------------------------- */
.bl.pr .pr-btn{
    min-width: 0;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: none;
    white-space: nowrap;
}
.bl.pr .pr-btn .mud-button-icon-start .mud-icon-root{
    font-size: 15px;
}
.bl.pr .pr-btn--primary{
    height: 42px;
    padding: 0 18px;
    border: 0;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
    box-shadow: none;
}
.bl.pr .pr-btn--primary:hover{
    background: var(--dc-navy-hover);
    box-shadow: none;
}
.bl.pr .pr-btn--ghost{
    padding: 10px 18px;
    border: 1.5px solid var(--dc-navy);
    background: var(--dc-surface);
    color: var(--dc-navy);
}
.bl.pr .pr-btn--ghost:hover{
    background: var(--dc-hover);
}
.bl.pr .pr-btn--save{
    padding: 10px 20px;
    border: 0;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
    box-shadow: none;
}
.bl.pr .pr-btn--save:hover{
    background: var(--dc-navy-hover);
    box-shadow: none;
}
.bl.pr .pr-btn:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   §6 — Panel lateral. MudOverlay para el velo y MudPaper para el panel: el
   `MudDrawer` temporal fija top/height y anima `right`. Ver §6.12.
   -------------------------------------------------------------------------- */
/* MudOverlay 9.8 renderiza en el outlet de providers, FUERA del scope, y sin hijo
   .mud-overlay-scrim: el velo va en su raíz y sin prefijo .bl.pr. */
.mud-overlay.pr-scrim{
    border-color: var(--pr-scrim);
    background-color: var(--pr-scrim);
}
.bl.pr .pr-drawer{
    position: fixed;
    /* The handoff floats the panel 16px from the viewport edge, but the app has a fixed
       MudAppBar (z-index 1300) that would bury the panel head. Raising the panel above the
       bar is not an option: MudBlazor popovers (the selects' menus) live at z-index 1200 and
       would open behind it. So the 16px inset is taken from the bar's bottom edge instead. */
    top: calc(var(--mud-appbar-height, 64px) + 16px);
    right: 16px;
    bottom: 16px;
    z-index: 9;
    display: flex;
    flex-direction: column;
    width: min(480px, calc(100% - 32px));
    border-radius: 14px;
    background: var(--dc-surface);
    box-shadow: var(--pr-drawer-shadow);
    animation: pr-drawer-in 180ms ease-out both;
}
@keyframes pr-drawer-in{
    from{
        transform: translateX(24px);
        opacity: 0;
    }
    to{
        transform: none;
        opacity: 1;
    }
}
.bl.pr .pr-drawer__head{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 22px 24px 0;
}
.bl.pr .pr-drawer__titles{
    gap: 3px;
    min-width: 0;
}
.bl.pr .pr-drawer__kicker{
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .8px;
    line-height: 1.3;
    color: var(--dc-text-2);
}
.bl.pr .pr-drawer__title{
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.2px;
    line-height: 1.25;
    color: var(--dc-text);
}
.bl.pr .pr-drawer__x{
    padding: 6px;
    color: var(--dc-text-muted);
}
.bl.pr .pr-drawer__x .mud-icon-root{
    font-size: 20px;
}
.bl.pr .pr-drawer__x:hover{
    background: transparent;
    color: var(--dc-text);
}
.bl.pr .pr-drawer__x:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}
.bl.pr .pr-drawer__rule{
    /* MudDivider is a flex item here; MudBlazor lets it grow, so it would take the free
       height of the panel and open a blank block between the head and the body. The
       handoff rule is a 1px line: it never grows. */
    flex: 0 0 auto;
    margin: 18px 24px 0;
    border-color: var(--dc-line-card);
}
.bl.pr .pr-drawer__body{
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 14px;
    overflow: auto;
    padding: 20px 24px;
}
/* Body children stack from the top at their natural height (the handoff's plain <label>
   and <div> children never grow). MudBlazor gives .mud-input-control / .mud-select
   `flex: 1 1 auto`, which in this flex column stretched every field to share the free
   height (56px fields became 158px). The free space stays at the bottom, as in the mock. */
.bl.pr .pr-drawer__body > *{
    flex: 0 0 auto;
}
.bl.pr .pr-drawer__note{
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.45;
    color: var(--dc-text-muted);
}
.bl.pr .pr-drawer__foot{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 16px 24px;
    border-top: 1px solid var(--dc-line-card);
}
.bl.pr .pr-drawer__err{
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--dc-error);
}
.bl.pr .pr-drawer__acts{
    flex: 0 0 auto;
    gap: 10px;
}

/* --------------------------------------------------------------------------
   §7 — Campo relleno con etiqueta interna. Misma tecnica que `.dlg-client .fld`
   (§6.2.4), reescrita bajo .pr: aquel es el scope de un dialogo.
   -------------------------------------------------------------------------- */
.bl.pr .pr-fld{
    margin: 0;
}
.bl.pr .pr-fld .mud-input.mud-input-filled{
    min-height: 56px;
    border: 0;
    border-radius: 8px;
    background: var(--dc-fill);
}
.bl.pr .pr-fld .mud-input.mud-input-filled:hover{
    background: var(--dc-fill);
}
.bl.pr .pr-fld .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    padding: 27px 14px 9px;
    font-size: 15px;
    color: var(--dc-text);
}
.bl.pr .pr-fld .mud-input-slot::placeholder{
    color: var(--dc-placeholder);
    opacity: 1;
}
/* La etiqueta no flota nunca: `ShrinkLabel` la deja arriba con el campo vacio. */
.bl.pr .pr-fld label.mud-input-label-filled.mud-input-label-margin-dense,
.bl.pr .pr-fld .mud-shrink ~ label.mud-input-label-filled.mud-input-label-margin-dense,
.bl.pr .pr-fld .mud-input:focus-within ~ label.mud-input-label-filled.mud-input-label-margin-dense{
    transform: translate(14px, 9px);
    font-size: 11.5px;
    font-weight: 600;
    color: var(--dc-text-2);
}
.bl.pr .pr-fld .mud-input.mud-input-filled:focus-within{
    outline: 2px solid var(--dc-navy);
    outline-offset: 1px;
}
.bl.pr .pr-fld .mud-input-adornment .mud-icon-root{
    color: var(--dc-text-2);
}
/* Solo lectura al editar: la aseguradora sale del catalogo, no se teclea. */
.bl.pr .pr-fld--ro .mud-input.mud-input-filled{
    background: var(--dc-disabled);
}
.bl.pr .pr-fld--ro .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    color: var(--dc-text-2);
}

/* --------------------------------------------------------------------------
   §8 — Sucursales: tarjetas, no rejilla. El nombre se teclea en la fila: la
   fila no es un boton. Ver §6.12.
   -------------------------------------------------------------------------- */
.bl.pr .pr-list{
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 22px;
}
/* La fila y su error inline comparten columna: el error cuelga debajo. */
.bl.pr .pr-suc{
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.bl.pr .pr-suc__row{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid var(--dc-line-card);
    border-radius: 10px;
}
.bl.pr .pr-suc__ico{
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: 8px;
    background: var(--dc-fill);
    color: var(--dc-navy);
}
.bl.pr .pr-suc__ico .mud-icon-root{
    font-size: 16px;
    color: var(--dc-navy);
}
/* Campo SIN marco: parece texto hasta que toma el foco, que lo rellena. */
.bl.pr .pr-suc__name{
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}
.bl.pr .pr-suc__name .mud-input.mud-input-filled{
    min-height: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
}
.bl.pr .pr-suc__name .mud-input.mud-input-filled:hover{
    background: var(--dc-hover);
}
.bl.pr .pr-suc__name .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    height: auto;
    padding: 6px 8px;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--dc-text);
}
.bl.pr .pr-suc__name .mud-input.mud-input-filled:focus-within{
    background: var(--dc-fill);
    outline: 2px solid var(--dc-navy);
    outline-offset: 1px;
}
.bl.pr .pr-suc__badge{
    flex: 0 0 auto;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
    font-size: 11.5px;
    font-weight: 800;
    line-height: 1.35;
    white-space: nowrap;
}
/* Hueco del ancho de la papelera, que la sede principal no lleva. */
.bl.pr .pr-suc__gap{
    width: 25px;
    flex: 0 0 auto;
}
.bl.pr .pr-suc__del{
    flex: 0 0 auto;
    padding: 4px;
    color: var(--dc-placeholder);
}
.bl.pr .pr-suc__del .mud-icon-root{
    font-size: 17px;
}
.bl.pr .pr-suc__del:hover{
    background: transparent;
    color: var(--dc-error);
}
.bl.pr .pr-suc__del:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}
.bl.pr .pr-suc__err{
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.35;
    color: var(--dc-error);
}
/* La ayuda cierra la lista, dentro de ella y no en el pie. Ver §6.12. */
.bl.pr .pr-suc__hint{
    font-size: 12.5px;
    color: var(--dc-text-muted);
}

/* --------------------------------------------------------------------------
   §9 — Alta en linea. La sucursal solo tiene nombre, asi que no gasta panel:
   una fila borrador sobre la lista, con marco navy. Ver §6.12.
   -------------------------------------------------------------------------- */
.bl.pr .pr-new{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1.5px solid var(--dc-navy);
    border-radius: 10px;
    background: var(--dc-panel);
}
.bl.pr .pr-new__plus{
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: 8px;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
}
.bl.pr .pr-new__plus .mud-icon-root{
    font-size: 16px;
    color: var(--dc-navy-ink);
}
/* Aca el campo SI lleva marco: es el unico dato que se escribe. */
.bl.pr .pr-new__fld{
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}
.bl.pr .pr-new__fld .mud-input.mud-input-filled{
    min-height: 0;
    border: 1px solid var(--dc-line-field);
    border-radius: 8px;
    background: var(--dc-surface);
}
.bl.pr .pr-new__fld .mud-input.mud-input-filled:hover{
    background: var(--dc-surface);
}
.bl.pr .pr-new__fld .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    height: auto;
    padding: 10px 12px;
    font-size: 14px;
    color: var(--dc-text);
}
.bl.pr .pr-new__fld .mud-input-slot::placeholder{
    color: var(--dc-placeholder);
    opacity: 1;
}
.bl.pr .pr-new__fld .mud-input.mud-input-filled:focus-within{
    outline: 2px solid var(--dc-navy);
    outline-offset: 1px;
}
/* Boton de la fila borrador: mas bajo que el de la barra, que mide 42px. */
.bl.pr .pr-btn--inline{
    padding: 10px 16px;
    border: 0;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
    font-size: 12.5px;
    box-shadow: none;
}
.bl.pr .pr-btn--inline:hover{
    background: var(--dc-navy-hover);
    box-shadow: none;
}
.bl.pr .pr-btn--plain{
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--dc-text-muted);
    font-size: 12.5px;
}
.bl.pr .pr-btn--plain:hover{
    background: transparent;
    color: var(--dc-text);
}

/* --------------------------------------------------------------------------
   §10 — Departamentos: arbol de tarjetas, no `.grid-hierarchy`. El catalogo
   es fijo: no hay alta de departamento. Ver §6.12.
   -------------------------------------------------------------------------- */
.bl.pr .pr-tree{
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 22px;
}
.bl.pr .pr-tree__lock{
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--dc-text-muted);
}
.bl.pr .pr-tree__lock .mud-icon-root{
    flex: 0 0 auto;
    font-size: 14px;
}
.bl.pr .pr-dep{
    overflow: hidden;
    border: 1px solid var(--dc-line-card);
    border-radius: 12px;
}
.bl.pr .pr-dep__head{
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 16px;
    background: var(--dc-surface);
}
.bl.pr .pr-dep__chev{
    flex: 0 0 auto;
    padding: 4px;
    color: var(--dc-text-muted);
    transition: transform var(--motion-fast) var(--motion-ease);
}
.bl.pr .pr-dep__chev .mud-icon-root{
    font-size: 16px;
}
.bl.pr .pr-dep__chev:hover{
    background: transparent;
    color: var(--dc-text);
}
.bl.pr .pr-dep__chev:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}
/* Desplegado: el galon gira un cuarto y apunta hacia abajo. */
.bl.pr .pr-dep__chev--on{
    transform: rotate(90deg);
}
/* El cuadro del departamento va en navy pleno: es la raiz del arbol. */
.bl.pr .pr-dep__ico{
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    border-radius: 8px;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
}
.bl.pr .pr-dep__ico .mud-icon-root{
    font-size: 16px;
    color: var(--dc-navy-ink);
}
.bl.pr .pr-dep__name{
    font-size: 15px;
    font-weight: 800;
    color: var(--dc-text);
    white-space: nowrap;
}
.bl.pr .pr-dep__sys{
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--dc-disabled);
    color: var(--dc-text-2);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.45;
    white-space: nowrap;
}
.bl.pr .pr-dep__sys .mud-icon-root{
    font-size: 10px;
}
.bl.pr .pr-dep__spacer{
    flex: 1 1 auto;
}
.bl.pr .pr-dep__count{
    font-size: 12.5px;
    font-weight: 600;
    color: var(--dc-text-muted);
    white-space: nowrap;
}
/* Los 62px de sangria alinean la bandeja con el nombre del departamento. */
.bl.pr .pr-dep__tray{
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 16px 12px 62px;
    border-top: 1px solid var(--pr-line-row);
    background: var(--dc-panel);
}
.bl.pr .pr-sub{
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px 14px;
    border: 1px solid var(--dc-line-card);
    border-radius: 10px;
    background: var(--dc-surface);
    font: inherit;
    text-align: left;
    transition: border-color var(--motion-fast) var(--motion-ease);
}
/* Solo la editable actua. La sembrada no lleva lapiz, ni cursor, ni hover. */
.bl.pr .pr-sub--act{
    cursor: pointer;
}
.bl.pr .pr-sub--act:hover{
    border-color: var(--dc-navy);
}
.bl.pr .pr-sub--act:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: -2px;
}
.bl.pr .pr-sub__name{
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 180px;
}
.bl.pr .pr-sub__t{
    font-size: 14px;
    font-weight: 700;
    color: var(--dc-text);
}
.bl.pr .pr-sub__def{
    flex: 0 0 auto;
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--dc-disabled);
    color: var(--dc-text-2);
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .4px;
    line-height: 1.45;
    white-space: nowrap;
}
.bl.pr .pr-sub__ramos{
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1 1 auto;
    flex-wrap: wrap;
}
.bl.pr .pr-sub__ramo{
    padding: 3px 9px;
    border-radius: 999px;
    background: var(--dc-fill);
    color: var(--dc-text-2);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.45;
}
.bl.pr .pr-sub__more{
    font-size: 12px;
    font-weight: 700;
    color: var(--dc-navy);
}
.bl.pr .pr-sub__count{
    font-size: 12px;
    font-weight: 600;
    color: var(--dc-text-muted);
    white-space: nowrap;
}
/* Hueco del ancho del lapiz, que la sembrada no lleva: alinea el borde. */
.bl.pr .pr-sub__pencil{
    width: 15px;
    flex: 0 0 auto;
    font-size: 15px;
    color: var(--dc-placeholder);
}
.bl.pr .pr-tree__empty{
    padding: 4px 0;
    font-size: 12.5px;
    color: var(--dc-placeholder);
}
/* Alta de sub-departamento, dentro de la cabeza de su departamento. */
.bl.pr .pr-btn--outline{
    flex: 0 0 auto;
    padding: 6px 12px;
    border: 1.5px solid var(--dc-navy);
    background: var(--dc-surface);
    color: var(--dc-navy);
    font-size: 12px;
    letter-spacing: normal;
}
.bl.pr .pr-btn--outline:hover{
    background: var(--dc-hover);
}
.bl.pr .pr-btn--outline .mud-button-icon-start{
    margin: 0 6px 0 0;
}
.bl.pr .pr-btn--outline .mud-button-icon-start .mud-icon-root{
    font-size: 13px;
}

/* --------------------------------------------------------------------------
   §11 — Selector de ramos del panel: dos bloques, elegidos arriba y
   disponibles abajo. Ni MudChipSet ni MudToggleGroup parten en dos. Ver §6.12.
   -------------------------------------------------------------------------- */
.bl.pr .pr-pick{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.bl.pr .pr-pick__row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.bl.pr .pr-pick__lbl{
    font-size: 11.5px;
    font-weight: 600;
    color: var(--dc-text-2);
}
.bl.pr .pr-pick__n{
    padding: 2px 9px;
    border-radius: 999px;
    background: var(--dc-fill);
    color: var(--dc-navy);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
    white-space: nowrap;
}
.bl.pr .pr-pick__sel{
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    padding: 10px;
    border: 1px solid var(--dc-line-card);
    border-radius: 8px;
    background: var(--dc-panel);
}
.bl.pr .pr-pick__hint{
    font-size: 11.5px;
    font-weight: 400;
    color: var(--dc-text-muted);
}
.bl.pr .pr-pick__find{
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 12px;
    border-radius: 8px;
    background: var(--dc-fill);
}
/* El campo va sin marco propio: la caja de 40px ya es el marco. */
.bl.pr .pr-pick__q{
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
}
.bl.pr .pr-pick__q .mud-input.mud-input-filled{
    height: auto;
    min-height: 0;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
}
.bl.pr .pr-pick__q .mud-input.mud-input-filled:hover{
    background: transparent;
}
.bl.pr .pr-pick__q .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    height: auto;
    padding: 0;
    font-size: 14px;
    color: var(--dc-text);
}
.bl.pr .pr-pick__q .mud-input-slot::placeholder{
    color: var(--dc-placeholder);
    opacity: 1;
}
.bl.pr .pr-pick__q .mud-input-adornment{
    margin: 0;
}
.bl.pr .pr-pick__q .mud-input-adornment .mud-icon-root{
    font-size: 14px;
    color: var(--dc-text-muted);
}
.bl.pr .pr-pick__list{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.bl.pr .pr-pick__none{
    font-size: 12.5px;
    color: var(--dc-placeholder);
}
/* Enlace de la caja de busqueda: obra solo sobre lo filtrado. Ver §6.12. */
.bl.pr .pr-btn--link{
    flex: 0 0 auto;
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--dc-navy);
    font-size: 12px;
    letter-spacing: normal;
}
.bl.pr .pr-btn--link:hover{
    background: transparent;
    color: var(--dc-navy-hover);
}
.bl.pr .pr-chip{
    min-width: 0;
    min-height: 0;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 1.45;
    text-transform: none;
    white-space: nowrap;
    box-shadow: none;
}
.bl.pr .pr-chip:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}
/* Elegido: navy pleno y una cruz que lo devuelve a disponibles. */
.bl.pr .pr-chip--on{
    padding: 4px 10px;
    border: 0;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
}
.bl.pr .pr-chip--on:hover{
    background: var(--dc-navy-hover);
    box-shadow: none;
}
.bl.pr .pr-chip--on .mud-button-icon-end{
    margin: 0 0 0 5px;
}
.bl.pr .pr-chip--on .mud-button-icon-end .mud-icon-root{
    font-size: 11px;
}
.bl.pr .pr-chip--off{
    padding: 6px 12px;
    border: 1.5px solid var(--dc-line-dash);
    background: var(--dc-surface);
    color: var(--dc-text-2);
    font-size: 12.5px;
}
.bl.pr .pr-chip--off:hover{
    border-color: var(--dc-navy);
    background: var(--dc-surface);
    color: var(--dc-navy);
}
.bl.pr .pr-chip--off .mud-button-icon-start{
    margin: 0 6px 0 0;
}
.bl.pr .pr-chip--off .mud-button-icon-start .mud-icon-root{
    font-size: 11px;
}

/* --------------------------------------------------------------------------
   §12 — Productores. Misma rejilla de Aseguradoras con su propio vector,
   avatar circular, pastilla de tipo y las cuatro cajas de comision. Ver §6.12.
   -------------------------------------------------------------------------- */
.bl.pr .pr-thead--prod,
.bl.pr .pr-row--prod{
    grid-template-columns: minmax(0, 1.8fr) minmax(0, .8fr) minmax(0, 1.6fr) 36px;
}
/* Avatar circular: MudAvatar sin `Rounded` ya es un circulo (mud-avatar-rounded
   es el que da esquinas). Los otros monogramas del modulo llevan Rounded. */
.bl.pr .pr-prod__ava{
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
    font-size: 13px;
    font-weight: 800;
}
.bl.pr .pr-prod__txt{
    gap: 1px;
    min-width: 0;
}
.bl.pr .pr-prod__meta{
    overflow: hidden;
    font-size: 12px;
    color: var(--dc-text-muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bl.pr .pr-prod__type{
    justify-self: start;
    max-width: 100%;
    padding: 3px 10px;
    border: 1.5px solid transparent;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    white-space: nowrap;
}
.bl.pr .pr-prod__type--on{
    background: var(--dc-navy);
    border-color: var(--dc-navy);
    color: var(--dc-navy-ink);
}
.bl.pr .pr-prod__type--off{
    background: var(--dc-surface);
    border-color: var(--dc-line-dash);
    color: var(--dc-text-2);
}
.bl.pr .pr-prod__comm{
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.bl.pr .pr-prod__pcts{
    display: flex;
    align-items: center;
    gap: 4px;
}
.bl.pr .pr-prod__pct{
    min-width: 38px;
    padding: 3px 5px;
    border-radius: 6px;
    font-size: 12.5px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    text-align: center;
    white-space: nowrap;
}
.bl.pr .pr-prod__pct--on{
    background: var(--dc-fill);
    color: var(--dc-navy);
}
/* El mock pide --dc-placeholder aqui, pero no llega al piso de contraste sobre
   --dc-panel en ningun tema (tools/css/conform.py); --dc-text-2 si alcanza. */
.bl.pr .pr-prod__pct--off{
    background: var(--dc-panel);
    color: var(--dc-text-2);
}
.bl.pr .pr-prod__scheme{
    font-size: 11.5px;
    font-weight: 700;
    color: var(--dc-text-muted);
}

/* Panel "Productor": kicker de seccion, filas de dos columnas y separador propio. */
.bl.pr .pr-prod__kicker{
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .8px;
    color: var(--dc-text-2);
}
.bl.pr .pr-prod__hint{
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--dc-text-muted);
}
.bl.pr .pr-prod__row2{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
.bl.pr .pr-prod__segwrap{
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.bl.pr .pr-prod__rule{
    margin: 6px 0;
    border-color: var(--dc-line-card);
}
.bl.pr .pr-prod__pctgrid{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

/* Segmentado Interno/Externo: reusa `.seg--dialog.seg--fill` de 07-language.css,
   con la geometria mas angosta del mock y los tokens navy propios del modulo. */
.bl.pr .pr-seg{
    height: auto;
    padding: 3px;
    gap: 3px;
    background: var(--dc-fill);
    border-radius: 8px;
}
.bl.pr .pr-seg > button{
    height: auto;
    padding: 8px 10px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--dc-text-2);
}
.bl.pr .pr-seg > button:hover{
    background: var(--dc-hover);
}
.bl.pr .pr-seg > button.seg__on{
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
}
.bl.pr .pr-seg > button.seg__on:hover{
    background: var(--dc-navy-hover);
}
.bl.pr .pr-seg > button:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}

/* Fecha de acuerdo: mismo `.pr-fld`, pero el icono del calendario va navy,
   no --dc-text-2 como el resto de los adornos del modulo. */
.bl.pr .pr-fld--date .mud-input-adornment .mud-icon-root{
    color: var(--dc-navy);
}

/* Comision por año: caja mas baja que `.pr-fld`, con "%" pegado al valor. */
.bl.pr .pr-fld--pct .mud-input.mud-input-filled{
    min-height: 0;
}
.bl.pr .pr-fld--pct .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    padding: 22px 0 7px 12px;
    font-size: 16px;
    font-weight: 700;
}
.bl.pr .pr-fld--pct label.mud-input-label-filled.mud-input-label-margin-dense,
.bl.pr .pr-fld--pct .mud-shrink ~ label.mud-input-label-filled.mud-input-label-margin-dense,
.bl.pr .pr-fld--pct .mud-input:focus-within ~ label.mud-input-label-filled.mud-input-label-margin-dense{
    transform: translate(12px, 7px);
}
.bl.pr .pr-fld--pct .mud-input.mud-input-filled > .mud-input-adornment-end{
    align-self: flex-end;
    margin: 0 12px 7px 0;
}
.bl.pr .pr-fld--pct .mud-input-adornment .mud-input-adornment-text{
    font-size: 13px;
    font-weight: 700;
    color: var(--dc-text-muted);
}

/* Tasa de la matriz: la misma caja de `.pr-fld--pct` encogida, porque cuatro de
   ellas y el nombre del ramo comparten una sola fila. */
.bl.pr .pr-fld--mini .mud-input.mud-input-filled{
    min-height: 44px;
}
.bl.pr .pr-fld--mini .mud-input.mud-input-filled .mud-input-slot:not(textarea){
    padding: 18px 0 5px 8px;
    font-size: 13px;
}
.bl.pr .pr-fld--mini label.mud-input-label-filled.mud-input-label-margin-dense,
.bl.pr .pr-fld--mini .mud-shrink ~ label.mud-input-label-filled.mud-input-label-margin-dense,
.bl.pr .pr-fld--mini .mud-input:focus-within ~ label.mud-input-label-filled.mud-input-label-margin-dense{
    transform: translate(8px, 4px);
    font-size: 10px;
}
.bl.pr .pr-fld--mini .mud-input.mud-input-filled > .mud-input-adornment-end{
    margin: 0 8px 5px 0;
}
.bl.pr .pr-fld--mini .mud-input-adornment .mud-input-adornment-text{
    font-size: 11px;
}

/* Casilla en tarjeta: mismo idioma que `.dc-check` de §6.2.4, reescrito bajo .pr
   porque aquel vive en el scope de un dialogo. */
.bl.pr .pr-check.mud-input-control{
    min-height: 56px;
    border: 1px solid var(--dc-line-card);
    border-radius: 8px;
    background: var(--dc-surface);
}
/* El label llena la tarjeta: toda la superficie conmuta la casilla. */
.bl.pr .pr-check .mud-input-control-input-container{
    flex: 1;
}
.bl.pr .pr-check .mud-checkbox{
    display: flex;
    align-items: center;
    gap: 2px;
    flex: 1;
    margin: 0;
    padding: 0 12px 0 8px;
}
.bl.pr .pr-check__body{
    gap: 1px;
}
.bl.pr .pr-check__title{
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--dc-text);
}
.bl.pr .pr-check__sub{
    font-size: 12px;
    line-height: 1.3;
    color: var(--dc-text-muted);
}

/* Matriz por ramo: para el interno ES la tarifa; para el externo, excepciones.
   Una tarjeta por ramo con sus tasas y la cruz. */
.bl.pr .pr-prod__mtxtitle{
    font-size: 13px;
    font-weight: 700;
    color: var(--dc-text);
}
.bl.pr .pr-mtx{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.bl.pr .pr-mtx__row{
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 28px;
    align-items: center;
    gap: 10px;
    padding: 8px 8px 8px 12px;
    border: 1px solid var(--dc-line-card);
    border-radius: 8px;
    background: var(--dc-surface);
}
.bl.pr .pr-mtx__name{
    overflow: hidden;
    font-size: 13px;
    font-weight: 700;
    color: var(--dc-text);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bl.pr .pr-mtx__pcts{
    display: grid;
    grid-template-columns: repeat(4, 64px);
    gap: 6px;
}
/* Cruz del ramo: idioma de pr-suc__del, un punto mas chica por la fila mas baja. */
.bl.pr .pr-mtx__del{
    flex: 0 0 auto;
    padding: 4px;
    color: var(--dc-placeholder);
}
.bl.pr .pr-mtx__del .mud-icon-root{
    font-size: 16px;
}
.bl.pr .pr-mtx__del:hover{
    background: transparent;
    color: var(--dc-error);
}
.bl.pr .pr-mtx__del:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}

/* Base bloqueada: el interno no elige, cobra sobre prima neta. El gancho va en el
   envoltorio: MudToggleGroup no marca su raiz al desactivarse. */
.bl.pr .pr-prod__segwrap--lock .pr-seg{
    opacity: .7;
}
.bl.pr .pr-prod__segwrap--lock .pr-seg > button{
    cursor: default;
}
/* Sin el hover que promete un clic que no ocurre, y la elegida sigue navy. */
.bl.pr .pr-prod__segwrap--lock .pr-seg > button:hover{
    background: transparent;
}
.bl.pr .pr-prod__segwrap--lock .pr-seg > button.seg__on,
.bl.pr .pr-prod__segwrap--lock .pr-seg > button.seg__on:hover{
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
}

/* --------------------------------------------------------------------------
   §13 — Productos: columna propia, pastilla de ramo distinta, y ramo de
   eleccion unica en el panel. Ver §6.12.
   -------------------------------------------------------------------------- */
.bl.pr .pr-thead--product,
.bl.pr .pr-row--product{
    grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1.4fr) 36px;
}
.bl.pr .pr-item__aseg{
    justify-self: start;
    max-width: 100%;
    overflow: hidden;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--dc-fill);
    color: var(--dc-navy);
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bl.pr .pr-item__ramo{
    overflow: hidden;
    font-size: 13px;
    font-weight: 600;
    color: var(--dc-text-2);
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Picker de ramo de eleccion unica: reusa pr-pick__find/__q/__list; el chip es
   nuevo porque no hay bloque de elegidos ni disponibles aqui. */
.bl.pr .pr-chip--pickon{
    padding: 6px 12px;
    border: 1.5px solid var(--dc-navy);
    background: var(--dc-navy);
    color: var(--dc-navy-ink);
}
.bl.pr .pr-chip--pickon:hover{
    background: var(--dc-navy-hover);
    border-color: var(--dc-navy-hover);
}
.bl.pr .pr-chip--pickoff{
    padding: 6px 12px;
    border: 1.5px solid var(--dc-line-dash);
    background: var(--dc-surface);
    color: var(--dc-text-2);
}
.bl.pr .pr-chip--pickoff:hover{
    border-color: var(--dc-navy);
    color: var(--dc-navy);
}

/* Planes (solo EDITAR): adicion del dueño sin mock propio. Reusa pr-prod__,
   pr-pick__, pr-dep__sys, pr-suc__del/err y pr-new/pr-btn__ donde calza. */
.bl.pr .pr-plan-list{
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.bl.pr .pr-plan{
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 14px;
    border: 1px solid var(--dc-line-card);
    border-radius: 10px;
    background: var(--dc-surface);
}
/* Plan inactivo: atenuado, como el resto de lo desactivado en la app. */
.bl.pr .pr-plan--off{
    opacity: .55;
}
.bl.pr .pr-plan__row{
    display: flex;
    align-items: center;
    gap: 10px;
}
.bl.pr .pr-plan__name{
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    font-size: 14px;
    font-weight: 700;
    color: var(--dc-text);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bl.pr .pr-plan__shared{
    font-size: 11.5px;
    color: var(--dc-text-muted);
}
.bl.pr .pr-plan__actions{
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
}
/* Lapiz del plan: idioma de pr-suc__del sin el rojo, porque no borra nada. */
.bl.pr .pr-plan__edit{
    flex: 0 0 auto;
    padding: 4px;
    color: var(--dc-placeholder);
}
.bl.pr .pr-plan__edit .mud-icon-root{
    font-size: 16px;
}
.bl.pr .pr-plan__edit:hover{
    background: transparent;
    color: var(--dc-text);
}
.bl.pr .pr-plan__edit:focus-visible{
    outline: 2px solid var(--dc-navy);
    outline-offset: 2px;
}
.bl.pr .pr-plan__editgrid{
    display: grid;
    grid-template-columns: 1fr 100px 90px;
    gap: 8px;
}
.bl.pr .pr-plan__editfoot{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 4px;
}

/* Borrador de plan: pr-new de Sucursales con tres campos, asi que envuelve. */
.bl.pr .pr-new--wrap{
    flex-wrap: wrap;
}
.bl.pr .pr-new__fld--code,
.bl.pr .pr-new__fld--cur{
    flex: 0 1 96px;
    min-width: 84px;
}

/* §6.13  Listas de Parámetros: ~10 filas y luego scroll dentro
   de la tarjeta (thead fuera del pr-scroll). Departamentos: L2 a ~5. */
.bl.pr .pr-scroll{
    max-height: 660px;      /* ~10 filas (fila ≈ 66px en Productos/Productores) */
    overflow-y: auto;
    overscroll-behavior: contain;
}
/* Sucursales son tarjetas: el pr-scroll recupera el aire entre filas que
   antes daba el pr-list, para que no queden pegadas. */
.bl.pr .pr-list .pr-scroll{
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.bl.pr .pr-dep__tray{
    max-height: 279px;      /* ~5 sub-departamentos (tarjeta 45px + gap 8 + padding 10/12) */
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* §6.14  Drawer de Productor: ajustes de composición. */
/* Encabezado del esquema: kicker y descripción apilados, para que
   "ESQUEMA DE COMISIONES" no se parta al competir por el ancho. */
.bl.pr .pr-prod__scheme-hdr{
    display: flex;
    flex-direction: column;
    gap: 4px;
}
/* Fila pareada (segmentado + campo): cajas alineadas por abajo y el
   segmentado a la altura del campo, para que arranquen y cierren parejos. */
.bl.pr .pr-prod__row2{
    align-items: end;
}
.bl.pr .pr-prod__row2 .pr-seg{
    min-height: 54px;
    align-items: stretch;
}
/* Los botones llenan la altura del segmentado, para un marco parejo. */
.bl.pr .pr-prod__row2 .pr-seg .mud-button{
    height: auto;
    min-height: 0;
}
/* El date picker suma 4px arriba y abajo en su control (el text field no),
   dejando su caja 4px alta. */
.bl.pr .pr-prod__row2 .pr-fld--date .mud-input-control{
    margin-top: 0;
    margin-bottom: 0;
}
/* Split % y tasas por año: el "%" comparte la línea base del valor. */
.bl.pr .pr-fld--pct .mud-input.mud-input-filled > .mud-input-adornment-end{
    margin-bottom: 19px;
}

/* §6.15  Corto plazo: the grid reuses the Ramos matrix (13-ramos.css); these style its toolbar. */
.bl.pr .pr-cp__add{
    display: flex;
}
/* El error ocupa su propia línea bajo GUARDAR, alineado a la derecha. */
.bl.pr .pr-cp__alert{
    flex: 1 0 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 6px;
    color: var(--dc-error);
}
.bl.pr .pr-cp__alert-ico{
    font-size: 16px;
}
.bl.pr .pr-fld--err .mud-input.mud-input-filled{
    box-shadow: inset 0 0 0 1.5px var(--dc-error);
}
.bl.pr .pr-check__tip{
    display: inline-flex;
    cursor: help;
}