/* ============================================================
   PropiedadPro — Paleta y tokens centralizados
   Fuente única de verdad para colores, tipografía y espaciado.
   Identidad: azul marino + petróleo, con acento dorado patrimonial.
   Usar var(--pp-*) en lugar de hex/medidas hardcodeadas.
   ============================================================ */
:root {
  /* Colores de marca */
  --pp-primary:        #1B3A5C;  /* Azul marino — navegación, títulos, acciones */
  --pp-primary-dark:   #14304D;  /* Marino más oscuro — hover/activo */
  --pp-primary-light:  #E7EDF3;  /* Tinte marino claro — fondos, hover de filas */
  --pp-accent:         #2E6F8E;  /* Azul petróleo — 2º color del gradiente, enlaces */

  /* Acento dorado (CTA / destacados patrimoniales) */
  --pp-gold:           #C9A227;
  --pp-gold-dark:      #A8861F;
  --pp-gold-light:     #FBF3D6;

  /* Colores de estado */
  --pp-success:        #38A169;
  --pp-success-light:  #DCF4E6;
  --pp-danger:         #dc3545;
  --pp-danger-light:   #fee2e2;
  --pp-warning:        #f59e0b;
  --pp-warning-light:  #fef3c7;
  --pp-info:           #0ea5e9;
  --pp-info-light:     #e0f2fe;

  /* Neutros */
  --pp-text:           #2D3748;  /* Gris carbón */
  --pp-muted:          #5A6678;
  --pp-bg:             #F4F6F8;  /* Gris arena */
  --pp-surface:        #ffffff;
  --pp-border:         #E3E7EC;

  /* Escala tipográfica */
  --pp-fs-xs:   0.70rem;
  --pp-fs-sm:   0.8rem;
  --pp-fs-base: 1rem;
  --pp-fs-lg:   1.25rem;
  --pp-fs-xl:   1.5rem;

  /* Escala de espaciado */
  --pp-sp-xs: 0.25rem;
  --pp-sp-sm: 0.5rem;
  --pp-sp-md: 1rem;
  --pp-sp-lg: 1.5rem;
  --pp-sp-xl: 2rem;

  /* Radios y sombras */
  --pp-radius:    0.5rem;
  --pp-radius-sm: 0.35rem;
  --pp-shadow:    0 2px 10px rgba(0, 0, 0, 0.06);
  --pp-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);

  /* Gradientes reutilizables */
  --pp-gradient-primary: linear-gradient(135deg, var(--pp-primary) 0%, var(--pp-accent) 100%);
  --pp-gradient-success: linear-gradient(135deg, #48BB78 0%, var(--pp-success) 100%);
  --pp-gradient-danger:  linear-gradient(135deg, #ef4444 0%, var(--pp-danger) 100%);
  --pp-gradient-gold:    linear-gradient(135deg, #D9B43A 0%, var(--pp-gold) 100%);
}

/* Utilidades de acento dorado */
.pp-text-gold { color: var(--pp-gold); }
.pp-bg-gold   { background: var(--pp-gold); color: #fff; }
.pp-btn-gold  { background: var(--pp-gold); border-color: var(--pp-gold); color: #fff; }
.pp-btn-gold:hover { background: var(--pp-gold-dark); border-color: var(--pp-gold-dark); color: #fff; }

/* Utilidades de tipografía/espaciado basadas en tokens */
.pp-text-xs { font-size: var(--pp-fs-xs); }
.pp-text-sm { font-size: var(--pp-fs-sm); }
.pp-text-lg { font-size: var(--pp-fs-lg); }
.pp-text-xl { font-size: var(--pp-fs-xl); }
.pp-text-muted-2 { color: var(--pp-muted); }