:root {
  --font-size: 1rem;
  /* Paleta Minimalista Marina Dev */
  --background: #bce7ff;
  --foreground: #333333;
  --nav-background: rgba(255, 255, 255, 0.65);
  --card: #e4eef8;
  --card-foreground: #333333;
  --popover: #dae1fc;
  --popover-foreground: #333333;
  
  /* Azul principal */
  --primary: #2b84d4; 
  --primary-foreground: #ffffff;
  
  --secondary: #f1f5f9;
  --secondary-foreground: #1e293b;
  --muted: #f8f9fa;
  --muted-foreground: #666666;
  
  /* Detalles en azul clarito */
  --accent: #e9f3fc; 
  --accent-foreground: #1a5c9e; 
  
  --ytlogo: #ff0000;
  --border: #e2e8f0;
  --input: #e2e8f0;
  --ring: #2b84d4;
  --radius: 0.625rem;
  --sidebar: #f8f9fa;
  --sidebar-foreground: #333333;
  --sidebar-primary: #2b84d4;
  --sidebar-primary-foreground: #cbecff;
  --sidebar-accent: #e9f3fc;
  --sidebar-accent-foreground: #2b84d4;
  --sidebar-border: #e2e8f0;
  --sidebar-ring: #2b84d4;
  --footer-height: 200px;
}

/**
 * Base typography.
 * */

h2 {
  font-size: 2.25rem; /* Reemplazado var(--text-xl) que no existía */
  font-weight: 500;
  line-height: 1.5;
}

h3 {
  font-size: 1.5rem; /* Reemplazado var(--text-lg) que no existía */
  font-weight: 500;
  line-height: 1.5;
}
p,
label,
button,
input {
  font-size: 1rem;
  line-height: 1.5;
}

p,
input {
  font-weight: 400; /* normal */
}

label,
button,
h4 {
  font-weight: 500; /* medium */
}

html {
  font-size: var(--font-size);
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  height: 100vh;
  /* Aplicamos el fondo claro minimalista */
  background-color: var(--background);
  color: var(--foreground);
  font-family: 'Segoe UI', Verdana, Geneva, Tahoma, sans-serif; /* Segoe UI da un toque más moderno */
}