/* color mode */
.color-mode .dropstart .dropdown-toggle:before{
    display: none;
}
.color-mode .dropdown-menu.show {
    display: block !important;
}

.color-mode .dropdown-menu {
    display: none !important;
    z-index: 9999;
}

.color-mode .dropdown .btn {
    border: none;
}

.color-mode .dropdown-toggle:after {
    display: none;
}

/* ==========================================================
   Agendy brand overrides (feature/agendy-public-arculat)
   ========================================================== */
.agendy-page-title {
    background: linear-gradient(120deg, #292dc2 0%, #0084e9 100%);
}
.agendy-page-title h1 { color: #fff; }
.agendy-page-title ul li a,
.agendy-page-title ul li { color: rgba(255,255,255,0.75); }
.agendy-page-title ul li a:hover { color: #fff; }

.agendy-bw {
    max-width: 960px;
    margin: 0 auto;
}
.agendy-bw__head { text-align: center; margin-bottom: 2.5rem; }
.agendy-bw__title { color: #1f194c; font-weight: 600; }
.agendy-bw__subtitle { color: #575a7b; }
.agendy-bw__group-title { font-size: 1.05rem; font-weight: 600; color: #292dc2; margin: 1.5rem 0 .75rem; }
.agendy-bw__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.agendy-bw__card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #fff;
    border: 1px solid #ececf6;
    border-radius: 14px;
    padding: 1.1rem 1.4rem;
    flex-wrap: wrap;
}
.agendy-bw__card-name { display: block; font-weight: 600; color: #1f194c; }
.agendy-bw__card-desc { display: block; color: #9497b8; font-size: .9rem; margin-top: .2rem; }
.agendy-bw__card-meta { display: flex; align-items: center; gap: 1rem; }
.agendy-bw__card-dur { color: #9497b8; font-size: .85rem; }
.agendy-bw__card-price { font-weight: 600; color: #292dc2; }
.agendy-bw__pick {
    background: #292dc2;
    color: #fff;
    border: none;
    border-radius: 30px;
    padding: .5rem 1.3rem;
    font-weight: 500;
    font-size: .9rem;
}
.agendy-bw__pick:hover { background: #0084e9; }
.agendy-bw__empty { text-align: center; color: #9497b8; padding: 3rem 0; }
.agendy-bw__card-main { display: flex; flex-direction: column; }

/* booking panel -- date/slot picker + contact form (step 2) */
.agendy-bw__panel {
    background: #fff;
    border: 1px solid #efefef;
    border-radius: 16px;
    box-shadow: 0 5px 10px rgba(0, 9, 128, 0.035), 0 7px 18px rgba(0, 9, 128, 0.05);
    padding: 2rem;
    margin-top: 1.5rem;
}
.agendy-bw__back {
    background: none;
    border: 0;
    color: #292dc2;
    font-weight: 500;
    cursor: pointer;
    padding: 0;
    margin-bottom: 1.25rem;
}
.agendy-bw__panel-title { color: #1f194c; font-weight: 600; margin-bottom: 1.25rem; }
.agendy-bw__step { margin-bottom: 1.5rem; }
.agendy-bw__label { display: block; color: #1f194c; font-weight: 500; font-size: .9rem; margin-bottom: .4rem; }
.agendy-bw__date {
    padding: 10px 14px;
    border: 1px solid #dcdcec;
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
    color: #1f194c;
}
.agendy-bw__date:focus { outline: none; border-color: #292dc2; }

.agendy-bw__slots { margin-bottom: 1.5rem; }
.agendy-bw__hint { color: #9497b8; text-align: center; padding: 1rem 0; }
.agendy-bw__slot-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(84px, 1fr));
    gap: .6rem;
}
.agendy-bw__slot {
    background: #fbfbff;
    border: 1px solid #dcdcec;
    border-radius: 10px;
    padding: .55rem .5rem;
    font-weight: 500;
    color: #1f194c;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.agendy-bw__slot:hover { border-color: #292dc2; color: #292dc2; }
.agendy-bw__slot.is-selected { background: #292dc2; border-color: #292dc2; color: #fff; }

.agendy-bw__form-title { color: #1f194c; font-weight: 600; font-size: 1rem; margin: 1.5rem 0 1rem; }
.agendy-bw__field { margin-bottom: 1.1rem; display: flex; flex-direction: column; gap: 6px; }
.agendy-bw__field label { color: #1f194c; font-weight: 500; font-size: .9rem; }
.agendy-bw__field input {
    padding: 12px 14px;
    border: 1px solid #dcdcec;
    border-radius: 10px;
    font-size: 15px;
    font-family: inherit;
}
.agendy-bw__field input:focus { outline: none; border-color: #292dc2; }
.agendy-bw__chosen-slot { color: #575a7b; font-size: .9rem; margin-bottom: 1rem; }
.agendy-bw__submit {
    background: #292dc2;
    background: linear-gradient(-45deg, #292dc2, #0084e9);
    color: #fff;
    border: 0;
    border-radius: 30px;
    padding: 13px 28px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}
.agendy-bw__submit:disabled { opacity: .5; cursor: not-allowed; }
.agendy-bw__submit:not(:disabled):hover { opacity: .9; }
.agendy-bw__result { margin-top: 1.5rem; text-align: center; color: #1f194c; }

/* pricing cards -- make the "+ ÁFA" (net price) label clearly visible next to the big price,
   not just present in the markup (Roland/tars R2: don't let it read as the final price). */
.pricing-table .price-plan span {
    display: block;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .4px;
    color: #292dc2;
    margin-top: .35rem;
}

/* header account nav (R5) -- .attr-nav > ul > li > a defaults to #fff (built for a dark/
   transparent hero header); our navbar is light, so the plain login link needs an explicit
   dark color or it's invisible white-on-white. */
.attr-nav .agendy-nav-login {
    color: #1f194c !important;
    font-weight: 500;
    padding: 21px 15px;
}
.attr-nav .agendy-nav-login:hover { color: #292dc2 !important; }

/* Mobile: the theme's #nav dropdown is position:absolute (~232px tall for our 5-item menu),
   so .attr-nav (normal flow, float:left) renders at the same top offset and overlaps it --
   the original theme only ever put 1-2 small icons in .attr-nav, never full buttons+text.
   Push .attr-nav below the open dropdown and lay our 3 items out as a clean stacked block. */
@media (max-width: 991px) {
    .attr-nav .agendy-nav-login { padding: 10px 0; display: inline-block; }
    .navbar-header-custom ~ .attr-nav,
    .menu_area .attr-nav {
        float: none;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        margin: 0 0 20px;
        padding: 0 12px;
        width: 100%;
    }

    /* The 245px above was unconditional, but the dropdown it clears only exists
       while the burger is OPEN -- closed, it left 245px of empty header on every
       mobile page load, measured: header 426px tall on a 844px screen, pushing
       the hero CTA to 97% of the viewport. Scope it to the open state instead.
       The theme marks that on both the menu (ul.navbar-nav.open) and the burger
       (.navbar-toggler.menu-opened); either match is enough, both are listed so
       one renamed class does not silently bring the overlap back. Measured with
       the menu open: dropdown 71..304, buttons start at 313. */
    .menu_area:has(.navbar-nav.open) .attr-nav,
    .menu_area:has(.navbar-toggler.menu-opened) .attr-nav {
        margin-top: 245px;
    }
    .attr-nav > ul { display: flex; flex-direction: column; gap: 10px; width: 100%; }
    .attr-nav > ul > li { display: block; width: 100%; }
    .attr-nav > ul > li > a.butn { display: block; text-align: center; }
}

/* Mobile hero: measured at 390x844, the "Foglaljon időpontot" CTA sat at 97% of
   the viewport height, so the bottom-pinned consent bar covered it.

   Note what is NOT touched here: the hero's padding-TOP. .header-position pulls
   the hero up by 71px below 991px, so of the 100px top padding only 29px is
   actual clearance under the nav -- cutting it is how the headline ends up
   behind the navbar. The three levers below are all below the fold line. */
@media (max-width: 767px) {
    /* 1. The intro paragraph is 90% wide (.w-90). Its counterpart .w-md-80 only
       applies from 768px up, so under that the missing 10% buys nothing except
       an extra wrapped line. */
    .main-banner-style02 .header-text p {
        width: 100%;
    }

    /* 2. Hero bottom padding: the <=991px rule sets `100px 0 50px 0`. */
    .main-banner-style02 {
        padding-bottom: 24px;
    }

    /* 3. Headline: 27.85px/33.42px across three lines is more than a phone
       needs, and it is the tallest single block in the hero. */
    .main-banner-style02 .header-text h1 {
        font-size: 24px;
        line-height: 29px;
    }
}