/* finesse · component: action-buttons · register=brand
 * states: default · hover · focus-visible · active · disabled · loading · error · success
 * tokens: inherited aubergine and lavender, with derived bevel and reflection tones */
:root{
  --button-ink:var(--ktv-on-accent);
  --button-light:color-mix(in srgb,var(--showcase-accent) 36%,var(--showcase-ink));
  --button-face:var(--showcase-accent);
  --button-low:color-mix(in srgb,var(--showcase-accent) 79%,var(--showcase-panel));
  --button-edge:color-mix(in srgb,var(--showcase-accent) 65%,var(--showcase-panel));
  --button-depth:color-mix(in srgb,var(--showcase-accent) 39%,var(--showcase-panel));
  --button-shadow:color-mix(in srgb,var(--showcase-bg) 80%,transparent);
  --button-halo:color-mix(in srgb,var(--showcase-accent) 24%,transparent);
  --button-reflect:color-mix(in srgb,var(--showcase-ink) 65%,transparent);
  --button-reflect-soft:color-mix(in srgb,var(--showcase-ink) 12%,transparent);
  --button-dark-top:color-mix(in srgb,var(--showcase-panel) 75%,var(--showcase-accent));
  --button-dark-mid:color-mix(in srgb,var(--showcase-panel) 93%,var(--showcase-accent));
  --button-dark-edge:color-mix(in srgb,var(--showcase-panel) 60%,var(--showcase-accent));
  --button-clear:transparent;
}
:is(#top,.booking-dock,.rm-dialog) .ktv-action{
  position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box;
  min-height:44px;border:1px solid var(--button-dark-edge);border-radius:10px;
  outline:3px solid var(--button-clear);outline-offset:4px;
  background:linear-gradient(180deg,var(--button-dark-top),var(--button-dark-mid) 48%,var(--showcase-panel));
  color:var(--showcase-ink);text-decoration:none;
  box-shadow:inset 0 1px 0 var(--button-reflect-soft),inset 0 -1px 0 var(--showcase-line),0 3px 0 var(--showcase-bg),0 6px 12px var(--button-shadow);
  font-weight:700;white-space:nowrap;cursor:pointer;touch-action:manipulation;
  transition:transform 140ms ease,box-shadow 140ms ease;
  -webkit-tap-highlight-color:transparent;
}
:is(#top,.booking-dock,.rm-dialog) .ktv-action>span,
:is(#top,.booking-dock,.rm-dialog) .ktv-action>small,
:is(#top,.booking-dock,.rm-dialog) .ktv-action>img{position:relative;z-index:2}
:is(#top,.booking-dock,.rm-dialog) .ktv-action.ktv-action-primary{
  border-color:var(--button-light);border-bottom-color:var(--button-edge);
  background:linear-gradient(180deg,var(--button-light) 0%,var(--button-face) 44%,var(--button-low) 100%);
  color:var(--button-ink);
  box-shadow:inset 0 1px 0 var(--button-reflect),inset 0 -1px 0 var(--button-reflect-soft),0 4px 0 var(--button-depth),0 8px 16px var(--button-shadow),0 0 16px var(--button-halo);
}
.booking-dock :is(#booking-whatsapp,.booking-rooms).ktv-action{border-radius:12px;min-height:56px}
.booking-dock #booking-whatsapp.ktv-action-primary{box-shadow:inset 0 1px 0 var(--button-reflect),inset 0 -1px 0 var(--button-reflect-soft),0 5px 0 var(--button-depth),0 9px 20px var(--button-shadow),0 0 23px var(--button-halo)}
#top .offers-grid .offer-detail.ktv-action{justify-content:space-between;min-height:44px;margin-top:13px;padding:10px 12px;font-size:13px;color:var(--showcase-accent)}
#top .package-room-cta.ktv-action{min-height:48px;color:var(--showcase-accent)}
.ktv-action-shine::before{
  content:'';position:absolute;z-index:1;pointer-events:none;left:0;top:-50%;width:34%;height:200%;
  background:linear-gradient(90deg,var(--button-clear),var(--button-reflect-soft) 22%,var(--button-reflect) 51%,var(--button-clear));
  transform:translateX(-240%) skewX(-22deg);opacity:0;
  animation:ktv-button-sheen 6.8s ease-in-out infinite;animation-play-state:paused;
}
.ktv-action-shine::after{
  content:'';position:absolute;z-index:1;pointer-events:none;top:7px;right:13px;width:9px;height:9px;
  background:var(--button-light);opacity:.45;
  clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);
  animation:ktv-button-glint 6.8s ease-in-out infinite;animation-play-state:paused;
}
html[data-ktv-motion=running] .ktv-action-shine::before,
html[data-ktv-motion=running] .ktv-action-shine::after{animation-play-state:running}
@keyframes ktv-button-sheen{0%,58%{transform:translateX(-240%) skewX(-22deg);opacity:0}62%{opacity:.75}82%{transform:translateX(410%) skewX(-22deg);opacity:.75}85%,100%{transform:translateX(410%) skewX(-22deg);opacity:0}}
@keyframes ktv-button-glint{0%,42%,100%{opacity:.25;transform:scale(.75)}67%{opacity:.95;transform:scale(1.16)}82%{opacity:.45;transform:scale(.9)}}
/* Selected controls share the same bevel without continuous animation. */
#top :is(.package-tab[aria-selected=true],.rm-filter[aria-pressed=true],.drink-tab[aria-selected=true]),
.language-switch button[aria-pressed=true]{
  border-color:var(--button-light);background:linear-gradient(180deg,var(--button-light),var(--button-face) 48%,var(--button-low));
  color:var(--button-ink);box-shadow:inset 0 1px 0 var(--button-reflect),0 2px 0 var(--button-depth),0 4px 10px var(--button-shadow);
}
@media(hover:hover){
  :is(#top,.booking-dock,.rm-dialog) .ktv-action:hover{transform:translateY(-1px);border-color:var(--showcase-accent)}
  :is(#top,.booking-dock,.rm-dialog) .ktv-action-primary:hover{border-color:var(--button-light);box-shadow:inset 0 1px 0 var(--button-reflect),0 5px 0 var(--button-depth),0 10px 18px var(--button-shadow),0 0 24px var(--button-halo)}
}
:is(#top,.booking-dock,.rm-dialog) .ktv-action.is-hover{transform:translateY(-1px);border-color:var(--button-light)}
:is(#top,.booking-dock,.rm-dialog) .ktv-action:focus-visible,
:is(#top,.booking-dock,.rm-dialog) .ktv-action.is-focus{outline-color:var(--ktv-focus)}
:is(#top,.booking-dock,.rm-dialog) .ktv-action:active,
:is(#top,.booking-dock,.rm-dialog) .ktv-action.is-active{transform:translateY(2px);box-shadow:inset 0 1px 0 var(--button-reflect-soft),0 1px 0 var(--button-depth),0 3px 8px var(--button-shadow);filter:none}
:is(#top,.booking-dock,.rm-dialog) .ktv-action:is(:disabled,[aria-disabled=true]){opacity:.5;cursor:not-allowed;transform:none;box-shadow:inset 0 1px 0 var(--button-reflect-soft)}
:is(#top,.booking-dock,.rm-dialog) .ktv-action:is(:disabled,[aria-disabled=true])::before,
:is(#top,.booking-dock,.rm-dialog) .ktv-action:is(:disabled,[aria-disabled=true])::after{animation:none;display:none}
:is(#top,.booking-dock,.rm-dialog) .ktv-action[data-state=loading]{cursor:progress;pointer-events:none}
.ktv-action[data-state=loading]>span{opacity:.6}
.ktv-action[data-state=loading]::after{content:'';position:absolute;right:10px;top:calc(50% - 7px);width:14px;height:14px;box-sizing:border-box;border:2px solid var(--button-ink);border-inline-end-color:var(--button-clear);border-radius:50%;clip-path:none;background:none;animation:ktv-button-wait 1s linear infinite}
.ktv-action[data-state=loading]::before{display:none}
@keyframes ktv-button-wait{to{transform:rotate(360deg)}}
:is(#top,.booking-dock,.rm-dialog) .ktv-action[data-state=error]{outline:2px dashed var(--showcase-accent);outline-offset:3px}
:is(#top,.booking-dock,.rm-dialog) .ktv-action[data-state=success]{box-shadow:inset 0 1px 0 var(--button-reflect),0 2px 0 var(--button-depth),0 4px 12px var(--button-shadow)}
.ktv-action:is([data-state=success],[data-state=error])::before,
.ktv-action:is([data-state=success],[data-state=error])::after{animation:none;display:none}
@media(max-width:360px){#top .offers-grid .offer-detail.ktv-action{padding-inline:9px;font-size:12px}}
@media(prefers-reduced-motion:reduce){
  :is(#top,.booking-dock,.rm-dialog) .ktv-action{transition:none}
  .ktv-action::before,.ktv-action::after{animation:none!important}
  .ktv-action-shine::before{display:none}
  .ktv-action-shine::after{opacity:.5;transform:none}
}