:root {
    --azul-oscuro: #0f2742;
    --azul-principal: #174a7c;
    --azul-medio: #245d91;
    --azul-claro: #eaf2f8;
    --gris-fondo: #f4f6f8;
    --gris-borde: #dfe5ea;
    --gris-texto: #66717d;
    --blanco: #ffffff;
    --verde-fondo: #ebf8f1;
    --verde-texto: #23704d;
    --rojo-fondo: #fff1f1;
    --rojo-texto: #9f2929;
    --amarillo-fondo: #fff7df;
    --amarillo-texto: #75520a;
    --sombra: 0 8px 24px rgba(15, 39, 66, 0.08);
    --radio: 14px;
    --capa-barra-superior: 200;
    --capa-menu-principal: 300;
}

.entry-dialog {
    width: min(920px, calc(100% - 32px));
    max-width: none;
    max-height: min(90vh, 940px);
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 16px;
    background: var(--blanco);
    box-shadow: 0 24px 70px rgba(18, 35, 58, 0.28);
    color: #1f2933;
}

.entry-dialog::backdrop {
    background: rgba(18, 35, 58, 0.58);
    backdrop-filter: blur(2px);
}

body:has(.entry-dialog[open]) {
    overflow: hidden;
}

.entry-dialog-form {
    display: flex;
    max-height: min(90vh, 940px);
    flex-direction: column;
}

.entry-dialog-header,
.entry-dialog-footer {
    display: flex;
    gap: 18px;
    padding: 20px 24px;
    align-items: center;
    justify-content: space-between;
    background: var(--blanco);
}

.entry-dialog-header {
    border-bottom: 1px solid var(--gris-borde);
}

.entry-dialog-header h2 {
    margin: 0 0 5px;
    color: #12233a;
    font-size: 23px;
}

.entry-dialog-header p,
.entry-section-heading p {
    margin: 0;
    color: var(--gris-texto);
    line-height: 1.45;
}

.entry-dialog-close {
    display: inline-flex;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--gris-borde);
    border-radius: 50%;
    background: #f7f9fb;
    color: #344353;
    cursor: pointer;
    font-size: 25px;
    line-height: 1;
}

.entry-dialog-close:hover {
    border-color: var(--azul-principal);
    color: var(--azul-principal);
}

.entry-dialog-body {
    padding: 22px 24px 26px;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.entry-dialog-footer {
    border-top: 1px solid var(--gris-borde);
    justify-content: flex-end;
}

.entry-mode-selector {
    display: grid;
    margin: 0 0 22px;
    padding: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    border: 0;
}

.entry-mode-selector legend {
    margin-bottom: 9px;
    color: #344353;
    font-size: 13px;
    font-weight: 800;
}

.entry-mode-selector label {
    display: flex;
    gap: 10px;
    padding: 14px;
    align-items: flex-start;
    border: 1px solid #cfd8e1;
    border-radius: 11px;
    background: #fbfcfd;
    cursor: pointer;
}

.entry-mode-selector label:has(input:checked) {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
    box-shadow: inset 0 0 0 1px var(--azul-principal);
}

.entry-mode-selector input {
    width: auto;
    margin-top: 3px;
}

.entry-mode-selector span,
.entry-mode-selector strong,
.entry-mode-selector small {
    display: block;
}

.entry-mode-selector small {
    margin-top: 3px;
    color: var(--gris-texto);
    line-height: 1.35;
}

.entry-form-section {
    padding: 19px;
    border: 1px solid var(--gris-borde);
    border-radius: 12px;
    background: #fbfcfd;
}

.entry-form-section + .entry-form-section {
    margin-top: 16px;
}

.entry-form-section[hidden] {
    display: none;
}

.entry-section-heading {
    margin-bottom: 15px;
}

.entry-section-heading h3 {
    margin: 0 0 4px;
    color: #22354b;
    font-size: 16px;
}

.entry-section-heading h3 small {
    color: var(--gris-texto);
    font-size: 12px;
    font-weight: 600;
}

.entry-form-section label {
    display: block;
    color: #344353;
    font-size: 12px;
    font-weight: 700;
}

.entry-form-section label > .form-control {
    margin-top: 6px;
    font-size: 14px;
    font-weight: 400;
}

.entry-form-section input[readonly] {
    background: #eef3f7;
    color: #38506a;
    font-weight: 800;
}

.entry-pdf-section {
    margin-bottom: 16px;
    border-color: #bfd3e5;
    background: #f4f8fc;
}

.entry-pdf-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.entry-pdf-controls .secondary-button {
    min-height: 40px;
}

.entry-pdf-status {
    min-height: 18px;
    margin-top: 9px;
    color: var(--gris-texto);
    font-size: 12px;
    line-height: 1.45;
}

.entry-pdf-status.is-success {
    color: var(--verde-texto);
}

.entry-pdf-status.is-warning {
    color: var(--amarillo-texto);
}

.entry-pdf-status.is-error {
    color: var(--rojo-texto);
}

.entry-pdf-status.is-loading {
    color: var(--azul-principal);
}

[data-guarantees-fields] textarea {
    min-height: 108px;
}

.entry-span-full {
    grid-column: 1 / -1;
}

.entry-search-results {
    display: grid;
    gap: 7px;
    margin-top: 10px;
}

.entry-search-result {
    display: flex;
    width: 100%;
    gap: 12px;
    padding: 11px 12px;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #d5dde5;
    border-radius: 9px;
    background: var(--blanco);
    color: #22354b;
    cursor: pointer;
    text-align: left;
}

.entry-search-result:hover {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
}

.entry-search-result strong,
.entry-search-result small {
    display: block;
}

.entry-search-result small,
.entry-search-status {
    color: var(--gris-texto);
}

.entry-search-status {
    padding: 10px 2px;
    font-size: 12px;
}

.selected-process-card {
    margin-top: 12px;
    padding: 13px 14px;
    border: 1px solid #a9d4b7;
    border-radius: 10px;
    background: #eef9f1;
}

.selected-process-card span,
.selected-process-card strong,
.selected-process-card small {
    display: block;
}

.selected-process-card span {
    margin-bottom: 4px;
    color: #357049;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.selected-process-card strong {
    color: #1e5632;
}

.selected-process-card small {
    margin-top: 3px;
    color: #477456;
}

@media (max-width: 700px) {
    .entry-dialog {
        width: calc(100% - 16px);
        max-height: calc(100vh - 16px);
        border-radius: 12px;
    }

    .entry-dialog-form {
        max-height: calc(100vh - 16px);
    }

    .entry-dialog-header,
    .entry-dialog-footer,
    .entry-dialog-body {
        padding-right: 16px;
        padding-left: 16px;
    }

    .entry-mode-selector {
        grid-template-columns: 1fr;
    }

    .entry-pdf-controls {
        grid-template-columns: 1fr;
    }

    .entry-dialog-footer {
        align-items: stretch;
        flex-direction: column-reverse;
    }
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    background: var(--gris-fondo);
    color: #1f2933;
    font-family: Arial, Helvetica, sans-serif;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
    text-decoration: none;
}

.app {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    min-height: 100vh;
    transition: grid-template-columns 0.2s ease;
}

.app.sidebar-collapsed,
html.sidebar-collapsed .app {
    grid-template-columns: 76px minmax(0, 1fr);
}

.sidebar {
    display: flex;
    position: relative;
    z-index: var(--capa-menu-principal);
    min-height: 100vh;
    flex-direction: column;
    background: linear-gradient(180deg, #102e4d 0%, #173e64 100%);
    color: var(--blanco);
    transition: width 0.2s ease;
}

.sidebar-toggle {
    display: inline-grid;
    position: absolute;
    z-index: 2;
    top: 62px;
    right: 0;
    width: 28px;
    height: 28px;
    padding: 0;
    place-items: center;
    transform: translateX(50%);
    border: 1px solid #cad5df;
    border-radius: 50%;
    background: var(--blanco);
    box-shadow: 0 3px 9px rgba(15, 39, 66, 0.18);
    color: var(--azul-oscuro);
    cursor: pointer;
}

.sidebar-toggle:hover {
    background: #edf4fa;
}

.sidebar-toggle:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.55);
    outline-offset: 2px;
}

