/* SmartersWeb AI v18.35 global backend shell fix */
:root{--sw-fixed-header-h:74px;--sw-backend-w:1440px;--sw-backend-pad:32px;--sw-backend-sidebar:292px;--sw-backend-gap:24px;}
html,body{min-width:0!important;max-width:100%!important;overflow-x:hidden!important;}
.tutorial-backdrop,.tutorial-spotlight,.tutorial-modal,body.tutorial-open .tutorial-backdrop,body.tutorial-open .tutorial-spotlight,body.tutorial-open .tutorial-modal{display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;box-shadow:none!important;}
body.tutorial-open{overflow:auto!important;}
.tutorial-target-active{position:static!important;z-index:auto!important;}
body.layout-v18-25 .site-header,body.layout-v18-25 .site-header-v18-25{position:sticky!important;top:0!important;bottom:auto!important;left:0!important;right:0!important;z-index:9999!important;width:100%!important;max-width:none!important;min-height:var(--sw-fixed-header-h)!important;margin:0!important;transform:none!important;display:flex!important;align-items:center!important;}
body.layout-v18-25 .site-header.nav-hidden,body.layout-v18-25 .site-header-v18-25.nav-hidden{transform:none!important;}
body.section-client .site-header-v18-25,body.section-admin .site-header-v18-25{position:fixed!important;padding:10px max(18px,calc((100vw - var(--sw-backend-w))/2 + 18px))!important;background:color-mix(in srgb,var(--bg) 92%,transparent)!important;border-bottom:1px solid var(--line)!important;backdrop-filter:blur(18px)!important;}
body.section-client .site-header-v18-25 .primary-nav,body.section-admin .site-header-v18-25 .primary-nav{display:flex!important;flex:1 1 auto!important;justify-content:center!important;align-items:center!important;gap:8px!important;min-width:0!important;}
body.section-client .main-client,body.section-admin .main-admin{display:block!important;width:100%!important;min-width:0!important;padding-top:var(--sw-fixed-header-h)!important;margin:0!important;overflow:visible!important;}
body.section-client .extension-subnav,body.section-admin .extension-subnav,body.section-client .extension-subnav-v18-23,body.section-admin .extension-subnav-v18-23{display:none!important;}
body.section-client .mobile-scrim,body.section-admin .mobile-scrim{display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;}
@media (min-width:1181px){body.section-client.sidebar-open,body.section-admin.sidebar-open,body.section-client.nav-open,body.section-admin.nav-open{overflow:auto!important;}body.section-client .nav-toggle,body.section-admin .nav-toggle{display:none!important;}body.section-client .dashboard,body.section-admin .dashboard{width:min(var(--sw-backend-w),calc(100% - var(--sw-backend-pad)))!important;max-width:var(--sw-backend-w)!important;margin:0 auto!important;padding:24px 0 56px!important;display:grid!important;grid-template-columns:minmax(252px,var(--sw-backend-sidebar)) minmax(0,1fr)!important;gap:var(--sw-backend-gap)!important;align-items:start!important;min-width:0!important;overflow:visible!important;}body.section-client .dashboard>aside.sidebar,body.section-client .dashboard>.sidebar,body.section-admin .dashboard>aside.sidebar,body.section-admin .dashboard>.sidebar{grid-column:1!important;grid-row:1!important;position:sticky!important;top:calc(var(--sw-fixed-header-h) + 18px)!important;left:auto!important;right:auto!important;bottom:auto!important;display:block!important;width:100%!important;max-width:var(--sw-backend-sidebar)!important;max-height:calc(100vh - var(--sw-fixed-header-h) - 36px)!important;transform:none!important;opacity:1!important;visibility:visible!important;z-index:20!important;overflow:auto!important;}body.section-client .dashboard>.dash-main,body.section-client .dashboard>section.dash-main,body.section-admin .dashboard>.dash-main,body.section-admin .dashboard>section.dash-main{grid-column:2!important;grid-row:1!important;display:grid!important;gap:22px!important;align-content:start!important;width:100%!important;min-width:0!important;max-width:none!important;margin:0!important;padding:0!important;opacity:1!important;visibility:visible!important;overflow:visible!important;}}
body.section-client .sidebar,body.section-admin .sidebar{border:1px solid var(--line)!important;border-radius:26px!important;padding:16px!important;background:linear-gradient(180deg,rgba(255,255,255,.082),rgba(255,255,255,.04)),color-mix(in srgb,var(--panel) 94%,transparent)!important;box-shadow:var(--shadow-soft)!important;color:var(--text)!important;backdrop-filter:blur(16px)!important;}
body.section-client .sidebar a,body.section-admin .sidebar a{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;width:100%!important;min-height:42px!important;padding:10px 12px!important;margin:2px 0!important;border-radius:15px!important;border:1px solid transparent!important;color:color-mix(in srgb,var(--text) 78%,var(--muted))!important;background:transparent!important;font-weight:850!important;line-height:1.2!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
body.section-client .sidebar a:hover,body.section-client .sidebar a.active,body.section-admin .sidebar a:hover,body.section-admin .sidebar a.active{color:var(--text)!important;border-color:rgba(22,214,182,.28)!important;background:linear-gradient(135deg,rgba(22,214,182,.14),rgba(124,92,255,.10))!important;box-shadow:inset 3px 0 0 var(--brand-2)!important;}
body.section-client .dashboard .grid,body.section-admin .dashboard .grid{min-width:0!important;}body.section-client .dashboard .grid-2,body.section-admin .dashboard .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))!important;}body.section-client .dashboard .grid-3,body.section-admin .dashboard .grid-3{grid-template-columns:repeat(3,minmax(0,1fr))!important;}body.section-client .dashboard .grid-4,body.section-admin .dashboard .grid-4{grid-template-columns:repeat(4,minmax(0,1fr))!important;}
body.section-client .dash-hero-grid,body.section-admin .dash-hero-grid{display:grid!important;grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr)!important;gap:22px!important;align-items:center!important;}
body.layout-v18-25 .site-footer-v18-23{width:100%!important;max-width:none!important;margin:0!important;padding:26px 0 44px!important;border-top:1px solid var(--line)!important;}body.layout-v18-25 .site-footer-v18-23 .footer-inner{width:min(var(--sw-backend-w),calc(100% - var(--sw-backend-pad)))!important;max-width:var(--sw-backend-w)!important;margin:0 auto!important;display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:28px!important;}
@media (max-width:1180px){:root{--sw-fixed-header-h:68px;}body.section-client .site-header-v18-25,body.section-admin .site-header-v18-25{min-height:68px!important;padding:10px 14px!important;}body.section-client .site-header-v18-25 .primary-nav,body.section-admin .site-header-v18-25 .primary-nav{display:none!important;position:fixed!important;left:14px!important;right:14px!important;top:78px!important;z-index:700!important;}body.section-client .site-header-v18-25 .primary-nav.open,body.section-admin .site-header-v18-25 .primary-nav.open{display:grid!important;}body.section-client .site-header-v18-25 .nav-toggle,body.section-admin .site-header-v18-25 .nav-toggle{display:inline-flex!important;}body.section-client .main-client,body.section-admin .main-admin{padding-top:68px!important;}body.section-client .dashboard,body.section-admin .dashboard{width:min(100% - 28px,var(--sw-backend-w))!important;display:block!important;padding:18px 0 42px!important;margin:0 auto!important;}body.section-client .dashboard>aside.sidebar,body.section-client .dashboard>.sidebar,body.section-admin .dashboard>aside.sidebar,body.section-admin .dashboard>.sidebar{position:fixed!important;left:14px!important;top:80px!important;bottom:14px!important;width:min(330px,calc(100vw - 28px))!important;max-width:none!important;max-height:none!important;transform:translateX(calc(-100% - 28px))!important;transition:transform .22s ease!important;z-index:720!important;overflow:auto!important;background:var(--panel)!important;}body.sidebar-open .dashboard>aside.sidebar,body.sidebar-open .dashboard>.sidebar,.dashboard>aside.sidebar.is-open,.dashboard>.sidebar.is-open{transform:translateX(0)!important;}body.sidebar-open .mobile-scrim,body.nav-open .mobile-scrim{display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;}body.section-client .dashboard .grid-2,body.section-admin .dashboard .grid-2,body.section-client .dashboard .grid-3,body.section-admin .dashboard .grid-3,body.section-client .dashboard .grid-4,body.section-admin .dashboard .grid-4,body.section-client .dash-hero-grid,body.section-admin .dash-hero-grid{grid-template-columns:1fr!important;}}
@media (max-width:760px){body.layout-v18-25 .site-footer-v18-23 .footer-inner{flex-direction:column!important;align-items:flex-start!important;}body.section-client .command-btn,body.section-admin .command-btn{display:none!important;}}

