/* =============================================================================
   avanbox_central · Buzon de soporte. Sobre el kit aura-ui copiado de Aura
   (aura-theme.css + aura-ui.css): mismos colores y componentes que Aura.
   ========================================================================== */

body { min-height: 100vh; margin: 0; color: var(--ui-ink); background: var(--ui-canvas); font-family: var(--ui-font); }
[hidden] { display: none !important; }

/* Acceso (index.html): panel de marca a la izquierda con el degradado de la barra y una reticula
   que se desvanece; formulario a la derecha. Por debajo de 992 px el panel queda como franja superior. */
.central-acceso { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(440px, 1fr); min-height: 100vh; background: var(--ui-paper); }
.central-acceso__marca { position: relative; isolation: isolate; display: flex; flex-direction: column; gap: 40px; overflow: hidden; padding: 44px 56px; color: #fff; background:
    radial-gradient(120% 80% at 0% 0%, rgba(var(--brand-primary-light-rgb, 104, 165, 212), .45) 0%, transparent 55%),
    radial-gradient(90% 70% at 100% 100%, rgba(8, 24, 48, .55) 0%, transparent 60%),
    linear-gradient(155deg, var(--brand-navbar-from, #4a8fcc) 0%, var(--brand-navbar-to, #1e5a93) 52%, #0f2d57 100%); }
.central-acceso__marca::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: radial-gradient(80% 70% at 30% 35%, #000 0%, transparent 75%); mask-image: radial-gradient(80% 70% at 30% 35%, #000 0%, transparent 75%); }
.central-acceso__marca::after { content: ""; position: absolute; right: -120px; bottom: -120px; z-index: -1; width: 420px; height: 420px; border: 1px solid rgba(255, 255, 255, .12); border-radius: 50%; box-shadow: 0 0 0 60px rgba(255, 255, 255, .03), 0 0 0 130px rgba(255, 255, 255, .025); }
.central-acceso__logo { display: flex; align-items: center; gap: 12px; font-size: 17px; font-weight: 750; letter-spacing: .01em; }
.central-acceso__logo-icono { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 12px; background: rgba(255, 255, 255, .14); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25); font-size: 18px; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.central-acceso__lema { max-width: 30rem; margin-top: auto; }
.central-acceso__eyebrow { margin: 0 0 14px; color: rgba(255, 255, 255, .72); font-size: 11px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.central-acceso__lema h2 { margin: 0 0 14px; color: #fff; font-size: clamp(26px, 2.6vw, 36px); font-weight: 750; line-height: 1.15; letter-spacing: -.015em; text-wrap: balance; }
.central-acceso__pie { margin: auto 0 0; color: rgba(255, 255, 255, .55); font-size: 12px; }

.central-acceso__panel { display: grid; place-items: center; padding: 48px 32px; background: radial-gradient(70% 50% at 50% 0%, var(--ui-canvas) 0%, transparent 100%), var(--ui-paper); }
.central-acceso__form { width: 100%; max-width: 380px; display: grid; gap: 18px; }
.central-acceso__cabecera h1 { margin: 0 0 6px; color: var(--ui-ink); font-size: 26px; font-weight: 750; letter-spacing: -.015em; }
.central-acceso__cabecera p { margin: 0; color: var(--ui-muted); font-size: 14px; }
.central-acceso__campo { display: grid; gap: 7px; }
.central-acceso__campo label { margin: 0; color: var(--ui-soft); font-size: 12px; font-weight: 700; }
.central-acceso__control { position: relative; }
.central-acceso__control > i { position: absolute; top: 50%; left: 15px; color: var(--ui-faint); font-size: 13px; transform: translateY(-50%); pointer-events: none; transition: color .15s ease; }
.central-acceso__input { width: 100%; height: 46px; padding: 0 14px 0 42px; border: 1px solid var(--ui-line); border-radius: 12px; color: var(--ui-ink); background: var(--ui-head-bg); font: 14px var(--ui-font); transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.central-acceso__input--clave { padding-right: 48px; }
.central-acceso__input:hover { border-color: #cfd9d6; }
.central-acceso__input:focus { border-color: var(--brand-primary); background: #fff; outline: 0; box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb), .16); }
.central-acceso__control:focus-within > i { color: var(--brand-primary-dark); }
.central-acceso__ver { position: absolute; top: 50%; right: 6px; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 9px; color: var(--ui-faint); background: transparent; transform: translateY(-50%); cursor: pointer; }
.central-acceso__ver:hover { color: var(--ui-ink); background: var(--ui-line-soft); }
.central-acceso__ver:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), .3); }
.central-acceso__mayusculas { margin: 0; color: var(--ui-warn); font-size: 12px; font-weight: 600; }
.central-acceso__entrar { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; height: 48px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-primary-dark) 100%); box-shadow: 0 10px 24px -10px rgba(var(--brand-primary-rgb), .75), inset 0 1px 0 rgba(255, 255, 255, .18); font-size: 14px; font-weight: 700; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.central-acceso__entrar i { transition: transform .2s ease; }
.central-acceso__entrar:hover { filter: brightness(1.06); box-shadow: 0 14px 28px -12px rgba(var(--brand-primary-rgb), .85), inset 0 1px 0 rgba(255, 255, 255, .18); }
.central-acceso__entrar:hover i { transform: translateX(3px); }
.central-acceso__entrar:active { transform: translateY(1px); }
.central-acceso__entrar:focus-visible { outline: 0; box-shadow: 0 0 0 4px rgba(var(--brand-primary-rgb), .3); }
.central-acceso__entrar:disabled { cursor: progress; filter: saturate(.7); opacity: .85; }

@media (prefers-reduced-motion: no-preference) {
    .central-acceso__form { animation: centralAccesoEntrada .45s cubic-bezier(.2, .7, .2, 1) both; }
    .central-acceso__lema { animation: centralAccesoEntrada .6s cubic-bezier(.2, .7, .2, 1) both; }
}
@keyframes centralAccesoEntrada { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

@media (max-width: 991.98px) {
    .central-acceso { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
    .central-acceso__marca { gap: 18px; padding: 24px 24px 28px; }
    .central-acceso__lema { margin-top: 0; }
    .central-acceso__lema h2 { font-size: 22px; margin-bottom: 0; }
    .central-acceso__pie { display: none; }
    .central-acceso__marca::after { width: 260px; height: 260px; right: -110px; bottom: -150px; }
    .central-acceso__panel { place-items: start center; padding: 32px 20px 40px; }
}

/* Barra superior de la bandeja */
.buzon-barra { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 20px; color: #fff; background: linear-gradient(180deg, var(--brand-navbar-from, #1e3a5f) 0%, var(--brand-navbar-to, #16304f) 100%); }
.buzon-barra__marca { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 700; }
.buzon-barra__usuario { display: flex; align-items: center; gap: 14px; font-size: 12px; }
.buzon-barra__salir { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 999px; color: #fff; background: rgba(255, 255, 255, .1); font-size: 12px; font-weight: 600; cursor: pointer; }
.buzon-barra__salir:hover { background: rgba(255, 255, 255, .2); }
.buzon-barra__salir:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(255, 255, 255, .45); }
.buzon-barra__menu { display: none; align-items: center; justify-content: center; width: 34px; height: 34px; margin-right: 2px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 9px; color: #fff; background: rgba(255, 255, 255, .1); cursor: pointer; }
.buzon-barra__menu:hover { background: rgba(255, 255, 255, .2); }
.buzon-barra__menu:focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(255, 255, 255, .45); }

/* Estructura de la app central: menu lateral por grupos y, a la derecha, la ruta y la seccion.
   El menu se pinta desde MENU_CENTRAL (app/js/buzon.js). Mismos colores que las tarjetas de antes. */
.central-marco { display: grid; grid-template-columns: 232px minmax(0, 1fr); min-height: calc(100vh - 56px); }
.central-menu { position: sticky; top: 56px; align-self: start; height: calc(100vh - 56px); overflow-y: auto; padding: 18px 12px; border-right: 1px solid #dfe7e4; background: #fff; }
.central-menu__grupo + .central-menu__grupo { margin-top: 16px; }
.central-menu__titulo { padding: 0 10px 6px; color: #85918e; font-size: 10.5px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.central-menu__item { display: flex; align-items: center; gap: 10px; min-height: 38px; padding: 8px 10px; border-radius: 10px; color: #5b6a66; font-size: 13px; font-weight: 650; text-decoration: none; transition: background .15s ease, color .15s ease; }
.central-menu__item + .central-menu__item { margin-top: 2px; }
.central-menu__item > i { flex: 0 0 18px; color: #7c8c87; text-align: center; }
.central-menu__item:hover { color: #26332f; background: #f2f6f5; text-decoration: none; }
.central-menu__item:focus { outline: 0; }
.central-menu__item:focus-visible { outline: 3px solid rgba(var(--brand-primary-rgb), .23); outline-offset: 1px; }
.central-menu__item.is-active { color: var(--brand-primary-dark); background: var(--brand-surface-bg, #e6f9f4); box-shadow: inset 3px 0 0 var(--brand-primary); }
.central-menu__item.is-active > i { color: var(--brand-primary-dark); }
.central-menu__texto { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.central-menu__badge { flex: 0 0 auto; min-width: 22px; margin-left: auto; padding: 1px 7px; border: 1px solid var(--ui-warn-line, #f0d9a8); border-radius: 999px; color: var(--ui-warn, #8a5a00); background: var(--ui-warn-bg, #fff6e0); font-size: 11px; font-weight: 750; text-align: center; font-variant-numeric: tabular-nums; }
.central-menu-fondo { display: none; }
.central-principal { min-width: 0; }
.central-ruta { display: flex; align-items: center; gap: 8px; max-width: 1400px; margin: 0 auto; padding: 16px 20px 0; color: #85918e; font-size: 12px; }
.central-ruta__actual { color: #26332f; font-weight: 700; }
.central-ruta__separador { color: #b4bdba; }

/* Portatiles pequenos (992-1199 px): menu solo con iconos, como el sidebar-mini de Aura. El nombre sigue
   para lectores de pantalla y aparece al pasar el raton (title); los grupos se separan con una linea. */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .central-marco { grid-template-columns: 72px minmax(0, 1fr); }
    .central-menu { padding: 14px 10px; }
    .central-menu__grupo + .central-menu__grupo { margin-top: 10px; padding-top: 10px; border-top: 1px solid #dfe7e4; }
    .central-menu__titulo { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .central-menu__item { position: relative; justify-content: center; padding: 10px 0; }
    .central-menu__item > i { flex: none; font-size: 16px; }
    .central-menu__texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .central-menu__badge { position: absolute; top: 2px; right: 2px; min-width: 18px; margin: 0; padding: 0 4px; font-size: 10px; }
}

@media (max-width: 991.98px) {
    .central-marco { grid-template-columns: minmax(0, 1fr); }
    .buzon-barra__menu { display: inline-flex; }
    .central-menu { position: fixed; top: 56px; bottom: 0; left: 0; z-index: 1030; align-self: stretch; width: 264px; height: auto; visibility: hidden; transform: translateX(-100%); box-shadow: 12px 0 32px rgba(15, 30, 40, .18); transition: transform .2s ease, visibility .2s ease; }
    body.is-menu-abierto .central-menu { visibility: visible; transform: none; }
    .central-menu-fondo { position: fixed; top: 56px; right: 0; bottom: 0; left: 0; z-index: 1029; display: block; background: rgba(15, 30, 40, .35); }
}

.buzon-contenido { max-width: 1400px; margin: 0 auto; padding: 14px 20px 20px; }
/* Los textos solo para lectores de pantalla (sr-only, absolutos) de una tabla ancha quedan dentro de su
   caja con desplazamiento: si no, ensanchan la pagina en el movil */
.buzon-contenido .aura-ui-table-wrap { position: relative; }
.buzon-barra__marca, .buzon-barra__usuario { white-space: nowrap; }
@media (max-width: 479.98px) {
    #nombreUsuarioBuzon { display: none; }
}

/* Bandeja (F3.2): filtros y rejilla lista + detalle, como el panel Soporte de Aura (aura-soporte.css) */
.buzon-panel .aura-ui-header { margin-bottom: 16px; }
.buzon-filtros { display: grid; gap: 10px; margin-bottom: 14px; }
.buzon-filtros__estados { flex-wrap: wrap; justify-self: start; }
.buzon-filtros__fila { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.buzon-filtros__busqueda { flex: 1 1 240px; min-width: 200px; }
.buzon-filtros__fila .aura-ui-select { width: auto; min-width: 150px; }
.buzon-filtros__empresa { max-width: 280px; }
.buzon-filtros__fechas { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.buzon-filtros__fecha { display: flex; align-items: center; gap: 6px; margin: 0; color: var(--ui-muted); font-size: 12px; font-weight: 600; }
.buzon-filtros__fecha .aura-ui-input { width: 150px; }

.buzon-layout { min-height: 480px; display: grid; grid-template-columns: minmax(320px, 1fr) minmax(0, 1.3fr); overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); }
.buzon-layout__lista { min-width: 0; border-right: 1px solid var(--ui-line); background: var(--ui-head-bg); }
.buzon-layout__resumen { padding: 8px 14px; border-bottom: 1px solid var(--ui-line-soft); color: var(--ui-muted); font-size: 11px; font-weight: 600; }
.buzon-layout__resumen:empty { display: none; }
.buzon-layout__items { max-height: 640px; overflow-y: auto; }
.buzon-layout__detalle { min-width: 0; padding: 20px 22px; background: var(--ui-paper); }

.buzon-item { display: block; width: 100%; border: 0; border-bottom: 1px solid var(--ui-line-soft); padding: 12px 14px; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.buzon-item:hover { background: var(--ui-hover); }
.buzon-item:focus { outline: 0; }
.buzon-item:focus-visible { box-shadow: inset var(--ui-focus); }
.buzon-item.active { background: var(--ui-primary-soft); }
.buzon-item__meta,
.buzon-item__origen,
.buzon-item__pie { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; color: var(--ui-muted); font-size: 11px; }
.buzon-item__meta .aura-ui-status { margin-left: auto; }
.buzon-item__ref { color: var(--ui-soft); font-weight: 700; font-variant-numeric: tabular-nums; }
.buzon-item__tipo i,
.buzon-item__adjuntos i { color: var(--ui-primary); font-size: 10px; }
.buzon-item__asunto { display: block; overflow: hidden; margin-top: 5px; color: var(--ui-ink); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.buzon-item__origen { margin-top: 4px; }
.buzon-item__origen span { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.buzon-item__origen i,
.buzon-item__atendido i { color: var(--ui-faint); font-size: 10px; }
.buzon-item__pie { margin-top: 6px; }
.buzon-item__pie time { font-variant-numeric: tabular-nums; white-space: nowrap; }
.buzon-item__dias.is-antiguo { color: var(--ui-danger); font-weight: 700; }
.buzon-item__atendido { margin-left: auto; color: var(--ui-soft); }
.buzon-item__atendido.is-vacio { color: var(--ui-faint); font-style: italic; }

/* Detalle (F3.3), como el de Aura (aura-soporte.css) con los datos del cliente y el contexto tecnico a la vista */
.buzon-layout__detalle { max-height: 720px; overflow-y: auto; }
.buzon-detalle { min-width: 0; display: grid; gap: 16px; color: var(--ui-soft); font-size: 12px; }
.buzon-detalle__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--ui-line-soft); }
.buzon-detalle__titulo { min-width: 0; }
.buzon-detalle__titulo h2 { margin: 6px 0 4px; color: var(--ui-ink); font-size: 15px; font-weight: 750; line-height: 1.35; overflow-wrap: anywhere; }
.buzon-detalle__fecha { color: var(--ui-muted); font-size: 11px; }
.buzon-detalle__respuesta strong { display: block; margin-bottom: 2px; }
.buzon-detalle__bloque { min-width: 0; display: grid; gap: 8px; }
.buzon-detalle__apartado { margin: 0; color: var(--ui-muted); font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.buzon-detalle__relacion { margin: 0; color: var(--ui-muted); }
.buzon-detalle__relacion i { color: var(--ui-primary); }
.buzon-detalle__relacion strong { color: var(--ui-ink); }
.buzon-detalle__descripcion { max-width: 72ch; color: var(--ui-ink); font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.buzon-detalle .aura-ui-kv__row strong { overflow-wrap: anywhere; }
.buzon-detalle__tecnico .aura-ui-kv__row strong { font-weight: 600; }

/* Cambio de estado (F3.4): opciones como pastillas con radio; la elegida con el color de marca */
.buzon-estado { padding: 14px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-head-bg); }
.buzon-estado .aura-ui-hint { margin: 0; }
.buzon-estado__opciones { display: flex; flex-wrap: wrap; gap: 8px; }
.buzon-estado__opcion { position: relative; display: inline-flex; align-items: center; gap: 7px; margin: 0; padding: 7px 14px; border: 1px solid var(--ui-line); border-radius: 999px; color: var(--ui-soft); background: var(--ui-paper); font-size: 12px; font-weight: 650; cursor: pointer; transition: border-color .14s ease, background-color .14s ease; }
.buzon-estado__opcion:hover { border-color: rgba(var(--ui-primary-rgb), .45); }
.buzon-estado__opcion input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.buzon-estado__opcion i { color: var(--ui-muted); font-size: 11px; }
.buzon-estado__opcion.is-activa { border-color: var(--ui-primary); color: var(--ui-ink); background: var(--ui-primary-soft); box-shadow: 0 0 0 1px var(--ui-primary) inset; }
.buzon-estado__opcion.is-activa i { color: var(--ui-primary); }
.buzon-estado__opcion:has(input:focus-visible) { box-shadow: var(--ui-focus); }
.buzon-estado .aura-ui-textarea { min-height: 72px; resize: vertical; }
.buzon-estado .aura-ui-textarea.is-invalid { border-color: var(--ui-danger-line); box-shadow: 0 0 0 3px rgba(165, 66, 66, .1); }
.buzon-estado__acciones { display: flex; justify-content: flex-end; }

.buzon-adjuntos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.buzon-adjunto { min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-head-bg); }
.buzon-adjunto__vista { height: 104px; display: block; background: var(--ui-line-soft); }
.buzon-adjunto__vista img { display: block; width: 100%; height: 100%; object-fit: cover; }
.buzon-adjunto__vista:hover img { opacity: .88; }
.buzon-adjunto__vista:focus { outline: 0; }
.buzon-adjunto__vista:focus-visible { box-shadow: inset var(--ui-focus); }
.buzon-adjunto__descargar { display: inline-flex; align-items: center; gap: 5px; margin-top: 4px; color: var(--ui-primary); font-size: 11px; font-weight: 700; }
.buzon-adjunto__descargar:hover { color: var(--ui-primary); text-decoration: underline; }
.buzon-adjunto__descargar i { font-size: 10px; }
.buzon-adjunto figcaption { padding: 6px 8px; font-size: 11px; }
.buzon-adjunto figcaption span { display: block; overflow: hidden; color: var(--ui-ink); text-overflow: ellipsis; white-space: nowrap; }
.buzon-adjunto figcaption small { display: block; color: var(--ui-muted); font-size: 11px; }

.buzon-historial { display: grid; margin: 0; padding: 0; list-style: none; }
.buzon-historial li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 0; border-bottom: 1px solid var(--ui-line-soft); }
.buzon-historial li:last-child { border-bottom: 0; }
.buzon-historial__fecha { min-width: 104px; color: var(--ui-muted); font-variant-numeric: tabular-nums; }
.buzon-historial__actor { color: var(--ui-soft); }
.buzon-historial__actor i { color: var(--ui-faint); font-size: 10px; }
.buzon-historial__actor small { color: var(--ui-faint); font-size: 10px; }
.buzon-historial p { flex: 1 0 100%; margin: 0; padding-left: 114px; color: var(--ui-muted); overflow-wrap: anywhere; }

.buzon-mas { width: 100%; min-height: 39px; border: 0; color: var(--ui-primary); background: var(--ui-paper); font-size: 12px; font-weight: 700; }
.buzon-mas:hover:not(:disabled) { background: var(--ui-hover); }
.buzon-aviso { flex-wrap: wrap; margin: 12px; }
.buzon-aviso > span { flex: 1 1 150px; }
.buzon-aviso .aura-ui-notice__action { margin-left: 22px; }
.buzon-contenido > .aura-ui-notice { max-width: 560px; margin: 24px auto; }

@media (max-width: 991.98px) {
    .buzon-layout { grid-template-columns: minmax(0, 1fr); }
    .buzon-layout__lista { border-right: 0; border-bottom: 1px solid var(--ui-line); }
    .buzon-layout__items { max-height: 420px; }
    .buzon-layout__detalle { min-height: 240px; max-height: none; padding: 18px 16px; }
    .buzon-historial p { padding-left: 0; }
}
@media (max-width: 575.98px) {
    .buzon-contenido { padding: 12px; }
    .central-ruta { padding: 12px 12px 0; }
    .buzon-barra { padding: 0 16px; }
    .buzon-filtros__fila .aura-ui-select,
    .buzon-filtros__empresa,
    .buzon-filtros__fechas,
    .buzon-filtros__fecha { flex: 1 1 100%; max-width: none; }
    .buzon-filtros__fecha .aura-ui-input { flex: 1; width: auto; }
}

/* Instalaciones: maestro de clientes (F5.1) */
.instalaciones-panel .aura-ui-header,
.comparador-panel .aura-ui-header { margin-bottom: 16px; }
.instalaciones-aviso,
.comparador-aviso { margin-bottom: 14px; }
.instalaciones-tabla,
.comparador-tabla { border: 1px solid var(--ui-line); border-radius: var(--ui-radius); }
.instalaciones-tabla .aura-ui-chip,
.comparador-tabla .aura-ui-chip { margin-left: 6px; vertical-align: 1px; }
.instalaciones-bd { color: var(--ui-ink); font-weight: 650; }
.instalaciones-soporte { align-items: flex-start; }
.instalaciones-soporte .aura-ui-switch__track { flex: 0 0 34px; margin-top: 1px; }
.instalaciones-soporte small { display: block; margin-top: 2px; color: var(--ui-muted); font-size: 11px; font-weight: 500; line-height: 1.4; }
.instalaciones-apartado { display: flex; align-items: center; gap: 8px; margin: 20px 0 2px; padding-top: 16px; border-top: 1px solid var(--ui-line-soft); color: var(--ui-ink); font-size: 13px; font-weight: 750; }
.instalaciones-apartado i { color: var(--ui-primary); font-size: 12px; }
.instalaciones-apartado__ayuda { margin: 0 0 12px; }
.instalaciones-modal__resultado { margin-top: 14px; flex-wrap: wrap; }
.instalaciones-modal__resultado > span { flex: 1 1 200px; overflow-wrap: anywhere; }
.instalaciones-modal__hueco { flex: 1 1 auto; }
/* Buscador y filtro de la lista de instalaciones */
.instalaciones-filtros { margin-bottom: 12px; }
.instalaciones-vacio { margin: 0; padding: 18px 16px; text-align: center; }
/* F8.2: plantilla para bases nuevas y resumen de su base */
.instalaciones-plantilla { display: grid; gap: 10px; justify-items: start; margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--ui-line-soft); }
.instalaciones-resumen { justify-self: stretch; display: grid; gap: 10px; }
.instalaciones-resumen[aria-busy="true"] { opacity: .7; }
.instalaciones-resumen .aura-ui-kv__row strong { overflow-wrap: anywhere; }
.instalaciones-resumen__titulo { margin: 2px 0 0; }
.instalaciones-resumen__mayores { margin: 0; padding-left: 18px; color: var(--ui-soft); font-size: 12px; line-height: 1.6; }
.instalaciones-resumen__mayores code { color: var(--ui-ink); font-size: 11.5px; }
/* F8.5: copia de la plantilla en la pestaña Conexión */
.hosting-copia__barra { margin: 10px 0 12px; max-width: 420px; }
.hosting-copia__titulo { margin: 10px 0 2px; }
.hosting-copia__avisos { margin: 0 0 12px; padding-left: 18px; color: var(--ui-soft); font-size: 12px; line-height: 1.6; }

/* Hosting de los clientes (fase 7): «Probar conexiones» */
.hosting-prueba { padding: 14px 0; border-bottom: 1px solid var(--ui-line-soft); }
.hosting-prueba:first-child { padding-top: 0; }
.hosting-prueba:last-child { padding-bottom: 0; border-bottom: 0; }
.hosting-prueba__cabecera { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hosting-prueba__titulo { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--ui-ink); font-size: 13px; font-weight: 750; }
.hosting-prueba__titulo i { color: var(--ui-muted); }
.hosting-prueba__titulo i[data-tone="ok"] { color: var(--ui-ok); }
.hosting-prueba__titulo i[data-tone="warn"] { color: var(--ui-warn); }
.hosting-prueba__titulo i[data-tone="danger"] { color: var(--ui-danger); }
.hosting-prueba__mensaje { margin: 6px 0 4px; color: var(--ui-soft); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
#resultadoConexionesHosting[aria-busy="true"] { opacity: .55; }

/* F7.2: estado de hosting en la lista y subdominios sin registrar */
.instalaciones-hosting { min-width: 200px; }
.hosting-celda { display: flex; align-items: flex-start; gap: 6px; }
.hosting-celda__estado { flex: 1 1 auto; min-width: 0; }
.hosting-estado { display: flex; flex-wrap: wrap; gap: 4px; }
.hosting-estado__item { padding: 1px 7px; font-size: 10.5px; }
.hosting-estado__detalle { margin-top: 4px; line-height: 1.45; }
.hosting-estado__alerta { color: var(--ui-warn); font-weight: 700; }
.hosting-recomprobar { flex: 0 0 auto; }
.hosting-aviso { margin-bottom: 14px; flex-wrap: wrap; }
.hosting-aviso > span { flex: 1 1 240px; }
.hosting-sin-registrar__filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-bottom: 12px; }
.hosting-sin-registrar__todos { display: inline-flex; align-items: center; gap: 6px; margin: 0; color: var(--ui-soft); font-size: 12px; }
.hosting-sin-registrar__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; }

/* F7.3: ficha de instalacion con pestañas */
.instalaciones-pestanas { margin-top: -4px; }
.hosting-ficha__situacion { margin: 0 0 12px; }
.hosting-apps { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-bottom: 14px; }
.hosting-ficha__campos { margin-bottom: 12px; }
.hosting-ficha__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 8px; }
.hosting-ficha__resultado { margin-top: 12px; flex-wrap: wrap; }
.hosting-ficha__resultado > span { flex: 1 1 200px; overflow-wrap: anywhere; }
.hosting-ia__activa { margin-bottom: 14px; }
.hosting-ia__coste { margin: 0 0 12px; color: var(--ui-ok); font-size: 12px; font-weight: 700; }
.hosting-historial td { vertical-align: top; }
.hosting-historial__detalle { min-width: 220px; overflow-wrap: anywhere; }
.hosting-borrar__lista { margin: 0 0 14px; padding-left: 20px; font-size: 13px; line-height: 1.55; }
.hosting-borrar__resultado { margin-top: 12px; flex-wrap: wrap; }
.hosting-borrar__resultado > span { flex: 1 1 200px; overflow-wrap: anywhere; }
.instalaciones-panel-ficha[aria-busy="true"] { opacity: .55; }
.hosting-ficha__primer-apartado { margin-top: 0; padding-top: 0; border-top: 0; }

/* Comparador: pestaña Configuracion (F5.2) */
.comparador-config { display: grid; gap: 22px; }
.comparador-bloque { display: grid; gap: 10px; }
.comparador-bloque .aura-ui-hint { margin: -4px 0 0; max-width: 90ch; }
.comparador-bloque__titulo { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--ui-ink); font-size: 14px; font-weight: 750; }
.comparador-bloque__titulo i { color: var(--ui-primary); font-size: 12px; }
.comparador-referencia { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.comparador-referencia .aura-ui-select { flex: 0 1 460px; min-width: 240px; }
.comparador-tablas { max-height: 560px; overflow-y: auto; }
.comparador-anadir__toolbar { margin-bottom: 10px; }
.comparador-anadir__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 2px 16px; max-height: 360px; overflow-y: auto; padding: 4px 2px; }
.comparador-anadir__fila { display: flex; align-items: center; gap: 8px; margin: 0; padding: 5px 6px; border-radius: 6px; font-size: 13px; cursor: pointer; overflow-wrap: anywhere; }
.comparador-anadir__fila:hover { background: var(--ui-primary-soft); }
.comparador-anadir__fila[hidden] { display: none; }
.comparador-tablas thead th { position: sticky; top: 0; z-index: 1; }
.comparador-tablas .is-centro { width: 1%; text-align: center; white-space: nowrap; }
.comparador-tabla-nombre { color: var(--ui-ink); font-weight: 650; font-family: SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 11.5px; overflow-wrap: anywhere; }
.comparador-interruptor { justify-content: center; }
.comparador-clave { width: 170px; height: 30px; padding: 4px 9px; font-family: SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 11.5px; text-transform: uppercase; }
.comparador-clave::placeholder { text-transform: none; }
.comparador-tablas tr[hidden] { display: none; }
@media (max-width: 767.98px) {
    .comparador-referencia .aura-ui-select { flex: 1 1 100%; }
    .comparador-clave { width: 120px; }
}

/* Comparador: resultado de una comparacion (F5.4) */
.comparador-referencia-actual { margin: 0 0 12px; }
.comparador-referencia-actual i { color: var(--ui-primary); }
.comparador-resultado-zona { margin-top: 18px; }
.comparador-resultado-zona:empty { display: none; }
.comparador-resultado { display: grid; gap: 14px; padding: 18px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-paper); }
.comparador-resultado__cabecera { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--ui-line-soft); }
.comparador-resultado__cabecera h2 { margin: 0 0 3px; color: var(--ui-ink); font-size: 15px; font-weight: 750; }
.comparador-resultado__frente { color: var(--ui-muted); font-weight: 500; }
.comparador-resumen { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; }
.comparador-contador { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid var(--ui-warn-line); border-radius: var(--ui-radius-sm); background: var(--ui-warn-bg); }
.comparador-contador strong { color: var(--ui-warn); font-size: 18px; font-weight: 750; font-variant-numeric: tabular-nums; }
.comparador-contador span { color: var(--ui-soft); font-size: 11px; }
.comparador-contador.is-cero { border-color: var(--ui-line-soft); background: var(--ui-head-bg); }
.comparador-contador.is-cero strong { color: var(--ui-faint); }
.comparador-diferencias { display: grid; gap: 8px; }
.comparador-diferencia { border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); background: var(--ui-paper); }
.comparador-diferencia summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 9px 12px; cursor: pointer; }
.comparador-diferencia[open] summary { border-bottom: 1px solid var(--ui-line-soft); }
.comparador-diferencia__tabla { color: var(--ui-ink); font-weight: 700; }
.comparador-diferencia__chips { display: flex; flex-wrap: wrap; gap: 4px; margin-right: auto; }
.comparador-diferencia__lista td { vertical-align: top; overflow-wrap: anywhere; }
.comparador-resultado__aviso-tabla { margin: 8px 12px 0; color: var(--ui-warn); font-size: 12px; }
.comparador-resultado__nota { margin: 0; }
.comparador-mono { font-family: SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 11.5px; }
.comparador-sql-bloque__cabecera { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.comparador-sql-bloque__acciones { display: flex; gap: 6px; }
.comparador-sql { max-height: 420px; margin: 0; padding: 12px 14px; overflow: auto; border-radius: var(--ui-radius-sm); color: #d8e3e0; background: #1f2b29; font-family: SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 11.5px; line-height: 1.55; white-space: pre; }
@media (max-width: 767.98px) {
    .comparador-resultado { padding: 12px; }
    .comparador-resultado__cabecera { flex-direction: column; }
}

/* Comparador: resultado en modal, tablas y SQL plegados (F5.4) */
.comparador-modal .aura-ui-modal__head { align-items: center; }
.comparador-modal__titulo { flex: 1 1 auto; min-width: 0; }
.comparador-modal__estado { flex: 0 0 auto; margin-right: 8px; }
.comparador-modal .comparador-resultado { padding: 0; border: 0; }
.comparador-fila-referencia td { background: var(--ui-head-bg); }
.comparador-diferencias__cabecera { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 2px; }
.comparador-sql-desplegable { border: 1px solid var(--ui-line); border-radius: var(--ui-radius-sm); }
.comparador-sql-desplegable summary { padding: 9px 12px; color: var(--ui-primary); font-size: 12px; font-weight: 700; cursor: pointer; }
.comparador-sql-desplegable[open] summary { border-bottom: 1px solid var(--ui-line-soft); }
.comparador-sql-desplegable .aura-ui-hint { margin: 8px 12px 0; }
.comparador-sql-desplegable .comparador-sql { margin: 8px; }
/* Las lineas largas del SQL no deben ensanchar la rejilla: el desplazamiento horizontal va solo dentro del <pre> */
.comparador-resultado > *,
.comparador-bloque > *,
.comparador-diferencias > * { min-width: 0; }
.comparador-modal .modal-body { overflow-x: hidden; }

/* Comparador: aplicar e historial (F5.5) */
.comparador-modal .aura-ui-modal__foot { flex-wrap: wrap; }
.comparador-modal__hueco { flex: 1 1 auto; }
.comparador-modal__motivo { max-width: 60ch; }
.comparador-aplicando, .comparador-aplicacion-reciente { margin-bottom: 14px; }
.comparador-errores { display: grid; gap: 8px; margin: 0; padding: 10px 12px 12px 32px; font-size: 12px; }
.comparador-errores li { overflow-wrap: anywhere; }
.comparador-errores code { display: block; margin-bottom: 2px; color: var(--ui-ink); white-space: pre-wrap; }
.comparador-errores span { color: var(--ui-danger); }
.comparador-historial { margin-top: 14px; }
.comparador-historial .aura-ui-table-wrap { margin: 0; }
.comparador-historial__aplicacion td { background: var(--ui-head-bg); }
.comparador-historial__errores summary { margin-top: 4px; color: var(--ui-danger); font-size: 11px; font-weight: 700; cursor: pointer; }

/* ---- Versiones compartidas (fase 9, F9.2): lista del modal «Versiones» ---- */
.versiones-tabla { margin: 0; }
.versiones-tabla td { vertical-align: top; }
.versiones-tabla .aura-ui-status + .aura-ui-table__sub { margin-top: 4px; }
.versiones-uso summary { color: var(--ui-primary); font-size: 12px; font-weight: 700; cursor: pointer; }
.versiones-uso__lista { margin: 6px 0 0; padding-left: 18px; font-size: 12px; line-height: 1.55; }
.versiones-uso__lista .aura-ui-table__sub { display: inline; }
.versiones-pie { margin: 10px 0 0; }
.versiones-acciones { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.versiones-accion__bloqueada { display: inline-block; cursor: not-allowed; }
.versiones-accion__bloqueada .aura-ui-btn { pointer-events: none; }
.versiones-nueva { margin: 0 0 14px; }
.versiones-nueva--boton { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.versiones-nueva .hosting-copia__barra { max-width: none; }
.versiones-nueva__acciones { display: flex; flex-wrap: wrap; gap: 8px; }

/* ---- Cambiar contraseña (13/11/2026): en el móvil, el botón de la barra solo con su icono ---- */
.buzon-clave__resultado { margin-top: 12px; }
@media (max-width: 575.98px) {
  .buzon-barra__texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}