/* Sistema de apariencia SGAM: azul oscuro, negro y claro. */
:root,
:root[data-sgap-theme="claro"] {
    color-scheme: light;
    --sgap-bg: #f3f6fa;
    --sgap-card: #ffffff;
    --sgap-ink: #172033;
    --sgap-text: #172033;
    --sgap-muted: #617083;
    --sgap-blue: #1769aa;
    --sgap-panel: #202b3f;
    --sgap-panel-soft: #2b394f;
    --sgap-panel-muted: #b9c8d8;
    --sgap-line: #d8e1ea;
    --sgap-input: #ffffff;
    --sgap-input-text: #172033;
    --sgap-soft: #edf3f8;
    --sgap-hover: #e3edf6;
    --sgap-shadow: 0 12px 34px rgba(23, 32, 51, .08);
}

:root[data-sgap-theme="azul"] {
    color-scheme: dark;
    --sgap-bg: #081423;
    --sgap-card: #111f33;
    --sgap-ink: #0d1a2d;
    --sgap-text: #eef6ff;
    --sgap-muted: #a8bdd2;
    --sgap-blue: #2e91d3;
    --sgap-panel: #172943;
    --sgap-panel-soft: #213a5c;
    --sgap-panel-muted: #bfd2e5;
    --sgap-line: #334b67;
    --sgap-input: #0c1a2c;
    --sgap-input-text: #f3f8ff;
    --sgap-soft: #152842;
    --sgap-hover: #1d3553;
    --sgap-shadow: 0 14px 38px rgba(0, 0, 0, .32);
}

:root[data-sgap-theme="negro"] {
    color-scheme: dark;
    --sgap-bg: #07080a;
    --sgap-card: #111317;
    --sgap-ink: #090a0d;
    --sgap-text: #f2f2f3;
    --sgap-muted: #aaaeb6;
    --sgap-blue: #438fca;
    --sgap-panel: #17191e;
    --sgap-panel-soft: #24272e;
    --sgap-panel-muted: #c0c3c9;
    --sgap-line: #383b43;
    --sgap-input: #0b0d10;
    --sgap-input-text: #f7f7f8;
    --sgap-soft: #1a1d22;
    --sgap-hover: #252930;
    --sgap-shadow: 0 14px 38px rgba(0, 0, 0, .55);
}

body.app-body { background: var(--sgap-bg); color: var(--sgap-text); }
.app-page-head, .app-head-brand, .app-head-product, .app-content { color: var(--sgap-text); }
.app-head-credit { color: var(--sgap-muted); }
.app-content, .app-embedded-module, .app-login { background: var(--sgap-card); border-color: var(--sgap-line); color: var(--sgap-text); }
.app-embedded-module__frame { background: var(--sgap-card); }
.app-view-switch { border-color: var(--sgap-line); background: var(--sgap-soft); }
.app-view-switch button { color: var(--sgap-muted); }
.app-view-switch button.is-active, .app-view-switch button[aria-pressed="true"] { background: var(--sgap-card); color: var(--sgap-blue); }
.app-sidebar { background: var(--sgap-ink); }
.app-account, .app-navigation a:hover, .app-navigation a.is-active,
.app-navigation__group-toggle:hover, .app-navigation__group.is-active .app-navigation__group-toggle { background: var(--sgap-panel); }
.app-board { background: linear-gradient(145deg, var(--sgap-ink), var(--sgap-panel)); border-color: var(--sgap-line); }
.app-board-card { background: var(--sgap-panel); border-color: var(--sgap-line); }
.app-board-card:hover, .app-board-card.is-active, .app-board-card--group { background: var(--sgap-panel-soft); }

