/* =========================================================
   GLOBAL STYLES - Volaris
   Fuentes, variables y normalización
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --v-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  
  --v-primary: #911083;
  --v-primary-hover: #6e0b65;
  --v-primary-alt: #A12885;
  --v-bg: #ffffff;
  --v-text: #242424;
  --v-muted: #595959;
  --v-border: #d7d7d7;
  --v-border-strong: #bdbdbd;
  --v-focus: rgba(145,16,131,.35);
  --v-shadow: 0 2px 20px rgba(0,0,0,.08);
  
  --v-radius: 12px;
  --v-radius-sm: 10px;
  
  --v-spacing-xs: 8px;
  --v-spacing-sm: 12px;
  --v-spacing-md: 20px;
  --v-spacing-lg: 32px;
  --v-spacing-xl: 48px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, 
figure, figcaption, blockquote, dl, dd {
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--v-font);
  font-weight: 400;
  line-height: 1.6;
  color: var(--v-text);
  background-color: var(--v-bg);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--v-font);
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 0.5em;
}

a {
  color: var(--v-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover {
  color: var(--v-primary-hover);
  text-decoration: underline;
}

button {
  font-family: var(--v-font);
  cursor: pointer;
}

.styled-form > * input,
.styled-form > * textarea,
.styled-form > * select,
.form-grid input,
.form-grid textarea,
.form-grid select {
  font-family: var(--v-font);
}

/* Focus visible - Solo elementos del formulario */
.styled-form input:focus-visible,
.styled-form textarea:focus-visible,
.styled-form select:focus-visible,
.styled-form button:focus-visible,
.form-grid input:focus-visible,
.form-grid textarea:focus-visible,
.form-grid select:focus-visible,
.form-grid button:focus-visible {
  outline: 3px solid var(--v-focus);
  outline-offset: 2px;
}

/* NO aplicar outline a elementos de plugins */
.choices__input:focus-visible,
.flatpickr-calendar *:focus-visible,
.flatpickr-day:focus-visible {
  outline: none;
}