/* Overrides of Uncode's own chrome (header, menus, buttons, rows, footer) for "Weingarten und Keller". */

/* ---- Ported from the former Theme Options › Custom CSS (emptied by .dev/redesign/lib/options.php) ---- */

/* Speisekarte: prices and separators stay hidden */
.uncode-pricing-entry-value,
.uncode-pricing-entry-separator {
  display: none !important;
}
.wpcf7-not-valid-tip {
  text-align: left !important;
}
/* Cart: coupon field without right margin, update button below the table */
.woocommerce-cart-form__contents .coupon {
  margin-right: 0 !important;
}
.woocommerce-cart-form__contents .actions > button {
  position: initial !important;
  margin-top: 20px !important;
  float: left;
}
/* Product pages: no previous/next navigation */
.row-container.row-navigation {
  display: none;
}

/* ---- Header: the ground, no rule; logo and menu on the page margins ---- */
.menu-wrapper .menu-container,
.menu-wrapper .navbar {
  background-color: var(--st-label) !important;
}
.menu-container.menu-borders,
.menu-borders .row-menu,
.menu-borders .row-menu-inner {
  border-color: transparent !important;
}
@media (min-width: 960px) {
  .menu-container .row-menu.limit-width {
    max-width: none !important;
    padding-left: calc(var(--st-edge) - 36px) !important;
    padding-right: calc(var(--st-edge) - 36px) !important;
  }
}
.navbar-brand .logo-image img {
  height: 100%;
  width: auto;
}

/* Main menu: Sofia, sentence case; an underline drawn under the hovered and the current item */
.menu-horizontal .menu-smart > li > a,
.menu-horizontal .menu-smart > li > a span,
.navbar-main .menu-smart > li > a,
.menu-smart .drop-menu a,
.menu-smart .drop-menu li > span {
  font-family: var(--st-sans) !important;
  font-size: var(--st-fs-ui) !important;
  font-weight: 470 !important;   /* small print: 450–480; 560 is for buttons only */
  font-variant-caps: normal;
  letter-spacing: .012em !important;
  text-transform: none !important;
  color: var(--st-cream) !important;
}
.menu-horizontal .menu-smart > li > a > span,
.menu-horizontal .menu-smart > li > a {
  position: relative;
}
@media (min-width: 960px) {
  /* Only the main menu (the shop's sort bar and the header icons are menus too); the line spans the label
     inside the link's 14 px side padding, and the last link has none on its right */
  .menu-horizontal .navbar-main .menu-smart > li.menu-item > a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: calc(50% - .95em);
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform var(--st-standard) var(--st-ease-inout);
  }
  .menu-horizontal .navbar-main .menu-smart > li.menu-item:last-child > a::after { right: 0; }
  .menu-horizontal .navbar-main .menu-smart > li.menu-item > a:hover::after,
  .menu-horizontal .navbar-main .menu-smart > li.menu-item > a:focus-visible::after,
  .menu-horizontal .navbar-main .menu-smart > li.current-menu-item > a::after,
  .menu-horizontal .navbar-main .menu-smart > li.current-menu-ancestor > a::after,
  .menu-horizontal .navbar-main .menu-smart > li.current_page_parent > a::after {
    transform: scaleX(1);
    transform-origin: left center;
  }
  .menu-horizontal .menu-smart > li.current-menu-item > a,
  .menu-horizontal .menu-smart > li.current-menu-ancestor > a,
  .menu-horizontal .menu-smart > li.current_page_parent > a {
    color: var(--st-gold-text) !important;
  }
}
.menu-horizontal .menu-smart > li > a .fa-dropdown,
.menu-horizontal .menu-smart > li > a i.fa-angle-down {
  font-size: .8em;
  opacity: .7;
}

