/* MAXIFER · Branding compartido (header visual)
   Replica el topbar de pedido.html. No toca estilos del body de cada app. */

.mxb-topbar{
    --mxb-navy:#1a3a7a;
    --mxb-navy-dark:#13295a;
    --mxb-navy-light:#2151a8;
    --mxb-green:#4ea83e;
    --mxb-green-dark:#3d8a30;
    --mxb-orange:#e8510a;

    border-bottom:1px solid rgba(255,255,255,.08);
    background:linear-gradient(135deg, var(--mxb-navy-dark) 0%, var(--mxb-navy) 60%, var(--mxb-navy-light) 100%);
    position:sticky;top:0;z-index:9999;
    padding:12px 16px;
    padding-top:max(10px, env(safe-area-inset-top));
    padding-left:max(16px, env(safe-area-inset-left));
    padding-right:max(16px, env(safe-area-inset-right));
    box-shadow:0 2px 12px rgba(19,41,90,.25);
    color:#fff;
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    -webkit-font-smoothing:antialiased;
    line-height:1.25;
}
.mxb-topbar *{box-sizing:border-box}
.mxb-topbar-inner{
    max-width:1400px;margin:0 auto;display:flex;align-items:center;
    justify-content:space-between;gap:12px;
}
.mxb-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#fff}
.mxb-brand:hover{text-decoration:none;color:#fff}
.mxb-brand img{
    width:40px;height:40px;object-fit:contain;
    background:#fff;border-radius:10px;padding:3px;
    box-shadow:0 2px 6px rgba(0,0,0,.2);
    flex-shrink:0;
}
.mxb-brand-text{
    font-family:'Montserrat','Inter',sans-serif;font-size:10px;
    color:rgba(255,255,255,.85);
    text-transform:uppercase;letter-spacing:.14em;font-weight:700;
    border-left:1px solid rgba(255,255,255,.25);padding-left:12px;line-height:1.25;
}
.mxb-brand-text strong{
    display:block;color:#fff;font-size:13px;letter-spacing:.16em;
}
.mxb-ver-chip{
    font-size:9px;color:rgba(255,255,255,.5);font-weight:700;
    letter-spacing:.05em;
    align-self:center;margin-left:auto;
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (max-width:560px){
    .mxb-brand img{width:34px;height:34px}
    .mxb-brand-text{font-size:9px;padding-left:10px}
    .mxb-brand-text strong{font-size:11px}
}
