/*!
 * Aurelia Zoekbalk — frontend styles
 */

.aus{
  --aus-fg:#F2EEE6;
  --aus-ink:#060B11;
  --aus-muted:rgba(242,238,230,.60);
  --aus-accent:#C8A96A;
  --aus-line:rgba(242,238,230,.13);
  --aus-bg:rgba(9,15,22,.55);
  --aus-hover:rgba(242,238,230,.045);
  --aus-blur:22px;
  --aus-r:0px;
  --aus-pad:22px;
  --aus-serif:Georgia,"Times New Roman",serif;
  --aus-ease:cubic-bezier(.22,1,.36,1);

  position:relative;
  width:100%;
  color:var(--aus-fg);
}
.aus *,.aus *::before,.aus *::after{box-sizing:border-box}

.aus__bar{
  display:grid;
  grid-template-columns:repeat(var(--aus-cols,3),1fr) auto;
  align-items:stretch;
  background:var(--aus-bg);
  border:1px solid var(--aus-line);
  border-radius:var(--aus-r);
  -webkit-backdrop-filter:blur(var(--aus-blur)) saturate(1.3);
  backdrop-filter:blur(var(--aus-blur)) saturate(1.3);
}

.aus-field{
  position:relative;
  display:block;
  width:100%;
  text-align:left;
  background:none;
  border:0;
  border-radius:0;
  padding:var(--aus-pad) clamp(16px,2vw,32px);
  color:var(--aus-fg);
  font-family:inherit;
  cursor:pointer;
  text-decoration:none;
  transition:background .45s var(--aus-ease);
}
.aus-field:hover,.aus-field.is-open{background:var(--aus-hover)}
.aus-field:focus-visible{outline:1px solid var(--aus-accent);outline-offset:-3px}
.aus-field + .aus-field::before{
  content:"";position:absolute;left:0;top:22%;bottom:22%;width:1px;background:var(--aus-line);
}
.aus-field__l{
  display:block;
  font-size:8.5px;letter-spacing:.30em;text-transform:uppercase;
  color:var(--aus-accent);margin-bottom:9px;
}
.aus-field__v{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-family:var(--aus-serif);font-size:clamp(16px,1.5vw,20px);font-weight:400;letter-spacing:.01em;
  line-height:1.2;
}
.aus-field__v span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aus-field__v svg{flex:none;opacity:.45;transition:transform .4s var(--aus-ease)}
.aus-field.is-open .aus-field__v svg{transform:rotate(180deg);opacity:.9}
.aus-field__v.is-dim span{color:rgba(242,238,230,.4)}

.aus-go{
  display:grid;place-items:center;
  padding:var(--aus-pad) clamp(26px,3vw,46px);
  background:var(--aus-accent);
  border:0;border-radius:0;
  color:var(--aus-ink);
  font-family:inherit;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;
  cursor:pointer;text-decoration:none;text-align:center;
  position:relative;overflow:hidden;isolation:isolate;
  transition:color .5s var(--aus-ease);
}
.aus-go::before{
  content:"";position:absolute;inset:0;background:var(--aus-fg);z-index:-1;
  transform:translateY(101%);transition:transform .55s var(--aus-ease);
}
.aus-go:hover::before{transform:translateY(0)}

/* ── uitklappaneel ── */
/* De panelen worden bij het openen naar <body> verplaatst en met vaste
   positionering neergezet. Zo kan geen enkele container met overflow:hidden
   of een eigen stapelcontext ze nog afkappen. */
.aus-portal{display:contents}
.aus-pop{
  position:fixed;z-index:99999;top:0;left:0;
  min-width:280px;max-width:calc(100vw - 24px);
  background:rgba(9,15,22,.94);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border:1px solid var(--aus-line);border-radius:var(--aus-r);
  padding:18px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .3s var(--aus-ease),transform .3s var(--aus-ease),visibility 0s linear .3s;
}
.aus-pop.is-on{opacity:1;visibility:visible;transform:none;transition-delay:0s,0s,0s}
.aus-pop--dates{min-width:min(540px,92vw);padding:20px 22px}
.aus-pop--guests{min-width:300px}