/* Submenu: a quiet panel on the ground, no border, no shadow */
.menu-smart .drop-menu,
.menu-smart .un-submenu {
  background-color: var(--st-label) !important;
  border: 0 !important;
  box-shadow: 0 0 0 1px var(--st-line) !important;
  border-radius: 0 !important;
  padding: 10px 0 !important;
}
.menu-smart .drop-menu a {
  font-weight: 460 !important;
  color: var(--st-cream-soft) !important;
  transition: color var(--st-quick) ease-out;
}
.menu-smart .drop-menu a:hover,
.menu-smart .drop-menu .current-menu-item > a {
  color: var(--st-cream) !important;
}
/* Desktop: the submenu's words start under the parent's word. Parent links have 14 px side padding, items 20 px,
   so the panel moves 6 px left of the parent (SmartMenus places it at the parent's edge, 1 px out) */
@media (min-width: 960px) {
  /* as wide as its longest item: Uncode pins top-level submenus at 195 px, four classes deep */
  .menu-horizontal .navbar-main ul.menu-smart > li > ul.drop-menu:not(.mega-menu-inner) {
    width: max-content !important;
  }
  .menu-horizontal .navbar-main .menu-smart > li > .drop-menu {
    margin-left: -6px !important;
    padding: 12px 0 !important;
  }
  .menu-horizontal .navbar-main .menu-smart > li > .drop-menu a {
    padding: 6px 20px !important;
  }
}

/* Cart and search icons; the count as a plain number */
.uncode-cart .badge,
.mobile-shopping-cart .badge {
  background-color: transparent !important;
  color: var(--st-gold-text) !important;
  font-family: var(--st-sans) !important;
  font-weight: 600;
  font-size: .8rem !important;
  box-shadow: none !important;
}
.menu-icons .fa,
.mobile-additional-icons .fa,
.menu-icons [class*="uncode-icon"],
.mobile-additional-icons [class*="uncode-icon"] {
  color: var(--st-cream);
}

/* Hamburger lines in cream */
.mobile-menu-button .lines,
.mobile-menu-button .lines::before,
.mobile-menu-button .lines::after,
.mobile-menu-button .lines span {
  background-color: var(--st-cream) !important;
}

/* Mobile menu: a full-height dark panel, items set large in Literata */
@media (max-width: 959px) {
  .main-menu-container {
    background-color: var(--st-label) !important;
  }
  .main-menu-container .menu-smart > li > a,
  .main-menu-container .navbar-main .menu-smart > li > a {
    font-family: var(--st-serif) !important;
    font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.5rem) !important;
    font-weight: 470 !important;
    letter-spacing: -.012em !important;
    line-height: 1.15 !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    border: 0 !important;
  }
  .main-menu-container .menu-smart .drop-menu {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 0 8px !important;
  }
  .main-menu-container .menu-smart .drop-menu a {
    font-family: var(--st-sans) !important;
    font-size: 1.125rem !important;
    color: var(--st-cream-soft) !important;
    padding-top: 9px !important;
    padding-bottom: 9px !important;
  }
}

/* ---- Buttons: Sofia, sentence case, square; cream is primary, gold only on hover ---- */
.btn,
.btn-container .btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wpcf7-submit {
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: var(--st-sans) !important;
  font-size: var(--st-fs-ui) !important;
  font-weight: 560 !important;
  font-variant-caps: normal;
  letter-spacing: .012em !important;
  text-transform: none !important;
  transition: background-color var(--st-quick) ease-out, border-color var(--st-quick) ease-out, color var(--st-quick) ease-out, transform 120ms ease-out !important;
}
.btn:active,
.woocommerce a.button:active,
.woocommerce button.button:active,
.wpcf7-submit:active {
  transform: scale(.98);
}
.btn-accent,
.btn-color-202006,
.btn-color-vyce,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.wpcf7-submit {
  background-color: var(--st-cream) !important;
  border-color: var(--st-cream) !important;
  color: var(--st-label) !important;
}
.btn-accent:hover,
.btn-color-202006:hover,
.btn-color-vyce:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wpcf7-submit:hover {
  background-color: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-label) !important;
}
.btn-default,
.btn-outline,
.btn-flat {
  background-color: transparent !important;
  border: 1px solid rgba(236, 228, 214, .45) !important;
  color: var(--st-cream) !important;
}
.btn-default:hover,
.btn-outline:hover,
.btn-flat:hover {
  background-color: transparent !important;
  border-color: var(--st-cream) !important;
  color: var(--st-cream) !important;
}

