/**
 * SMS Short Code – variáveis (tema claro e escuro)
 * Todas as variáveis da página SMS em um único arquivo.
 * sms/css/sms-variables.css
 */

/* ========== VARIÁVEIS ========== */
:root,
[data-theme="light"] {
  /* Hero / seção */
  --sms-gradient: linear-gradient(135deg, #0052d4 0%, #0077ff 35%, #00b3ff 70%, #66e0ff 100%);
  --sms-bg-hero: linear-gradient(135deg, #0052d4 0%, #0077ff 35%, #00b3ff 70%, #66e0ff 100%);
  --sms-primary: #0052d4;
  --sms-secondary: #00b3ff;
  --sms-accent: #66e0ff;
  --sms-gradient-btn: linear-gradient(135deg, #0052d4 0%, #0077ff 50%, #00b3ff 100%);
  --sms-gradient-btn-hover: linear-gradient(-135deg, #0077ff 0%, #00b3ff 100%);
  --sms-box-shadow-btn: 0 0 12px rgb(8 255 221);
  --sms-background-btn: linear-gradient(135deg, #0052d4 0%, #0077ff 50%, #00b3ff 100%);
  --sms-background-btn-hover: linear-gradient(-135deg, #0077ff 0%, #00b3ff 100%);
  --sms-box-shadow-btn-hover: 0 0 18px rgba(0, 179, 255, 0.6);
  --sms-cta-content-max-width: 800px;
  --sms-cta-section-padding: 50px 0;
  --sms-cta-title-font-size: 3rem;
  --sms-cta-title-font-weight: 800;
  --sms-cta-title-line-height: 1.2;
  --sms-cta-title-margin-bottom: 30px;
  --sms-cta-title-letter-spacing: -0.02em;
  --sms-cta-text-font-size: 1.3rem;
  --sms-cta-text-line-height: 1.8;
  --sms-cta-text-margin-bottom: 80px;
  --sms-cta-button-font-size: 1.2rem;
  --sms-cta-button-padding: 16px 40px;
  --sms-cta-button-gap: 12px;
  --sms-cta-button-border-radius: 14px;

  /* Seção Tipos de SMS – card em tema claro */
  --sms-gradient-section: linear-gradient(145deg, #ffffff 0%, #f0f7ff 40%, #e8f4fd 100%);
  --sms-tipos-panel-border: rgba(0, 82, 212, 0.18);
  --sms-tipos-tab-bg: #ffffff;
  --sms-tipos-tab-text: #1e3a5f;
  --sms-tipos-tab-border: rgba(0, 82, 212, 0.2);
  --sms-tipos-panel-title: #0f172a;
  --sms-tipos-panel-desc: #475569;
  --sms-tipos-panel-bullet-bg: rgba(0, 119, 255, 0.08);
  --sms-tipos-panel-bullet-text: #1e293b;
  --sms-tipos-panel-bullet-border: #0077ff;
  --sms-tipos-panel-icon-bg: rgba(0, 119, 255, 0.12);
  --sms-tipos-panel-icon-color: #0052d4;

  /* Phone / conversa SMS – estilo iMessage claro */
  --sms-sms-bg: #f5f5f7;
  --sms-sms-header-bg: #f9f9fb;
  --sms-sms-header-text: #111111;
  --sms-sms-status-text: #000000;
  --sms-sms-in-bubble-bg: #e5e5ea;
  --sms-sms-out-bubble-bg: #007aff;
  --sms-sms-text: #111111;
  --sms-sms-link: #007aff;
  --sms-sms-input-bar-bg: #f9f9fb;
  --sms-sms-input-bg: #ffffff;
  --sms-sms-input-text: #111111;
}

[data-theme="dark"] {
  --sms-cta-bg: radial-gradient(ellipse 80% 70% at 50% 45%, rgba(30, 64, 175, 0.35) 0%, rgba(15, 23, 42, 0.5) 40%, #0f172a 70%, #020617 100%),
    linear-gradient(180deg, #0f172a 0%, #0c1222 50%, #020617 100%);
  --sms-gradient: radial-gradient(circle at 70% 50%, rgba(0, 162, 255, 0.55) 0%, rgba(0, 102, 255, 0.4) 18%, rgba(0, 40, 90, 0.35) 32%, rgba(0, 12, 30, 0) 45%),
    linear-gradient(135deg, #000814 0%, #001d3d 40%, #002c5f 75%, #000c1f 100%);
  --sms-bg-hero: radial-gradient(circle at 67% 53%, rgba(0, 162, 255, 0.45) 0%, rgb(0 58 113 / 35%) 25%, rgb(0 0 0 / 25%) 45%, rgb(0 0 0 / 15%) 60%, rgb(49 50 51 / 0%) 75%),
    linear-gradient(135deg, #000814 0%, #001d3d 40%, #002c5f 75%, #000c1f 100%);
  --sms-primary: #00a2ff;
  --sms-secondary: #0066ff;
  --sms-accent: #66e0ff;
  --sms-gradient-section: linear-gradient(135deg, #020617 0%, #001326 35%, #00316f 65%, #008dc1 100%);
  --sms-gradient-btn: linear-gradient(135deg, #002c5f 0%, #0066ff 100%);
  --sms-gradient-btn-hover: linear-gradient(-135deg, #002c5f 0%, #0066ff 100%);
  --sms-box-shadow-btn: 0 0 14px rgb(0, 162, 255);
  --sms-background-btn: linear-gradient(135deg, #00172f 0%, #004191 100%);
  --sms-background-btn-hover: linear-gradient(-135deg, #000e1c 0%, #0059c6 100%);
  --sms-box-shadow-btn-hover: 0 0 18px rgba(0, 162, 255, 0.5);

  /* Conversa SMS – tema escuro */
  --sms-sms-bg: #000000;
  --sms-sms-header-bg: #1c1c1e;
  --sms-sms-header-text: #ffffff;
  --sms-sms-status-text: rgba(255, 255, 255, 0.95);
  --sms-sms-in-bubble-bg: #2c2c30;
  --sms-sms-out-bubble-bg: #0a84ff;
  --sms-sms-text: #ffffff;
  --sms-sms-link: #34c759;
  --sms-sms-input-bar-bg: #1c1c1e;
  --sms-sms-input-bg: #3a3a3c;
  --sms-sms-input-text: #ffffff;
}