/* EXT:tw_elements · taurerwirt/quickmenu – seitliche Buttons (eckig)
   Farben je Button: --q-bg, --q-c, --q-bg-h, --q-c-h (inline gesetzt, sonst Standard unten) */
nav.tw-quick {
  position: fixed;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: clamp(10px, 1.2vw, 18px);
  margin: 0;
  pointer-events: none;
}
nav.tw-quick--right { right: 0; align-items: flex-end; }
nav.tw-quick--left { left: 0; align-items: flex-start; }
nav.tw-quick--pos-middle { top: 50%; transform: translateY(-38%); }
nav.tw-quick--pos-top { top: 24%; }
nav.tw-quick--pos-bottom { bottom: 10%; }

nav.tw-quick a.tw-quick__btn {
  --q-bg: var(--tw-navy, #293349);
  --q-c: #ffffff;
  --q-bg-h: var(--tw-gold, #d2be6f);
  --q-c-h: var(--tw-navy, #293349);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .7em;
  border-radius: 0;
  background-color: var(--q-bg);
  color: var(--q-c);
  font-family: var(--font-family-bold, 'Barlow Condensed', 'Arial Narrow', sans-serif);
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  letter-spacing: .4em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: -3px 3px 10px rgba(0, 0, 0, .28);
  pointer-events: auto;
  transition: width .35s var(--tw-ease, ease), padding .35s var(--tw-ease, ease), color .35s, background-color .35s, box-shadow .35s;
}
nav.tw-quick--left a.tw-quick__btn { box-shadow: 3px 3px 10px rgba(0, 0, 0, .28); }
nav.tw-quick a.tw-quick__btn:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }
.tw-quick__icon { flex: none; width: 20px; height: 20px; }

/* --- senkrecht (Design Lafer) --- */
nav.tw-quick--vertical a.tw-quick__btn {
  --q-w: clamp(38px, 2.6vw, 50px);
  flex-direction: column;
  width: var(--q-w);
  min-height: clamp(132px, 9.2vw, 182px);
  padding: 16px 0;
}
nav.tw-quick--vertical .tw-quick__label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  padding-bottom: .4em;                 /* gleicht die Sperrung am Wortende aus */
}
nav.tw-quick--vertical .tw-quick__btn--icon .tw-quick__label { padding-bottom: 0; }
nav.tw-quick--vertical .tw-quick__btn--icon { flex-direction: column-reverse; }

/* --- waagrecht (wie central-soelden.com) --- */
nav.tw-quick--horizontal a.tw-quick__btn {
  justify-content: flex-start;
  min-width: 150px;
  padding: 15px 22px;
  letter-spacing: .2em;
}

/* --- Hover: Ausfahren (alle Effekte außer "kein") --- */
nav.tw-quick--vertical:not(.tw-quick--fx-none) a.tw-quick__btn:hover,
nav.tw-quick--vertical:not(.tw-quick--fx-none) a.tw-quick__btn:focus-visible { width: calc(var(--q-w) + 10px); box-shadow: -5px 4px 16px rgba(0, 0, 0, .35); }
nav.tw-quick--horizontal.tw-quick--right:not(.tw-quick--fx-none) a.tw-quick__btn:hover,
nav.tw-quick--horizontal.tw-quick--right:not(.tw-quick--fx-none) a.tw-quick__btn:focus-visible { padding-right: 34px; }
nav.tw-quick--horizontal.tw-quick--left:not(.tw-quick--fx-none) a.tw-quick__btn:hover,
nav.tw-quick--horizontal.tw-quick--left:not(.tw-quick--fx-none) a.tw-quick__btn:focus-visible { padding-left: 34px; }

/* --- Hover: Farbe --- */
nav.tw-quick a.tw-quick__btn::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: var(--q-bg-h);
  opacity: 0;
}
nav.tw-quick--fx-wipe a.tw-quick__btn::before { opacity: 1; transform: translateX(101%); transition: transform .4s var(--tw-ease, ease); }
nav.tw-quick--fx-wipe.tw-quick--left a.tw-quick__btn::before { transform: translateX(-101%); }
nav.tw-quick--fx-fade a.tw-quick__btn::before { transition: opacity .4s ease; }
nav.tw-quick--fx-wipe a.tw-quick__btn:hover::before,
nav.tw-quick--fx-wipe a.tw-quick__btn:focus-visible::before { transform: translateX(0); }
nav.tw-quick--fx-fade a.tw-quick__btn:hover::before,
nav.tw-quick--fx-fade a.tw-quick__btn:focus-visible::before { opacity: 1; }
nav.tw-quick--fx-wipe a.tw-quick__btn:hover, nav.tw-quick--fx-wipe a.tw-quick__btn:focus-visible,
nav.tw-quick--fx-fade a.tw-quick__btn:hover, nav.tw-quick--fx-fade a.tw-quick__btn:focus-visible { color: var(--q-c-h); text-decoration: none; }

/* --- Einfahren beim Laden --- */
nav.tw-quick--intro a.tw-quick__btn { animation: tw-q-in-r .7s var(--tw-ease, ease) both; animation-delay: calc(var(--q-i, 0) * .12s + .15s); }
nav.tw-quick--intro.tw-quick--left a.tw-quick__btn { animation-name: tw-q-in-l; }
@keyframes tw-q-in-r { from { transform: translateX(110%); } to { transform: none; } }
@keyframes tw-q-in-l { from { transform: translateX(-110%); } to { transform: none; } }

/* --- Handy --- */
@media (max-width: 768px) {
  nav.tw-quick--m-hidden { display: none; }
  nav.tw-quick--m-bar {
    top: auto; bottom: 0; left: 0; right: 0;
    transform: none;
    flex-direction: row;
    align-items: stretch;
    gap: 0;
  }
  nav.tw-quick--m-bar a.tw-quick__btn {
    flex: 1 1 0;
    flex-direction: row;
    width: auto !important;
    min-width: 0;
    min-height: 0;
    height: 52px;
    padding: 0 8px !important;
    font-size: 15px;
    letter-spacing: .25em;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, .2);
    animation-name: tw-q-up;
  }
  nav.tw-quick--m-bar .tw-quick__label { writing-mode: horizontal-tb; transform: none; padding: 0 0 0 .25em; }
  nav.tw-quick--m-bar .tw-quick__btn--no-mobile { display: none; }
  nav.tw-quick--m-bar.tw-quick--fx-wipe a.tw-quick__btn::before { transform: translateY(101%); }
  nav.tw-quick--m-bar.tw-quick--fx-wipe a.tw-quick__btn:hover::before { transform: translateY(0); }
  body:has(nav.tw-quick--m-bar) { padding-bottom: 52px; }
  body:has(nav.tw-quick--m-bar) .scrollToTop { bottom: 64px !important; }
}
@keyframes tw-q-up { from { transform: translateY(110%); } to { transform: none; } }

@media (prefers-reduced-motion: reduce) {
  nav.tw-quick a.tw-quick__btn, nav.tw-quick a.tw-quick__btn::before { animation: none !important; transition: none !important; }
}