/*
 * CSS Overrides — Tille & Venelle
 *
 * Project-wide visual rules layered on top of the main theme stylesheet.
 * Loaded after `hello-elementor-child-style` so source order resolves ties.
 */

/* ===== Default button style =====
   Targets bare <button> and <input type="submit">. :where() keeps specificity
   at 0,0,1 so any class on a button (.mobile-menu-toggle, .tv-search-form__submit,
   future widgets…) wins automatically. `.tv-button-bare` is the explicit opt-out
   for unclassed buttons that should remain unstyled. */
:where(button, input[type="submit"]) {
    background-color: var(--tv-color-green, #66A386);
    color: var(--tv-color-white, #fff);
    border: none;
    padding: var(--tv-space-2) var(--tv-space-4);
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    transition: filter .2s ease;
}

:where(button, input[type="submit"]):hover {
    filter: brightness(0.92);
}

button.tv-button-bare,
input[type="submit"].tv-button-bare {
    all: unset;
    cursor: pointer;
}

/* ===== Main menu : is-highlighted + active in solid mode =====
   In solid mode, an item that is BOTH is-highlighted and current renders as a
   dark green pill with white text (overrides the light-green pill set by the
   plain is-highlighted rule in style.css l.240-245). Transparent mode keeps
   the existing white-pill / dark-green-text rendering. The ::before bar is
   already suppressed for any is-highlighted item by style.css l.248. */
body.has-solid-header .menu--main .is-highlighted.current-menu-item > a,
body.has-solid-header .menu--main .is-highlighted.current-menu-ancestor > a {
    background: var(--tv-color-green-dark, #315B47);
    color: var(--tv-color-white, #fff);
}

/* ===== Top menu : active / hover / inactive =====
   Inactive items get permanent white side borders so layout stays stable when
   the active state swaps them to light green. The flex gap is removed so
   adjacent borders touch; horizontal padding on each link keeps the text
   away from its own borders. */
.menu--top {
    gap: 0;
}

.menu--top li > a {
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
    box-sizing: border-box;
    padding-left: var(--tv-space-3);
    padding-right: var(--tv-space-3);
}

.menu--top .current-menu-item > a,
.menu--top .current-menu-ancestor > a {
    border-color: var(--tv-color-green, #66A386);
    color: var(--tv-color-green, #66A386);
}

.menu--top li > a:hover {
    color: var(--tv-color-green, #66A386);
}