/* =============================================================================
   aura-ui · Kit visual compartido de Aura
   Estilo minimalista del detalle de documentos (aura-doc): tarjetas blancas con
   borde fino, cabeceras de seccion discretas, tablas aireadas y color de marca
   solo en iconos y acciones. Los colores de marca salen de aura-theme.css.
   Muestra de todos los componentes: docs/aura-ui-muestra.html
   ========================================================================== */

:root {
    --ui-ink: #172b28;
    --ui-soft: #53635f;
    --ui-muted: #5f6c68;
    --ui-faint: #6b7875;
    --ui-line: #e5ebe9;
    --ui-line-soft: #eff3f1;
    --ui-canvas: #f4f7f6;
    --ui-paper: #fff;
    --ui-head-bg: #fafcfb;
    --ui-hover: #f7faf9;
    --ui-primary: var(--brand-primary-dark, #0f7f6f);
    --ui-primary-strong: var(--brand-primary-darker, #0a6557);
    --ui-primary-soft: var(--brand-surface-bg, #e6f9f4);
    --ui-primary-text: var(--brand-surface-text, #0f7f6f);
    --ui-primary-rgb: var(--brand-primary-rgb, 26, 188, 156);
    --ui-ok: #167253;
    --ui-ok-bg: #effaf5;
    --ui-ok-line: #c4e6d8;
    --ui-warn: #965715;
    --ui-warn-bg: #fff8ed;
    --ui-warn-line: #f1d9b8;
    --ui-danger: #a54242;
    --ui-danger-bg: #fff3f2;
    --ui-danger-line: #f0cece;
    --ui-danger-strong: #c62828;
    --ui-info: #255b83;
    --ui-info-bg: #f2f8fd;
    --ui-info-line: #c9dcec;
    --ui-neutral: #5f6c68;
    --ui-neutral-bg: #f5f7f6;
    --ui-neutral-line: #dfe7e4;
    --ui-radius: 10px;
    --ui-radius-sm: 7px;
    --ui-shadow: 0 8px 24px rgba(23, 43, 40, .045);
    --ui-shadow-pop: 0 20px 60px rgba(23, 43, 40, .18);
    --ui-focus: 0 0 0 3px rgba(var(--ui-primary-rgb), .18);
    --ui-font: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* -----------------------------------------------------------------------------
   Pagina y cabecera
   -------------------------------------------------------------------------- */
.aura-ui-page { color: var(--ui-ink); font: 13px/1.5 var(--ui-font); }
.aura-ui-page *, .aura-ui-modal * { box-sizing: border-box; }
.aura-ui-stack { display: grid; gap: 14px; min-width: 0; }
.aura-ui-layout { display: grid; grid-template-columns: minmax(0, 1fr) 305px; gap: 16px; align-items: start; }

/* Tarjeta de fondo que envuelve una pantalla de listado (cabecera, filtros y lista), como en Contactos */
.aura-ui-page-card { overflow: visible; margin: 0; border: 1px solid var(--ui-line); border-radius: 16px; background: var(--ui-canvas); box-shadow: 0 12px 34px rgba(23, 43, 40, .055); }
.aura-ui-page-card > .card-body { padding: 16px 16px 18px; }

.aura-ui-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 16px; }
.aura-ui-header__main { display: flex; align-items: center; gap: 13px; min-width: 0; }
.aura-ui-header__icon { width: 42px; height: 42px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid rgba(var(--ui-primary-rgb), .19); border-radius: 11px; color: var(--ui-primary); background: var(--ui-primary-soft); font-size: 15px; }
.aura-ui-header__eyebrow { display: block; margin: 0 0 3px; color: var(--ui-muted); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.aura-ui-header__title { margin: 0; color: var(--ui-ink); font-size: 21px; font-weight: 750; letter-spacing: -.03em; line-height: 1.25; }
.aura-ui-header__subtitle { margin: 3px 0 0; color: var(--ui-soft); font-size: 12px; }
.aura-ui-header__actions { display: flex; flex-wrap: wrap; gap: 7px; }

/* -----------------------------------------------------------------------------
   Tarjeta y cabecera de seccion
   -------------------------------------------------------------------------- */
.aura-ui-card { min-width: 0; overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-paper); box-shadow: var(--ui-shadow); }
.aura-ui-card--flat { box-shadow: none; }
.aura-ui-card__head { min-height: 55px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 17px; border-bottom: 1px solid var(--ui-line-soft); }
.aura-ui-card__body { padding: 16px 17px; }
.aura-ui-card__body--flush { padding: 0; }
.aura-ui-card__foot { display: flex; align-items: center; gap: 8px; padding: 11px 17px; border-top: 1px solid var(--ui-line-soft); color: var(--ui-muted); font-size: 11px; }

.aura-ui-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.aura-ui-title > i { flex: 0 0 auto; color: var(--ui-primary); font-size: 13px; }
.aura-ui-title h2, .aura-ui-title h3 { margin: 0; color: var(--ui-ink); font-size: 13px; font-weight: 750; line-height: 1.3; }
.aura-ui-title p { margin: 2px 0 0; color: var(--ui-muted); font-size: 11px; line-height: 1.35; }

.aura-ui-count { min-width: 22px; height: 22px; display: inline-grid; place-items: center; padding: 0 6px; border-radius: 6px; color: var(--ui-soft); background: #f0f4f2; font-size: 11px; font-weight: 750; font-variant-numeric: tabular-nums; }

/* Pares etiqueta / valor, como el lateral de la factura */
.aura-ui-kv { display: grid; }
.aura-ui-kv__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 37px; padding: 8px 0; border-bottom: 1px solid var(--ui-line-soft); font-size: 12px; }
.aura-ui-kv__row:last-child { border-bottom: 0; }
.aura-ui-kv__row > span { flex: 0 0 auto; color: var(--ui-muted); }
.aura-ui-kv__row > strong { min-width: 0; color: var(--ui-soft); font-weight: 700; text-align: right; overflow-wrap: anywhere; }

/* -----------------------------------------------------------------------------
   Tabla
   -------------------------------------------------------------------------- */
.aura-ui-table-wrap { overflow-x: auto; }
.aura-ui-table { width: 100%; margin: 0; border-collapse: collapse; }
.aura-ui-table th { height: 36px; padding: 0 12px; border: 0; border-bottom: 1px solid var(--ui-line-soft); color: var(--ui-muted); background: var(--ui-head-bg); font-size: 11px; font-weight: 750; letter-spacing: .04em; text-align: left; text-transform: uppercase; white-space: nowrap; vertical-align: middle; }
.aura-ui-table td { padding: 10px 12px; border: 0; border-top: 1px solid var(--ui-line-soft); color: var(--ui-soft); font-size: 12px; vertical-align: middle; }
.aura-ui-table tbody tr:first-child td { border-top: 0; }
.aura-ui-table tbody tr { transition: background-color .14s ease; }
.aura-ui-table tbody tr:hover { background: var(--ui-hover); }
.aura-ui-table tbody tr.is-clickable { cursor: pointer; }
.aura-ui-table tbody tr.is-muted td { color: var(--ui-muted); }
.aura-ui-table .is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.aura-ui-table .is-strong { color: var(--ui-ink); font-weight: 700; }
.aura-ui-table .is-actions { width: 1%; text-align: right; white-space: nowrap; }
.aura-ui-table__sub { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 11px; }
.aura-ui-table tbody tr.is-muted .aura-ui-avatar { filter: grayscale(1); opacity: .6; }
.aura-ui-table tbody tr.is-muted .aura-ui-identity__name { color: var(--ui-muted); }
.aura-ui-card > .aura-ui-table-wrap { border-top: 1px solid var(--ui-line-soft); }

/* DataTables sobre .aura-ui-table: flechas de orden, informacion y paginador */
.aura-ui-table.dataTable { margin: 0 !important; border-collapse: collapse !important; }
.aura-ui-table.dataTable thead .sorting, .aura-ui-table.dataTable thead .sorting_asc, .aura-ui-table.dataTable thead .sorting_desc { padding-right: 26px; cursor: pointer; }
.aura-ui-table.dataTable thead .sorting_asc, .aura-ui-table.dataTable thead .sorting_desc { color: var(--ui-primary); }
.aura-ui-table.dataTable thead th::before, .aura-ui-table.dataTable thead th::after { bottom: 50% !important; font-size: 10px; line-height: 1; transform: translateY(50%); }
.aura-ui-table-wrap + .row, .aura-ui-table-wrap .dataTables_wrapper > .row { margin: 0; padding: 10px 17px 12px; border-top: 1px solid var(--ui-line-soft); }
.aura-ui-table-wrap .dataTables_wrapper > .row > div { padding: 0; }
.aura-ui-table-wrap .dataTables_info { padding-top: 0 !important; color: var(--ui-muted); font-size: 11px; }
.aura-ui-table-wrap .dataTables_paginate .pagination { justify-content: flex-end; margin: 0; }
.aura-ui-table-wrap .dataTables_paginate .page-link { min-width: 30px; height: 30px; margin-left: 4px; padding: 0 9px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm) !important; color: var(--ui-soft); background: var(--ui-paper); font-size: 11px; line-height: 28px; text-align: center; }
.aura-ui-table-wrap .dataTables_paginate .page-item.active .page-link { border-color: var(--ui-primary); color: #fff; background: var(--ui-primary); }
.aura-ui-table-wrap .dataTables_paginate .page-item.disabled .page-link { color: var(--ui-faint); background: var(--ui-paper); }

/* -----------------------------------------------------------------------------
   Formularios
   -------------------------------------------------------------------------- */
.aura-ui-form-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 12px 14px; }
.aura-ui-form-grid > * { grid-column: span 12; min-width: 0; }
.aura-ui-form-grid > .span-3 { grid-column: span 3; }
.aura-ui-form-grid > .span-4 { grid-column: span 4; }
.aura-ui-form-grid > .span-5 { grid-column: span 5; }
.aura-ui-form-grid > .span-6 { grid-column: span 6; }
.aura-ui-form-grid > .span-7 { grid-column: span 7; }
.aura-ui-form-grid > .span-8 { grid-column: span 8; }

/* align-content: start mantiene etiqueta y control arriba aunque otro campo de la fila sea mas alto (p. ej. con ayuda) */
.aura-ui-field { display: grid; align-content: start; gap: 5px; min-width: 0; margin: 0; }
.aura-ui-field > label, .aura-ui-label { margin: 0; color: var(--ui-soft); font-size: 12px; font-weight: 650; }
.aura-ui-required { margin-left: 2px; color: #c2410c; }
.aura-ui-optional { margin-left: 4px; color: var(--ui-muted); font-weight: 500; }
.aura-ui-hint { color: var(--ui-muted); font-size: 11px; line-height: 1.4; }
.aura-ui-error { color: var(--ui-danger); font-size: 11px; line-height: 1.4; }

.aura-ui-input, .aura-ui-select, .aura-ui-textarea {
    width: 100%;
    height: 38px;
    padding: 0 11px;
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius-sm);
    color: var(--ui-ink);
    background: var(--ui-paper);
    font: 13px var(--ui-font);
    outline: 0;
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.aura-ui-input[type="color"] { padding: 4px; cursor: pointer; }
.aura-ui-textarea { height: auto; min-height: 92px; padding: 9px 11px; line-height: 1.5; resize: vertical; }
.aura-ui-select { appearance: none; padding-right: 30px; background: var(--ui-paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%2385918e'/%3E%3C/svg%3E") no-repeat right 11px center / 10px 6px; cursor: pointer; }
.aura-ui-input::placeholder, .aura-ui-textarea::placeholder { color: var(--ui-faint); }
.aura-ui-input:hover, .aura-ui-select:hover, .aura-ui-textarea:hover { border-color: #d3ddd9; }
.aura-ui-input:focus, .aura-ui-select:focus, .aura-ui-textarea:focus { border-color: var(--ui-primary); box-shadow: var(--ui-focus); }
.aura-ui-input[readonly], .aura-ui-input:disabled, .aura-ui-select:disabled, .aura-ui-textarea[readonly] { color: var(--ui-soft); background: var(--ui-neutral-bg); cursor: default; }
.aura-ui-input.is-invalid, .aura-ui-select.is-invalid { border-color: var(--ui-danger-line); box-shadow: 0 0 0 3px rgba(165, 66, 66, .1); }

.aura-ui-input-group { display: flex; min-width: 0; }
.aura-ui-input-group > .aura-ui-input { min-width: 0; border-radius: var(--ui-radius-sm) 0 0 var(--ui-radius-sm); }
.aura-ui-input-group__addon { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-width: 40px; padding: 0 10px; border: 1px solid var(--ui-line); border-left: 0; border-radius: 0 var(--ui-radius-sm) var(--ui-radius-sm) 0; color: var(--ui-soft); background: var(--ui-head-bg); font: 12px var(--ui-font); }
button.aura-ui-input-group__addon { cursor: pointer; }
button.aura-ui-input-group__addon:hover, button.aura-ui-input-group__addon:focus { color: var(--ui-primary); background: var(--ui-primary-soft); outline: 0; }

/* Interruptor: input checkbox + pista */
.aura-ui-switch { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; gap: 8px; margin: 0; cursor: pointer; }
.aura-ui-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.aura-ui-switch__track { position: relative; width: 34px; height: 19px; display: inline-block; border-radius: 999px; background: #cfd9d6; transition: background-color .16s ease; }
.aura-ui-switch__track::after { position: absolute; top: 2px; left: 2px; width: 15px; height: 15px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(23, 43, 40, .25); content: ""; transition: transform .16s ease; }
.aura-ui-switch input:checked + .aura-ui-switch__track { background: var(--ui-primary); }
.aura-ui-switch input:checked + .aura-ui-switch__track::after { transform: translateX(15px); }
.aura-ui-switch input:indeterminate + .aura-ui-switch__track { background: rgba(var(--ui-primary-rgb), .45); }
.aura-ui-switch input:indeterminate + .aura-ui-switch__track::after { transform: translateX(7px); }
.aura-ui-switch input:focus-visible + .aura-ui-switch__track { box-shadow: var(--ui-focus); }
.aura-ui-switch input:disabled + .aura-ui-switch__track { cursor: not-allowed; opacity: .5; }
.aura-ui-switch__text { color: var(--ui-soft); font-size: 12px; font-weight: 600; }

/* Fila de opcion: texto a la izquierda, interruptor a la derecha */
.aura-ui-option { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; padding: 9px 0; border-top: 1px solid var(--ui-line-soft); cursor: pointer; }
.aura-ui-option:first-child { border-top: 0; }
.aura-ui-option__text { color: var(--ui-soft); font-size: 12px; line-height: 1.35; }
.aura-ui-option__text small { display: block; color: var(--ui-muted); font-size: 11px; }

/* -----------------------------------------------------------------------------
   Botones
   -------------------------------------------------------------------------- */
.aura-ui-btn { min-height: 34px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); color: var(--ui-soft); background: var(--ui-paper); font: 600 12px var(--ui-font); line-height: 1; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color .14s ease, border-color .14s ease, color .14s ease; }
.aura-ui-btn:hover, .aura-ui-btn:focus { border-color: #cbd8d3; color: var(--ui-ink); background: #f9fbfa; text-decoration: none; outline: 0; }
.aura-ui-btn:focus-visible { box-shadow: var(--ui-focus); }
.aura-ui-btn:active { transform: translateY(1px); }
.aura-ui-btn:disabled { cursor: not-allowed; opacity: .55; transform: none; }
.aura-ui-btn--primary { border-color: var(--ui-primary); color: #fff; background: var(--ui-primary); }
.aura-ui-btn--primary:hover, .aura-ui-btn--primary:focus { border-color: var(--ui-primary-strong); color: #fff; background: var(--ui-primary-strong); }
.aura-ui-btn--soft { border-color: transparent; color: var(--ui-primary-text); background: var(--ui-primary-soft); }
.aura-ui-btn--soft:hover, .aura-ui-btn--soft:focus { border-color: rgba(var(--ui-primary-rgb), .35); color: var(--ui-primary-text); background: var(--ui-primary-soft); }
.aura-ui-btn--ghost { border-color: transparent; background: transparent; }
.aura-ui-btn--danger { border-color: transparent; color: var(--ui-danger); background: transparent; }
.aura-ui-btn--danger:hover, .aura-ui-btn--danger:focus { border-color: var(--ui-danger-line); color: var(--ui-danger); background: var(--ui-danger-bg); }
.aura-ui-btn--danger.aura-ui-btn--icon:not(:hover):not(:focus) { border-color: var(--ui-line); background: var(--ui-paper); }
.aura-ui-btn--danger-solid { border-color: var(--ui-danger-strong); color: #fff; background: var(--ui-danger-strong); }
.aura-ui-btn--danger-solid:hover, .aura-ui-btn--danger-solid:focus { border-color: #a61f1f; color: #fff; background: #a61f1f; }
.aura-ui-btn--icon { width: 34px; padding: 0; }
.aura-ui-btn--sm { min-height: 30px; padding: 0 10px; font-size: 11px; }
.aura-ui-btn--sm.aura-ui-btn--icon { width: 30px; }
.aura-ui-link { padding: 0; border: 0; color: var(--ui-primary); background: none; font: 700 12px var(--ui-font); cursor: pointer; text-decoration: none; }
.aura-ui-link:hover, .aura-ui-link:focus { color: var(--ui-primary-strong); text-decoration: underline; outline: 0; }

/* -----------------------------------------------------------------------------
   Estados, etiquetas y avatares
   -------------------------------------------------------------------------- */
.aura-ui-status { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border: 1px solid var(--ui-neutral-line); border-radius: 999px; color: var(--ui-neutral); background: var(--ui-neutral-bg); font-size: 11px; font-weight: 700; white-space: nowrap; }
.aura-ui-status::before { width: 6px; height: 6px; border-radius: 50%; background: currentColor; content: ""; }
.aura-ui-status[data-tone="ok"] { border-color: var(--ui-ok-line); color: var(--ui-ok); background: var(--ui-ok-bg); }
.aura-ui-status[data-tone="warn"] { border-color: var(--ui-warn-line); color: var(--ui-warn); background: var(--ui-warn-bg); }
.aura-ui-status[data-tone="danger"] { border-color: var(--ui-danger-line); color: var(--ui-danger); background: var(--ui-danger-bg); }
.aura-ui-status[data-tone="info"] { border-color: var(--ui-info-line); color: var(--ui-info); background: var(--ui-info-bg); }

.aura-ui-chip { display: inline-block; max-width: 100%; overflow: hidden; padding: 3px 9px; border-radius: 6px; color: var(--ui-primary-text); background: var(--ui-primary-soft); font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.aura-ui-chip--neutral { color: var(--ui-soft); background: #f0f4f2; }

.aura-ui-avatar { width: 34px; height: 34px; display: inline-grid; flex: 0 0 34px; place-items: center; border-radius: 50%; color: var(--ui-primary-text); background: var(--ui-primary-soft); font-size: 12px; font-weight: 750; letter-spacing: .02em; }
.aura-ui-avatar--square { border-radius: 10px; }
.aura-ui-avatar[data-tone="1"] { color: #0c447c; background: #e6f1fb; }
.aura-ui-avatar[data-tone="2"] { color: #3c3489; background: #eeedfe; }
.aura-ui-avatar[data-tone="3"] { color: #633806; background: #faeeda; }
.aura-ui-avatar[data-tone="4"] { color: #72243e; background: #fbeaf0; }
.aura-ui-avatar[data-tone="5"] { color: #27500a; background: #eaf3de; }

/* Identidad: avatar + nombre + linea secundaria */
.aura-ui-identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.aura-ui-identity__copy { min-width: 0; }
.aura-ui-identity__name { display: block; overflow: hidden; color: var(--ui-ink); font-size: 13px; font-weight: 700; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.aura-ui-identity__meta { display: block; overflow: hidden; color: var(--ui-muted); font-size: 11px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }

/* Barra de avance */
.aura-ui-meter { display: flex; align-items: center; gap: 10px; min-width: 140px; }
.aura-ui-meter__track { flex: 1; height: 6px; overflow: hidden; border-radius: 999px; background: #edf2f0; }
.aura-ui-meter__fill { display: block; height: 100%; border-radius: 999px; background: var(--brand-primary, #1abc9c); }
.aura-ui-meter__label { color: var(--ui-muted); font-size: 11px; font-weight: 650; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* -----------------------------------------------------------------------------
   Avisos, vacios y carga
   -------------------------------------------------------------------------- */
.aura-ui-notice { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--ui-info-line); border-radius: var(--ui-radius-sm); color: var(--ui-info); background: var(--ui-info-bg); font-size: 12px; line-height: 1.45; }
.aura-ui-notice > i { margin-top: 2px; }
.aura-ui-notice[data-tone="ok"] { border-color: var(--ui-ok-line); color: var(--ui-ok); background: var(--ui-ok-bg); }
.aura-ui-notice[data-tone="warn"] { border-color: var(--ui-warn-line); color: var(--ui-warn); background: var(--ui-warn-bg); }
.aura-ui-notice[data-tone="danger"] { border-color: var(--ui-danger-line); color: var(--ui-danger); background: var(--ui-danger-bg); }
.aura-ui-notice[data-tone="brand"] { border-color: rgba(var(--ui-primary-rgb), .25); color: var(--ui-primary-text); background: var(--ui-primary-soft); }
.aura-ui-notice__action { margin-left: auto; }

.aura-ui-empty { padding: 34px 16px; color: var(--ui-muted); text-align: center; }
.aura-ui-empty > i { display: block; margin-bottom: 10px; color: #c7d2cf; font-size: 22px; }
.aura-ui-empty strong { display: block; margin-bottom: 3px; color: var(--ui-ink); font-size: 13px; }
.aura-ui-empty span { font-size: 12px; }

.aura-ui-skeleton { display: grid; }
.aura-ui-skeleton__row { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border-top: 1px solid var(--ui-line-soft); }
.aura-ui-skeleton__row:first-child { border-top: 0; }
.aura-ui-skeleton__dot, .aura-ui-skeleton__bar { animation: auraUiPulse 1.3s ease-in-out infinite; background: #edf2f1; }
.aura-ui-skeleton__dot { flex: 0 0 32px; height: 32px; border-radius: 50%; }
.aura-ui-skeleton__bar { height: 10px; border-radius: 6px; }
@keyframes auraUiPulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* -----------------------------------------------------------------------------
   Barra de herramientas, busqueda, segmentos y pestanas
   -------------------------------------------------------------------------- */
.aura-ui-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.aura-ui-toolbar__push { margin-left: auto; }
.aura-ui-search { position: relative; flex: 1 1 240px; min-width: 0; }
.aura-ui-search > i { position: absolute; top: 50%; left: 12px; color: var(--ui-faint); font-size: 12px; pointer-events: none; transform: translateY(-50%); }
.aura-ui-search > .aura-ui-input { padding-left: 34px; }

.aura-ui-segmented { display: inline-flex; gap: 2px; padding: 3px; border-radius: 9px; background: #edf2f0; }
.aura-ui-segmented__btn { height: 30px; display: inline-flex; align-items: center; gap: 6px; padding: 0 11px; border: 0; border-radius: 7px; color: var(--ui-muted); background: transparent; font: 650 12px var(--ui-font); white-space: nowrap; cursor: pointer; transition: background-color .14s ease, color .14s ease; }
.aura-ui-segmented__btn:hover { color: var(--ui-ink); }
.aura-ui-segmented__btn:focus { outline: 0; }
.aura-ui-segmented__btn:focus-visible { box-shadow: var(--ui-focus); }
.aura-ui-segmented__btn.is-active { color: var(--ui-ink); background: var(--ui-paper); box-shadow: 0 1px 3px rgba(23, 43, 40, .1); }
.aura-ui-segmented__count { color: var(--ui-muted); font-weight: 750; font-variant-numeric: tabular-nums; }
.aura-ui-segmented__btn.is-active .aura-ui-segmented__count { color: var(--ui-primary); }

.aura-ui-tabs { display: flex; gap: 4px; margin: 0 0 16px; border-bottom: 1px solid var(--ui-line); }
.aura-ui-tab { display: inline-flex; align-items: center; gap: 8px; margin-bottom: -1px; padding: 10px 13px 11px; border: 0; border-bottom: 2px solid transparent; color: var(--ui-muted); background: transparent; font: 650 13px var(--ui-font); cursor: pointer; transition: color .14s ease, border-color .14s ease; }
.aura-ui-tab:hover { color: var(--ui-ink); }
.aura-ui-tab:focus { outline: 0; }
.aura-ui-tab:focus-visible { border-radius: 7px 7px 0 0; box-shadow: var(--ui-focus); }
.aura-ui-tab.is-active { border-bottom-color: var(--ui-primary); color: var(--ui-primary); }
.aura-ui-tab .aura-ui-count { height: 20px; font-size: 11px; }
.aura-ui-tab.is-active .aura-ui-count { color: var(--ui-primary-text); background: var(--ui-primary-soft); }

/* -----------------------------------------------------------------------------
   Modal: se aplica sobre el .modal de Bootstrap
   <div class="modal fade aura-ui-modal aura-ui-modal--md"> … .modal-dialog > .modal-content
     > .aura-ui-modal__head  > .modal-body  > .aura-ui-modal__foot
   -------------------------------------------------------------------------- */
.aura-ui-modal { font: 13px/1.5 var(--ui-font); }
.aura-ui-modal .modal-dialog { width: calc(100% - 32px); max-width: 720px; margin: 24px auto; }
.aura-ui-modal.aura-ui-modal--sm .modal-dialog { max-width: 480px; }
.aura-ui-modal.aura-ui-modal--lg .modal-dialog { max-width: 900px; }
.aura-ui-modal.aura-ui-modal--xl .modal-dialog { max-width: 1140px; }
.aura-ui-modal .modal-dialog-centered { min-height: 0; }
.aura-ui-modal .modal-content { display: flex; flex-direction: column; max-height: calc(100vh - 48px); overflow: hidden; border: 1px solid var(--ui-line); border-radius: 14px; background: var(--ui-paper); box-shadow: var(--ui-shadow-pop); }
.aura-ui-modal__head { position: relative; display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 14px 58px 14px 20px; border-bottom: 1px solid var(--ui-line-soft); background: var(--ui-paper); }
.aura-ui-modal__icon { width: 36px; height: 36px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid rgba(var(--ui-primary-rgb), .19); border-radius: 10px; color: var(--ui-primary); background: var(--ui-primary-soft); font-size: 14px; }
.aura-ui-modal__icon[data-tone="danger"] { border-color: var(--ui-danger-line); color: var(--ui-danger); background: var(--ui-danger-bg); }
.aura-ui-modal__icon[data-tone="warn"] { border-color: var(--ui-warn-line); color: var(--ui-warn); background: var(--ui-warn-bg); }
.aura-ui-modal__title { margin: 0; color: var(--ui-ink); font-size: 15px; font-weight: 750; letter-spacing: -.01em; line-height: 1.3; }
.aura-ui-modal__subtitle { margin: 2px 0 0; color: var(--ui-muted); font-size: 12px; line-height: 1.35; }
.aura-ui-modal__close { position: absolute; top: 50%; right: 16px; width: 32px; height: 32px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 8px; color: var(--ui-muted); background: transparent; font-size: 14px; cursor: pointer; transform: translateY(-50%); }
.aura-ui-modal__close:hover, .aura-ui-modal__close:focus { color: var(--ui-ink); background: var(--ui-neutral-bg); outline: 0; }
.aura-ui-modal__close:focus-visible { box-shadow: var(--ui-focus); }
/* Solo el formulario que envuelve cuerpo y pie; los formularios internos (chat, subidas) mantienen su maquetacion */
.aura-ui-modal .modal-content > form { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.aura-ui-modal .modal-body { flex: 1 1 auto; min-height: 0; max-height: none; overflow-y: auto; overscroll-behavior: contain; padding: 16px 20px; background: var(--ui-canvas); }
.aura-ui-modal .modal-body--plain { background: var(--ui-paper); }
.aura-ui-modal__foot { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--ui-line-soft); background: var(--ui-paper); }
.aura-ui-modal__foot .aura-ui-btn { min-height: 36px; padding: 0 15px; }
.aura-ui-modal__dirty { display: none; align-items: center; gap: 7px; margin-right: auto; color: var(--ui-warn); font-size: 11px; font-weight: 650; }
.aura-ui-modal__dirty::before { width: 6px; height: 6px; border-radius: 50%; background: currentColor; content: ""; }
.aura-ui-modal__dirty.is-visible { display: inline-flex; }

/* Seccion dentro del cuerpo de un modal (tarjeta sin sombra) */
.aura-ui-section { margin-bottom: 12px; overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-paper); }
.aura-ui-section:last-child { margin-bottom: 0; }
.aura-ui-section__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px; border-bottom: 1px solid var(--ui-line-soft); }
.aura-ui-section__body { padding: 14px 15px; }

/* Confirmacion corta (avisos y si/no): cuerpo blanco y texto centrado en el mensaje */
.aura-ui-confirm__context { display: block; margin: 0 0 6px; overflow-wrap: anywhere; color: var(--ui-ink); font-size: 14px; font-weight: 700; }
.aura-ui-confirm__text { margin: 0; color: var(--ui-soft); font-size: 13px; line-height: 1.55; }

/* -----------------------------------------------------------------------------
   Campos dinámicos (plantillas de panelDetalleElementos: fichas, expedientes, formularios de evento)
   -------------------------------------------------------------------------- */
.form-control.datoEtiqueta { height: 35px; padding: 0 11px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); color: var(--ui-ink); background-color: var(--ui-paper); font-size: 12px; box-shadow: none; }
.form-control.datoEtiqueta:focus { border-color: var(--ui-primary); box-shadow: var(--ui-focus); }
.form-control.datoEtiqueta:disabled, .form-control.datoEtiqueta[readonly] { color: var(--ui-soft); background-color: var(--ui-neutral-bg); }
textarea.form-control.datoEtiqueta { height: auto; min-height: 70px; padding: 8px 11px; }

/* -----------------------------------------------------------------------------
   Todos los modales de Aura: alineados arriba, con margen inferior y sin centrar
   -------------------------------------------------------------------------- */
.modal .modal-dialog.modal-dialog-centered { align-items: flex-start; justify-content: flex-start; min-height: 0; }
.modal .modal-dialog-centered.modal-dialog-scrollable { height: auto; }
@media (min-width: 576px) {
    .modal .modal-dialog { margin-top: 24px; margin-bottom: 24px; padding-top: 0; }
    .modal .modal-dialog-scrollable { max-height: calc(100% - 48px); }
    .modal .modal-dialog-scrollable .modal-content { max-height: calc(100vh - 48px); }
}
.modal .modal-body { overscroll-behavior: contain; }
/* paper-dashboard.css da padding-top: 60px a todos los .modal-dialog; se anula para que todos empiecen igual */
.modal .modal-dialog { padding-top: 0; }

/* -----------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .aura-ui-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 767px) {
    .aura-ui-form-grid > [class*="span-"] { grid-column: span 12; }
    .aura-ui-header__title { font-size: 18px; }
    .aura-ui-page-card > .card-body { padding: 12px 10px 14px; }
    .aura-ui-toolbar > * { flex: 1 1 100%; }
    .aura-ui-toolbar__push { margin-left: 0; }
    .aura-ui-segmented { display: flex; }
    .aura-ui-segmented__btn { flex: 1; justify-content: center; padding: 0 6px; }
    .aura-ui-tab { flex: 1; justify-content: center; padding: 10px 6px 11px; }

    /* Tabla en tarjetas: cada fila es un bloque; .is-hide-mobile oculta columnas secundarias */
    .aura-ui-table--cards thead { display: none; }
    .aura-ui-table--cards, .aura-ui-table--cards tbody { display: block; }
    .aura-ui-table--cards tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 10px; padding: 12px 14px; border-top: 1px solid var(--ui-line-soft); }
    .aura-ui-table--cards tbody tr:first-child { border-top: 0; }
    .aura-ui-table--cards tbody td { display: block; padding: 0; border: 0; }
    .aura-ui-table--cards tbody td:first-child, .aura-ui-table--cards tbody td.is-actions, .aura-ui-table--cards tbody td[colspan] { grid-column: 1 / -1; }
    .aura-ui-table--cards tbody td.is-actions { width: auto; text-align: left; }
    .aura-ui-table--cards tbody td.is-hide-mobile { display: none; }
}

@media (max-width: 575px) {
    .aura-ui-modal .modal-dialog { width: calc(100% - 16px); margin: 8px auto; }
    .aura-ui-modal .modal-content { max-height: calc(100vh - 16px); }
    .aura-ui-modal__head { padding: 12px 52px 12px 14px; }
    .aura-ui-modal .modal-body { padding: 12px; }
    .aura-ui-modal__foot { flex-wrap: wrap; padding: 10px 12px; }
    .aura-ui-modal__dirty { flex: 1 1 100%; justify-content: center; margin-right: 0; }
    .aura-ui-modal__foot .aura-ui-btn { flex: 1 1 0; }
}

@media (prefers-reduced-motion: reduce) {
    .aura-ui-skeleton__dot, .aura-ui-skeleton__bar { animation: none; }
    .aura-ui-switch__track, .aura-ui-switch__track::after, .aura-ui-btn, .aura-ui-tab { transition: none; }
}

/* Mapas Leaflet: paper-dashboard.css fuerza svg { height: 800px !important } y la bandera de la atribucion estiraba ese recuadro sobre el mapa */
.leaflet-container .leaflet-attribution-flag { width: 1em !important; height: .6669em !important; }