:root{
  /* Fondo y superficies */
  --bg: #ffffff;
  --surface: #fbf1e9;
  --surface2: #f6e4d3;

  /* Texto */
  --text: #3a2a20;
  --muted: #6b5648;

  /* Bordes y sombras suaves */
  --border: #f1d7be;
  --shadow: 0 12px 30px rgba(58, 42, 32, 0.10);

  /* Paleta CASA (principales) */
  --primary: #c09d79;       /* botones principales */
  --primaryHover: #b5936f;  /* hover */
  --accent: #d7b38e;        /* acento */
  --accent2: #e2be99;       /* acento claro */
  --danger: #b25b4b;        /* rojo suave para eliminar (si querés lo ajustamos) */
  --success: #5f7a5f;       /* verde suave (si querés lo ajustamos) */
}

/* ====== Overrides globales para “pintar” el sistema sin tocar mil archivos ====== */
html, body{
  background: var(--bg) !important;
  color: var(--text) !important;
}

/* Panels / cards genéricas */
.card, .panel, .container, .box, .content, .wrap{
  border-color: var(--border) !important;
}

/* Inputs */
input, select, textarea{
  border: 1px solid var(--border) !important;
  background: var(--surface) !important;
  color: var(--text) !important;
}

/* Botones (cubre la mayoría) */
button, .btn, a.btn, .button{
  background: var(--primary) !important;
  color: #fff !important;
  border: 0 !important;
}

button:hover, .btn:hover, a.btn:hover, .button:hover{
  background: var(--primaryHover) !important;
}

/* Botones “secundarios” si usás clases típicas */
.btn-secondary, .secondary{
  background: var(--accent) !important;
  color: #fff !important;
}

/* Botón eliminar / peligro */
.btn-danger, .danger{
  background: var(--danger) !important;
  color: #fff !important;
}

/* Botón éxito */
.btn-success, .success{
  background: var(--success) !important;
  color: #fff !important;
}

/* ===== Admin CASA overrides ===== */

/* Fondo general */
body{
  background: linear-gradient(135deg, var(--surface2), var(--surface)) !important;
  color: var(--text) !important;
}

/* Header violeta -> CASA */
.header{
  background: linear-gradient(135deg, var(--primary), var(--primaryHover)) !important;
  color: #fff !important;
}

/* Cards / contenedores */
.container, .evento-card, .modal-content{
  background: var(--surface) !important;
  border: 1px solid var(--border) !important;
  border-radius: 18px !important;
  box-shadow: var(--shadow) !important;
}

/* Botones */
.btn, button{
  background: var(--primary) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
}

.btn:hover, button:hover{
  background: var(--primaryHover) !important;
}

.btn-danger{
  background: var(--danger) !important;
}

.btn-cancel, .btn-secondary{
  background: var(--accent) !important;
}

/* Inputs */
input, select, textarea{
  background: #fff !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
}

/* Alerts */
.alert{
  border: 1px solid var(--border) !important;
  background: var(--surface2) !important;
  color: var(--text) !important;
}
.alert-success{ border-color: rgba(95, 122, 95, .35) !important; }
.alert-error{ border-color: rgba(178, 91, 75, .35) !important; }

/* Emojis sutiles cuando están al inicio (títulos/botones) */
h1::first-letter,
h2::first-letter,
h3::first-letter,
.btn::first-letter,
button::first-letter{
  filter: grayscale(1);
  opacity: .78;
}
