/*
 * odoo-panel.css — Módulo Odoo: catálogo, curación, exportación.
 * Identidad de dominio: mint (--dom-odoo = --go-ink, decisión owner 2026-07-07).
 * Referencia: standards-diseno-central.md §1 (3 capas de color).
 *
 * QUA-426 Ola 1b: grilla con pin de columna + drawer de ficha + Safe Sync dry-run.
 * QUA-644 F2A-02: fix page-exportar-odoo en blanco en light mode.
 *
 * ROOT CAUSE (QUA-644): en central-tokens.css light mode, --bg (oklch 98.6%) y
 * --card (oklch 99.4%) son near-white casi idénticos. El bloque de remapeo en
 * styles.css:762 aplica "background: var(--bg)" + "--bg-card: var(--card)" a
 * page-exportar-odoo, resultando en contraste ≈ 0 entre fondo y tarjetas.
 * Fix: sobreescribir el fondo de la sección con un valor más cálido-gris
 * que preserve la elevación visual de las cs-panel (tarjetas blancas sobre
 * fondo gris-suave), consistente con el visual del skin Central en claro.
 */

/* ============================================================
   EXPORTAR A ODOO — corrección de fondo en light mode
   ============================================================ */

/* Reemplaza el "background: var(--bg)" del bloque styles.css:762 con un valor
   que provea contraste visible frente a las cs-panel (--bg-card = --card ≈ blanco).
   oklch(95% 0.007 330): warm near-gray con el mismo matiz mauve del skin Central.
   En dark mode este selector NO aplica (central-tokens.css dark redefine --line
   a oklch(30% ...), haciendo el color-mix muy oscuro — se anula abajo). */
#page-exportar-odoo[data-skin="central"] {
    background: oklch(95% 0.007 330);
}

/* Dark mode: restaura el fondo oscuro original de central-tokens
   (oklch(17% 0.014 330) del dark --bg, preservado por la regla styles.css:762). */
html[data-theme="dark"] #page-exportar-odoo[data-skin="central"] {
    background: var(--bg);
}

/* Sombra para cs-panel: en el skin Central la elevación se expresa con sombra
   (no solo con diferencia de fondo). Completa la separación visual en light mode. */
#page-exportar-odoo[data-skin="central"] .cs-panel {
    box-shadow: 0 1px 3px oklch(25% 0.022 330 / 0.08),
                0 1px 1px oklch(25% 0.022 330 / 0.05);
    border-color: var(--line-2);
}

/* cs-hero: borde inferior más pronunciado para que el separador del hero sea visible
   con el nuevo fondo gris-suave de la sección. */
#page-exportar-odoo[data-skin="central"] .cs-hero {
    border-bottom-color: var(--line-2);
}

/* ============================================================
   CATÁLOGO Y CURACIÓN ODOO (página con grilla + drawer)
   Nota: los estilos de .odp-* y .qc-chip--odoo están definidos en
   styles.css:11746+ para mantener el archivo bajo (patrón de la base).
   Este bloque solo agrega lo que no entra en ese scope genérico.
   ============================================================ */

/* Curación: tarjeta de par duplicado */
.odcur-par {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 16px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg, 12px);
    margin-bottom: 10px;
}
.odcur-par-head {
    grid-column: 1 / -1;
    font-size: 12px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border);
}
.odcur-item {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.odcur-nombre { font-weight: 600; font-size: 13.5px; color: var(--text); }
.odcur-sku { font-size: 11.5px; color: var(--text-muted); font-variant-numeric: tabular-nums; }
.odcur-actions {
    grid-column: 1 / -1;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    padding-top: 10px;
    border-top: 1px solid var(--border);
    margin-top: 4px;
}

/* Loading placeholder */
.pl-loading {
    text-align: center;
    padding: 48px 24px;
    color: var(--text-muted);
    font-size: 13px;
}

/* Responsive mobile */
@media (max-width: 640px) {
    .odcur-par {
        grid-template-columns: 1fr;
    }
    .odcur-par-head, .odcur-actions { grid-column: 1; }
}