:root{
  /* MODO CLARO */
  --nav-bg: #DAD4B5;
  --page-bg: #F2E8C6;

  --btn-bg: #982B1C;
  --btn-text: #ffffff;

  --card-bg: #ffffff;
  --card-border: rgba(0,0,0,0.14);

  --text: #1a1a1a;
  --text-muted: rgba(0,0,0,0.70);

  --link: #982B1C;

  --shadow: 0 12px 35px rgba(0,0,0,0.12);

  --radius: 18px;
  --radius-sm: 14px;
}

/* MODO OSCURO */
body.dark-mode{
  --nav-bg: #1b1b1b;
  --page-bg: #101010;

  /* BOTONES EN OSCURO */
  --btn-bg: #DAD4B5;
  --btn-text: #982B1C;

  --card-bg: #1c1c1c;
  --card-border: rgba(255,255,255,0.14);

  --text: #f2f2f2;
  --text-muted: rgba(255,255,255,0.70);

  --link: #ffb3a8;

  --shadow: 0 14px 40px rgba(0,0,0,0.40);
}