body.section-client .tutorial-center{display:none!important;}


/* =========================================================
   v18.36 true app-shell fix
   This is the final backend override for logged-in pages.
   It removes the client/admin footer conflict and restores a real
   dark branded left-sidebar + full-width content workspace.
   ========================================================= */
body.section-client,
body.section-admin{
  --bg:#070a12;
  --bg-soft:#0b1020;
  --panel:#111827;
  --panel-2:#162033;
  --panel-3:#0e1525;
  --text:#f8fafc;
  --muted:#a7b0c3;
  --muted-2:#7f8aa1;
  --line:rgba(255,255,255,.115);
  --shadow:0 24px 80px rgba(0,0,0,.38);
  --shadow-soft:0 16px 45px rgba(0,0,0,.22);
  --sw-backend-w:1680px;
  --sw-backend-pad:76px;
  color:var(--text) !important;
  background:
    radial-gradient(circle at 0% 50%,rgba(124,92,255,.20),transparent 28%),
    radial-gradient(circle at 100% 45%,rgba(22,214,182,.18),transparent 28%),
    linear-gradient(180deg,var(--bg),var(--bg-soft)) !important;
}

/* No logged-in footer. The app workspace should end cleanly after content. */
body.section-client .site-footer,
body.section-admin .site-footer,
body.section-client .site-footer-v18-23,
body.section-admin .site-footer-v18-23,
body.section-client footer.site-footer,
body.section-admin footer.site-footer{
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  visibility:hidden !important;
}