.aus-cal__bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.aus-cal__t{font-family:var(--aus-serif);font-size:14px;color:var(--aus-muted)}
.aus-cal__nav{display:flex;gap:6px}
.aus-cal__nav button{width:30px;height:30px;border:1px solid var(--aus-line);background:none;
  color:var(--aus-fg);cursor:pointer;display:grid;place-items:center;border-radius:var(--aus-r);
  transition:.35s var(--aus-ease)}
.aus-cal__nav button:hover:not(:disabled){background:var(--aus-hover)}
.aus-cal__nav button:disabled{opacity:.25;cursor:default}

.aus-months{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,30px)}
.aus-mo__h{font-family:var(--aus-serif);font-size:13px;text-align:center;margin-bottom:8px;
  color:rgba(242,238,230,.8)}
.aus-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.aus-dw{font-size:8px;letter-spacing:.12em;text-transform:uppercase;text-align:center;
  color:rgba(242,238,230,.34);padding-bottom:5px}
.aus-day{aspect-ratio:1/1;min-height:30px;border:0;border-radius:3px;background:none;color:var(--aus-fg);
  cursor:pointer;font-family:var(--aus-serif);font-size:13px;display:grid;place-items:center;
  padding:0;transition:background .2s var(--aus-ease),color .2s var(--aus-ease)}
.aus-day:hover:not(:disabled){background:rgba(242,238,230,.1)}
.aus-day:disabled{color:rgba(242,238,230,.2);cursor:default}
.aus-day.is-in{background:rgba(200,169,106,.18)}
.aus-day.is-in:hover{background:rgba(200,169,106,.3)}
.aus-day.is-edge,.aus-day.is-edge:hover{background:var(--aus-accent);color:var(--aus-ink)}
.aus-day.is-hide{visibility:hidden}
.aus-cal__hint{margin:12px 0 0;font-size:11px;color:var(--aus-muted)}

.aus-count{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:12px 0}
.aus-count + .aus-count{border-top:1px solid var(--aus-line)}
.aus-count p{margin:0;font-size:13px}
.aus-count p small{display:block;margin-top:4px;font-size:11px;color:var(--aus-muted)}
.aus-count div{display:flex;align-items:center;gap:12px}
.aus-count button{width:30px;height:30px;border:1px solid rgba(242,238,230,.24);background:none;
  color:var(--aus-fg);cursor:pointer;font-size:15px;line-height:1;display:grid;place-items:center;
  border-radius:var(--aus-r);padding:0;transition:.3s var(--aus-ease)}
.aus-count button:hover:not(:disabled){background:var(--aus-hover)}
.aus-count button:disabled{opacity:.24;cursor:default}
.aus-count output{font-family:var(--aus-serif);font-size:18px;min-width:1.4ch;text-align:center}

/* ── responsive ── */
@media(max-width:1024px){
  .aus__bar{grid-template-columns:1fr 1fr}
  .aus-go{grid-column:1 / -1;padding-top:18px;padding-bottom:18px}
  .aus-field:nth-child(3)::before{display:none}
  .aus-field:nth-child(3){border-top:1px solid var(--aus-line);grid-column:1 / -1}
  .aus-go{border-top:0}
  .aus-months{grid-template-columns:1fr}
  .aus-months .aus-mo:nth-child(2){display:none}
  .aus-cal__t{display:none}
  .aus-cal__bar{justify-content:flex-end}
}
@media(max-width:600px){
  .aus__bar{grid-template-columns:1fr}
  .aus-field + .aus-field::before{left:var(--aus-pad);right:var(--aus-pad);top:0;bottom:auto;
    width:auto;height:1px}
  .aus-field:nth-child(3){border-top:0}
  .aus-field{padding-top:15px;padding-bottom:15px}
  .aus-pop.is-sheet{left:12px !important;right:12px !important;top:auto !important;
    bottom:12px !important;width:auto !important;min-width:0;max-width:none;
    max-height:76vh;overflow:auto}
}
@media(prefers-reduced-motion:reduce){ .aus *{transition-duration:1ms !important} }
