/* MLACal — Airbnb-style date-range calendar (see front/media/v10/js/mla-calendar.js) */
.mcal{
  --mc-ink: var(--heading, #121211);
  --mc-muted: var(--muted, #6b6b66);
  --mc-faint: rgba(18,18,17,.28);
  --mc-line: var(--line, rgba(18,18,17,.12));
  --mc-gold: var(--gold, #A9713F);
  --mc-range: rgba(169,113,63,.10);
  position:relative; box-sizing:border-box;
  font-family:inherit; color:var(--mc-ink);
  background:#fff; border-radius:22px;
  padding:22px 24px 16px;
}
.mcal *{ box-sizing:border-box; }
.mcal--pop{
  position:fixed; z-index:1000; width:min(720px, calc(100vw - 24px));
  box-shadow:0 2px 6px rgba(0,0,0,.06), 0 24px 60px -18px rgba(0,0,0,.35);
  border:1px solid var(--mc-line);
  display:none;
}
.mcal--pop.open{ display:block; }
.mcal--pop.sheet{                       /* phones: bottom sheet */
  left:0 !important; right:0; bottom:0; top:auto !important; width:100%;
  border-radius:22px 22px 0 0; max-height:88vh; overflow:auto;
  padding-bottom:calc(16px + env(safe-area-inset-bottom));
}
.mcal--inline{ padding:6px 0 0; border-radius:0; }

.mcal-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; min-height:46px; }
.mcal-title{ font-size:19px; font-weight:600; letter-spacing:-.02em; }
.mcal-sub{ margin-top:3px; font-size:13px; color:var(--mc-muted); }
.mcal-sub b{ font-weight:600; color:var(--mc-gold); }
.mcal-x{ border:0; background:none; font-size:26px; line-height:1; cursor:pointer; color:var(--mc-muted); padding:0 4px; }

.mcal-nav{ position:relative; height:0; }
.mcal-nav button{
  position:absolute; top:16px; width:32px; height:32px; border-radius:50%;
  border:1px solid var(--mc-line); background:#fff; cursor:pointer;
  font-size:20px; line-height:1; color:var(--mc-ink); z-index:2;
}
.mcal-nav button:disabled{ opacity:.3; cursor:default; }
.mcal-prev{ left:0; }
.mcal-next{ right:0; }

.mcal-months{ display:grid; gap:34px; margin-top:12px; }
.mcal-mname{ text-align:center; font-size:15px; font-weight:600; padding:22px 0 14px; }
.mcal-grid{ display:grid; grid-template-columns:repeat(7, 1fr); row-gap:2px; }
.mcal-dow{ text-align:center; font-size:11px; color:var(--mc-muted); padding-bottom:8px; }

.mcal-day{
  position:relative; aspect-ratio:1/1; width:100%;
  border:0; background:none; padding:0; cursor:pointer;
  font:inherit; font-size:14px; font-weight:500; color:var(--mc-ink);
}
.mcal-day span{
  position:relative; z-index:1; display:flex; align-items:center; justify-content:center;
  width:100%; height:100%; border-radius:50%;
  border:1.5px solid transparent; transition:border-color .12s ease, background .12s ease;
}
.mcal-day:hover span{ border-color:var(--mc-ink); }

/* taken / past: crossed out, no hover circle */
.mcal-day.x{ cursor:default; color:var(--mc-faint); }
.mcal-day.x span{ text-decoration:line-through; }
.mcal-day.x:hover span{ border-color:transparent; }
/* taken day that can be the CHECKOUT (after a check-in is picked): still crossed, hover shows the circle (Airbnb) */
.mcal-day.x.coable{ cursor:pointer; }
.mcal-day.x.coable:hover span{ border-color:var(--mc-ink); color:var(--mc-ink); }
/* too short for this check-in: looks normal; hovering / clicking pops "N nights minimum" */
.mcal-day.short, .mcal-day.noci{ cursor:not-allowed; }
.mcal-day.short:hover span, .mcal-day.noci:hover span{ border-color:transparent; }

/* selected range */
.mcal-day.ci span, .mcal-day.co span{ background:var(--mc-ink); color:#fff; border-color:var(--mc-ink); }
.mcal-day.ci.co span{ background:var(--mc-ink); }
.mcal-day.in::before, .mcal-day.pre::before,
.mcal-day.ci::before, .mcal-day.co::before{
  content:''; position:absolute; top:0; bottom:0; left:0; right:0; background:var(--mc-range); z-index:0;
}
.mcal-day.ci::before{ left:50%; }
.mcal-day.co::before{ right:50%; }
.mcal-day.ci:not(.has-range)::before, .mcal-day.co:not(.has-range)::before{ display:none; }
.mcal-day.pre-end::before{ right:50%; }
.mcal-day.pre.pre-end span{ border-color:var(--mc-ink); }
.mcal-day.pre span{ border-color:transparent; }
.mcal-day.pre:hover span{ border-color:var(--mc-ink); }

.mcal-foot{
  display:flex; align-items:center; gap:14px; justify-content:flex-end;
  margin-top:14px; padding-top:12px; border-top:1px solid var(--mc-line);
}
.mcal-clear{ border:0; background:none; font:inherit; font-size:13.5px; font-weight:600; text-decoration:underline; cursor:pointer; color:var(--mc-ink); }
.mcal-clear:disabled{ color:var(--mc-faint); cursor:default; }
.mcal-done{
  border:0; border-radius:999px; padding:10px 22px; cursor:pointer;
  background:var(--mc-ink); color:#fff; font:inherit; font-size:13.5px; font-weight:600;
}

.mcal-tip{
  position:absolute; z-index:5; transform:translate(-50%, -100%);
  background:var(--mc-ink); color:#fff; font-size:12px; font-weight:500; white-space:nowrap;
  padding:6px 10px; border-radius:8px; pointer-events:none;
  box-shadow:0 6px 18px -6px rgba(0,0,0,.4);
}
.mcal-tip::after{
  content:''; position:absolute; left:var(--ax, 50%); bottom:-5px; transform:translateX(-50%);
  border:5px solid transparent; border-bottom:0; border-top-color:var(--mc-ink);
}

/* phones (<760px): one scrolling list of months, weekday row pinned on top, no arrows (Airbnb) */
.mcal-dowbar{ display:none; }
.mcal--v .mcal-nav{ display:none; }
.mcal--v .mcal-dowbar{
  display:grid; grid-template-columns:repeat(7, 1fr); margin-top:10px; padding:8px 0;
  border-bottom:1px solid var(--mc-line);
}
.mcal--v .mcal-dowbar span{ text-align:center; font-size:11px; color:var(--mc-muted); }
.mcal--v .mcal-months{
  display:block; position:relative; margin-top:0;
  overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
}
.mcal--v .mcal-mname{ text-align:left; padding:18px 4px 10px; }
.mcal--pop.sheet.mcal--v.open{ display:flex; flex-direction:column; height:88vh; height:88dvh; overflow:hidden; }
.mcal--pop.sheet.mcal--v .mcal-months{ flex:1 1 auto; min-height:0; }
.mcal--pop.sheet.mcal--v .mcal-foot{ margin-top:0; }
.mcal--inline.mcal--v .mcal-months{ max-height:440px; }
