/* Office 365 / Word — Fluent Design · Modo oscuro */
:root,
html.theme-dark,
body.theme-dark {
    --word-blue: #0d3b6e;
    --word-blue-dark: #082849;
    --word-blue-light: #6cb8ff;
    --fluent-blue: #4cc2ff;
    --fluent-blue-hover: #7ad4ff;
    --bg-app: #1b1a19;
    --bg-canvas: #252423;
    --bg-sidebar: #201f1e;
    --bg-ribbon: #292827;
    --border: #3b3a39;
    --border-strong: #484644;
    --text: #f3f2f1;
    --text-secondary: #c8c6c4;
    --text-muted: #a19f9d;
    --success: #6ccb5f;
    --success-bg: rgba(16, 124, 16, 0.22);
    --warning: #f8d22a;
    --warning-bg: rgba(202, 80, 16, 0.22);
    --danger: #f1707b;
    --danger-bg: rgba(164, 38, 44, 0.24);
    --info-bg: rgba(0, 120, 212, 0.18);
    --shadow-sm: 0 1.6px 3.6px rgba(0,0,0,.45), 0 0.3px 0.9px rgba(0,0,0,.35);
    --shadow-md: 0 6.4px 14.4px rgba(0,0,0,.5), 0 1.2px 3.6px rgba(0,0,0,.4);
    --row-alt: #2d2c2b;
    --row-hover: rgba(76, 194, 255, 0.12);
    --nav-hover: #323130;
}

body {
    background: var(--bg-app);
    color: var(--text);
}

