

/* --- Header: tema imediatamente após a marca, só ícone --- */
.sb-theme-toggle {
  flex: 0 0 38px !important;
  width: 38px !important;
  min-width: 38px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  border: 1px solid rgba(103, 139, 255, .82) !important;
  background: linear-gradient(110deg, #3daeff 0%, #327ff7 48%, #6552ff 100%) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(54, 100, 255, .14) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}
.sb-theme-toggle:hover,
.sb-theme-toggle:focus-visible {
  border-color: #75bfff !important;
  background: linear-gradient(110deg, #50b8ff 0%, #3d8bff 46%, #735fff 100%) !important;
  box-shadow: 0 8px 22px rgba(58, 108, 255, .24) !important;
}
.sb-theme-toggle span[aria-hidden="true"] { font-size: 17px !important; line-height: 1 !important; }
.sb-theme-toggle-text { display: none !important; }


.site-header .header-action,
.flow-nav .flow-primary-link{
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(103, 139, 255, .82) !important;
  background: linear-gradient(110deg, #3daeff 0%, #327ff7 48%, #6552ff 100%) !important;
  color: #fff !important;
  box-shadow: 0 6px 18px rgba(54, 100, 255, .12) !important;
  text-shadow: none !important;
}
.site-header .header-action:hover,
.site-header .header-action:focus-visible,
.flow-nav .flow-primary-link:hover,
.flow-nav .flow-primary-link:focus-visible{
  border-color: #75bfff !important;
  background: linear-gradient(110deg, #50b8ff 0%, #3d8bff 46%, #735fff 100%) !important;
  color: #fff !important;
}
html[data-theme="light"] .site-header .header-action,
html[data-theme="light"] .flow-nav .flow-primary-link,
html[data-theme="light"] .sb-theme-toggle{ color: #fff !important; }

/* O botão de tema fica entre a marca e a navegação em todas as barras. */
.header-inner > .sb-theme-toggle,
.flow-shell > .sb-theme-toggle,
.legal-header-inner > .sb-theme-toggle { margin-left: 2px !important; margin-right: 2px !important; }

/* --- Minha conta: compactação desktop, sem apertar o conteúdo --- */
@media (min-width: 1100px) {
  body.account-page .account-main,
  body.account-hub .account-main {
    width: min(calc(100% - 34px), 1320px) !important;
    min-height: auto !important;
    padding: 86px 0 22px !important;
    grid-template-columns: minmax(255px, .52fr) minmax(0, 1.48fr) !important;
    align-items: stretch !important;
  }
  body.account-page .account-context,
  body.account-hub .account-context {
    min-height: 0 !important;
    padding: 34px 32px !important;
  }
  body.account-page .account-context::before { margin-bottom: 28px !important; }
  body.account-page .account-step { margin-bottom: 12px !important; }
  body.account-page .account-context h2 {
    margin-bottom: 17px !important;
    font-size: clamp(37px, 3.2vw, 50px) !important;
    line-height: .96 !important;
  }
  body.account-page .account-context p { line-height: 1.55 !important; font-size: 13px !important; }
  body.account-page .account-points { margin-top: 24px !important; padding-top: 18px !important; }
  body.account-page .account-points li { margin-top: 10px !important; font-size: 12.5px !important; }

  body.account-page .card {
    padding: 28px 30px 24px !important;
  }
  body.account-page .card h1 { font-size: clamp(29px, 2.45vw, 38px) !important; }
  body.account-page .account-title-row { margin-bottom: 10px !important; gap: 12px !important; }
  body.account-page .account-title-row .subtitle { font-size: 12.5px !important; }
  body.account-page .status-chip { padding: 6px 9px !important; font-size: 11px !important; }

  body.account-page .account-nav {
    display: grid !important;
    grid-template-columns: .92fr 1.7fr .92fr .82fr !important;
    gap: 0 !important;
    margin: 8px 0 16px !important;
  }
  html[data-theme="light"] body.account-page .account-nav { background: #fff !important; }
  body.account-page .account-nav-button {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 10px !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 750 !important;
    letter-spacing: .055em !important;
    white-space: nowrap !important;
  }

  body.account-page .account-section {
    margin-top: 12px !important;
    padding: 14px !important;
  }
  body.account-page .account-section-header { margin-bottom: 10px !important; }
  body.account-page .account-section-copy { margin-top: 3px !important; line-height: 1.4 !important; }

  body.account-page .summary-item { min-height: 72px !important; padding: 13px !important; }
  body.account-page .summary-item small { margin-bottom: 3px !important; }

  
  
  
  
  
  
  
  
  
  
  
  body.account-page .account-avatar-editor {
    grid-template-columns: 68px 1fr !important;
    gap: 12px !important;
    margin-bottom: 10px !important;
  }
  body.account-page .account-avatar-preview { width: 68px !important; height: 68px !important; }
  body.account-page .account-avatar-actions > span { font-size: 10.5px !important; }
  
  
  body.account-page .logout-button { margin-top: 10px !important; }
  body.account-page .account-back { margin-top: 8px !important; }
  body.account-page + .flow-footer,
  body.account-page .flow-footer { min-height: 52px !important; padding-top: 12px !important; padding-bottom: 12px !important; }
}

/* Em telas Full HD/HD altas, o primeiro quadro da Conta cabe com folga. */
@media (min-width: 1100px) and (min-height: 780px) {
  body.account-page .account-main,
  body.account-hub .account-main { padding-top: 82px !important; }
}

/* --- Planos: os dois cards principais cabem no primeiro quadro em 100% --- */
@media (min-width: 1000px) {
  .experience-v15 .xp-plans {
    padding-top: 82px !important;
    padding-bottom: 74px !important;
  }
  .experience-v15 .xp-sales-heading {
    margin-bottom: 32px !important;
    column-gap: 52px !important;
  }
  .experience-v15 .xp-sales-heading h2 {
    font-size: clamp(42px, 4.4vw, 66px) !important;
    line-height: .95 !important;
  }
  .experience-v15 .xp-sales-heading > p:last-child {
    line-height: 1.55 !important;
    font-size: 13px !important;
  }
  .experience-v15 .xp-plans-grid .plan-card {
    min-height: 480px !important;
    padding: 25px 28px !important;
  }
  .experience-v15 .xp-plans-grid .plan-card h3 { margin-top: 22px !important; }
  .experience-v15 .xp-plans-grid .plan-price { margin: 22px 0 6px !important; }
  .experience-v15 .xp-plans-grid .plan-price strong { font-size: clamp(48px, 4.8vw, 68px) !important; }
  .experience-v15 .xp-plans-grid .plan-description,
  .experience-v15 .xp-plans-grid .plan-billing-note,
  .experience-v15 .xp-plans-grid .plan-card ul { line-height: 1.42 !important; }
  .experience-v15 .xp-plans-grid .plan-card ul {
    gap: 6px !important;
    margin: 13px 0 18px !important;
    padding-top: 13px !important;
  }
  .experience-v15 .xp-plans-grid .plan-select { min-height: 42px !important; }
  .experience-v15 .xp-guarantee { margin-top: 12px !important; padding-top: 12px !important; padding-bottom: 12px !important; }
}





/* Tema claro: mantém o mesmo desenho dos controles de topo, sem perder contraste. */
html[data-theme="light"] .sb-theme-toggle,
html[data-theme="light"] .site-header .header-action,
html[data-theme="light"] .flow-nav .flow-primary-link{
  border-color: rgba(70, 111, 245, .72) !important;
  background: linear-gradient(110deg, #3daeff 0%, #327ff7 48%, #6552ff 100%) !important;
  color: #fff !important;
}

@media (max-width: 1180px) {
  .header-inner > .sb-theme-toggle,
  .flow-shell > .sb-theme-toggle { margin-right: auto !important; }
}

@media (max-width: 760px) {
  .sb-theme-toggle { width: 36px !important; min-width: 36px !important; height: 34px !important; min-height: 34px !important; }
  .site-header .header-action{ display: none !important; }
}
