/* SGL 4.2.2: conserva siempre la proporción original del logotipo. */
img[class*="logo" i], img[id*="logo" i], .brand img, .sidebar-logo img, header img.logo { width:auto !important; height:auto !important; max-width:100% !important; object-fit:contain !important; aspect-ratio:auto !important; }
.remote-url-box{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:14px;margin:12px 0;background:var(--surface-soft)}.remote-url-box small{grid-column:1/-1;color:var(--muted)}.remote-url-box code{overflow:auto;font-size:12px;font-weight:700}

/* SGL 4.2.7 · avisos de aprobación/revisión */
.notification-pill.has-unread{border-color:#f0bf55;background:#fff8e7}
.notification-label{display:inline}
.notification-modal{width:min(820px,96vw)}
.notification-list{display:grid;gap:9px}
.notification-item{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:11px;align-items:start;padding:12px;border:1px solid var(--border);border-radius:14px;background:#fff}
.notification-item.unread{border-color:#a8c2ff;background:#f6f9ff;box-shadow:0 3px 12px rgba(30,74,160,.06)}
.notification-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);font-size:17px;font-weight:900}
.notification-item h4{margin:7px 0 4px;font-size:13px}.notification-item p{margin:0;color:var(--text);font-size:12px;line-height:1.45}.notification-item small{display:block;margin-top:5px;color:var(--muted);font-size:9px}

/* SGL 4.2.7 · en retrato el menú es realmente off-canvas. La versión anterior
   reservaba 76 px permanentes y por eso tapaba/estrechaba el chat con el teclado. */
@media(max-width:760px) and (orientation:portrait){
  .shell{grid-template-columns:minmax(0,1fr)!important;width:100%!important;overflow-x:hidden}
  .main{grid-column:1!important;width:100%!important;min-width:0!important}
  .content{width:100%!important;min-width:0!important;padding-left:15px!important;padding-right:15px!important}
  .sidebar{
    position:fixed!important;z-index:110!important;left:0!important;top:0!important;
    width:min(82vw,280px)!important;height:100dvh!important;
    padding:max(12px,env(safe-area-inset-top)) 14px max(12px,env(safe-area-inset-bottom))!important;
    transform:translateX(calc(-100% - 14px));
    transition:transform .22s ease,box-shadow .22s ease!important;
    box-shadow:none!important;overflow-y:auto!important;
  }
  .sidebar .side-brand{justify-content:flex-start!important;gap:10px!important}
  .sidebar .side-brand div,.sidebar .nav button span,.sidebar .user-meta{display:block!important}
  .sidebar .nav button{justify-content:flex-start!important;padding:8px 10px!important;gap:10px!important}
  .sidebar .side-user .user-row{justify-content:flex-start!important}.sidebar .side-user .logout{display:block!important}
  .mobile-drawer-tab{
    display:grid!important;place-items:center!important;position:fixed!important;z-index:125!important;
    left:0!important;top:44%!important;width:31px!important;height:58px!important;
    border:1px solid rgba(255,255,255,.2)!important;border-left:0!important;border-radius:0 14px 14px 0!important;
    background:var(--nav)!important;color:#fff!important;font-size:28px!important;font-weight:700!important;
    box-shadow:4px 5px 16px rgba(0,0,0,.18)!important;transition:left .22s ease!important;touch-action:manipulation
  }
  body.mobile-menu-open{overflow:hidden!important}
  body.mobile-menu-open:after{
    content:""!important;position:fixed!important;z-index:95!important;inset:0!important;
    background:rgba(5,15,24,.38)!important;backdrop-filter:blur(1px)!important;pointer-events:auto!important
  }
  body.mobile-menu-open .sidebar{transform:translateX(0)!important;box-shadow:14px 0 38px rgba(0,0,0,.28)!important}
  body.mobile-menu-open .mobile-drawer-tab{left:min(calc(82vw - 8px),272px)!important}
  .notification-label{display:none}.notification-item{grid-template-columns:36px minmax(0,1fr)}.notification-item>.btn{grid-column:2;width:max-content}
}

/* SGL 4.2.17 · acciones directas en avisos de cambios propuestos */
.notification-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap;min-width:160px}
.admin-change-plan-notice{border:1px solid rgba(180,35,24,.18)}
@media(max-width:760px) and (orientation:portrait){
  .notification-actions{grid-column:2;justify-content:flex-start;min-width:0;width:100%}
  .notification-actions .btn{width:auto}
}