.app-theme-control {
    display: inline-flex;
    align-items: center;
    flex: none;
}
.app-theme-native {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    white-space: nowrap;
}
.app-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 7px;
    border: 1px solid var(--sgap-line);
    border-radius: 50%;
    background: var(--sgap-card);
    color: var(--sgap-text);
    cursor: pointer;
}
.app-theme-toggle svg { width: 23px; height: 23px; fill: none; stroke-width: 2; }
.app-theme-toggle circle:nth-child(1) { stroke: #2e91d3; }
.app-theme-toggle circle:nth-child(2) { stroke: #9299a4; }
.app-theme-toggle circle:nth-child(3) { stroke: #f1f4f8; }
:root[data-sgap-theme="claro"] .app-theme-toggle circle:nth-child(3) { stroke: #172033; }
.app-theme-toggle:focus-visible { outline: 3px solid var(--sgap-blue); outline-offset: 2px; }
.app-theme-control--login { position: fixed; top: 14px; right: 16px; z-index: 50; box-shadow: var(--sgap-shadow); }
.app-theme-picker { width: min(430px, calc(100vw - 28px)); padding: 20px; border: 1px solid var(--sgap-line); border-radius: 14px; background: var(--sgap-card); color: var(--sgap-text); box-shadow: var(--sgap-shadow); }
.app-theme-picker::backdrop { background: rgba(2, 8, 18, .7); }
.app-theme-picker__head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.app-theme-picker__head h2 { margin: 0; color: var(--sgap-text); font-size: 20px; }
.app-theme-picker__head button { width: 36px; height: 36px; border: 1px solid var(--sgap-line); border-radius: 50%; background: var(--sgap-soft); color: var(--sgap-text); font-size: 22px; cursor: pointer; }
.app-theme-picker > p { margin: 8px 0 16px; color: var(--sgap-muted); }
.app-theme-options { display: grid; gap: 10px; }
.app-theme-options > button { display: grid; grid-template-columns: 92px 1fr auto; align-items: center; gap: 12px; min-height: 64px; padding: 10px; border: 2px solid var(--sgap-line); border-radius: 10px; background: var(--sgap-card); color: var(--sgap-text); font: 700 14px Arial, sans-serif; text-align: left; cursor: pointer; }
.app-theme-options > button[aria-pressed="true"] { border-color: var(--sgap-blue); background: var(--sgap-soft); }
.app-theme-swatches { display: flex; height: 38px; overflow: hidden; border: 1px solid var(--sgap-line); border-radius: 7px; }
.app-theme-swatches i { flex: 1; }
[data-sgap-theme-option="azul"] .app-theme-swatches i:nth-child(1) { background: #081423; }
[data-sgap-theme-option="azul"] .app-theme-swatches i:nth-child(2) { background: #172943; }
[data-sgap-theme-option="azul"] .app-theme-swatches i:nth-child(3) { background: #2e91d3; }
[data-sgap-theme-option="negro"] .app-theme-swatches i:nth-child(1) { background: #07080a; }
[data-sgap-theme-option="negro"] .app-theme-swatches i:nth-child(2) { background: #24272e; }
[data-sgap-theme-option="negro"] .app-theme-swatches i:nth-child(3) { background: #aaaeb6; }
[data-sgap-theme-option="claro"] .app-theme-swatches i:nth-child(1) { background: #f3f6fa; }
[data-sgap-theme-option="claro"] .app-theme-swatches i:nth-child(2) { background: #ffffff; }
[data-sgap-theme-option="claro"] .app-theme-swatches i:nth-child(3) { background: #1769aa; }
.app-theme-check { visibility: hidden; color: var(--sgap-blue); font-size: 20px; }
.app-theme-options > button[aria-pressed="true"] .app-theme-check { visibility: visible; }

/* El shell y sus tarjetas respetan la superficie activa, sin restos blancos en oscuro. */
:root:not([data-sgap-theme="claro"]) .app-content,
:root:not([data-sgap-theme="claro"]) .app-quick-links,
:root:not([data-sgap-theme="claro"]) .sgap-home,
:root:not([data-sgap-theme="claro"]) .sgap-welcome,
:root:not([data-sgap-theme="claro"]) .sgap-welcome__inner,
:root:not([data-sgap-theme="claro"]) .app-login { background: var(--sgap-card) !important; color: var(--sgap-text) !important; }
:root:not([data-sgap-theme="claro"]) .app-quick-link { background: var(--sgap-soft) !important; color: var(--sgap-text) !important; border-color: var(--sgap-line) !important; }
:root:not([data-sgap-theme="claro"]) .app-quick-links__header h2,
:root:not([data-sgap-theme="claro"]) .sgap-welcome h2,
:root:not([data-sgap-theme="claro"]) .sgap-welcome p,
:root:not([data-sgap-theme="claro"]) .sgap-welcome__signature { color: var(--sgap-text) !important; }

/* Capa de compatibilidad para formularios y reportes heredados cargados en SGAM. */
:root:not([data-sgap-theme="claro"]) body,
:root:not([data-sgap-theme="claro"]) #cont10,
:root:not([data-sgap-theme="claro"]) #cont10 form,
:root:not([data-sgap-theme="claro"]) #cont10 fieldset,
:root:not([data-sgap-theme="claro"]) #cont10 section,
:root:not([data-sgap-theme="claro"]) #cont10 article,
:root:not([data-sgap-theme="claro"]) #cont10 .card,
:root:not([data-sgap-theme="claro"]) #cont10 [class*="panel"] {
    color: var(--sgap-text);
    border-color: var(--sgap-line);
}
:root:not([data-sgap-theme="claro"]) #cont10 input,
:root:not([data-sgap-theme="claro"]) #cont10 select,
:root:not([data-sgap-theme="claro"]) #cont10 textarea,
:root:not([data-sgap-theme="claro"]) #cont10 table,
:root:not([data-sgap-theme="claro"]) #cont10 th,
:root:not([data-sgap-theme="claro"]) #cont10 td {
    border-color: var(--sgap-line) !important;
    color: var(--sgap-input-text) !important;
}
:root:not([data-sgap-theme="claro"]) #cont10 input,
:root:not([data-sgap-theme="claro"]) #cont10 select,
:root:not([data-sgap-theme="claro"]) #cont10 textarea { background-color: var(--sgap-input) !important; }
:root:not([data-sgap-theme="claro"]) #cont10 table,
:root:not([data-sgap-theme="claro"]) #cont10 td { background-color: var(--sgap-card); }
:root:not([data-sgap-theme="claro"]) #cont10 th { background-color: var(--sgap-soft); }
:root:not([data-sgap-theme="claro"]) #cont10 a { color: #6eb9ed; }
:root:not([data-sgap-theme="claro"]) #cont10 [style*="background: white"],
:root:not([data-sgap-theme="claro"]) #cont10 [style*="background:#fff"],
:root:not([data-sgap-theme="claro"]) #cont10 [style*="background: #fff"],
:root:not([data-sgap-theme="claro"]) #cont10 [style*="background-color: white"],
:root:not([data-sgap-theme="claro"]) #cont10 [style*="background-color:#fff"] { background: var(--sgap-card) !important; }

/* Formularios antiguos: paneles, listas y tarjetas dejan de conservar blanco fijo. */
:root:not([data-sgap-theme="claro"]) #cont10 > *,
:root:not([data-sgap-theme="claro"]) #cont10 form,
:root:not([data-sgap-theme="claro"]) #cont10 fieldset,
:root:not([data-sgap-theme="claro"]) #cont10 section,
:root:not([data-sgap-theme="claro"]) #cont10 article,
:root:not([data-sgap-theme="claro"]) #cont10 [class*="card"],
:root:not([data-sgap-theme="claro"]) #cont10 [class*="panel"],
:root:not([data-sgap-theme="claro"]) #cont10 [class*="contenedor"],
:root:not([data-sgap-theme="claro"]) #cont10 [class*="container"],
:root:not([data-sgap-theme="claro"]) #cont10 [class*="formulario"] {
    background-color: var(--sgap-card) !important;
    color: var(--sgap-text) !important;
    border-color: var(--sgap-line) !important;
}
:root:not([data-sgap-theme="claro"]) #cont10 .sgap-repuestos-unificado,
:root:not([data-sgap-theme="claro"]) #cont10 .sgap-repuestos-unificado__modos {
    background: var(--sgap-card) !important;
    color: var(--sgap-text) !important;
    border-color: var(--sgap-line) !important;
}
:root:not([data-sgap-theme="claro"]) #cont10 .sgap-repuestos-unificado__nota {
    background: var(--sgap-soft) !important;
    color: var(--sgap-text) !important;
    border-color: var(--sgap-blue) !important;
}
:root:not([data-sgap-theme="claro"]) #cont10 .sgap-repuestos-unificado__frame { background: var(--sgap-card) !important; }
:root:not([data-sgap-theme="claro"]) #cont10 h1,
:root:not([data-sgap-theme="claro"]) #cont10 h2,
:root:not([data-sgap-theme="claro"]) #cont10 h3,
:root:not([data-sgap-theme="claro"]) #cont10 h4,
:root:not([data-sgap-theme="claro"]) #cont10 p,
:root:not([data-sgap-theme="claro"]) #cont10 label,
:root:not([data-sgap-theme="claro"]) #cont10 legend,
:root:not([data-sgap-theme="claro"]) #cont10 li,
:root:not([data-sgap-theme="claro"]) #cont10 span:not(.app-quick-link__sigla) { color: var(--sgap-text) !important; }
:root:not([data-sgap-theme="claro"]) #cont10 [class*="nota"],
:root:not([data-sgap-theme="claro"]) #cont10 [class*="help"],
:root:not([data-sgap-theme="claro"]) #cont10 small { color: var(--sgap-muted) !important; }

/* Superficies de Reportes, Bitácora y desplegables filtrables. */
:root:not([data-sgap-theme="claro"]) #cont10 :is(.sgap-reportes__dato,.sgap-reportes__admin,.sgap-reportes__grupo,.bo-card,.bo-tabs,.bo-tab[aria-selected="true"],.bo-current,.bo-table-top,.cqd-searchable-select__toggle) {
    background: var(--sgap-card) !important;
    color: var(--sgap-text) !important;
    border-color: var(--sgap-line) !important;
}
:root:not([data-sgap-theme="claro"]) #cont10 :is(.sgap-reportes__dato--ok,.sgap-reportes__dato--warn,.sgap-reportes__dato--danger,.bo-current) { background: var(--sgap-soft) !important; }
:root:not([data-sgap-theme="claro"]) #cont10 .cqd-searchable-select__toggle:disabled { background: var(--sgap-soft) !important; color: var(--sgap-muted) !important; }

/* La misma hoja se inyecta en iframes del mismo origen. */
:root:not([data-sgap-theme="claro"]) body:not(.app-body) { background: var(--sgap-bg) !important; color: var(--sgap-text) !important; }
:root:not([data-sgap-theme="claro"]) body:not(.app-body) input,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) select,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) textarea { background: var(--sgap-input) !important; color: var(--sgap-input-text) !important; border-color: var(--sgap-line) !important; }
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form fieldset,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .b_rep_desc,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) #opciones_bm {
    background: var(--sgap-card) !important;
    color: var(--sgap-text) !important;
    border-color: var(--sgap-line) !important;
}
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form h1,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form h2,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form h4,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form legend,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-repuestos-form label { color: var(--sgap-text) !important; }
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-form-nota,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) .sgap-pegado-directo-guia,
:root:not([data-sgap-theme="claro"]) body:not(.app-body) #estado_pegado_repuestos {
    background: var(--sgap-soft) !important;
    color: var(--sgap-text) !important;
    border-color: var(--sgap-line) !important;
}
:root:not([data-sgap-theme="claro"]) body:not(.app-body) #tabla_br th { background: var(--sgap-soft) !important; color: var(--sgap-text) !important; }
:root:not([data-sgap-theme="claro"]) body:not(.app-body) #tabla_br td { background: var(--sgap-card) !important; color: var(--sgap-text) !important; border-color: var(--sgap-line) !important; }

@media (max-width: 760px) {
    .app-theme-toggle { width: 34px; height: 34px; padding: 6px; }
    .app-theme-control--login { top: 8px; right: 8px; }
}

@media (min-width: 761px) and (max-width: 1100px) {
    .app-head-credit { display: none; }
}