/* Logged-in shell: left sidebar + full content area. */
@media (min-width:1181px){
  body.section-client .main-client,
  body.section-admin .main-admin{
    padding-top:var(--sw-fixed-header-h,74px) !important;
  }

  body.section-client .dashboard,
  body.section-admin .dashboard{
    width:min(var(--sw-backend-w),calc(100vw - var(--sw-backend-pad))) !important;
    max-width:var(--sw-backend-w) !important;
    margin:0 auto !important;
    padding:24px 0 64px !important;
    display:grid !important;
    grid-template-columns:minmax(252px,var(--sw-backend-sidebar,292px)) minmax(0,1fr) !important;
    gap:var(--sw-backend-gap,24px) !important;
    align-items:start !important;
    overflow:visible !important;
  }

  body.section-client .dashboard > aside.sidebar,
  body.section-client .dashboard > .sidebar,
  body.section-admin .dashboard > aside.sidebar,
  body.section-admin .dashboard > .sidebar{
    grid-column:1 !important;
    grid-row:1 !important;
    position:sticky !important;
    top:calc(var(--sw-fixed-header-h,74px) + 18px) !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    display:block !important;
    float:none !important;
    width:100% !important;
    max-width:var(--sw-backend-sidebar,292px) !important;
    min-width:0 !important;
    transform:none !important;
    opacity:1 !important;
    visibility:visible !important;
    z-index:20 !important;
  }

  body.section-client .dashboard > section.dash-main,
  body.section-client .dashboard > .dash-main,
  body.section-admin .dashboard > section.dash-main,
  body.section-admin .dashboard > .dash-main{
    grid-column:2 !important;
    grid-row:1 !important;
    display:grid !important;
    gap:22px !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
    opacity:1 !important;
    visibility:visible !important;
    overflow:visible !important;
  }
}

