/* ============================================================
   NOMBRE       : PORTAL PÚBLICO
   ARCHIVO      : assets/css/pages/portal-publico.css
   MÓDULO       : Trámites Ciudadanos / Verificación Pública
   APLICACIÓN   : MunDigital Web
   DESARROLLADOR: Rodrigo Arce Muñoz
   AUTOR        : Rodrigo Arce Muñoz
   CREACIÓN     : Septiembre 2026
   ============================================================
   Header y footer de las páginas sin sesión: tramites/header.php y tramites/footer.php, con el mismo formato que
   includes/header.php (#topbar) e includes/footer.php (.footer-nuevo, en app.css).
   No depende de bootstrap.css: las píldoras .pub-pill tienen su propio estilo.
   El color de fondo institucional lo ponen los partials inline. */

/* ===== Barra superior ===== */
.pub-topbar {
    height: var(--topbar-height, 90px);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0 1.25rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    position: relative;
    z-index: 40;
    font-family: 'Nunito', sans-serif;
}
.pub-topbar-sticky { position: sticky; top: 0; }
.pub-topbar-marca { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.pub-topbar-marca a { display: inline-flex; align-items: center; }
.pub-topbar-marca img { height: 3.75em; }
.pub-topbar-texto { min-width: 0; }
.pub-topbar-title { font-size: 0.95rem; font-weight: 700; line-height: 1.2; color: #fff; }
.pub-topbar-sub { margin: 0; padding: 0; font-size: 12px; color: #fff; opacity: 0.85; line-height: 1.35; }
.pub-topbar-acciones { display: flex; align-items: center; gap: .5rem; list-style: none; padding-left: 0; margin: 0; flex-shrink: 0; }

/* ===== Píldoras (mismo aspecto que btn-primary / btn-danger rounded-pill del sistema) ===== */
.pub-pill {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .45rem 1rem; border-radius: 50rem; border: 1px solid transparent;
    font-family: 'Nunito', sans-serif; font-size: .9rem; font-weight: 600; line-height: 1.4;
    color: #fff !important; text-decoration: none !important; white-space: nowrap; cursor: pointer;
    transition: filter .15s ease;
}
.pub-pill:hover { filter: brightness(1.1); }
.pub-pill i { font-size: 1rem; }
.pub-pill-primary { background: var(--accent-brand, #435ebe); border-color: var(--accent-brand, #435ebe); }
.pub-pill-danger { background: #dc3545; border-color: #dc3545; }
.pub-pill-outline { background: transparent; border-color: rgba(255, 255, 255, .6); }
.pub-pill-outline:hover { background: rgba(255, 255, 255, .15); filter: none; }

/* ===== Pie ===== */
.pub-footer-md { font-family: 'Nunito', sans-serif; font-size: .9rem; margin-top: 2rem; }
.pub-footer-md .fn-logos { flex-wrap: wrap; }

@media (max-width: 767.98px) {
    .pub-topbar { height: auto; min-height: var(--topbar-height, 90px); padding: 10px 1rem; }
    .pub-topbar-marca img { height: 3em; }
    .pub-topbar-acciones .texto { display: none; }   /* en celular los botones quedan solo con el ícono */
    .pub-topbar-acciones .pub-pill { padding: .45rem .7rem; }
}

@media print {
    .pub-topbar, .pub-footer-md, .btn-scroll-top { display: none !important; }
}