.sidebar-toggle svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform 0.2s ease;
}

.brand {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 24px 20px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.brand-mark {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    flex: 0 0 52px;
    overflow: hidden;
    border-radius: 50%;
}

.brand-mark img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    transform: scale(1.5);
}

.brand-copy h1 {
    margin: 0 0 5px;
    font-size: 20px;
}

.brand-copy {
    min-width: 0;
}

.brand-copy .brand-subtitle {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 11px;
    line-height: 1.4;
}

.brand-copy .brand-court {
    margin: 5px 0 0;
    color: rgba(255, 255, 255, 0.88);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.35;
}

.sidebar-label {
    margin: 23px 24px 11px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.nav {
    display: grid;
    gap: 5px;
    padding: 0 14px;
}

.nav-link {
    display: flex;
    position: relative;
    gap: 13px;
    align-items: center;
    min-height: 48px;
    padding: 10px 17px;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.86);
    transition: background 0.18s ease, color 0.18s ease;
}

.nav-link:hover,
.nav-link.active {
    background: rgba(255, 255, 255, 0.14);
    color: var(--blanco);
}

.nav-icon {
    display: inline-grid;
    width: 20px;
    height: 20px;
    place-items: center;
    flex: 0 0 20px;
}

.nav-icon svg {
    display: block;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

@media (min-width: 821px) {
    .sidebar-collapsed .sidebar-toggle svg {
        transform: rotate(180deg);
    }

    .sidebar-collapsed .brand {
        justify-content: center;
        padding-right: 12px;
        padding-left: 12px;
    }

    .sidebar-collapsed .brand-copy,
    .sidebar-collapsed .sidebar-label,
    .sidebar-collapsed .nav-text {
        display: none;
    }

    .sidebar-collapsed .nav {
        padding-top: 22px;
    }

    .sidebar-collapsed .nav-link {
        gap: 0;
        justify-content: center;
        padding-right: 14px;
        padding-left: 14px;
    }

    .sidebar-collapsed .nav-link::after {
        position: absolute;
        z-index: 40;
        top: 50%;
        left: calc(100% + 10px);
        padding: 7px 10px;
        transform: translate(-4px, -50%);
        border-radius: 7px;
        background: #102e4d;
        box-shadow: 0 4px 12px rgba(15, 39, 66, 0.2);
        color: var(--blanco);
        content: attr(data-label);
        font-size: 12px;
        font-weight: 700;
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.15s ease, transform 0.15s ease;
        white-space: nowrap;
    }

    .sidebar-collapsed .nav-link:hover::after,
    .sidebar-collapsed .nav-link:focus-visible::after {
        transform: translate(0, -50%);
        opacity: 1;
    }
}

.main {
    display: flex;
    min-width: 0;
    min-height: 100vh;
    flex-direction: column;
}

.topbar {
    display: flex;
    position: sticky;
    z-index: var(--capa-barra-superior);
    top: 0;
    min-height: 78px;
    padding: 0 30px;
    align-items: center;
    justify-content: space-between;
    background: var(--blanco);
    border-bottom: 1px solid var(--gris-borde);
}

.topbar-left,
.user,
.heading-actions,
.confirmation-actions,
.form-actions {
    display: flex;
    gap: 11px;
    align-items: center;
}

.menu-button {
    display: none;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 1px solid var(--gris-borde);
    border-radius: 9px;
    background: var(--blanco);
    color: var(--azul-oscuro);
    cursor: pointer;
    font-size: 21px;
}

.user-avatar {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 50%;
    background: var(--azul-claro);
    color: var(--azul-principal);
    font-weight: 800;
}

.user-name,
.user-role {
    display: block;
}

.user-name {
    font-weight: 700;
}

.user-role {
    margin-top: 3px;
    color: var(--gris-texto);
    font-size: 11px;
}

.content {
    display: flex;
    padding: 30px;
    flex: 1;
    flex-direction: column;
}

.page-heading {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.page-heading h1 {
    margin: 0 0 7px;
    color: #12233a;
    font-size: 34px;
}

.page-heading p,
.section-description,
.search-help {
    margin: 0;
    color: var(--gris-texto);
    line-height: 1.5;
}

.search-help {
    margin-top: 8px;
}

.welcome {
    display: grid;
    min-height: 230px;
    padding: 36px;
    place-items: center;
    border: 1px solid var(--gris-borde);
    border-radius: var(--radio);
    background: var(--blanco);
    box-shadow: var(--sombra);
    text-align: center;
}

.welcome h1 {
    margin: 12px 0 8px;
    color: #12233a;
    font-size: 32px;
}

.welcome p {
    max-width: 650px;
    margin: 0;
    color: var(--gris-texto);
    line-height: 1.6;
}

.welcome-icon {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    border-radius: 16px;
    background: var(--azul-claro);
    color: var(--azul-principal);
    font-size: 29px;
}

.panel,
.card,
.search-panel,
.results-panel,
.tabs-panel {
    margin-bottom: 20px;
    overflow: hidden;
    border: 1px solid var(--gris-borde);
    border-radius: var(--radio);
    background: var(--blanco);
    box-shadow: var(--sombra);
}

.search-panel {
    padding: 20px;
}

.panel-heading,
.card-header,
.results-heading,
.search-section {
    padding: 19px 20px;
}

.panel-heading,
.card-header,
.results-heading {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--gris-borde);
}

.panel-heading h2,
.card-header h2,
.results-heading h2 {
    margin: 0 0 4px;
    color: #1d2b3b;
    font-size: 18px;
}

.section-title {
    margin: 0 0 6px;
    padding: 0;
    color: #1d2b3b;
    font-size: 18px;
}

.section-description {
    margin-bottom: 16px;
}

.nij-search-section {
    padding: 14px 20px 16px;
}

.nij-search-section .section-title {
    margin-bottom: 3px;
    padding: 0;
}

.nij-search-section .section-description {
    margin-bottom: 10px;
}

.result-section {
    margin: 0;
    padding: 20px;
    overflow: visible;
    border: 0;
    border-top: 1px solid var(--gris-borde);
    border-radius: 0;
    background: #fbfcfd;
    box-shadow: none;
}

.type-selection-form {
    margin-bottom: 20px;
}

.dynamic-fields {
    margin-top: 16px;
}

.panel-heading p,
.card-header p,
.results-heading p,
.section-title p {
    margin: 0;
    color: var(--gris-texto);
    font-size: 12px;
}

.search-form,
.limit-form,
.search-row {
    display: flex;
    gap: 10px;
    align-items: end;
}

.search-form > div,
.search-row > div {
    flex: 1;
}

.salidas-search-scope {
    display: block;
    margin: 12px 0 0;
    padding: 0;
    border: 0;
}

.salidas-search-scope legend {
    margin: 0 0 7px;
    color: #536170;
    font-size: 12px;
    font-weight: 700;
}

.salidas-scope-option {
    display: inline-flex;
    gap: 7px;
    align-items: center;
    cursor: pointer;
}

.salidas-scope-option + .salidas-scope-option {
    margin-left: 14px;
}

.salidas-scope-option input {
    width: 18px;
    height: 18px;
    margin: 0;
    flex: 0 0 18px;
    appearance: none;
    border: 2px solid #9aa8b6;
    border-radius: 50%;
    background: var(--blanco);
    cursor: pointer;
}

.salidas-scope-option span {
    color: #536170;
    font-size: 12px;
    font-weight: 700;
}

.salidas-scope-option input:checked {
    border-color: var(--azul-principal);
    background: var(--azul-principal);
    box-shadow: inset 0 0 0 4px var(--blanco);
}

.salidas-scope-option input:checked + span {
    color: var(--azul-principal);
}

.salidas-scope-option input:focus-visible {
    outline: 3px solid rgba(25, 118, 210, 0.22);
    outline-offset: 2px;
}

.field-label,
.search-label {
    display: block;
    margin-bottom: 7px;
    color: #344353;
    font-size: 12px;
    font-weight: 700;
}

.form-control,
.search-input,
.edit-field,
.limit-select,
.type-selector,
input[type="date"],
input[type="time"],
input[type="url"],
input[type="text"],
input[type="password"],
select,
textarea {
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #cfd8e1;
    border-radius: 9px;
    background: var(--blanco);
    color: #1f2933;
}

.limit-select {
    width: auto;
    min-width: 86px;
}

.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
    white-space: nowrap !important;
}

