/* iphone.css — overrides específicos para iOS/Safari */
@supports (-webkit-touch-callout: none) {

  /* 1) Tipografía y zoom en inputs (evita zoom al enfocar) */
  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  input, select, textarea { font-size: 16px; }

  /* 2) Normalización de controles (apariencia, alturas táctiles, paddings) */
  input, select, textarea, button {
    font: inherit;
    color: inherit;
    line-height: 1.2;
  }
  input[type="text"], input[type="email"], input[type="tel"],
  input[type="search"], input[type="number"], input[type="password"],
  input[type="url"], input[type="date"], input[type="time"],
  input[type="datetime-local"], input[type="month"], input[type="week"],
  select, textarea {
    -webkit-appearance: none; /* quita estilos nativos iOS */
    appearance: none;
    box-sizing: border-box;
    width: 100%;
    min-height: 44px;               /* tamaño táctil recomendado */
    padding: 10px 12px;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
    background: #fff;
  }

  /* 3) Select con flecha consistente (evita tamaño mini) */
  select {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path d="M1 1l5 5 5-5" stroke="%23555" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 12px 8px;
    padding-right: 36px;
  }

  /* 4) Enfoque accesible y claro */
  input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: #6aa4ff;
    box-shadow: 0 0 0 3px rgba(80,140,255,.2);
  }

  /* 5) Placeholders legibles */
  ::placeholder { color:#9aa0a6; opacity:1; }

  /* 6) Botones consistentes (altura táctil) */
  button, input[type="button"], input[type="submit"], input[type="reset"] {
    -webkit-appearance: none;
    appearance: none;
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 10px;
  }

  /* 7) Ajustes útiles de inputs especiales */
  /* Quita la X del search si te estorba (opcional: descomenta) */
  /* input[type="search"]::-webkit-search-cancel-button { display:none; } */

  /* Quita flechas de number (mantén si te sirven) */
  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

  /* File input botón más legible */
  input[type="file"]::-webkit-file-upload-button {
    -webkit-appearance: button;
    appearance: button;
    padding: 8px 12px;
    border-radius: 8px;
    border: 1px solid #d6d6d6;
  }

  /* 8) Textarea: evitar salto raro y permitir resize vertical */
  textarea {
    resize: vertical;
    min-height: 88px;
  }

  /* 9) Títulos que no se “achiquen” en iPhone */
  h1{ font-size: clamp(1.6rem, 2.8vw + 1rem, 2.2rem); }
  h2{ font-size: clamp(1.4rem, 2.2vw + .9rem, 1.8rem); }
  h3{ font-size: clamp(1.2rem, 1.6vw + .8rem, 1.4rem); }

  /* 10) Safe areas (por si usas headers pegados en notch) */
  :root {
    --safe-top: constant(safe-area-inset-top);
    --safe-top: env(safe-area-inset-top);
    --safe-bottom: constant(safe-area-inset-bottom);
    --safe-bottom: env(safe-area-inset-bottom);
  }
  .uses-safe-area {
    padding-top: calc(12px + var(--safe-top));
    padding-bottom: calc(12px + var(--safe-bottom));
  }

  /* 11) Links dentro de formularios: evitar “shrink” */
  .form a { font-size: 1rem; }

  /* 12) Corrección de scroll elástico en contenedores (si usas overflow) */
  .ios-scroll { -webkit-overflow-scrolling: touch; }

}