/* Content must use the full main column. */
body.section-client .dash-main > *,
body.section-admin .dash-main > *,
body.section-client .dash-main > .panel,
body.section-admin .dash-main > .panel,
body.section-client .dash-main > .card,
body.section-admin .dash-main > .card,
body.section-client .dash-main > .section-head,
body.section-admin .dash-main > .section-head,
body.section-client .dash-main > .dash-hero,
body.section-admin .dash-main > .dash-hero{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

/* Better branded panel contrast. */
body.section-client .panel,
body.section-admin .panel,
body.section-client .card,
body.section-admin .card,
body.section-client .metric-card,
body.section-admin .metric-card{
  background:
    radial-gradient(circle at top left,rgba(124,92,255,.10),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.038)) !important;
  border:1px solid var(--line) !important;
  color:var(--text) !important;
  box-shadow:var(--shadow-soft) !important;
}

body.section-client .page-title,
body.section-admin .page-title,
body.section-client h1,
body.section-admin h1,
body.section-client h2,
body.section-admin h2,
body.section-client h3,
body.section-admin h3{
  color:var(--text) !important;
}
body.section-client .lead,
body.section-admin .lead,
body.section-client .muted,
body.section-admin .muted{
  color:var(--muted) !important;
}

/* Page headers inside app content. */
body.section-client .section-head,
body.section-admin .section-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-end !important;
  gap:24px !important;
}
body.section-client .section-head > div,
body.section-admin .section-head > div{
  min-width:0 !important;
}
body.section-client .section-head .btn,
body.section-admin .section-head .btn{
  flex:0 0 auto !important;
}

/* Tables and filters should not shrink. */
body.section-client .table-wrap,
body.section-admin .table-wrap{
  width:100% !important;
  max-width:100% !important;
  overflow:auto !important;
}
body.section-client table,
body.section-admin table{
  width:100% !important;
  min-width:760px !important;
}
body.section-client .filter-input,
body.section-admin .filter-input{
  width:100% !important;
  max-width:none !important;
  margin:10px 0 14px !important;
}

/* Extension sidebars use the same branded style. */
body.section-client .social-suite-sidebar,
body.section-client .ai-tools-sidebar,
body.section-client .sidebar,
body.section-admin .sidebar{
  background:
    radial-gradient(circle at top left,rgba(124,92,255,.16),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.042)),
    color-mix(in srgb,var(--panel) 94%,transparent) !important;
  color:var(--text) !important;
}
body.section-client .social-suite-sidebar a,
body.section-client .ai-tools-sidebar a,
body.section-client .sidebar a,
body.section-admin .sidebar a{
  color:color-mix(in srgb,var(--text) 82%,var(--muted)) !important;
}
body.section-client .social-suite-sidebar a.active,
body.section-client .ai-tools-sidebar a.active,
body.section-client .sidebar a.active,
body.section-admin .sidebar a.active{
  color:var(--text) !important;
  border-color:rgba(22,214,182,.42) !important;
  background:linear-gradient(135deg,rgba(22,214,182,.16),rgba(124,92,255,.13)) !important;
}

/* Do not let hidden/drawer navigation reserve page space. */
body.section-client .extension-subnav,
body.section-admin .extension-subnav,
body.section-client .extension-subnav-v18-23,
body.section-admin .extension-subnav-v18-23{
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}

/* Mobile remains a single-column drawer layout. */
@media (max-width:1180px){
  body.section-client,
  body.section-admin{
    --sw-backend-pad:28px;
  }
  body.section-client .dashboard,
  body.section-admin .dashboard{
    width:min(100vw - 28px, var(--sw-backend-w)) !important;
    display:block !important;
    padding:18px 0 44px !important;
  }
  body.section-client .section-head,
  body.section-admin .section-head{
    display:grid !important;
    grid-template-columns:1fr !important;
    align-items:start !important;
  }
  body.section-client .section-head .btn,
  body.section-admin .section-head .btn{
    width:max-content !important;
  }
}
@media (max-width:760px){
  body.section-client .section-head .btn,
  body.section-admin .section-head .btn{
    width:100% !important;
  }
  body.section-client table,
  body.section-admin table{
    min-width:720px !important;
  }
}


/* =========================================================
   v18.39 logged-in app typography polish
   Keeps the fresh branded look but reduces oversized page headings
   on tools, social, visual, voice, WordPress, chatbots, support, and admin pages.
   ========================================================= */
