/* =====================================================================
   VAUTEX · campo de fecha del sitio y de las landings (fecha.js)
   - El calendario nativo ocupa todo el campo: un clic en cualquier parte lo abre.
   - Vacío dice «Elige la fecha» (en lugar de dd/mm/aaaa o del campo en blanco de iOS) y lleva el ícono de calendario.
   - «Aún no tengo fecha» cambia a texto libre (mes, temporada).
   Ajustes por formulario: --vx-fecha-x (sangría del texto), --vx-fecha-r (margen del ícono), --vx-fecha-fs (tamaño), --vx-fecha-ph (color).
   ===================================================================== */
.vx-fx{min-width:0}
.vx-fecha{display:block;position:relative;min-width:0}
.vx-fecha[hidden],.vx-fx [hidden]{display:none!important}
.vx-fecha input[type=date]{color-scheme:dark;cursor:pointer;position:relative;width:100%;min-width:0;padding-right:36px;min-height:44px;text-align:left}
.vx-fecha input[type=date]::-webkit-date-and-time-value{text-align:left}
/* el selector nativo ocupa todo el campo (en escritorio se abre con un clic en cualquier parte, no solo en el iconito) */
.vx-fecha input[type=date]::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:auto;height:auto;opacity:0;cursor:pointer}
/* vacío: «Elige la fecha»; al enfocarlo con el teclado se ven los campos del navegador para escribirla */
.vx-fecha:not(.lleno) input[type=date]:not(:focus)::-webkit-datetime-edit{color:transparent}
@supports (-moz-appearance:none){.vx-fecha:not(.lleno) input[type=date]:not(:focus){color:transparent}}
.vx-fecha::before{content:"";position:absolute;z-index:1;right:var(--vx-fecha-r,4px);top:50%;width:20px;height:20px;margin-top:-10px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F2F0EC' stroke-width='1.6'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E") center/20px no-repeat;pointer-events:none}
.vx-fecha::after{content:"Elige la fecha";position:absolute;left:var(--vx-fecha-x,0);right:36px;top:50%;transform:translateY(-50%);color:var(--vx-fecha-ph,#8E8B86);pointer-events:none;font-size:var(--vx-fecha-fs,16px);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vx-fecha.lleno::after,.vx-fecha:focus-within::after{content:none}

/* «Aún no tengo fecha» */
.vx-no{display:inline-flex;align-items:center;gap:10px;min-height:40px;font-size:13px;line-height:1.3;color:var(--vx-fecha-ph,#8E8B86);cursor:pointer;text-transform:none;letter-spacing:0;user-select:none}
.vx-no input,.fld .vx-no input{flex:none;width:18px;height:18px;margin:0;padding:0;border:0;-webkit-appearance:checkbox;appearance:auto;accent-color:var(--red,#DA3832);cursor:pointer}
.vx-no:hover{color:var(--paper,#F2F0EC)}
.vx-fx .vx-no{align-self:flex-start;margin-top:-4px}

/* en los formularios del sitio (.fld: línea inferior, 18 px) */
.fld .vx-fecha{--vx-fecha-fs:18px;--vx-fecha-ph:var(--dim,#868D97)}
@media (max-width:1024px),(pointer:coarse){.fld .vx-fecha{--vx-fecha-fs:16px}}
