/* ============================================================
   EcuadorOk - MENU SUPERIOR
   ============================================================ */

.topbar {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;

    background: #ffffff;

    border-bottom: 1px solid #e5e7eb;

    box-shadow:
        0 3px 12px rgba(0, 0, 0, 0.05);
}

.topbar__contenedor {
    max-width: 1450px;

    margin: 0 auto;

    min-height: 68px;

    padding: 0 28px;

    display: flex;
    align-items: center;

    gap: 30px;
}


/* MARCA */

.topbar__marca {
    flex-shrink: 0;
}

.topbar__logo {
    text-decoration: none;

    font-size: 22px;
    font-weight: 800;

    color: #111827;

    letter-spacing: -0.5px;
}


/* MENU */

.topbar__menu {
    display: flex;
    align-items: center;

    gap: 8px;

    flex: 1;
}

.topbar__enlace {
    padding: 9px 13px;

    border-radius: 8px;

    text-decoration: none;

    font-size: 14px;
    font-weight: 600;

    color: #4b5563;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}

.topbar__enlace:hover {
    background: #f3f4f6;

    color: #111827;
}


/* USUARIO */

.topbar__usuario {
    display: flex;
    align-items: center;

    gap: 11px;
}

.topbar__avatar {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    border-radius: 50%;

    background: #2563eb;

    color: #ffffff;

    font-size: 15px;
    font-weight: 400;
}

.topbar__usuario-datos {
    display: flex;
    flex-direction: column;

    min-width: 0;
}

.topbar__usuario-datos strong {
    max-width: 170px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    font-size: 13px;

    color: #111827;
}

.topbar__usuario-datos span {
    max-width: 170px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    font-size: 11px;

    color: #6b7280;
}

.topbar__logout {
    display: none;
    margin-left: 8px;

    padding: 8px 12px;

    border-radius: 8px;

    text-decoration: none;

    background: #f3f4f6;

    color: #374151;

    font-size: 13px;
    font-weight: 600;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}

.topbar__logout:hover {
    background: #fee2e2;

    color: #b91c1c;
}


/* RESPONSIVE */

@media (max-width: 850px) {

    .topbar__contenedor {
        padding: 0 16px;
    }

    .topbar__menu {
        display: none;
    }

    .topbar__usuario {
        margin-left: auto;
    }

    .topbar__usuario-datos {
        display: none;
    }
}
.topbar__logo-imagen{display:block;max-width:150px;height:42px;object-fit:contain;object-position:left center}


.topbar__alertas{position:relative}.topbar__alertas-boton{position:relative;display:grid;place-items:center;width:40px;height:40px;border:1px solid #dbe3ee;border-radius:50%;background:#fff;cursor:pointer;font-size:18px}.topbar__alertas-boton:hover,.topbar__alertas:focus-within .topbar__alertas-boton{background:#eff6ff;border-color:#93c5fd}.topbar__alertas-boton b{position:absolute;top:-6px;right:-7px;display:grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border:2px solid #fff;border-radius:999px;background:#dc2626;color:#fff;font-size:11px}.topbar__alertas-panel{position:absolute;top:calc(100% + 10px);right:0;z-index:1200;display:none;width:310px;padding:10px;border:1px solid #dbe3ee;border-radius:12px;background:#fff;box-shadow:0 18px 45px rgba(15,23,42,.2)}.topbar__alertas:hover .topbar__alertas-panel,.topbar__alertas:focus-within .topbar__alertas-panel{display:grid}.topbar__alertas-panel>strong{padding:8px 10px}.topbar__alertas-panel a{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px;border-radius:8px;color:#334155;text-decoration:none;font-size:13px}.topbar__alertas-panel a:hover{background:#f1f5f9}.topbar__alertas-panel a b{display:grid;place-items:center;min-width:25px;height:25px;border-radius:999px;background:#e0e7ff;color:#3730a3}
.topbar__alertas--personal .topbar__alertas-boton b{background:#16a34a}.topbar__alertas--personal .topbar__alertas-panel a b{background:#dcfce7;color:#166534}
.topbar__alertas--logs .topbar__alertas-boton{border-color:#f59e0b;background:#fffbeb;color:#92400e}.topbar__alertas--logs .topbar__alertas-boton b{background:#f59e0b}.topbar__alertas--logs .topbar__alertas-panel a b{background:#fef3c7;color:#92400e}.topbar__alertas-aviso{margin:4px 10px 8px;color:#b45309;font-size:12px;line-height:1.45}


.topbar__desplegable{position:relative}.topbar__desplegable-boton{display:flex;align-items:center;gap:6px;border:0;background:transparent;cursor:pointer;font-family:inherit}.topbar__submenu{position:absolute;top:calc(100% + 8px);left:0;z-index:1000;display:none;min-width:205px;padding:7px;border:1px solid #dfe5ee;border-radius:11px;background:#fff;box-shadow:0 16px 40px rgba(15,23,42,.16)}.topbar__desplegable:hover .topbar__submenu,.topbar__desplegable:focus-within .topbar__submenu{display:grid}.topbar__submenu a{padding:10px 12px;border-radius:8px;color:#334155;text-decoration:none;font-size:14px;font-weight:600}.topbar__submenu a:hover{background:#f1f5f9;color:#111827}
.topbar__cuenta-usuario>.topbar__desplegable-boton{padding:4px 7px 4px 4px}.topbar__cuenta-usuario>.topbar__submenu{right:0;left:auto}.topbar__cuenta-nombre{display:block;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}
.topbar__submenu-separador{display:block;height:1px;margin:5px 7px;background:#dbe3ee}
.topbar__submenu-grupo{display:grid;margin:0;padding:0}.topbar__submenu-titulo,.topbar__submenu-identidad{display:block;padding:7px 12px 4px;color:#64748b;font-size:10px;font-weight:850;letter-spacing:.11em;text-transform:uppercase}.topbar__submenu-identidad{padding-bottom:8px;color:#334155;font-size:12px;letter-spacing:0;text-transform:none}.topbar__submenu--amplio{min-width:240px}.topbar__cuenta-admin{margin-left:auto}.topbar__cuenta-admin>.topbar__submenu{right:0;left:auto}

body.tema-rol .topbar{background:var(--rol-color-principal);border-bottom-color:var(--rol-color-principal)}body.tema-rol .topbar__logo,body.tema-rol .topbar__enlace,body.tema-rol .topbar__usuario-datos strong,body.tema-rol .topbar__usuario-datos span{color:var(--rol-color-secundario)}body.tema-rol .topbar__avatar{background:var(--rol-color-secundario);color:var(--rol-color-principal)}body.tema-rol .topbar__enlace:hover,body.tema-rol .topbar__desplegable:focus-within>.topbar__enlace{background:color-mix(in srgb,var(--rol-color-secundario) 18%,transparent);color:var(--rol-color-secundario)}.topbar__rol-indicador{position:relative;display:grid;place-items:center;width:25px;height:25px;border:1px solid color-mix(in srgb,var(--rol-color-secundario,#fff) 60%,transparent);border-radius:50%;color:var(--rol-color-secundario,#334155);font-size:12px;font-weight:800;cursor:help}.topbar__rol-indicador>span{position:absolute;right:0;top:calc(100% + 9px);z-index:1300;display:none;width:max-content;max-width:220px;padding:8px 10px;border-radius:8px;background:#111827;color:#fff;font-size:12px;font-weight:600;box-shadow:0 8px 22px rgba(15,23,42,.25)}.topbar__rol-indicador:hover>span,.topbar__rol-indicador:focus>span{display:block}

.topbar__movil-boton{display:none;width:42px;height:42px;padding:9px;border:1px solid #dbe3ee;border-radius:10px;background:#fff;cursor:pointer}.topbar__movil-boton span{display:block;height:2px;margin:4px 0;border-radius:2px;background:#334155}
@media(max-width:850px){.topbar__movil-boton{display:block;margin-left:auto}.topbar__menu{position:absolute;top:calc(100% + 1px);left:12px;right:12px;display:none;max-height:calc(100vh - 90px);padding:10px;overflow:auto;flex-direction:column;align-items:stretch;gap:5px;border:1px solid #dbe3ee;border-radius:0 0 14px 14px;background:#fff;box-shadow:0 18px 36px rgba(15,23,42,.2)}.topbar__menu.topbar__menu--abierto{display:flex}.topbar__menu>.topbar__desplegable{width:100%}.topbar__menu .topbar__desplegable-boton{width:100%;justify-content:space-between;padding:12px;color:#334155!important}.topbar__menu .topbar__submenu{position:static;display:none;width:auto;min-width:0;margin:3px 0 7px;padding:5px;box-shadow:none;background:#f8fafc}.topbar__menu .topbar__desplegable--abierto>.topbar__submenu{display:grid}.topbar__usuario{margin-left:0}.topbar__cuenta-nombre{display:none}}
body.tema-rol .topbar__movil-boton{border-color:rgba(255,255,255,.5);background:transparent}body.tema-rol .topbar__movil-boton span{background:var(--rol-color-secundario,#fff)}

/* EcuadorOk v012 · identidad del portal administrativo */
.topbar{background:color-mix(in srgb,var(--topbar-primario,var(--sitio-primario,#0f766e)) 94%,#000 6%);border-bottom-color:color-mix(in srgb,var(--topbar-sobre-primario,#fff) 20%,transparent);color:var(--topbar-sobre-primario,#fff)}
.topbar__logo,.topbar__enlace{color:var(--topbar-sobre-primario,#fff)}.topbar__logo-imagen{padding:3px 7px;border-radius:9px;background:rgba(255,255,255,.95)}
.topbar__enlace:hover,.topbar__desplegable:focus-within>.topbar__enlace{background:color-mix(in srgb,var(--topbar-sobre-primario,#fff) 14%,transparent);color:var(--topbar-sobre-primario,#fff)}
.topbar__movil-boton{border-color:color-mix(in srgb,var(--topbar-sobre-primario,#fff) 40%,transparent);background:transparent}.topbar__movil-boton span{background:var(--topbar-sobre-primario,#fff)}
@media(max-width:850px){.topbar__menu{border-color:color-mix(in srgb,var(--topbar-sobre-primario,#fff) 22%,transparent);background:color-mix(in srgb,var(--topbar-primario,var(--sitio-primario,#0f766e)) 94%,#000 6%)}.topbar__menu .topbar__desplegable-boton{color:var(--topbar-sobre-primario,#fff)!important}.topbar__menu .topbar__submenu{background:#fff}}
/* v013: navegación administrativa centralizada. */
.topbar__enlace--activo{background:color-mix(in srgb,var(--topbar-sobre-primario,#fff) 18%,transparent)!important;box-shadow:inset 0 -2px 0 var(--topbar-secundario,var(--sitio-secundario,#f59e0b))}
@media(max-width:850px){.topbar__enlace--activo{box-shadow:inset 3px 0 0 var(--topbar-secundario,var(--sitio-secundario,#f59e0b))}}

/* EcuadorOk v022 · menú móvil modal, cerrable y estable */
.topbar__fondo-menu,.ecuadorok-menu-fondo{position:fixed;inset:0;width:100%;height:100%;padding:0;border:0;border-radius:0;background:rgba(2,6,23,.52);cursor:default;backdrop-filter:blur(2px)}
.topbar__fondo-menu{z-index:990}.ecuadorok-menu-fondo{z-index:1090}
body.menu-admin-abierto,body.menu-publico-abierto{overflow:hidden;overscroll-behavior:none}
@media(max-width:850px){
 .topbar__contenedor{min-height:64px;padding-inline:14px;gap:12px}
 .topbar__marca{min-width:0}.topbar__logo{display:block;max-width:calc(100vw - 84px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topbar__logo-imagen{max-width:min(150px,calc(100vw - 100px));height:38px}
 .topbar__movil-boton{position:relative;z-index:2;display:block;flex:0 0 44px;width:44px;height:44px;margin-left:auto;touch-action:manipulation}
 .topbar__menu{position:fixed;z-index:1010;top:64px;right:10px;bottom:10px;left:10px;display:none;max-height:none;padding:10px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;border-radius:0 0 16px 16px}
 .topbar__menu.topbar__menu--abierto{display:flex}
 .topbar__menu .topbar__desplegable:hover>.topbar__submenu,.topbar__menu .topbar__desplegable:focus-within>.topbar__submenu{display:none!important}
 .topbar__menu .topbar__desplegable.topbar__desplegable--abierto>.topbar__submenu{display:grid!important}
 .topbar__menu .topbar__desplegable-boton,.topbar__menu .topbar__submenu a{min-height:44px;touch-action:manipulation}
 .topbar__submenu-separador{margin-block:7px}.topbar__submenu-titulo{padding-top:9px}
}
@media(max-width:420px){.topbar__menu{right:6px;bottom:6px;left:6px;padding:7px}.topbar__menu .topbar__desplegable-boton{padding-inline:10px}.topbar__submenu{padding-inline:3px}}

.topbar__alertas{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;color:inherit;text-decoration:none;border-radius:9px}.topbar__alertas--pendientes{background:#fff3cd;color:#663c00}.topbar__alertas b{background:#b91c1c;color:#fff;border-radius:999px;min-width:23px;text-align:center;padding:2px 5px}.topbar__iniciales{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--topbar-primario,#0f766e);color:var(--topbar-sobre-primario,#fff)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.mensaje-alerta-nuevo{animation:mensajeAlertaPulso .7s ease 2}@keyframes mensajeAlertaPulso{50%{transform:scale(1.12)}}

/* EcuadorOk v072 · menús móviles compactos, no bloqueantes y autocerrables */
.topbar__fondo-menu,.ecuadorok-menu-fondo{display:none!important}
body.menu-admin-abierto,body.menu-publico-abierto{overflow:auto!important;overscroll-behavior:auto!important}
@media(max-width:850px){
 .topbar__menu{
  position:fixed!important;
  z-index:1010;
  top:calc(64px + env(safe-area-inset-top,0px))!important;
  right:8px!important;
  bottom:auto!important;
  left:8px!important;
  max-height:68vh!important;
  max-height:min(68dvh,560px)!important;
  padding:8px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  border:1px solid color-mix(in srgb,var(--topbar-sobre-primario,#fff) 22%,transparent)!important;
  border-radius:14px!important;
  box-shadow:0 16px 38px rgba(15,23,42,.24)!important;
 }
 .topbar__menu .topbar__desplegable{width:100%;min-width:0}
 .topbar__menu .topbar__desplegable-boton{min-height:42px!important;padding:9px 11px!important}
 .topbar__menu .topbar__submenu{
  position:static!important;
  width:100%!important;
  min-width:0!important;
  max-height:44vh!important;
  max-height:min(44dvh,360px)!important;
  margin:4px 0 6px!important;
  padding:5px!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
  border-radius:10px!important;
  box-shadow:none!important;
 }
 .topbar__menu .topbar__submenu a{min-height:40px!important;padding:8px 10px!important}
 .topbar__alertas{min-height:42px;padding:8px 11px}
 .topbar__cuenta-admin{margin-left:0!important}
 .topbar__alertas-panel{max-width:calc(100vw - 24px);max-height:min(60dvh,430px);overflow:auto}
}
@media(max-width:420px){
 .topbar__menu{top:calc(62px + env(safe-area-inset-top,0px))!important;right:5px!important;left:5px!important;max-height:min(66dvh,500px)!important;padding:6px!important}
 .topbar__menu .topbar__submenu{max-height:min(42dvh,330px)!important}
}

/* EcuadorOk v073 · navegación administrativa coherente, accesible y responsive */
.topbar__acciones-globales{display:flex;align-items:center;gap:6px;margin-left:auto;flex:0 0 auto}
.topbar__desplegable:hover>.topbar__submenu,.topbar__desplegable:focus-within>.topbar__submenu{display:none!important}
.topbar__desplegable.topbar__desplegable--abierto>.topbar__submenu{display:grid!important}
.topbar__submenu-activo{background:#ecfdf5!important;color:#065f46!important;box-shadow:inset 3px 0 0 var(--topbar-secundario,var(--sitio-secundario,#f59e0b))}
.topbar__desplegable--ruta-activa>.topbar__desplegable-boton{background:color-mix(in srgb,var(--topbar-sobre-primario,#fff) 18%,transparent)!important}
.topbar__desplegable-boton>span[aria-hidden="true"]{transition:transform .14s ease}.topbar__desplegable--abierto>.topbar__desplegable-boton>span[aria-hidden="true"]{transform:rotate(180deg)}
.topbar__enlace:focus-visible,.topbar__submenu a:focus-visible,.topbar__movil-boton:focus-visible{outline:3px solid color-mix(in srgb,var(--topbar-secundario,#f59e0b) 74%,#fff);outline-offset:2px}
@media(max-width:850px){
 .topbar__contenedor{padding-inline:max(7px,env(safe-area-inset-left)) max(7px,env(safe-area-inset-right));gap:6px}
 .topbar__logo-imagen{max-width:min(112px,calc(100vw - 178px));height:36px}
 .topbar__movil-boton{order:2;margin-left:auto!important;flex:0 0 42px;width:42px;height:42px}
 .topbar__menu{order:4;top:calc(64px + env(safe-area-inset-top,0px))!important;right:max(6px,env(safe-area-inset-right))!important;left:max(6px,env(safe-area-inset-left))!important;max-height:min(66dvh,calc(100dvh - 86px),540px)!important;z-index:1010!important}
 .topbar__acciones-globales{order:3;margin-left:0;gap:3px}
 .topbar__alertas{width:42px;height:42px;justify-content:center;padding:0!important;position:relative}.topbar__alertas-texto{display:none}.topbar__alertas b{position:absolute;top:-2px;right:-2px;min-width:17px;height:17px;padding:0 3px;font-size:10px;line-height:17px}
 .topbar__cuenta-admin{margin-left:0!important}
 .topbar__cuenta-admin>.topbar__desplegable-boton{width:42px;height:42px;padding:0;justify-content:center}.topbar__cuenta-admin>.topbar__desplegable-boton>span:last-child{display:none}
 .topbar__cuenta-admin>.topbar__submenu{position:fixed!important;z-index:1020!important;top:calc(64px + env(safe-area-inset-top,0px))!important;right:max(6px,env(safe-area-inset-right))!important;left:auto!important;width:min(310px,calc(100vw - 12px - env(safe-area-inset-left) - env(safe-area-inset-right)))!important;max-height:min(66dvh,calc(100dvh - 86px),520px)!important;overflow:auto!important;overscroll-behavior:contain}
 .topbar__menu .topbar__submenu{max-height:min(42dvh,330px)!important}
}
@media(max-width:375px){.topbar__logo-imagen{max-width:82px;height:32px}.topbar__contenedor{gap:4px}.topbar__movil-boton,.topbar__alertas,.topbar__cuenta-admin>.topbar__desplegable-boton{width:40px;height:40px;flex-basis:40px}.topbar__iniciales{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.topbar__desplegable-boton>span[aria-hidden="true"],.topbar__enlace,.topbar__submenu{transition:none!important;animation:none!important}}