/* 
 * Personalización del Admin de Wagtail
 * Escuela Normal Superior Lácides Iriarte
 */

/* ===================================
   LOGO Y BRANDING
   =================================== */

/* Logo en el sidebar */
.sidebar-header img {
    max-width: 80px !important;
    width: 80px !important;
    height: auto !important;
    padding: 15px 10px !important;
    display: block !important;
    margin: 0 auto !important;
}

/* Ocultar logo de Wagtail */
.sidebar-header .wagtail-logo,
.sidebar-header svg[class*="icon"] {
    display: none !important;
}

/* ===================================
   SIDEBAR
   =================================== */

.sidebar {
    background: #2e3d4e !important;
}

.sidebar-header {
    background: #fff !important;
    border-bottom: 1px solid #e6e6e6 !important;
    padding: 0 !important;
}

.sidebar-header a {
    display: block !important;
    padding: 0 !important;
}

/* Items del menú */
.sidebar-menu-item {
    color: #fff !important;
}

.sidebar-menu-item:hover {
    background: rgba(255, 255, 255, 0.1) !important;
}

.sidebar-menu-item.active,
.sidebar-menu-item[aria-current="page"] {
    background: rgba(255, 255, 255, 0.15) !important;
}

/* ===================================
   PÁGINA DE LOGIN (DESACTIVADO PARA RESTAURAR FÁBRICA)
   =================================== */

/* 
.login-form img { ... }
.login-form h1 { ... }
body.login { ... }
.login-form { ... }
...
*/

/* ===================================
   COLORES INSTITUCIONALES
   =================================== */

/* Botones primarios */
.button,
.button-primary,
button[type="submit"]:not(.login-form button) {
    background-color: #007d7e !important;
    border-color: #007d7e !important;
    color: #ffffff !important;
}

.button:hover,
.button-primary:hover,
button[type="submit"]:hover:not(.login-form button) {
    background-color: #006566 !important;
    border-color: #006566 !important;
    color: #ffffff !important;
}

/* Asegurar texto blanco en botones primarios */
.button-primary *,
.button--primary *,
.w-button--primary *,
.button-primary svg,
.button--primary svg,
.w-button--primary svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Botones de acción en headers */
.w-header-actions .button,
.w-header-actions .w-button,
.header-actions .button,
.header .button-primary {
    background-color: #007d7e !important;
    color: #ffffff !important;
    border-color: #007d7e !important;
}

