/* =========================================================
   Kit de marca · Antequera Software
   Piezas comunes a todas las apps: pie del menú lateral
   (modo claro/oscuro, cerrar sesión, crédito) y firma.
   ========================================================= */
.mk-side { margin: auto 12px 14px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.1); display: grid; gap: 3px; font-family: inherit; }
.mk-side form { margin: 0; }
.mk-side-btn {
    display: flex; align-items: center; gap: 11px; width: 100%; padding: 10px 12px; border: 0; border-radius: 12px;
    background: transparent; color: rgba(255,255,255,.82); font: 600 13.5px/1.2 inherit; font-family: inherit; text-align: left; cursor: pointer;
    transition: background .15s, color .15s;
}
.mk-side-btn[hidden] { display: none; }
.mk-side-btn svg { flex: 0 0 auto; }
.mk-side-btn:hover { background: rgba(255,255,255,.09); color: #fff; }
.mk-side-logout:hover { background: rgba(244,63,94,.18); color: #fecdd3; }
.mk-ico-sun { display: none; }
:root[data-theme="dark"] .mk-ico-sun { display: inline-flex; color: #fbbf24; }
:root[data-theme="dark"] .mk-ico-moon { display: none; }
.mk-ico-moon, .mk-ico-sun { align-items: center; }
.mk-ico-moon { display: inline-flex; }
.mk-credit { display: flex; align-items: center; gap: 10px; margin-top: 8px; padding: 11px 12px; border-radius: 12px; background: rgba(255,255,255,.06); font-size: 11.5px; line-height: 1.35; color: rgba(255,255,255,.7); }
.mk-credit img { width: 30px; height: 30px; border-radius: 8px; flex: 0 0 30px; }
.mk-credit b { color: #fff; }
.mk-credit span { color: rgba(255,255,255,.5); }
/* Menú lateral de fondo claro */
.mk-side-claro { border-top-color: rgba(15,23,42,.1); }
.mk-side-claro .mk-side-btn { color: #475569; }
.mk-side-claro .mk-side-btn:hover { background: rgba(15,23,42,.06); color: #0f172a; }
.mk-side-claro .mk-side-logout:hover { background: #fff1f2; color: #e11d48; }
.mk-side-claro .mk-credit { background: rgba(15,23,42,.04); color: #64748b; }
.mk-side-claro .mk-credit b { color: #0f172a; }
.mk-side-claro .mk-credit span { color: #94a3b8; }
:root[data-theme="dark"] .mk-side-claro .mk-side-btn { color: #cbd5e1; }
:root[data-theme="dark"] .mk-side-claro .mk-side-btn:hover { background: rgba(255,255,255,.07); color: #fff; }
:root[data-theme="dark"] .mk-side-claro .mk-credit { background: rgba(255,255,255,.05); color: #94a3b8; }
:root[data-theme="dark"] .mk-side-claro .mk-credit b { color: #fff; }

/* Firma en pantallas de acceso */
.mk-by { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 22px; font-size: 12px; line-height: 1.4; color: #64748b; }
.mk-by img { width: 26px; height: 26px; border-radius: 7px; flex: 0 0 26px; }
.mk-by b { color: #1e293b; }
.mk-by-oscuro { color: rgba(255,255,255,.7); justify-content: flex-start; }
.mk-by-oscuro b { color: #fff; }
:root[data-theme="dark"] .mk-by:not(.mk-by-oscuro) { color: #94a3b8; }
:root[data-theme="dark"] .mk-by:not(.mk-by-oscuro) b { color: #f1f5f9; }

/* Logotipo de la marca */
.mk-logo { display: block; height: auto; max-width: 100%; }
.mk-logo-claro { display: none; }
:root[data-theme="dark"] .mk-logo-normal { display: none; }
:root[data-theme="dark"] .mk-logo-claro { display: block; }

/* Botón "Instalar app": solo aparece cuando el navegador lo permite */
[data-pwa-install][hidden] { display: none !important; }
.mk-ico-moon, .mk-ico-sun { line-height: 0; }

/* Fondo de tarjeta para estilos en línea: var(--mk-card, #fff) */
:root[data-theme="dark"] { --mk-card: #171d2e; }

/* Íconos Remix (SVG en línea) */
.ri { display: inline-block; vertical-align: -0.2em; flex-shrink: 0; }