/* ─── Base ───────────────────────────────────────────────── */
html, body {
    font-family: 'Lora', Georgia, 'Times New Roman', serif;
    background-color: #F5F0E8;
}

h1:focus { outline: none; }

/* ─── Fondo general ──────────────────────────────────────── */
body,
.mud-main-content,
.mud-layout,
.mud-main-content > .mud-container {
    background-color: #F5F0E8 !important;
}

/* ─── Tipografía: Lora para contenido, Inter para UI ─────── */
.mud-typography {
    font-family: 'Lora', Georgia, serif !important;
}

/* Títulos con Lora */
.mud-typography-h4,
.mud-typography-h5,
.mud-typography-h6,
.mud-typography-subtitle1,
.mud-typography-subtitle2 {
    font-family: 'Lora', Georgia, serif !important;
    font-weight: 600 !important;
}

/* UI elements con Inter — más legible a tamaño pequeño */
.mud-button-root,
.mud-input,
.mud-select-input,
.mud-table-cell,
.mud-input-label,
.mud-nav-link,
.mud-chip,
.mud-alert,
.mud-snackbar {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* ─── AppBar ─────────────────────────────────────────────── */
.mud-appbar {
    background-color: #1C1917 !important;
    border-bottom: 1px solid #D4C4A8 !important;
    box-shadow: none !important;
}
.mud-appbar .mud-icon-button,
.mud-appbar .mud-icon-root {
    color: #F5F0E8 !important;
}

.mud-appbar .mud-typography {
    color: #F5F0E8 !important;
}

.appbar-title {
    color: #D97706 !important;
    font-weight: 700 !important;
}

/* ─── Drawer / Sidebar ───────────────────────────────────── */
.mud-drawer {
    background-color: #EDE8DF !important;
    border-right: 1px solid #D4C4A8 !important;
}
.mud-drawer-header {
    border-bottom: 1px solid #D4C4A8 !important;
    padding: 16px !important;
}
.mud-drawer .mud-typography {
    color: #1C1917 !important;
    font-family: 'Inter', sans-serif !important;
}
.mud-nav-link {
    color: #57534E !important;
    border-radius: 8px !important;
    margin: 2px 8px !important;
    font-weight: 500;
    font-size: 0.875rem;
    transition: background 0.15s ease, color 0.15s ease;
}
.mud-nav-link:hover {
    background-color: #DDD6CB !important;
    color: #1C1917 !important;
}
.mud-nav-link.active {
    background-color: #D97706 !important;
    color: #FFFFFF !important;
}
.mud-nav-link.active i {
    color: #FFFFFF !important;
}
.mud-nav-link i {
    color: #78716C !important;
}

/* ─── Phosphor Icons ─────────────────────────────────────── */
.ph-nav {
    font-size: 1.25rem;
    margin-right: 8px;
    vertical-align: middle;
}
.ph-appbar {
    font-size: 1.375rem;
    vertical-align: middle;
    color: #F5F0E8;
}

/* ─── Cards / Papers ─────────────────────────────────────── */
.mud-paper {
    background-color: #FDFAF4 !important;
    border: 1px solid #E7DFD0 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

/* ─── Tablas ─────────────────────────────────────────────── */
.mud-table-root {
    border-radius: 12px !important;
    overflow: hidden;
}
.mud-table-head .mud-table-cell {
    background-color: #F0EAE0 !important;
    font-weight: 600 !important;
    font-size: 0.72rem !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #78716C !important;
    font-family: 'Inter', sans-serif !important;
}
.mud-table-row:hover > .mud-table-cell {
    background-color: #F5EFE4 !important;
}

/* ─── Botones ────────────────────────────────────────────── */
.mud-button-root {
    border-radius: 8px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}
.mud-button-filled.mud-button-color-primary {
    background-color: #D97706 !important;
    color: #FFFFFF !important;
}
.mud-button-filled.mud-button-color-primary:hover {
    background-color: #B45309 !important;
    box-shadow: 0 2px 8px rgba(217,119,6,0.25) !important;
}
.mud-button-outlined.mud-button-color-primary {
    border-color: #D97706 !important;
    color: #D97706 !important;
}

/* ─── Inputs ─────────────────────────────────────────────── */
.mud-input-outlined .mud-input-outlined-border {
    border-color: #D4C4A8 !important;
    border-radius: 8px !important;
}
.mud-input-outlined:hover .mud-input-outlined-border {
    border-color: #D97706 !important;
}
.mud-input-label { font-family: 'Inter', sans-serif !important; }

/* ─── Chips / Badges ─────────────────────────────────────── */
.mud-chip { border-radius: 6px !important; }

/* ─── Progress bar ───────────────────────────────────────── */
.mud-progress-linear-bar {
    background-color: #D97706 !important;
}

/* ─── Alerts ─────────────────────────────────────────────── */
.mud-alert { border-radius: 10px !important; }

/* ─── Snackbar ───────────────────────────────────────────── */
.mud-snackbar { border-radius: 10px !important; }

/* ─── Textos ─────────────────────────────────────────────── */
.mud-text-secondary { color: #78716C !important; }

/* ─── Scrollbar ──────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #D4C4A8; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #D97706; }

/* ─── Error UI ───────────────────────────────────────────── */
#blazor-error-ui {
    background: #FEF3C7;
    border-top: 2px solid #D97706;
    bottom: 0;
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
    font-family: 'Inter', sans-serif;
    color: #92400E;
}
#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}