/*! UpSEO — App shell for every inner page (tools, profile, dashboard, account, contact…).
    Provides the sidebar layout for pages that don't already build .upseo-app-container,
    and makes the whole page wide edge-to-edge. Home header/hero styles are NOT loaded here. */

:root{ --up-shell-sidebar-w:260px; --up-shell-sidebar-collapsed:72px; }

body.up-app{background:var(--up-canvas,#f8fafc)}

/* Remove the old boxed/centered container width on every inner page */
.container.main-container,
.container.main-container.tool-root,
.upseo-main-panel .container.main-container{
  width:100% !important;max-width:100% !important;margin:0 !important;padding-inline:0 !important;
}
.main-index{
  background:var(--up-surface,#fff);border:1px solid var(--up-line,#e2e8f0);border-radius:16px;
  padding:24px 24px 20px !important;
}

/* -------- Auto-shell: wraps pages that DON'T already output .upseo-app-container -------- */
.up-autoshell{display:flex;align-items:flex-start;width:100%;min-height:calc(100vh - 20px)}
.up-autoshell > .up-autoshell__main{flex:1 1 0;min-width:0;width:100%;padding:20px 24px}
@media (max-width:1150px){ .up-autoshell > .up-autoshell__main{padding:14px} }

/* -------- Shared sidebar look also applies when injected by the auto-shell -------- */
.upseo-app-container,
.up-autoshell{max-width:100%;width:100%}

/* -------- Mobile/tablet top bar for inner pages (no home header here) --------
   Gives a constant, unmistakable way to open the sidebar drawer + a visible
   login button for guests, so the drawer trigger is never "lost" on a phone. */
.up-app-topbar{
  display:none;
  position:sticky;top:0;z-index:100060;
  align-items:center;gap:10px;height:56px;padding-inline:12px;
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--up-line,#e2e8f0);
}
.up-app-topbar__burger{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:38px;height:38px;border:0;border-radius:10px;background:var(--up-canvas,#f1f5f9);
  color:var(--up-ink,#0f172a);cursor:pointer;
}
.up-app-topbar__burger svg{width:20px;height:20px}
.up-app-topbar__burger:hover{background:var(--up-line,#e2e8f0)}
.up-app-topbar__logo{display:flex;align-items:center;flex:none}
.up-app-topbar__logo img{height:26px;width:auto;display:block}
.up-app-topbar__spacer{flex:1}
.up-app-topbar__login{
  margin-inline-start:auto;display:inline-flex;align-items:center;height:36px;padding:0 16px;
  border-radius:9px;background:var(--up-primary,#4f46e5);color:#fff !important;text-decoration:none;
  font-weight:800;font-size:13.5px;
}

@media (max-width:1150px){
  .up-app-topbar{display:flex}
  /* fixed instead of sticky on small screens keeps it reachable while the tall sidebar/content scrolls */
  .up-app-topbar{position:fixed;inset-inline:0}
  body.up-app{padding-top:56px}
  .up-autoshell{min-height:calc(100vh - 56px)}
}