.links-navigation {
    padding: 16px 20px 18px;
    border-bottom: 1px solid var(--gris-borde);
    background: #fbfcfd;
}

.links-date-toolbar {
    display: flex;
    gap: 16px;
    padding-bottom: 14px;
    align-items: center;
    border-bottom: 1px solid #e4e9ee;
}

.links-toolbar-label {
    flex: 0 0 auto;
    color: #344353;
    font-size: 12px;
    font-weight: 800;
}

.date-navigation {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.date-nav-button,
.pagination-link,
.page-go-button,
.filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c8d1da;
    background: var(--blanco);
    color: #344353;
    font-weight: 700;
    white-space: nowrap;
}

.date-nav-button {
    min-height: 39px;
    padding: 8px 12px;
    border-radius: 8px;
    font-size: 12px;
}

.date-nav-button:hover,
.date-nav-button.is-active,
.pagination-link:hover,
.page-go-button:hover {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
    color: var(--azul-principal);
}

.date-picker-form {
    display: block;
}

.links-filter-form label {
    display: block;
    color: #536170;
    font-size: 11px;
    font-weight: 700;
}

.date-navigation-input {
    width: 155px;
    min-height: 39px;
    padding: 8px 10px;
    border: 1px solid #c8d1da;
    border-radius: 8px;
    background: var(--blanco);
}

.links-filter-form {
    display: grid;
    grid-template-columns:
        minmax(250px, 420px)
        320px
        190px
        auto;
    gap: 10px;
    margin-top: 14px;
    align-items: end;
    justify-content: start;
}

.links-filter-form label {
    margin-bottom: 6px;
}

.links-filter-form .form-control {
    min-height: 41px;
}

.links-filter-actions {
    display: flex;
    gap: 7px;
}

.links-filter-actions .primary-button,
.links-filter-actions .secondary-button {
    min-height: 41px;
    padding: 9px 13px;
}

.date-range-picker {
    position: relative;
    width: 100%;
    max-width: 320px;
    min-width: 0;
}

