/* ════════════════════════════════════════════════════════════════
   EnixDatePicker — estilos (modelo Valle).
   Tokens: navy #0d2240 · blue #1e5fa8 · blue-md #dbeafe · gray200 #e2e8f0
════════════════════════════════════════════════════════════════ */
:root{
  --enix-navy:#0d2240; --enix-blue:#1e5fa8; --enix-blue-md:#dbeafe; --enix-blue-lt:#eff6ff;
  --enix-g200:#e2e8f0; --enix-g400:#94a3b8; --enix-g500:#64748b; --enix-g700:#334155; --enix-g800:#1e293b;
}

/* trigger */
.enix-dp{position:relative}
.enix-dp.is-disabled .enix-dp-trigger{opacity:.55;cursor:not-allowed;pointer-events:none}
.enix-dp-trigger{box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;height:42px;border:1.5px solid var(--enix-g200);border-radius:10px;padding:0 12px;background:#fff;cursor:pointer;font-size:13.5px;transition:border-color .18s,border-radius .12s}
.enix-dp-trigger__icon{font-size:15px;line-height:1}
.enix-dp-trigger.has-label{height:auto;min-height:48px;padding:6px 12px}
.enix-dp-trigger__texts{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.15;gap:1px}
.enix-dp-trigger__label{font-size:.68rem;font-weight:600;color:var(--enix-blue);text-transform:uppercase;letter-spacing:.05em}
.enix-dp-trigger.has-label .enix-dp-trigger__txt{font-size:.9rem;font-weight:700;color:var(--enix-navy)}
.enix-dp-trigger__txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--enix-g800)}
.enix-dp-trigger__txt.is-placeholder{color:var(--enix-g400)}
.enix-dp-trigger__chev{width:18px;flex-shrink:0;color:var(--enix-g400);transition:transform .2s}
.enix-dp.is-open .enix-dp-trigger{border-radius:10px 10px 10px 0}
.enix-dp.is-open .enix-dp-trigger__chev{transform:rotate(180deg)}

/* popover — position:fixed seteado por JS (evita stacking context de ancestros).
   z-index 1086: por encima de cualquier modal de la app (cart-panel 1080, modales
   enix-mf/enix-crm 1085) para que el calendario no quede tapado al abrirse dentro
   de uno; por debajo del toast-stack (1090) para que un aviso siga ganando. */
.enix-dp-pop{position:fixed;z-index:1086;background:#fff;border:1.5px solid var(--enix-g200);border-radius:0 11px 11px 11px;box-shadow:0 14px 32px rgba(13,34,64,.13);padding:16px;max-width:92vw;transform-origin:top left;animation:enix-in .14s cubic-bezier(.2,.8,.2,1)}
@keyframes enix-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* header / nav */
.enix-dp-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.enix-dp-nav{display:flex;gap:5px;flex-shrink:0}
.enix-dp-nav button{width:30px;height:30px;border-radius:7px;border:1.5px solid var(--enix-g200);background:#fff;color:var(--enix-blue);font-size:14px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.enix-dp-nav button:disabled{color:#cbd5e1;cursor:not-allowed}
/* títulos mes/año centrados entre ‹ y › */
.enix-dp-titles{display:flex;flex:1;align-items:center;justify-content:space-around;gap:12px}
.enix-dp-mtitle{display:flex;align-items:center;justify-content:center;gap:5px}
.enix-dp-mtitle .m{border:none;background:transparent;font-size:14px;font-weight:800;color:var(--enix-blue);text-transform:capitalize;cursor:pointer;font-family:inherit;padding:1px 4px;border-radius:6px;text-decoration:underline;text-underline-offset:2px}
.enix-dp-mtitle .y{border:none;background:transparent;font-size:14px;font-weight:800;color:var(--enix-blue);cursor:pointer;font-family:inherit;padding:1px 4px;border-radius:6px;text-decoration:underline;text-underline-offset:2px}

/* months */
.enix-dp-months{display:flex;gap:12px}
.enix-dp-month{flex:0 0 auto;width:240px}
.enix-dp-wd{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:2px}
.enix-dp-wd span{text-align:center;font-size:10.5px;font-weight:700;color:var(--enix-g400);padding:3px 0}
.enix-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);row-gap:1px}