.w-header-actions .button *,
.w-header-actions .w-button *,
.header-actions .button *,
.header .button-primary * {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Links activos */
a.active,
.active > a {
    color: #007d7e !important;
}

/* ===================================
   MEJORAS GENERALES
   =================================== */

/* Mejorar el header */
.header {
    background: #fff !important;
    border-bottom: 1px solid #e6e6e6 !important;
}

/* Breadcrumbs */
.breadcrumb {
    color: #666 !important;
}

/* Breadcrumb items */
.breadcrumb li {
    color: #666 !important;
}

.breadcrumb a {
    color: #007d7e !important;
    text-decoration: none !important;
}

.breadcrumb a:hover {
    text-decoration: underline !important;
}

/* Breadcrumb activo (cuadro verde/teal) */
.breadcrumb li[aria-current="page"],
.breadcrumb .w-breadcrumbs__item[aria-current="page"],
.w-breadcrumbs__item--active {
    background-color: #007d7e !important;
    color: #ffffff !important;
    padding: 0.5rem 1rem !important;
    border-radius: 6px !important;
}

.breadcrumb li[aria-current="page"] a,
.breadcrumb .w-breadcrumbs__item[aria-current="page"] a,
.w-breadcrumbs__item--active a {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Separadores del breadcrumb */
.breadcrumb .w-breadcrumbs__chevron,
.breadcrumb svg {
    color: #999 !important;
    opacity: 0.6 !important;
}

/* Cards */
.card {
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* Tablas */
.listing th {
    background: #f8f9fa !important;
    font-weight: 600 !important;
}

.listing tbody tr:hover {
    background: #f8f9fa !important;
}

/* ===================================
   BREADCRUMBS - MODO CLARO Y OSCURO
   =================================== */

/* Breadcrumb activo - MODO CLARO */
[data-wagtail-theme="light"] .w-breadcrumbs__item[aria-current="page"],
[data-wagtail-theme="light"] .w-breadcrumbs__item--active {
    background-color: #007d7e !important;
}

[data-wagtail-theme="light"] .w-breadcrumbs__item[aria-current="page"] a,
[data-wagtail-theme="light"] .w-breadcrumbs__item--active a,
[data-wagtail-theme="light"] .w-breadcrumbs__item[aria-current="page"] span,
[data-wagtail-theme="light"] .w-breadcrumbs__item--active span {
    color: #ffffff !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

/* Breadcrumb activo - MODO OSCURO */
[data-wagtail-theme="dark"] .w-breadcrumbs__item[aria-current="page"],
[data-wagtail-theme="dark"] .w-breadcrumbs__item--active {
    background-color: #00a8aa !important;
}

[data-wagtail-theme="dark"] .w-breadcrumbs__item[aria-current="page"] a,
[data-wagtail-theme="dark"] .w-breadcrumbs__item--active a,
[data-wagtail-theme="dark"] .w-breadcrumbs__item[aria-current="page"] span,
[data-wagtail-theme="dark"] .w-breadcrumbs__item--active span {
    color: #000000 !important;
    font-weight: 600 !important;
    text-shadow: none !important;
}

/* Separadores en modo oscuro */
[data-wagtail-theme="dark"] .w-breadcrumbs__chevron {
    color: #ccc !important;
}

/* ===================================
   MEJORAS PARA MODO OSCURO
   =================================== */

[data-wagtail-theme="dark"] .header {
    background: #1a1a1a !important;
    border-bottom: 1px solid #333 !important;
}

[data-wagtail-theme="dark"] .sidebar {
    background: #1a1a1a !important;
}

[data-wagtail-theme="dark"] .sidebar-header {
    background: #2a2a2a !important;
    border-bottom: 1px solid #333 !important;
}

[data-wagtail-theme="dark"] .w-breadcrumbs__item {
    color: #ccc !important;
}

[data-wagtail-theme="dark"] .w-breadcrumbs__item a {
    color: #00d4d6 !important;
}

[data-wagtail-theme="dark"] .card,
[data-wagtail-theme="dark"] .w-panel {
    background: #2a2a2a !important;
    border-color: #333 !important;
}

[data-wagtail-theme="dark"] input,
[data-wagtail-theme="dark"] textarea,
[data-wagtail-theme="dark"] select {
    background: #2a2a2a !important;
    border-color: #444 !important;
    color: #fff !important;
}

[data-wagtail-theme="dark"] input:focus,
[data-wagtail-theme="dark"] textarea:focus,
[data-wagtail-theme="dark"] select:focus {
    border-color: #00a8aa !important;
    background: #333 !important;
}

[data-wagtail-theme="dark"] .listing th {
    background: #2a2a2a !important;
    color: #fff !important;
    border-color: #444 !important;
}

[data-wagtail-theme="dark"] .listing td {
    border-color: #333 !important;
    color: #ccc !important;
}

[data-wagtail-theme="dark"] .listing tbody tr:hover {
    background: #333 !important;
}

[data-wagtail-theme="dark"] .button,
[data-wagtail-theme="dark"] .button-primary {
    background-color: #00a8aa !important;
    border-color: #00a8aa !important;
    color: #000 !important;
}

[data-wagtail-theme="dark"] .button:hover,
[data-wagtail-theme="dark"] .button-primary:hover {
    background-color: #00d4d6 !important;
    border-color: #00d4d6 !important;
}