.date-range-native {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.js .date-range-picker .date-range-native,
.date-range-picker.is-enhanced .date-range-native {
    display: none;
}

.date-range-trigger {
    display: none;
    width: 100%;
    min-height: 41px;
    padding: 8px 10px;
    align-items: center;
    gap: 8px;
    border: 1px solid #cfd8e1;
    border-radius: 9px;
    background: var(--blanco);
    color: #536170;
    cursor: pointer;
    text-align: left;
}

.js .date-range-picker .date-range-trigger,
.date-range-picker.is-enhanced .date-range-trigger {
    display: flex;
}

.date-range-picker.has-value .date-range-trigger {
    border-color: #a9bed1;
    color: var(--azul-oscuro);
}

.date-range-picker.is-open .date-range-trigger,
.date-range-trigger:focus-visible {
    border-color: var(--azul-principal);
    outline: 3px solid rgba(25, 118, 210, 0.16);
    outline-offset: 1px;
}

.date-range-trigger svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.date-range-trigger span {
    min-width: 0;
    overflow: hidden;
    flex: 1 1 auto;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.date-range-trigger .date-range-chevron {
    width: 15px;
    height: 15px;
    flex-basis: 15px;
}

.date-range-popover {
    position: absolute;
    z-index: 60;
    top: calc(100% + 8px);
    right: 0;
    width: min(640px, calc(100vw - 40px));
    padding: 14px;
    border: 1px solid #ccd6df;
    border-radius: 12px;
    background: var(--blanco);
    box-shadow: 0 18px 45px rgba(15, 39, 66, 0.22);
}

.date-range-popover[hidden] {
    display: none;
}

.date-range-toolbar,
.date-range-footer,
.date-range-footer-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.date-range-toolbar {
    justify-content: space-between;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5ebf0;
}

.date-range-toolbar span {
    color: #344353;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.date-range-toolbar button {
    display: grid;
    width: 32px;
    height: 32px;
    padding: 0;
    place-items: center;
    flex: 0 0 32px;
    border: 1px solid #cbd5df;
    border-radius: 8px;
    background: var(--blanco);
    color: var(--azul-principal);
    cursor: pointer;
    font-size: 22px;
}

.date-range-toolbar button:hover {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
}

.date-range-calendars {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: 14px 0;
}

.date-range-calendar h3 {
    margin: 0 0 10px;
    color: var(--azul-oscuro);
    font-size: 14px;
    text-align: center;
    text-transform: capitalize;
}

.date-range-weekdays,
.date-range-days {
    display: grid;
    grid-template-columns: repeat(7, minmax(30px, 1fr));
}

.date-range-weekdays span {
    padding: 4px 0 7px;
    color: #73808d;
    font-size: 10px;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
}

.date-range-day,
.date-range-day-empty {
    min-width: 0;
    min-height: 34px;
}

.date-range-day {
    position: relative;
    z-index: 1;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #273444;
    cursor: pointer;
    font-size: 12px;
}

.date-range-day:hover,
.date-range-day:focus-visible {
    border-color: #91b9dc;
    outline: none;
    background: var(--azul-claro);
    color: var(--azul-principal);
}

.date-range-day.is-today {
    border-color: #9eacb8;
    font-weight: 800;
}

.date-range-day.is-in-range {
    border-radius: 0;
    background: #e8f2fb;
    color: var(--azul-oscuro);
}

.date-range-day.is-start,
.date-range-day.is-end {
    border-color: var(--azul-principal);
    background: var(--azul-principal);
    color: var(--blanco);
    font-weight: 800;
}

.date-range-footer {
    min-height: 39px;
    padding-top: 12px;
    justify-content: space-between;
    border-top: 1px solid #e5ebf0;
}

.date-range-status {
    color: #536170;
    font-size: 11px;
}

.date-range-footer-actions button {
    min-height: 34px;
    padding: 6px 11px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
}

.date-range-clear {
    border: 1px solid #cbd5df;
    background: var(--blanco);
    color: #536170;
}

.date-range-accept {
    border: 1px solid var(--azul-principal);
    background: var(--azul-principal);
    color: var(--blanco);
}

.active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
    align-items: center;
}

.active-filters-label {
    color: #536170;
    font-size: 11px;
    font-weight: 700;
}

.filter-chip {
    max-width: min(320px, 100%);
    min-height: 29px;
    padding: 5px 9px;
    overflow: hidden;
    border-color: #b9cee2;
    border-radius: 999px;
    background: #eef5fb;
    color: var(--azul-principal);
    font-size: 11px;
    text-overflow: ellipsis;
}

.filter-chip:hover {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
}

.links-pagination {
    display: flex;
    min-width: 0;
    gap: 5px;
    align-items: center;
    justify-content: center;
}

.links-pagination-inferior {
    padding: 16px 20px;
    border-top: 1px solid var(--gris-borde);
    background: #fbfcfd;
}

.pagination-actions {
    display: flex;
    gap: 4px;
}

.pagination-link,
.page-go-button {
    min-height: 33px;
    padding: 6px 10px;
    border-radius: 7px;
    font-size: 11px;
}

.pagination-link.is-disabled {
    opacity: 0.48;
    cursor: default;
    pointer-events: none;
}

.pagination-icon-link {
    display: inline-grid;
    width: 33px;
    min-width: 33px;
    height: 33px;
    min-height: 33px;
    padding: 0;
    place-items: center;
    font-size: 16px;
    line-height: 1;
}

.page-jump-form {
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
    align-items: center;
    color: #536170;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.page-number-input {
    width: 52px;
    min-height: 33px;
    padding: 5px 7px;
    border: 1px solid #c8d1da;
    border-radius: 7px;
    background: var(--blanco);
    text-align: center;
}

.page-total {
    min-width: 24px;
    color: var(--gris-texto);
    text-align: left;
}

.page-go-button {
    cursor: pointer;
}

.links-limit-form {
    flex: 0 0 auto;
    align-items: center;
    color: #536170;
    font-size: 12px;
    font-weight: 700;
}

.links-limit-form .limit-select {
    width: 122px;
    min-width: 122px;
    color: #344353;
    font-size: 1rem;
    font-weight: 700;
}

textarea,
.observation {
    min-height: 96px;
    resize: vertical;
    line-height: 1.45;
}

.observation {
    width: 310px;
}

.rezagados-table .observation {
    height: 54px;
    min-height: 54px;
    max-height: 120px;
    overflow-y: auto;
}

.rezagados-table .field-help {
    margin-top: 0;
}

.rezagados-table th:nth-child(1),
.rezagados-table td:nth-child(1) {
    min-width: 120px;
    overflow-wrap: normal;
    white-space: nowrap;
    word-break: normal;
}

.rezagados-table th:nth-child(2),
.rezagados-table td:nth-child(2) {
    min-width: 210px;
    overflow-wrap: normal;
    white-space: nowrap;
    word-break: normal;
}

.form-grid,
.readonly-grid,
.dynamic-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.dynamic-field.full-width {
    grid-column: 1 / -1;
}

.readonly-grid {
    margin: 16px 0 20px;
}

.result-section .form-grid {
    margin-top: 16px;
}

.readonly-card {
    padding: 14px;
    border: 1px solid var(--gris-borde);
    border-radius: 10px;
    background: #f8fafb;
}

.readonly-card span {
    display: block;
    margin-bottom: 6px;
    color: var(--gris-texto);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.readonly-card strong {
    display: block;
    overflow-wrap: anywhere;
}

.primary-button,
.secondary-button,
.search-button,
.limit-button,
.clear-link,
.logout-button {
    display: inline-flex;
    min-height: 42px;
    padding: 10px 16px;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    cursor: pointer;
    font-weight: 700;
    white-space: nowrap;
}

.primary-button,
.search-button {
    border: 1px solid var(--azul-principal);
    background: var(--azul-principal);
    color: var(--blanco);
}

.primary-button:hover,
.search-button:hover {
    background: var(--azul-medio);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(36, 93, 145, 0.35);
    outline-offset: 2px;
}

.secondary-button,
.clear-link,
.limit-button,
.logout-button {
    border: 1px solid #c8d1da;
    background: var(--blanco);
    color: #344353;
}

.logout-button {
    min-height: 36px;
    padding: 8px 11px;
    font-size: 11px;
}

.logout-button:hover {
    border-color: var(--azul-principal);
    color: var(--azul-principal);
}

.login-form,
.session-summary {
    width: min(420px, 100%);
}

.login-form h2,
.session-summary h2 {
    margin: 14px 0 18px;
    color: #12233a;
    font-size: 28px;
}

.login-form .welcome-icon,
.session-summary .welcome-icon {
    margin: 0 auto;
}

.login-field {
    margin-bottom: 15px;
    text-align: left;
}

.login-button {
    width: 100%;
    margin-top: 4px;
}

.login-form .error-message {
    margin-bottom: 16px;
    text-align: left;
}

.session-summary p {
    margin: 0 auto;
}

.audit-filters {
    display: grid;
    grid-template-columns: minmax(260px, 2fr) repeat(4, minmax(145px, 1fr));
    gap: 12px;
    align-items: end;
}

.audit-filter-actions {
    display: flex;
    grid-column: 1 / -1;
    gap: 9px;
    justify-content: flex-end;
}

.audit-list {
    display: grid;
    gap: 14px;
    padding: 18px 20px 20px;
}

.audit-event {
    padding: 18px;
    border: 1px solid var(--gris-borde);
    border-radius: 11px;
    background: #fbfcfd;
}

.audit-event-heading {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
}

.audit-event-heading > div {
    display: flex;
    gap: 9px;
    align-items: center;
}

.audit-event-heading time {
    color: var(--gris-texto);
    font-size: 12px;
}

.audit-badge {
    display: inline-flex;
    min-height: 26px;
    padding: 5px 8px;
    align-items: center;
    border-radius: 999px;
    background: var(--azul-claro);
    color: var(--azul-principal);
    font-size: 10px;
    font-weight: 800;
}

.audit-description {
    margin: 13px 0;
    line-height: 1.5;
}

.audit-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.audit-meta div {
    min-width: 0;
    padding: 10px;
    border-radius: 8px;
    background: var(--blanco);
}

.audit-meta dt {
    margin-bottom: 4px;
    color: var(--gris-texto);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.audit-meta dd {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 12px;
}

.audit-request-id {
    font-family: Consolas, monospace;
}

.audit-fields {
    margin: 13px 0 0;
    color: #455566;
    font-size: 12px;
}

.audit-details {
    margin-top: 14px;
    border-top: 1px solid var(--gris-borde);
}

.audit-details summary {
    padding-top: 13px;
    color: var(--azul-principal);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.audit-json-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.audit-json-grid h3 {
    margin: 0 0 6px;
    font-size: 13px;
}

.audit-json-grid pre {
    max-height: 360px;
    margin: 0;
    padding: 12px;
    overflow: auto;
    border-radius: 8px;
    background: #102e4d;
    color: #eef5fb;
    font: 11px/1.5 Consolas, monospace;
    white-space: pre-wrap;
}

.audit-pagination {
    display: flex;
    gap: 12px;
    padding: 16px 20px;
    align-items: center;
    justify-content: center;
    border-top: 1px solid var(--gris-borde);
    color: var(--gris-texto);
    font-size: 12px;
}

.notice,
.error-message,
.success-message,
.form-errors {
    margin-bottom: 18px;
    padding: 14px 16px;
    border: 1px solid transparent;
    border-radius: 10px;
    line-height: 1.5;
}

.notice.success,
.success-message {
    border-color: #bee5cf;
    background: var(--verde-fondo);
    color: var(--verde-texto);
}

.success-message[data-auto-dismiss] {
    position: fixed;
    z-index: 100;
    right: 24px;
    bottom: 24px;
    width: min(420px, calc(100vw - 48px));
    margin: 0;
    box-shadow: 0 12px 32px rgba(15, 39, 66, 0.2);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.success-message.is-dismissing {
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
}

.notice.warning {
    border-color: #ebd28c;
    background: var(--amarillo-fondo);
    color: var(--amarillo-texto);
}

.notice.error,
.error-message,
.form-errors {
    border-color: #efc7c7;
    background: var(--rojo-fondo);
    color: var(--rojo-texto);
}

.form-errors ul {
    margin: 7px 0 0;
    padding-left: 20px;
}

.confirmation {
    margin-bottom: 20px;
    padding: 20px;
    border: 1px solid #ebd28c;
    border-radius: var(--radio);
    background: var(--amarillo-fondo);
    box-shadow: var(--sombra);
    color: var(--amarillo-texto);
}

.confirmation h2 {
    margin: 0 0 8px;
    color: #604307;
    font-size: 20px;
}

.confirmation p {
    margin: 6px 0;
    line-height: 1.5;
}

.confirmation-actions,
.form-actions {
    margin-top: 16px;
}

.tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px;
    overflow: visible;
    border-bottom: 1px solid var(--gris-borde);
}

.tab-link {
    padding: 10px 13px;
    border: 1px solid var(--gris-borde);
    border-radius: 8px;
    background: #f8fafb;
    color: #536170;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.tab-link:hover,
.tab-link.active {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
    color: var(--azul-principal);
}

.table-scroll,
.table-wrap {
    max-height: clamp(360px, 68vh, 720px);
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-color: #aebbc7 transparent;
    scrollbar-width: thin;
}

table,
.results-table {
    width: 100%;
    border-collapse: collapse;
}

.results-table {
    min-width: 1080px;
}

.table-inventario {
    min-width: 1900px;
}

.table-entrantes {
    min-width: 1740px;
}

.table-entrantes-secretario {
    min-width: 2260px;
}

.table-entrantes .table-date {
    width: 145px;
}

.table-entrantes .table-time {
    width: 110px;
}

.table-entrantes .table-textarea {
    min-width: 280px;
    min-height: 96px;
    resize: vertical;
}

.entrante-row-form {
    display: none;
}

.auto-download-form {
    margin: 0;
}

.auto-download-button {
    cursor: pointer;
}

.auto-unavailable {
    color: var(--gris-texto);
    font-size: 11px;
    white-space: nowrap;
}

.entrante-error-row td {
    position: static;
    padding: 8px 12px;
    background: var(--rojo-fondo);
}

.entrante-error-row .row-errors {
    width: auto;
    margin: 0;
}

.table-links {
    min-width: 1200px;
}

.table-links td {
    vertical-align: middle;
}

.table-links .table-time {
    width: 110px;
    padding-right: 8px;
}

.link-row-form {
    display: none;
}

.table-links .link-cell-display {
    display: flex;
    width: 360px;
    max-width: 360px;
    gap: 7px;
    align-items: center;
}

.table-links .link-cell-value {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    align-items: center;
}

.link-url {
    min-width: 0;
    overflow: hidden;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.link-empty-value {
    color: var(--gris-texto);
}

.table-links .link-cell-actions {
    display: inline-flex;
    gap: 7px;
    margin-left: auto;
    flex: 0 0 auto;
    align-items: center;
}

.copy-link-placeholder {
    width: 27px;
    height: 27px;
    flex: 0 0 27px;
    visibility: hidden;
}

.link-display-actions {
    display: flex;
    min-width: 0;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
    white-space: nowrap;
}

.audience-link {
    color: var(--azul-principal);
    font-weight: 700;
    text-decoration: none;
}

.open-link-button {
    display: inline-grid;
    width: 31px;
    height: 31px;
    padding: 0;
    place-items: center;
    flex: 0 0 31px;
    border: 1px solid #c7d1da;
    border-radius: 6px;
    background: var(--blanco);
    color: var(--azul-principal);
}

.open-link-button:hover {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
}

.open-link-button.is-disabled {
    border-color: #d8e0e7;
    background: #f4f6f8;
    color: #a3afba;
    cursor: not-allowed;
    opacity: 0.75;
}

.open-link-button svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.muted-value {
    color: var(--gris-texto);
    font-style: italic;
}

.link-edit-button {
    display: inline-grid;
    width: 31px;
    height: 31px;
    min-height: 31px;
    margin-left: 2px;
    padding: 0;
    place-items: center;
    flex: 0 0 31px;
}

.link-edit-button svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.link-dialog {
    width: min(680px, calc(100% - 32px));
}

.copy-link-button {
    display: inline-grid;
    width: 27px;
    height: 27px;
    padding: 0;
    place-items: center;
    flex: 0 0 27px;
    border: 1px solid #c7d1da;
    border-radius: 6px;
    background: var(--blanco);
    color: var(--azul-principal);
    cursor: pointer;
    font-size: 15px;
}

.copy-link-button:hover {
    border-color: var(--azul-principal);
    background: var(--azul-claro);
}

.copy-link-button.is-disabled,
.copy-link-button:disabled {
    border-color: #d8e0e7;
    background: #f4f6f8;
    color: #a3afba;
    cursor: not-allowed;
    opacity: 0.75;
}

.copy-link-button.copied {
    border-color: #79bf99;
    background: var(--verde-fondo);
    color: var(--verde-texto);
}

.copy-link-button svg,
.delete-link-button svg {
    display: block;
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.copy-link-button .copy-success-icon {
    display: none;
}

.copy-link-button.copied .copy-default-icon {
    display: none;
}

.copy-link-button.copied .copy-success-icon {
    display: block;
}

.delete-link-button {
    display: inline-grid;
    width: 27px;
    height: 27px;
    padding: 0;
    place-items: center;
    flex: 0 0 27px;
    border: 1px solid #e1bcbc;
    border-radius: 6px;
    background: var(--blanco);
    color: var(--rojo-texto);
    cursor: pointer;
}

.delete-link-button:hover {
    border-color: var(--rojo-texto);
    background: var(--rojo-fondo);
}

.link-editor-input {
    width: 360px;
}

.editable-cell.editing > .link-editor-input {
    width: 100%;
    min-width: 360px;
}

.table-links .link-error-row td {
    position: static;
    padding: 8px 12px;
    background: var(--rojo-fondo);
}

.link-error-row .row-errors {
    width: auto;
    margin: 0;
}

.table-audiencias {
    width: max-content;
    min-width: 100%;
}

.table-wrap .table-audiencias {
    min-width: 100%;
}

.table-audiencias th,
.table-audiencias td {
    width: 1%;
    padding-right: 10px;
    padding-left: 10px;
}

.audiencias-search-panel {
    position: relative;
    z-index: 12;
    overflow: visible;
}

.audiencias-results-panel,
.entrantes-results-panel {
    overflow: visible;
}

.audiencias-results-panel .results-heading,
.entrantes-results-panel .results-heading {
    position: relative;
    z-index: 15;
}

.audiencias-heading-actions,
.entrantes-heading-actions {
    display: flex;
    gap: 18px;
    align-items: center;
}

.audiencias-heading-actions .section-description {
    margin: 0;
}

.actas-download-form {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    align-items: center;
}

.actas-download-button {
    gap: 7px;
    white-space: nowrap;
}

.actas-download-icon,
.actas-download-chevron {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.actas-download-icon {
    width: 16px;
    height: 16px;
}

.actas-download-control {
    position: relative;
}

.actas-download-chevron {
    margin-left: 2px;
    width: 14px;
    height: 14px;
    transition: transform 0.16s ease;
}

.actas-download-button[aria-expanded="true"] .actas-download-chevron {
    transform: rotate(180deg);
}

.actas-download-menu {
    position: absolute;
    z-index: 30;
    top: calc(100% + 7px);
    left: 0;
    width: min(310px, calc(100vw - 48px));
    padding: 6px;
    border: 1px solid var(--gris-borde);
    border-radius: 10px;
    background: var(--blanco);
    box-shadow: 0 14px 34px rgba(15, 39, 66, 0.2);
}

.actas-download-menu button {
    display: flex;
    width: 100%;
    padding: 10px 11px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--azul-oscuro);
    cursor: pointer;
    text-align: left;
    flex-direction: column;
    gap: 2px;
}

.actas-download-menu button:hover,
.actas-download-menu button:focus-visible {
    background: var(--azul-claro);
    outline: none;
}

.actas-download-menu button span {
    color: var(--gris-texto);
    font-size: 0.78rem;
    line-height: 1.3;
}

.actas-download-button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.actas-download-hint {
    color: var(--gris-texto);
    font-size: 0.78rem;
    white-space: nowrap;
}

.column-visibility {
    position: relative;
    margin-left: auto;
}

.column-toggle-button {
    gap: 7px;
}

.column-menu {
    position: absolute;
    z-index: 15;
    top: calc(100% + 8px);
    right: 0;
    width: min(360px, calc(100vw - 48px));
    max-height: 480px;
    padding: 14px;
    overflow-y: auto;
    border: 1px solid var(--gris-borde);
    border-radius: 10px;
    background: var(--blanco);
    box-shadow: 0 14px 34px rgba(15, 39, 66, 0.2);
}

.column-menu > strong {
    display: block;
    margin-bottom: 10px;
}

.column-menu label {
    display: flex;
    gap: 9px;
    padding: 7px 3px;
    align-items: flex-start;
    color: #344353;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.35;
}

.column-menu label input {
    width: auto;
    margin: 1px 0 0;
}

.column-menu-actions {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

.column-menu-actions button {
    padding: 6px 8px;
    border: 1px solid var(--gris-borde);
    border-radius: 7px;
    background: #f8fafb;
    color: var(--azul-principal);
    cursor: pointer;
    font-size: 11px;
    font-weight: 700;
}

.column-hidden {
    display: none !important;
}

.table-input,
.table-select,
.table-textarea {
    width: 175px;
    padding: 7px 8px;
    border: 1px solid #cfd8e1;
    border-radius: 7px;
    background: var(--blanco);
    color: #1f2933;
    font-size: 12px;
}

.table-date {
    width: 132px;
}

.table-time {
    width: 124px;
    padding-right: 48px;
}

.time-editor {
    position: relative;
    width: 124px;
}

.editable-cell.editing .cell-editor.time-editor {
    display: flex;
    align-items: center;
}

.time-clear-button {
    display: grid;
    position: absolute;
    right: 28px;
    width: 20px;
    height: 26px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #788592;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.time-clear-button:hover {
    background: #f1f4f7;
    color: var(--rojo-texto);
}

.table-select-wide {
    width: 285px;
}

.table-select:disabled {
    border-color: #d8dee5;
    background: #eef1f4;
    color: #7a8793;
    cursor: not-allowed;
    opacity: 0.8;
}

.table-textarea {
    width: 190px;
    min-height: 52px;
    max-height: 100px;
    resize: vertical;
}

.table-audiencias td {
    vertical-align: middle;
}

.editable-cell {
    cursor: cell;
    transition: background 0.15s ease, box-shadow 0.15s ease;
}

.editable-cell:hover:not(.editing) {
    background: #f4f8fb;
    box-shadow: inset 0 0 0 1px #d9e5ef;
}

.editable-cell:focus-visible {
    outline: 2px solid rgba(36, 93, 145, 0.45);
    outline-offset: -2px;
}

.cell-display {
    display: block;
    width: max-content;
    min-width: 0;
    max-width: 190px;
    overflow-wrap: anywhere;
    white-space: normal;
}

.cell-display-wide {
    max-width: 285px;
}

.cell-display-long {
    display: -webkit-box;
    max-width: 190px;
    max-height: 2.9em;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.cell-editor {
    display: none;
}

.editable-cell.editing {
    background: var(--azul-claro);
    box-shadow: inset 0 0 0 2px rgba(36, 93, 145, 0.25);
}

.editable-cell.editing .cell-display {
    display: none;
}

.editable-cell.editing .cell-editor {
    display: block;
}

.editable-cell.editing > input[type="text"].cell-editor {
    width: 100%;
}

.checkbox-cell {
    text-align: center;
}

.attendance-checkbox {
    width: 15px;
    height: 15px;
    margin: 0 auto;
    accent-color: var(--azul-principal);
    cursor: pointer;
}

.reprogramacion-cell {
    position: relative;
    text-align: center;
}

.table-audiencias th[data-column="reprogramacion"],
.table-audiencias td[data-column="reprogramacion"] {
    width: 1px;
    min-width: 84px;
    padding-right: 8px;
    padding-left: 8px;
    text-align: center;
    white-space: nowrap;
}

.reprogramacion-button {
    display: inline-grid;
    position: relative;
    width: 31px;
    height: 31px;
    padding: 0;
    place-items: center;
    flex: 0 0 31px;
    border: 1px solid currentColor;
    border-radius: 6px;
    background: var(--blanco);
    cursor: pointer;
}

.reprogramacion-button svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.reprogramacion-button.is-pending {
    border-color: #d98787;
    background: var(--rojo-fondo);
    color: var(--rojo-texto);
}

.reprogramacion-button.is-ready {
    border-color: #79bf99;
    background: var(--verde-fondo);
    color: var(--verde-texto);
}

.reprogramacion-button:disabled {
    border-color: #79bf99;
    background: var(--verde-fondo);
    color: var(--verde-texto);
    cursor: not-allowed;
    opacity: 1;
}

.reprogramacion-button.is-pending:enabled:hover,
.reprogramacion-button.is-pending:focus-visible {
    border-color: var(--rojo-texto);
    background: #f8dede;
}

.reprogramacion-button.is-closed:disabled {
    border-color: #aeb8c2;
    background: #eef1f4;
    color: #536170;
}

.reprogramacion-button.is-ready:enabled:hover,
.reprogramacion-button.is-ready:focus-visible {
    border-color: var(--verde-texto);
    background: #d8f0e2;
}

.reprogramacion-tooltip-anchor {
    display: inline-grid;
}

.reprogramacion-tooltip-anchor:focus-visible {
    outline: 2px solid var(--azul-principal);
    outline-offset: 3px;
    border-radius: 6px;
}

.reprogramacion-tooltip {
    position: fixed;
    z-index: calc(var(--capa-menu-principal) + 1);
    width: max-content;
    max-width: min(270px, calc(100vw - 24px));
    box-sizing: border-box;
    padding: 7px 9px;
    border-radius: 7px;
    background: #15283d;
    color: var(--blanco);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
    pointer-events: none;
}

.reprogramacion-tooltip[hidden] {
    display: none;
}

.reprogramacion-dialog {
    width: min(760px, calc(100% - 32px));
}

.reprogramacion-readonly-grid {
    margin-top: 0;
}

.reprogramacion-fields {
    margin-top: 18px;
}

.reprogramacion-fields .field.full-width {
    grid-column: 1 / -1;
}

.notification-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
    padding: 14px 18px;
    border: 1px solid #b9d5ed;
    border-left: 4px solid var(--azul-principal);
    border-radius: 10px;
    background: var(--azul-claro);
    color: var(--azul-oscuro);
}

.notification-summary div {
    display: grid;
    gap: 3px;
}

.notification-summary a {
    flex: 0 0 auto;
    font-weight: 700;
    color: var(--azul-principal);
}

.supervision-notice {
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid #d5dde5;
    border-radius: 8px;
    background: #f7f9fb;
    color: var(--gris-texto);
}

.notification-panel-heading {
    align-items: center;
}

.notification-filters {
    display: grid;
    grid-template-columns:
        minmax(260px, 420px)
        320px
        190px
        auto;
    align-items: end;
    justify-content: start;
    gap: 12px;
    padding: 16px 20px;
    border-top: 1px solid var(--gris-borde);
    border-bottom: 1px solid var(--gris-borde);
}

.notification-filters label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--gris-texto);
}

.notification-filter-actions {
    display: flex;
    gap: 8px;
}

.table-notifications {
    min-width: 1250px;
}

.table-notifications td {
    vertical-align: middle;
}

.table-notifications .checkbox-cell form {
    display: flex;
    justify-content: center;
}

.table-notifications small {
    display: block;
    margin-top: 4px;
    color: var(--gris-texto);
}

.notification-state {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 700;
}

.notification-state.is-notified {
    background: #e4f4e9;
    color: #216b38;
}

.notification-state.is-pending {
    background: #fff2d7;
    color: #8a5a00;
}

@media (max-width: 700px) {
    .notification-summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .date-range-popover {
        position: fixed;
        top: 50%;
        right: 16px;
        left: 16px;
        width: auto;
        max-height: calc(100vh - 32px);
        overflow-y: auto;
        transform: translateY(-50%);
    }

    .date-range-calendars {
        grid-template-columns: 1fr;
    }
}

.audiencia-row-form,
.inventory-row-form {
    display: none;
}

.audiencia-error-row td,
.inventory-error-row td {
    position: static;
    padding: 8px 12px;
    background: var(--rojo-fondo);
}

.audiencia-error-row .row-errors,
.inventory-error-row .row-errors {
    width: auto;
    margin: 0;
}

.table-salidas {
    min-width: 1080px;
}

.table-action-link {
    display: inline-grid;
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    place-items: center;
    flex: 0 0 32px;
    border: 1px solid #c8d1da;
    border-radius: 8px;
    background: var(--blanco);
    color: var(--azul-principal);
}

.table-action-link:hover {
    border-color: var(--azul-principal);
    background: #f3f7fb;
}

.table-actions {
    display: flex;
    gap: 7px;
    align-items: center;
}

.table-actions form {
    margin: 0;
}

.table-action-delete {
    display: inline-grid;
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    place-items: center;
    flex: 0 0 32px;
    border: 1px solid #e1bcbc;
    border-radius: 8px;
    background: var(--blanco);
    color: var(--rojo-texto);
    cursor: pointer;
}

.table-action-delete:hover {
    border-color: var(--rojo-texto);
    background: var(--rojo-fondo);
}

.table-action-link svg,
.table-action-delete svg {
    display: block;
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.table-wrap table {
    min-width: 1700px;
}

th,
td {
    padding: 13px 12px;
    border-bottom: 1px solid #e8edf1;
    text-align: left;
    vertical-align: top;
}

th {
    position: sticky;
    z-index: 2;
    top: 0;
    background: #f7f9fb;
    color: #536170;
    font-size: 11px;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    white-space: nowrap;
}

th:first-child {
    z-index: 4;
    left: 0;
}

td:first-child {
    position: sticky;
    z-index: 1;
    left: 0;
    background: var(--blanco);
    box-shadow: 1px 0 0 #e8edf1;
}

td {
    color: #273444;
    font-size: 13px;
    line-height: 1.45;
}

tbody tr:last-child td {
    border-bottom: 0;
}

.cell-identifier {
    color: var(--azul-principal);
    font-weight: 700;
    white-space: nowrap;
}

.readonly {
    max-width: 220px;
    overflow-wrap: anywhere;
}

.link-action {
    color: var(--azul-principal);
    font-weight: 700;
}

.field-help {
    display: block;
    margin-top: 5px;
    color: var(--gris-texto);
    font-size: 11px;
}

.row-errors {
    width: 230px;
    margin: 0 0 9px;
    padding: 10px 11px 10px 27px;
    border-radius: 8px;
    background: var(--rojo-fondo);
    color: var(--rojo-texto);
    font-size: 12px;
}

.empty,
.empty-state {
    padding: 50px 24px;
    text-align: center;
}

.empty strong,
.empty-state strong {
    display: block;
    margin-bottom: 7px;
    color: #1d2b3b;
}

.empty p,
.empty-state p {
    margin: 0;
    color: var(--gris-texto);
}

.result-count {
    color: var(--gris-texto);
    font-size: 12px;
}

.footer {
    margin-top: auto;
    padding: 34px 0 5px;
    color: var(--gris-texto);
    font-size: 11px;
    text-align: center;
}

@media (max-width: 1100px) {
    .audit-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .audit-search-field,
    .audit-filter-actions {
        grid-column: 1 / -1;
    }

}

@media (min-width: 821px) {
    .sidebar {
        position: sticky;
        top: 0;
        height: 100vh;
    }
}

@media (max-width: 820px) {
    .audit-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .links-navigation {
        padding: 14px 16px 16px;
    }

    .links-date-toolbar {
        gap: 9px;
        align-items: flex-start;
        flex-direction: column;
    }

    .date-navigation {
        width: 100%;
        align-items: stretch;
    }

    .date-picker-form {
        flex: 0 1 155px;
    }

    .links-pagination {
        align-items: stretch;
        flex-direction: column;
    }

    .pagination-actions,
    .pagination-actions-next {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .page-jump-form {
        justify-content: center;
    }

    .links-limit-form {
        width: auto;
    }

    .audiencias-results-panel .links-pagination {
        align-items: center;
        flex-flow: row wrap;
    }

    .audiencias-results-panel .pagination-actions,
    .audiencias-results-panel .pagination-actions-next {
        display: flex;
    }

    .app {
        grid-template-columns: 1fr;
    }

    .sidebar-toggle {
        display: none;
    }

    .sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        width: 260px;
        transform: translateX(-100%);
        box-shadow: 12px 0 30px rgba(15, 39, 66, 0.22);
        transition: transform 0.2s ease;
    }

    .sidebar.open {
        transform: translateX(0);
    }

    .menu-button {
        display: inline-grid;
        place-items: center;
    }

    .topbar,
    .content {
        padding-right: 18px;
        padding-left: 18px;
    }

    .page-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        overscroll-behavior-inline: contain;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }

    .tabs::-webkit-scrollbar {
        display: none;
    }

    .tabs-panel {
        position: relative;
    }

    .tabs-panel::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 28px;
        background: linear-gradient(90deg, transparent, var(--blanco));
        content: '';
        pointer-events: none;
    }

    .tab-link {
        scroll-snap-align: start;
    }
}

@media (max-width: 620px) {
    .audit-filters,
    .audit-meta,
    .audit-json-grid {
        grid-template-columns: 1fr;
    }

    .audit-search-field,
    .audit-filter-actions {
        grid-column: 1;
    }

    .audit-filter-actions,
    .audit-event-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .audiencias-heading-actions,
    .entrantes-heading-actions {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .date-nav-button {
        flex: 1 1 calc(50% - 8px);
    }

    .date-picker-form {
        flex: 1 1 100%;
        order: -1;
    }

    .date-navigation-input {
        width: 100%;
    }

    .links-pagination-inferior {
        padding: 14px 16px;
    }

    .success-message[data-auto-dismiss] {
        right: 16px;
        bottom: 16px;
        width: calc(100vw - 32px);
    }

    .topbar {
        min-height: 68px;
    }

    .user-details {
        display: none;
    }

    .content {
        padding-top: 22px;
    }

    .page-heading {
        gap: 14px;
        margin-bottom: 18px;
    }

    .page-heading h1,
    .welcome h1 {
        font-size: 28px;
    }

    .form-grid,
    .readonly-grid,
    .dynamic-fields {
        grid-template-columns: 1fr;
    }

    .search-form,
    .search-row,
    .heading-actions,
    .confirmation-actions,
    .form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .limit-form {
        width: 100%;
        align-items: center;
    }

    .panel-heading,
    .card-header,
    .results-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .search-panel,
    .search-section,
    .result-section {
        padding: 16px;
    }

    .primary-button,
    .secondary-button,
    .search-button,
    .clear-link {
        width: 100%;
    }

    .column-visibility {
        width: 100%;
        margin-left: 0;
    }

    .column-toggle-button {
        width: 100%;
    }

    .column-menu {
        right: auto;
        left: 0;
    }
}

.filter-layout-container {
    position: relative;
    /* Keep date-range popovers above headings and menus in the results panel. */
    z-index: 20;
    overflow: visible;
    container: filter-layout / inline-size;
}

@container filter-layout (max-width: 900px) {
    .links-filter-form,
    .notification-filters {
        grid-template-columns: minmax(0, 420px) minmax(260px, 320px);
        justify-content: start;
    }

    .links-search-field,
    .links-filter-actions {
        grid-column: auto;
    }

    .links-filter-actions,
    .notification-filter-actions {
        justify-content: flex-start;
    }
}

@container filter-layout (max-width: 560px) {
    .links-filter-form,
    .notification-filters {
        grid-template-columns: minmax(0, 1fr);
    }

    .date-range-picker {
        max-width: none;
    }

    .links-filter-actions,
    .notification-filter-actions {
        align-items: stretch;
        flex-direction: column;
    }
}