body.section-client .dash-main .page-title,
body.section-admin .dash-main .page-title,
body.section-client .dash-main h1.page-title,
body.section-admin .dash-main h1.page-title{
  font-size:clamp(2.35rem,3.45vw,4.25rem) !important;
  line-height:1.04 !important;
  letter-spacing:-.055em !important;
  max-width:920px !important;
  margin:12px 0 14px !important;
}

body.section-client .dash-main .dash-hero .page-title,
body.section-admin .dash-main .dash-hero .page-title{
  font-size:clamp(2.45rem,3.7vw,4.45rem) !important;
  line-height:1.04 !important;
}

body.section-client .dash-main .lead,
body.section-admin .dash-main .lead{
  font-size:clamp(1rem,1.08vw,1.16rem) !important;
  line-height:1.68 !important;
  max-width:760px !important;
}

body.section-client .dash-main .dash-hero,
body.section-admin .dash-main .dash-hero{
  padding:clamp(28px,4vw,44px) !important;
  border-radius:30px !important;
}

body.section-client .dash-main .section-head,
body.section-admin .dash-main .section-head{
  margin-bottom:12px !important;
}

body.section-client .dash-main .section-head .page-title,
body.section-admin .dash-main .section-head .page-title{
  max-width:780px !important;
}

body.section-client .dash-main .eyebrow,
body.section-admin .dash-main .eyebrow{
  font-size:.86rem !important;
  line-height:1.15 !important;
}

/* Better action button placement on app page headers. */
body.section-client .dash-main .section-head > .btn,
body.section-admin .dash-main .section-head > .btn,
body.section-client .dash-main .section-head > a.btn,
body.section-admin .dash-main .section-head > a.btn{
  align-self:center !important;
  min-width:92px !important;
  white-space:normal !important;
  text-align:center !important;
}

/* Keep forms and output panels balanced beneath the hero. */
body.section-client .dash-main > .grid.grid-2,
body.section-admin .dash-main > .grid.grid-2,
body.section-client .dash-main > .grid-2,
body.section-admin .dash-main > .grid-2{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:22px !important;
  align-items:start !important;
}

body.section-client .dash-main .panel h2,
body.section-admin .dash-main .panel h2{
  font-size:clamp(1.35rem,1.45vw,1.75rem) !important;
  line-height:1.18 !important;
  margin-top:0 !important;
}

/* Tool/detail pages should feel professional, not billboard-sized. */
body.section-client.page-tools-webchat-php .page-title,
body.section-client.page-tools-text-generator-php .page-title,
body.section-client.page-tools-multi-model-php .page-title,
body.section-client.page-tools-youtube-blog-php .page-title,
body.section-client.page-tools-code-generator-php .page-title,
body.section-client.page-tools-seo-tools-php .page-title,
body.section-client.page-tools-file-chat-php .page-title,
body.section-client.page-visual-ai-avatar-php .page-title,
body.section-client.page-social-calendar-php .page-title,
body.section-client.page-social-composer-php .page-title,
body.section-client.page-social-campaigns-php .page-title,
body.section-client.page-social-brand-voice-php .page-title,
body.section-client.page-wordpress-composer-php .page-title,
body.section-client.page-chatbots-index-php .page-title{
  font-size:clamp(2.2rem,3vw,3.75rem) !important;
  line-height:1.06 !important;
  max-width:820px !important;
}

/* Mobile heading reduction. */
@media (max-width:760px){
  body.section-client .dash-main .page-title,
  body.section-admin .dash-main .page-title,
  body.section-client .dash-main .dash-hero .page-title,
  body.section-admin .dash-main .dash-hero .page-title{
    font-size:clamp(2rem,10vw,3rem) !important;
    line-height:1.06 !important;
    letter-spacing:-.045em !important;
  }

  body.section-client .dash-main .dash-hero,
  body.section-admin .dash-main .dash-hero{
    padding:22px !important;
    border-radius:24px !important;
  }

  body.section-client .dash-main > .grid.grid-2,
  body.section-admin .dash-main > .grid.grid-2,
  body.section-client .dash-main > .grid-2,
  body.section-admin .dash-main > .grid-2{
    grid-template-columns:1fr !important;
  }
}