/* ---- Shapes and motion from the demo: square corners, no blobs, no noise, no Uncode entrance animations ---- */
.img-round,
.img-round-xl,
.img-round-hg,
[class*="unradius-"],
.uncode-single-media-wrapper,
.tmb .t-entry-visual,
.tmb .t-entry-visual-cont {
  border-radius: 0 !important;
}
.uncode-canvas-bg-noise-wrap,
.block-bg-overlay[data-overlay-animated],
.column-background .block-bg-overlay {
  display: none !important;
}
.animate_when_almost_visible,
.animate_when_almost_visible.start_animation {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
}
.btn-shadow,
.img-shadow {
  box-shadow: none !important;
}

/* ---- Rows and separators ---- */
hr,
.separator-wrapper hr,
.vc_separator .vc_sep_line {
  border-color: var(--st-line) !important;
}

/* ---- Footer frame ---- */
.site-footer,
.site-footer .style-color-nhtu-bg {
  background-color: var(--st-label-3) !important;
}
.site-footer a {
  color: var(--st-cream);
  text-decoration: none;
}
.site-footer a:hover {
  color: var(--st-gold-text);
}

/* ---- Specificity guards against Uncode's generated button rules (style-custom.css) ----
   Uncode's dark skin paints .btn-default white with the heading colour as text, and turns accent-button
   text gold on hover. These selectors are deliberately one step stronger. */
html body .style-dark .btn-default:not(.st-btn):not(.st-film):not(.checkout-button) {
  background-color: transparent !important;
  border-color: rgba(236, 228, 214, .45) !important;
  color: var(--st-cream) !important;
}
html body .style-dark .btn-default:not(.st-btn):not(.st-film):not(.checkout-button):not(.btn-hover-nobg):not(.icon-animated):not(.btn-flat):hover {
  background-color: transparent !important;
  border-color: var(--st-cream) !important;
  color: var(--st-cream) !important;
}
/* Uncode empties the accent fill on hover, focus and press (transparent with a gold border, so the dark label
   vanishes): a primary button stays filled, cream at rest and on keyboard focus (the gold ring marks it), gold under
   the pointer and while pressed */
html .btn-accent:not(.btn-flat):not(.btn-hover-nobg):not(.icon-animated):not(.btn-text-skin):focus {
  background-color: var(--st-cream) !important;
  border-color: var(--st-cream) !important;
  color: var(--st-label) !important;
}
html .btn-accent:not(.btn-flat):not(.btn-hover-nobg):not(.icon-animated):not(.btn-text-skin):hover,
html .btn-accent:not(.btn-flat):not(.btn-hover-nobg):not(.icon-animated):not(.btn-text-skin):active {
  background-color: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-label) !important;
}
html body .style-dark a.st-btn,
html body .style-dark .st-btn.btn,
html body a.st-btn.btn {
  background-color: var(--st-cream) !important;
  border-color: var(--st-cream) !important;
  color: var(--st-label) !important;
}
html body .style-dark a.st-btn:hover,
html body .style-dark .st-btn.btn:hover,
html body a.st-btn.btn:hover {
  background-color: var(--st-gold) !important;
  border-color: var(--st-gold) !important;
  color: var(--st-label) !important;
}
html body .style-dark a.st-btn.st-btn--line,
html body a.st-btn.st-btn--line {
  background-color: transparent !important;
  border-color: rgba(236, 228, 214, .45) !important;
  color: var(--st-cream) !important;
}
html body .style-dark a.st-btn.st-btn--line:hover,
html body a.st-btn.st-btn--line:hover {
  background-color: transparent !important;
  border-color: var(--st-cream) !important;
  color: var(--st-cream) !important;
}

/* ---- One button family (2026-11-03): every filled or outlined form button has st-btn's metrics (components.css):
   50 px tall, 0 1.4em, Sofia 560. Uncode's generated rules set weight 500 and padding 18px 44px with !important,
   four classes deep (.btn:not(…):not(…):not(…)); these selectors are one step stronger. ---- */