/* day cells + range shading */
.enix-dp-day{height:36px;display:flex;align-items:center;justify-content:center;background:transparent}
.enix-dp-day.in-range{background:var(--enix-blue-md)}
.enix-dp-day.lo{background:linear-gradient(90deg,transparent 50%,var(--enix-blue-md) 50%)}
.enix-dp-day.hi{background:linear-gradient(90deg,var(--enix-blue-md) 50%,transparent 50%)}
.enix-dp-d{width:31px;height:31px;border-radius:50%;border:none;background:transparent;color:var(--enix-g800);font-family:inherit;font-size:13px;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center;transition:background .12s}
.enix-dp-d:hover:not(:disabled):not(.sel){background:var(--enix-blue-lt)}
.enix-dp-d.sel{background:var(--enix-blue);color:#fff;font-weight:700}
.enix-dp-d:disabled{cursor:not-allowed;color:#cbd5e1;opacity:.55}
.enix-dp-d.invalid{cursor:not-allowed;color:#cbd5e1;opacity:.4}
.enix-dp-d.unavail{text-decoration:line-through}
.enix-dp-d.today:not(.sel)::after{content:'';position:absolute;bottom:3px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--enix-blue)}

/* single = mes más amplio */
.enix-dp.is-single .enix-dp-month{width:288px}
.enix-dp.is-single .enix-dp-day{height:40px}
.enix-dp.is-single .enix-dp-d{width:34px;height:34px;font-size:14px}
.enix-dp.is-single .enix-dp-mtitle .m,.enix-dp.is-single .enix-dp-mtitle .y{font-size:15px}
.enix-dp.is-single .enix-dp-wd span{font-size:11px;padding:4px 0}

/* footer */
/* flex-wrap: en popups angostos (1 mes) los botones bajan a otra linea en vez de
   desbordar; en 2 meses (hoteles) hay lugar de sobra y no envuelve. */
.enix-dp-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;row-gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid #f1f5f9}
.enix-dp-foot__info{font-size:13px;color:var(--enix-g500);white-space:nowrap;display:flex;align-items:center;min-width:0}
.enix-dp-foot__info .nights{display:inline-flex;align-items:center;gap:6px;background:var(--enix-blue-lt);color:var(--enix-blue);font-weight:700;padding:5px 10px;border-radius:8px;margin-right:8px}
.enix-dp-foot__info .rng{font-size:12.5px;color:var(--enix-g500)}
.enix-dp-foot__btns{display:flex;gap:8px;flex-shrink:0;margin-left:auto}
.enix-dp-clear{border:none;background:transparent;color:var(--enix-g500);font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;padding:9px 12px}
.enix-dp-reset{border:1.5px solid var(--enix-g200);background:#fff;color:var(--enix-blue);font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;padding:8px 14px;border-radius:8px;white-space:nowrap}
.enix-dp-reset:hover{background:var(--enix-blue-lt);border-color:var(--enix-blue)}
.enix-dp-apply{border:none;background:var(--enix-blue);color:#fff;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;padding:9px 18px;border-radius:8px}
.enix-dp-apply:disabled{background:#cbd5e1;cursor:not-allowed}

/* year picker */
.enix-dp-yhead{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.enix-dp-yhead span{flex:1;text-align:center;font-size:12px;font-weight:800;letter-spacing:.03em;color:var(--enix-navy)}
.enix-dp-yhead button{border:none;background:transparent;color:var(--enix-blue);font-weight:600;font-size:12.5px;cursor:pointer;font-family:inherit;padding:0}
.enix-dp-yhead__nav{width:26px;height:26px;border-radius:50%!important;display:inline-flex;align-items:center;justify-content:center;font-size:16px!important;line-height:1}
.enix-dp-yhead__nav:hover:not(:disabled){background:var(--enix-blue-lt)}
.enix-dp-yhead__nav:disabled{color:#cbd5e1;cursor:not-allowed}
.enix-dp-years{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.enix-dp-years button{padding:11px 0;border-radius:9px;border:1.5px solid var(--enix-g200);background:#fff;color:var(--enix-g700);font-weight:700;font-size:13px;cursor:pointer;font-family:inherit}
.enix-dp-years button.active{border-color:var(--enix-blue);background:var(--enix-blue);color:#fff}
.enix-dp-years button:disabled{cursor:not-allowed;color:#cbd5e1;opacity:.55;background:#f8fafc}

/* month picker */
.enix-dp-mpick{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.enix-dp-mpick button{padding:14px 0;border-radius:9px;border:1.5px solid var(--enix-g200);background:#fff;color:var(--enix-g700);font-weight:700;font-size:13px;cursor:pointer;font-family:inherit;text-transform:capitalize}
.enix-dp-mpick button.active{border-color:var(--enix-blue);background:var(--enix-blue);color:#fff}
.enix-dp-mpick button:disabled{cursor:not-allowed;color:#cbd5e1;opacity:.55;background:#f8fafc}

/* time picker */
.enix-dp-time{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;margin-top:12px;padding:10px 14px;background:var(--enix-blue-lt);border-radius:9px;overflow:hidden}
.enix-dp-time__group{display:flex;align-items:center;gap:5px;flex-shrink:0}
.enix-dp-time__lbl{font-size:10px;font-weight:700;color:var(--enix-g500);white-space:nowrap}
.enix-dp-time__arr{font-size:16px;color:var(--enix-g400)}
.enix-dp-time__colon{font-size:16px;font-weight:700;color:var(--enix-g500);line-height:1}
.enix-dp-time__sel{height:34px;border:1.5px solid var(--enix-g200);border-radius:7px;padding:0 6px;font-size:13px;font-family:inherit;color:var(--enix-g800);background:#fff;cursor:pointer;font-weight:600}
.enix-dp-time__sel:focus{outline:2px solid var(--enix-blue);outline-offset:1px}

/* mobile: bottom-sheet, 1 mes */
@media (max-width:768px){
  .enix-dp-pop{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:auto!important;max-width:none;border-radius:22px 22px 0 0;border:1.5px solid var(--enix-g200);border-bottom:none;padding:18px 16px 22px;animation:enix-sheet .28s cubic-bezier(.22,1,.36,1);transform-origin:bottom center;box-shadow:0 -14px 40px rgba(13,34,64,.18)}
  .enix-dp-titles{justify-content:center}
  .enix-dp-mtitle + .enix-dp-mtitle{display:none}
  .enix-dp-mtitle .m,.enix-dp-mtitle .y{font-size:15px}
  .enix-dp-months{flex-direction:column}
  .enix-dp-month{width:100%!important}
  .enix-dp-month + .enix-dp-month{display:none}
  .enix-dp-wd,.enix-dp-grid{width:100%}
  .enix-dp-day{height:44px!important}
  .enix-dp-d{width:38px;height:38px;font-size:14px}
  .enix-dp-wd span{font-size:11.5px;padding:6px 0}
  .enix-dp-foot{flex-wrap:wrap;gap:8px;padding-top:12px;margin-top:10px}
  .enix-dp-foot__info{flex:1 1 100%;font-size:12.5px}
  .enix-dp-foot__btns{margin-left:auto}
}
@keyframes enix-sheet{from{transform:translateY(100%)}to{transform:none}}

.enix-dp-pop.is-priced .enix-dp-month{width:470px}
.enix-dp-pop.is-priced .enix-dp-grid{row-gap:3px}
.enix-dp-pop.is-priced .enix-dp-day{height:56px}
.enix-dp-pop.is-priced .enix-dp-d{
  width:64px;height:52px;border-radius:10px;padding:3px 1px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
}
.enix-dp-pop.is-priced .enix-dp-d__n{font-size:13.5px;line-height:1.1;font-weight:600}
.enix-dp-pop.is-priced .enix-dp-d__p{
  font-size:10px;line-height:1.1;font-weight:700;color:var(--enix-g500);
  white-space:nowrap;letter-spacing:-.25px;
}
.enix-dp-pop.is-priced .enix-dp-d__p.is-cheap{color:#15803d}
.enix-dp-pop.is-priced .enix-dp-d__p.is-dear{color:var(--enix-g400)}
.enix-dp-pop.is-priced .enix-dp-d__p.is-none{color:#cbd5e1;font-weight:600}
.enix-dp-pop.is-priced .enix-dp-d.sel .enix-dp-d__p,
.enix-dp-pop.is-priced .enix-dp-d.sel .enix-dp-d__p.is-cheap,
.enix-dp-pop.is-priced .enix-dp-d.sel .enix-dp-d__p.is-dear{color:rgba(255,255,255,.92)}
.enix-dp-pop.is-priced .enix-dp-d.today:not(.sel)::after{bottom:1px}

.enix-dp-pop.is-priced .enix-dp-d__p.is-load{
  width:32px;height:9px;border-radius:3px;
  background:linear-gradient(90deg,#eef2f7 25%,#e2e8f0 37%,#eef2f7 63%);
  background-size:400% 100%;animation:enix-dp-shine 1.3s ease-in-out infinite;
}
@keyframes enix-dp-shine{0%{background-position:100% 50%}100%{background-position:0 50%}}

@media (max-width:768px){
  .enix-dp-pop.is-priced{max-height:92vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .enix-dp-pop.is-priced .enix-dp-day{height:56px!important}
  .enix-dp-pop.is-priced .enix-dp-d{width:100%;max-width:100%;height:52px;border-radius:9px}
  .enix-dp-pop.is-priced .enix-dp-d__n{font-size:14px}
  .enix-dp-pop.is-priced .enix-dp-d__p{font-size:10px;letter-spacing:-.3px}
}
@media (max-width:380px){
  .enix-dp-pop.is-priced .enix-dp-d__p{font-size:9px;letter-spacing:-.4px}
}
