/* ==========================================================================
   Premium Blue v0.1.1 — ajustes da marca Theus (AGENTS.md do DS, seção 6.1)
   Mesmo arquivo do portal interno (amonportal) e da página de downloads (amondownload); mantenha os três iguais.
   Único lugar onde a página mexe no design system. As cópias em
   ./premium-blue/ continuam fiéis e não são editadas.

   1. Marca: o azul do DS (#2563eb, marinho #071631 no CTA) vira o azul
      oceano do Theus (#017AFE, primary-500 do ERP). Tons escuros viram um
      oceano profundo no lugar do marinho quase preto.
   2. Contraste AA (seção 8 do guia): #017AFE tem 4,0:1 no branco, então
      texto azul usa #016BDF (5,0:1) e o oceano puro fica para preenchimentos.
   3. Regras do DS com a cor antiga escrita literal (rgb(37 99 235 / x),
      #071631…) recebem a mesma receita com a cor do Theus.
   ========================================================================== */

:root {
  /* ---------- Azul oceano do Theus ---------- */
  --pb-ocean: #017afe;              /* preenchimentos: switch, barras, aurora */
  --pb-blue: #016bdf;               /* acento em texto (5,0:1 no branco) */
  --pb-blue-strong: #015cbe;        /* hover e texto pequeno (6,4:1) */
  --pb-blue-soft: #75b0f0;
  --pb-blue-hover: #3d95f5;
  --pb-navy: #014c9d;
  --pb-navy-light: #edf3fa;         /* primary-50 do Theus */
  --pb-navy-border: rgb(1 76 157 / 0.12);

  --pb-blue-a55: rgb(1 122 254 / 0.55);
  --pb-blue-a35: rgb(1 122 254 / 0.35);
  --pb-blue-a28: rgb(1 122 254 / 0.28);
  --pb-blue-a18: rgb(1 122 254 / 0.18);
  --pb-blue-a12: rgb(1 122 254 / 0.12);
  --pb-blue-a06: rgb(1 122 254 / 0.06);

  /* Oceano profundo (seções escuras, header ao rolar, rodapé) */
  --pb-dark-900: #00162e;
  --pb-dark-800: #011d3c;
  --pb-dark-700: #01264d;
  --pb-dark-600: #013772;
  --pb-dark-500: #014c9d;

  /* ---------- Gradientes ---------- */
  /* CTA: oceano do Theus, com branco ≥ 4,5:1 em todo o gradiente */
  --pb-grad-cta: linear-gradient(135deg, #0172ee 0%, #0158b8 100%);
  --pb-grad-blue: linear-gradient(135deg, #017afe 0%, #015cbe 100%);
  /* Marca: azul profundo → oceano → ciano (sem o índigo do DS) */
  --pb-grad-brand: linear-gradient(135deg, #015cbe 0%, #017afe 50%, #22d3ee 100%);
  --pb-grad-brand-x: linear-gradient(90deg, #015cbe 0%, #017afe 50%, #22d3ee 100%);
  --pb-grad-text: linear-gradient(95deg, #016bdf 0%, #017afe 45%, #0891b2 100%);
  --pb-grad-hairline: linear-gradient(90deg, transparent, rgb(1 122 254 / 0.5), rgb(34 211 238 / 0.3), transparent);
  --pb-grad-soft-tint: linear-gradient(135deg, rgb(1 122 254 / 0.09) 0%, rgb(34 211 238 / 0.05) 100%);
  --pb-grad-hero-light: linear-gradient(180deg, #e6f0fd 0%, #edf4fd 40%, #f2f7fe 75%, #f6faff 100%);
  --pb-grad-dark-shell:
    radial-gradient(60% 70% at 10% 50%, rgb(1 122 254 / 0.2), transparent),
    radial-gradient(45% 55% at 90% 30%, rgb(1 122 254 / 0.12), transparent),
    radial-gradient(30% 40% at 50% 100%, rgb(34 211 238 / 0.06), transparent);
  --pb-grad-hero-dark:
    radial-gradient(70% 55% at 50% 0, rgb(1 122 254 / 0.26), transparent),
    radial-gradient(50% 50% at 85% 75%, rgb(1 122 254 / 0.14), transparent),
    radial-gradient(35% 40% at 10% 65%, rgb(34 211 238 / 0.07), transparent);

  /* ---------- Sombras e foco ---------- */
  --pb-shadow-blue: 0 2px 8px rgb(1 122 254 / 0.18);
  --pb-shadow-cta: 0 1px 2px rgb(1 76 157 / 0.18), 0 4px 14px rgb(1 122 254 / 0.28);
  --pb-shadow-cta-hover: 0 2px 6px rgb(1 76 157 / 0.2), 0 8px 22px rgb(1 122 254 / 0.34);
  --pb-shadow-cta-lg: 0 2px 8px rgb(1 76 157 / 0.2), 0 10px 26px rgb(1 122 254 / 0.32);
  --pb-shadow-featured: 0 0 0 4px rgb(1 122 254 / 0.06), 0 2px 8px rgb(1 122 254 / 0.1), 0 22px 50px -12px rgb(1 122 254 / 0.28);
  --pb-ring: 0 0 0 2px rgb(1 122 254 / 0.2);
  --pb-ring-focus: 0 0 0 3px rgb(1 122 254 / 0.3);
}

/* ---------- Regras do DS com a cor antiga literal ---------- */
.pb-brand-shell { background-image: radial-gradient(60% 40% at 50% 0, rgb(1 122 254 / 0.03), transparent); }
.pb-text-accent-soft { color: var(--pb-blue); }
.pb-btn--secondary:hover { border-color: rgb(1 122 254 / 0.3); }
.pb-btn--blue:hover { box-shadow: 0 4px 16px rgb(1 122 254 / 0.32); }
.pb-icon-btn:hover { border-color: rgb(1 122 254 / 0.35); }
.pb-eyebrow { border-color: rgb(1 122 254 / 0.2); background: rgb(1 122 254 / 0.06); }
.pb-badge--blue { background: rgb(1 122 254 / 0.08); border-color: rgb(1 122 254 / 0.2); }
.pb-check::before { background: rgb(1 122 254 / 0.12); }
.pb-card--interactive:hover { border-color: rgb(1 122 254 / 0.22); }
.pb-dark-card { background: linear-gradient(135deg, var(--pb-dark-600) 0%, var(--pb-dark-500) 100%); }
.pb-tint-card { border-color: rgb(1 122 254 / 0.14); }
.pb-logo-tile:hover { box-shadow: 0 1px 3px rgb(6 17 31 / 0.03), 0 6px 16px rgb(1 122 254 / 0.1), inset 0 0 0 1px #fff; }
.pb-price-card--dark { background: linear-gradient(135deg, var(--pb-dark-600) 0%, var(--pb-dark-500) 100%); }
.pb-segmented__item[aria-pressed="true"],
.pb-segmented__item.is-active { box-shadow: 0 2px 8px rgb(1 122 254 / 0.3); }
.pb-header.is-scrolled { background: rgb(1 29 60 / 0.92); }
.pb-dropdown { background: rgb(0 22 46 / 0.98); }
.pb-avatar { box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgb(1 122 254 / 0.22); }
.pb-aurora--1 { background: rgb(1 122 254 / 0.26); }
.pb-aurora--2 { background: rgb(34 211 238 / 0.2); }
.pb-aurora--3 { background: rgb(61 149 245 / 0.2); }
::selection { background: rgb(1 122 254 / 0.14); }
::-webkit-scrollbar-thumb { background: linear-gradient(var(--pb-ocean) 0%, var(--pb-blue-strong) 100%) padding-box; }
::-webkit-scrollbar-thumb:hover { background: linear-gradient(var(--pb-blue-hover) 0%, var(--pb-blue) 100%) padding-box; }
html { scrollbar-color: var(--pb-ocean) rgb(6 17 31 / 0.06); }

/* ---------- Contraste AA (seção 8 do guia) ---------- */
/* Cabeçalho da tabela: o DS usa tinta a 45% (3,1:1); texto pequeno pede ≥ 4,5:1. */
.pb-table th { color: var(--pb-muted); }
/* Kicker e eyebrow em texto pequeno: azul de texto, não o oceano puro. */
.pb-kicker,
.pb-eyebrow,
.pb-chip__icon,
.pb-check::before { color: var(--pb-blue); }
/* Switch ligado: preenchimento no oceano do Theus. */
.pb-switch input:checked + .pb-switch__track { background: var(--pb-ocean); }