/* ==========================================================================
   Design Tokens — Imob Child Theme
   ========================================================================== */

:root {
  /* ── Paleta Oportunidades Riviera ─────────────────────────────────────── */
  --color-navy:      #12283F;  /* Navy principal                          */
  --color-navy-80:   #1E4A5F;  /* Azul-petróleo                           */
  --color-navy-60:   #2A607A;  /* Intermediário                           */
  --color-navy-40:   #6A90A0;  /* Claro                                   */
  --color-navy-20:   #B5C8D2;  /* Muito claro                             */
  --color-navy-10:   #E2EDF1;  /* Quase branco azulado                    */

  --color-gold:      #CBA15A;  /* Dourado principal                       */
  --color-gold-dark: #A9793C;  /* Bronze / dourado escuro                 */
  --color-gold-light:#D4AE6A;  /* Dourado claro                           */
  --color-gold-10:   #FBF5E9;  /* Fundo dourado sutil                     */

  --color-teal:      #1E4A5F;  /* Mapeado para azul-petróleo              */
  --color-teal-dark: #12283F;  /* Mapeado para navy                       */
  --color-teal-light:#2A607A;  /* Intermediário azul                      */
  --color-teal-10:   #E2EDF1;  /* Fundo azul sutil                        */

  /* ── Extras da nova identidade ────────────────────────────────────────── */
  --color-areia:     #F5F1E9;  /* Off-white areia                         */
  --color-bronze:    #A9793C;  /* Bronze (alias de gold-dark)             */
  --color-grafite:   #2B2B2B;  /* Grafite (para texto alternativo)        */

  /* ── Neutros ──────────────────────────────────────────────────────────── */
  --color-white:     #ffffff;
  --color-gray-50:   #f9fafb;
  --color-gray-100:  #f5f5f5;
  --color-gray-200:  #e5e7eb;
  --color-gray-300:  #d1d5db;
  --color-gray-400:  #9ca3af;
  --color-gray-500:  #6b7280;
  --color-gray-600:  #4b5563;
  --color-gray-700:  #374151;
  --color-gray-800:  #1f2937;
  --color-gray-900:  #111827;
  --color-text:      #1a1a1a;

  /* ── Semânticas ───────────────────────────────────────────────────────── */
  --color-primary:         var(--color-navy);
  --color-primary-hover:   var(--color-navy-80);
  --color-secondary:       var(--color-gold);
  --color-secondary-hover: var(--color-gold-dark);
  --color-accent:          var(--color-teal);
  --color-accent-hover:    var(--color-teal-dark);
  --color-bg:              var(--color-white);
  --color-bg-alt:          var(--color-areia);
  --color-border:          var(--color-gray-200);
  --color-heading:         var(--color-navy);
  --color-body:            var(--color-gray-700);
  --color-muted:           var(--color-gray-500);
  --color-link:            var(--color-teal);
  --color-link-hover:      var(--color-teal-dark);

  /* ── Status ───────────────────────────────────────────────────────────── */
  --color-success:  #16a34a;
  --color-warning:  #d97706;
  --color-error:    #dc2626;
  --color-info:     var(--color-teal);

  /* ── Tipografia ───────────────────────────────────────────────────────── */
  --font-primary:   'Montserrat', sans-serif;
  --font-mono:      'Courier New', Courier, monospace;

  --fw-light:       300;
  --fw-regular:     400;
  --fw-medium:      500;
  --fw-semibold:    600;
  --fw-bold:        700;
  --fw-extrabold:   800;

  --fs-xs:   0.75rem;   /* 12px */
  --fs-sm:   0.875rem;  /* 14px */
  --fs-base: 1rem;      /* 16px */
  --fs-lg:   1.125rem;  /* 18px */
  --fs-xl:   1.25rem;   /* 20px */
  --fs-2xl:  1.5rem;    /* 24px */
  --fs-3xl:  1.875rem;  /* 30px */
  --fs-4xl:  2.25rem;   /* 36px */
  --fs-5xl:  3rem;      /* 48px */
  --fs-6xl:  3.75rem;   /* 60px */

  --lh-tight:  1.25;
  --lh-snug:   1.375;
  --lh-normal: 1.5;
  --lh-relaxed:1.625;
  --lh-loose:  2;

  --ls-tight:  -0.025em;
  --ls-normal:  0em;
  --ls-wide:    0.025em;
  --ls-wider:   0.05em;
  --ls-widest:  0.1em;

  /* ── Espaçamento ──────────────────────────────────────────────────────── */
  --space-1:  0.25rem;   /* 4px */
  --space-2:  0.5rem;    /* 8px */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.25rem;   /* 20px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */
  --space-24: 6rem;      /* 96px */
  --space-32: 8rem;      /* 128px */

  /* ── Layout ───────────────────────────────────────────────────────────── */
  --container-sm:  640px;
  --container-md:  768px;
  --container-lg:  1024px;
  --container-xl:  1280px;
  --container-2xl: 1440px;

  /* ── Bordas ───────────────────────────────────────────────────────────── */
  --radius-sm:   0.125rem;
  --radius:      0.25rem;
  --radius-md:   0.375rem;
  --radius-lg:   0.5rem;
  --radius-xl:   0.75rem;
  --radius-2xl:  1rem;
  --radius-full: 9999px;

  /* ── Sombras ──────────────────────────────────────────────────────────── */
  --shadow-sm:  0 1px 2px 0 rgb(18 40 63 / 0.08);
  --shadow:     0 1px 3px 0 rgb(18 40 63 / 0.12), 0 1px 2px -1px rgb(18 40 63 / 0.10);
  --shadow-md:  0 4px 6px -1px rgb(18 40 63 / 0.12), 0 2px 4px -2px rgb(18 40 63 / 0.08);
  --shadow-lg:  0 10px 15px -3px rgb(18 40 63 / 0.14), 0 4px 6px -4px rgb(18 40 63 / 0.08);
  --shadow-xl:  0 20px 25px -5px rgb(18 40 63 / 0.15), 0 8px 10px -6px rgb(18 40 63 / 0.08);
  --shadow-gold: 0 4px 20px rgb(203 161 90 / 0.25);
  --shadow-navy: 0 4px 20px rgb(18 40 63 / 0.30);

  /* ── Transições ───────────────────────────────────────────────────────── */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-bounce: 300ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── Z-index ──────────────────────────────────────────────────────────── */
  --z-below:   -1;
  --z-base:     0;
  --z-raised:  10;
  --z-dropdown:100;
  --z-sticky:  200;
  --z-overlay: 300;
  --z-modal:   400;
  --z-toast:   500;
}

/* ── Utilitários de cor para o editor de blocos ─────────────────────────── */
.has-navy-color     { color: var(--color-navy)  !important; }
.has-gold-color     { color: var(--color-gold)  !important; }
.has-teal-color     { color: var(--color-teal)  !important; }
.has-white-color    { color: var(--color-white) !important; }

.has-navy-background-color     { background-color: var(--color-navy)  !important; }
.has-gold-background-color     { background-color: var(--color-gold)  !important; }
.has-teal-background-color     { background-color: var(--color-teal)  !important; }
.has-white-background-color    { background-color: var(--color-white) !important; }
.has-gray-100-background-color { background-color: var(--color-gray-100) !important; }