html body .wpcf7 form.wpcf7-form input.wpcf7-submit.wpcf7-form-control[type="submit"],
html body form.cart button.single_add_to_cart_button.button.btn,
html body .wc-proceed-to-checkout a.checkout-button.wc-forward.btn,
html body form.checkout #payment button#place_order,
html body .woocommerce-cart-form .coupon button.button[name="apply_coupon"],
html body form.checkout_coupon.woocommerce-form-coupon button.button[name="apply_coupon"],
html body form.woocommerce-shipping-calculator button.button[name="calc_shipping"],
html body .ajax-filter-sidebar .ajax-filter-sidebar-footer a.btn.ajax-filter-sidebar__button {
  min-height: 50px !important;
  height: auto !important;
  padding: 0 1.4em !important;
  font: 560 var(--st-fs-ui)/1.2 var(--st-sans) !important;
  letter-spacing: .012em !important;
  text-transform: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body form.cart button.single_add_to_cart_button.button.btn,
html body .wc-proceed-to-checkout a.checkout-button.wc-forward.btn,
html body form.checkout #payment button#place_order,
html body .woocommerce-cart-form .coupon button.button[name="apply_coupon"],
html body form.checkout_coupon.woocommerce-form-coupon button.button[name="apply_coupon"],
html body form.woocommerce-shipping-calculator button.button[name="calc_shipping"],
html body .ajax-filter-sidebar .ajax-filter-sidebar-footer a.btn.ajax-filter-sidebar__button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
/* Fill changes: in on the enter curve, back on the settle curve */
html body .wpcf7 form.wpcf7-form input.wpcf7-submit.wpcf7-form-control[type="submit"],
html body form.cart button.single_add_to_cart_button.button.btn,
html body .wc-proceed-to-checkout a.checkout-button.wc-forward.btn,
html body form.checkout #payment button#place_order {
  transition: background-color var(--st-exit) var(--st-ease-settle), border-color var(--st-exit) var(--st-ease-settle), color var(--st-exit) var(--st-ease-settle), transform var(--st-instant) ease-out !important;
}
@media (hover: hover) {
  html body .wpcf7 form.wpcf7-form input.wpcf7-submit.wpcf7-form-control[type="submit"]:hover,
  html body form.cart button.single_add_to_cart_button.button.btn:hover,
  html body .wc-proceed-to-checkout a.checkout-button.wc-forward.btn:hover,
  html body form.checkout #payment button#place_order:hover {
    transition-duration: var(--st-quick), var(--st-quick), var(--st-quick), var(--st-instant) !important;
    transition-timing-function: var(--st-ease) !important;
  }
}
/* The shipping calculator's button is a secondary action: the outline, like "Gutschein anwenden" */
html body form.woocommerce-shipping-calculator button.button[name="calc_shipping"] {
  background-color: transparent !important;
  border: 1px solid rgba(236, 228, 214, .45) !important;
  color: var(--st-cream) !important;
}
@media (hover: hover) {
  html body form.woocommerce-shipping-calculator button.button[name="calc_shipping"]:hover { border-color: var(--st-cream) !important; }
}
/* The phone filter panel: "Anzeigen" is its primary step (cream), "Zurücksetzen" the outline beside it */
html body .ajax-filter-sidebar .ajax-filter-sidebar-footer a.btn.ajax-filter-sidebar__button--apply {
  background-color: var(--st-cream) !important;
  border: 1px solid var(--st-cream) !important;
  color: var(--st-label) !important;
}
html body .ajax-filter-sidebar .ajax-filter-sidebar-footer a.btn.ajax-filter-sidebar__button--clear {
  background-color: transparent !important;
  border: 1px solid rgba(236, 228, 214, .45) !important;
  color: var(--st-cream) !important;
}
@media (hover: hover) {
  html body .ajax-filter-sidebar .ajax-filter-sidebar-footer a.btn.ajax-filter-sidebar__button--apply:hover {
    background-color: var(--st-gold) !important;
    border-color: var(--st-gold) !important;
  }
  html body .ajax-filter-sidebar .ajax-filter-sidebar-footer a.btn.ajax-filter-sidebar__button--clear:hover { border-color: var(--st-cream) !important; }
}