.title-bar {
    background: linear-gradient(180deg, #12407a 0%, var(--word-blue) 100%);
    box-shadow: 0 2px 6px rgba(0,0,0,.45);
}

.word-icon {
    background: #f3f2f1;
    color: var(--word-blue-dark);
}

.ribbon {
    background: var(--bg-ribbon);
    border-bottom-color: var(--border);
}

.ribbon-tab {
    color: var(--text);
}

.ribbon-tab:hover {
    background: var(--nav-hover);
}

.ribbon-tab.active,
.ribbon a.ribbon-tab.is-active {
    background: var(--info-bg);
    color: var(--fluent-blue);
}

.sidebar {
    background: var(--bg-sidebar);
    border-right-color: var(--border);
}

.nav-item {
    color: var(--text);
}

.nav-item:hover {
    background: var(--nav-hover);
    color: var(--fluent-blue);
}

.nav-item.active {
    background: var(--info-bg);
    border-left-color: var(--fluent-blue);
    color: var(--fluent-blue);
}

.document-page {
    background: var(--bg-canvas);
    border-color: var(--border);
}

.doc-title {
    color: var(--word-blue-light);
}

.doc-subtitle,
p.lead {
    color: var(--text-secondary);
}

.stat-card {
    background: var(--bg-sidebar);
    border-color: var(--border);
}

.callout-info    { background: var(--info-bg);    border-color: var(--fluent-blue); color: var(--text); }
.callout-success { background: var(--success-bg); border-color: var(--success); color: var(--text); }
.callout-warning { background: var(--warning-bg); border-color: var(--warning); color: var(--text); }
.callout-danger  { background: var(--danger-bg);  border-color: var(--danger); color: var(--text); }

table.word-table th {
    background: #2b579a;
    border-color: var(--word-blue-dark);
}

table.word-table td {
    border-color: var(--border);
    color: var(--text);
}

table.word-table tr:nth-child(even) td {
    background: var(--row-alt);
}

table.word-table tr:hover td {
    background: var(--row-hover);
}

.file-card {
    background: var(--bg-canvas);
    border-color: var(--border);
}

.quick-card {
    background: var(--bg-canvas);
    border-color: var(--border);
    color: var(--text);
}

.quick-card .qc-title {
    color: var(--text);
}

.accordion summary {
    background: var(--bg-sidebar);
    color: var(--fluent-blue);
}

.accordion .accordion-body {
    background: var(--bg-canvas);
    border-top-color: var(--border);
}

.quote-block {
    background: var(--bg-sidebar);
    color: var(--text-secondary);
    border-left-color: var(--word-blue-light);
}

.code-block {
    background: #141414;
    border: 1px solid var(--border);
}

.progress-track {
    background: var(--border-strong);
}

.brg-table tr:nth-child(even) td {
    background: var(--row-alt);
}

.brg-table tr:hover td {
    background: var(--row-hover);
}

.brg-panel-list a:hover {
    background: var(--row-hover);
    color: var(--fluent-blue);
}

.entrada-card {
    background: var(--bg-canvas);
    border-color: var(--border);
}

.entrada-field label {
    color: var(--text);
}

.brg-formulario input,
.brg-formulario select,
.brg-formulario textarea,
.brg-filters input,
.brg-filters select {
    background: #1b1a19;
    border-color: var(--border-strong);
    color: var(--text);
}

.brg-formulario input::placeholder,
.brg-formulario textarea::placeholder {
    color: var(--text-muted);
}

/* Operaciones — adaptar módulos al tema Word oscuro */
.brg-op-header {
    background: var(--bg-sidebar);
    border-color: var(--border);
}

.brg-op-header h1,
.brg-op-header .doc-title {
    color: var(--word-blue-light);
}

.brg-protocol-intro__card {
    background: var(--bg-sidebar);
    border-color: var(--border);
    color: var(--text);
}

.brg-op-status-item strong {
    color: var(--text-secondary);
}

.brg-op-status-item span {
    color: var(--text);
}

/* Academia shell (htdocs raíz) */
body.brg-academia .app-sidebar {
    background: var(--bg-sidebar);
    border-right-color: var(--border);
}

body.brg-academia .sidebar-header {
    background: linear-gradient(180deg, #12407a 0%, var(--word-blue) 100%);
    border-bottom: none;
}

body.brg-academia .sidebar-brand-link,
body.brg-academia .sidebar-brand-link strong,
body.brg-academia .sidebar-brand-link span {
    color: #fff;
}

body.brg-academia .sidebar-nav-link {
    color: var(--text);
    border-radius: var(--radius);
}

body.brg-academia .sidebar-nav-link:hover,
body.brg-academia .sidebar-nav-link.is-active {
    background: var(--info-bg);
    color: var(--fluent-blue);
}

body.brg-academia .content-panel {
    background: var(--bg-canvas);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-md);
}

body.brg-academia .content-panel__title {
    color: var(--word-blue-light);
}

body.brg-academia .app-main {
    background: var(--bg-app);
}

/* Entrada tuto */
.entrada-body {
    background: linear-gradient(160deg, #1b1a19 0%, #12407a 100%);
}

.entrada-brand h1 {
    color: var(--word-blue-light);
}

.entrada-brand p {
    color: var(--text-secondary);
}

/* Staff editor oscuro */
body.brg-staff-editor .staff-card,
body.brg-staff-editor .staff-panel,
body.brg-staff-editor .editor-card,
body.brg-staff-editor .editor-step,
body.brg-staff-editor .preview-card,
body.brg-staff-editor .media-card {
    background: var(--bg-canvas);
    border-color: var(--border);
    color: var(--text);
}

body.brg-staff-editor .staff-btn,
body.brg-staff-editor .staff-shell__nav a {
    background: transparent;
    border-color: var(--border-strong);
    color: var(--text);
}

body.brg-staff-editor code {
    background: #141414;
    color: var(--fluent-blue);
    padding: 2px 6px;
    border-radius: 3px;
}

/* Landing academia */
.landing .section-title {
    color: var(--word-blue-light);
}

.landing .card {
    background: var(--bg-canvas);
    border-color: var(--border);
}

.landing .card:hover,
.landing .card.is-selected {
    border-color: var(--fluent-blue);
    box-shadow: var(--shadow-sm);
}