/* Group Lessons Booking — participant configurator (design handoff recreation) */
:root {
    --lgg-teal: #30DDC9;
    --lgg-teal-dark: #158174;
    --lgg-teal-tint: #EAFFFC;
    --lgg-teal-chip: #BCF4EE;
    --lgg-teal-accent: #1EB4A2;
    --bs-primary: #158174;
    --bs-primary-rgb: 21, 129, 116;
    --bs-body-color: #000000;
    --bs-body-color-rgb: 0, 0, 0;
    --bs-secondary-color: #616161;
    --bs-secondary-color-rgb: 97, 97, 97;
}

body {
    font-family: "Mona Sans", sans-serif;
}

.text-teal { color: var(--lgg-teal) !important; }
.text-teal-dark {color: var(--lgg-teal-dark)!important;}
.text-teal-accent {color: var(--lgg-teal-accent)!important;}

.form-control,
.form-select {
    padding: 13px;
    background-color: #FFFFFF;
    border: solid 2px #ECECEC;
    border-radius: 8px;
}

.lgg-page { margin-top: 86px;background: #ffffff; }

/* Navbar */
.lgg-navbar { position: fixed;left: 0;top: 0;width: 100%;background: #ffffff; border-bottom: 1px solid #dee2e6;box-shadow: 0px 3px 6px #00000029;z-index: 999; }
.lgg-brand { color: var(--lgg-teal) !important; }
.lgg-brand > img { max-height: 37px; }
.lgg-nav-link { font-weight: 500; color: #212529; text-decoration: none; }
.lgg-nav-link:hover { color: var(--lgg-teal); }
.lgg-nav-link.active { color: var(--lgg-teal-accent); font-weight: 600; }
.lgg-cart-icon {position: relative;}
.lgg-cart-icon > span {position: absolute; top: 0; right: 0; font-size: 0.75rem; color: #000000; display: inline-flex; width: 25px; height: 25px; background-color: #30DDC9; border: solid 3px #FFFFFF; border-radius: 50%; transform: translate(50%, -50%); align-items: center; justify-content: center; }
.lgg-avatar { width: 36px; height: 36px; font-size: 13px; color: #616161; background-color: #CFE9E7; border: solid 2px transparent; }
.lgg-avatar.logged { border-color: var(--lgg-teal); }

.lgg-account-menu {
    border: 2px solid var(--lgg-teal); border-radius: .75rem; min-width: 260px;
    padding: .5rem 0; margin-top: .75rem !important; box-shadow: 0 10px 25px rgba(0,0,0,.08);
}
.lgg-account-menu .dropdown-item { padding: .45rem 1.25rem; font-weight: 500; }
.lgg-account-menu .dropdown-item:hover, .lgg-account-menu .dropdown-item:focus { background: var(--lgg-teal-tint); }
.lgg-account-menu .dropdown-divider { margin: .5rem 0; }

/* Filters summary bar */
.lgg-filters { border: 1px solid #dee2e6; border-radius: .5rem; overflow: hidden; }
.lgg-filter-col { padding: .9rem 1.25rem; border-bottom: 1px solid #dee2e6; }
.lgg-filter-col:last-child { border-bottom: none; }
@media (min-width: 768px) {
    .lgg-filters { display: flex; }
    .lgg-filter-col { flex: 1 1 0; border-bottom: none; border-right: 1px solid #dee2e6; }
    .lgg-filter-col:last-child { border-right: none; }
}

/* Participant accordion */
.lgg-participant-card { border: 2px solid var(--bs-primary); border-radius: 12px; overflow: hidden; }
.lgg-separator { writing-mode: vertical-lr; height: 40px; margin: 0; border: none; border-left: solid 2px #ECECEC; opacity: 1; }
.lgg-toggle-btn {
    width: 40px; height: 40px; padding: 0; border: none; background: transparent;
    border-radius: .5rem; display: flex; align-items: center; justify-content: center;
}
.lgg-toggle-btn .lgg-chevron { transition: transform .2s ease; display: inline-block; }
.lgg-toggle-btn:not(.collapsed) .lgg-chevron { transform: rotate(-180deg); }
.lgg-body { display: none; }
.lgg-body.show { display: block; }

/* Participant chips */
.participant-chip { cursor: pointer; border: 1px solid transparent; color: #000000; font-weight: 500; }
.participant-chip.selected { background: var(--lgg-teal-chip); }
.participant-chip.outlined { border-color: #dee2e6; background: #ffffff; }

/* Level cards */
.lgg-level-scroll { display: flex; gap: .75rem; overflow-x: auto; flex-wrap: wrap; }
.lgg-level-scroll::-webkit-scrollbar { display: none; }
.level-card { cursor: pointer; flex: 0 0 calc(50% - .75rem); }
.level-card.selected { border: 2px solid var(--lgg-teal-dark) !important; background: var(--lgg-teal-tint); }
@media (min-width: 991px) {
    .lgg-level-scroll { gap: 5rem; }
}
@media (min-width: 768px) {
    .lgg-level-scroll { gap: 2.5rem; overflow-x: visible; }
    .level-card { flex: 1 1 0; }
}

.lgg-levels-explain-link:hover { text-decoration: underline !important; }

.recommended-badge, .recommended-badge-sm { background: #F7E09E; color: #000000; }
.recommended-badge { font-size: 11px; }
.recommended-badge-sm { font-size: 9.5px; }

/* Package cards */
.lgg-pkg-scroll { display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x mandatory; }
.lgg-pkg-scroll::-webkit-scrollbar { display: none; }
.pkg-card { cursor: pointer; flex: 0 0 260px; scroll-snap-align: start; }
.pkg-card.selected { border: 2px solid var(--lgg-teal-dark) !important; background: var(--lgg-teal-tint); }
.pkg-card img { max-width: 65px; }
@media (min-width: 768px) {
    .lgg-pkg-scroll { gap: 2.5rem; overflow-x: visible; scroll-snap-type: none; }
    .pkg-card { flex: 1 1 0; scroll-snap-align: none; }
}

.pkg-radio {
    width: 22px; height: 22px; border: 1px solid #d1d5db;
    display: flex; align-items: center; justify-content: center; font-size: 13px;
}
.pkg-radio.selected { background: var(--lgg-teal); border: none; color: #000000; }

.badge-level { background: var(--lgg-teal-dark); color: #fff; }

.lgg-dots { display: flex; gap: 1.5rem; justify-content: center; }
.dot { width: 12px; height: 12px; background: #000000; }
.dot.selected { background: var(--lgg-teal); }

.lgg-privacy-check {
    -webkit-appearance: none;
    appearance: none;
    width: 13px;
    height: 13px;
    margin: 0;
    margin-top: 1px;
    padding: 0;
    flex-shrink: 0;
    border: 1px solid #616161;
    border-radius: 0;
    background-color: #ffffff;
    cursor: pointer;
}
.lgg-privacy-check:checked { background-color: var(--lgg-teal); border-color: var(--lgg-teal); }
.lgg-privacy-check.is-invalid { border-color: #dc3545; }

.lgg-consent-box { display: flex; flex-direction: column; gap: .6rem; }
.lgg-consent-row label { line-height: 1.35; cursor: pointer; font-size: 12px; }
.lgg-consent-row label a { color: var(--lgg-teal-dark); }

.btn-outline-dark:hover svg,
.btn-outline-dark:focus svg { stroke: #ffffff; }

.btn-teal { background: var(--lgg-teal); border-color: var(--lgg-teal); color: #fff; }
.btn-teal:hover { background: var(--lgg-teal-dark); border-color: var(--lgg-teal-dark); color: #fff; }
.btn-teal:disabled { background: #ECECEC; border-color: transparent; color: #000000!important; opacity: 1; }
.btn-teal.lgg-btn-idle,
.btn-teal.lgg-btn-idle:hover { background: #ECECEC; border-color: transparent; color: #000000!important; cursor: pointer; }

/* Floating subtotal bar */
/* right offset aligns the bar with the right edge of the centered .container above 767px (Bootstrap container max-widths) */
.lgg-subtotal-bar { position: fixed; z-index: 1030; bottom: 1rem; right: 1rem; }
@media (max-width: 767px) {
    .lgg-subtotal-bar { left: 1rem; right: 1rem; max-width: 358px; margin-left: auto; margin-right: auto; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .lgg-subtotal-bar { right: calc((100vw - 720px) / 2); }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .lgg-subtotal-bar { right: calc((100vw - 960px) / 2); }
}
@media (min-width: 1200px) and (max-width: 1399px) {
    .lgg-subtotal-bar { right: calc((100vw - 1140px) / 2); }
}
@media (min-width: 1400px) {
    .lgg-subtotal-bar { right: calc((100vw - 1320px) / 2); }
}

.lgg-footer {
    position: relative;
    overflow: hidden;
    margin-top: 4rem;
    border-radius: 70px 70px 0 0;
    background-image: url("../../img/bg_footer.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    color: #ffffff;
}
.lgg-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: #000000DB;
    pointer-events: none;
}
.lgg-footer-inner { position: relative; text-align: center; z-index: 1; }
.lgg-footer-logo-icon { height: 40px; }
.lgg-footer-brand { font-family: "Protest Strike", sans-serif; font-size: 1.5rem; letter-spacing: .5px; text-transform: uppercase; color: #ffffff; }
.lgg-footer-contact a { display: block; width: max-content; margin: auto; color: #FFFFFF; font-size: .9rem; text-decoration: none; }
.lgg-footer-contact a:hover { color: var(--lgg-teal); }
.lgg-footer-cta {
    background: var(--lgg-teal); color: #000000; font-weight: 700; font-size: .9rem;
    padding: .4rem 1.5rem .4rem .4rem; border-radius: 50rem;
}
.lgg-footer-cta-icon {
    width: 32px; height: 32px; flex-shrink: 0; background: #000000; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
}
.lgg-footer-heading {
    font-family: "Protest Strike", sans-serif; font-weight: normal; text-transform: uppercase;
    font-size: 1.6rem; line-height: 1.1; color: #ffffff;
}
.lgg-footer-social {
    width: 40px; height: 40px; flex-shrink: 0; background: var(--lgg-teal); border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
}
.lgg-footer-bottom { position: relative; z-index: 1; background-color: #000000; border-top: 1px solid rgba(255,255,255,.12); font-size: .75rem; color: #FFFFFF; }
@media (min-width: 768px) {
    .lgg-footer-heading { font-size: 2.1rem; }
}
@media (min-width: 992px) {
    .lgg-footer-inner { text-align: start; }
    .lgg-footer-contact a { margin: 0; }
    .lgg-footer-heading { font-size: 2.75rem; line-height: 1.05; }
}

/* Lessons hub (choose type of lessons) */
.lgg-page-title {
    font-family: "Protest Strike", sans-serif;
    font-size: 2rem;
    font-weight: normal;
    text-transform: uppercase;
    line-height: 1.15;
    text-align: center;
}
@media (min-width: 768px) {
    .lgg-page-title { font-size: 4rem; text-align: start; }
}

.lgg-lesson-card { background: #000000; padding: 10px; }
.lgg-lesson-card-img { width: 100%; height: 260px; object-fit: cover; border-radius: 16px; display: block; }
.lgg-most-popular {
    position: absolute; top: 16px; left: 16px; background: #ffffff; color: #000000;
    font-size: 11px; font-weight: 700; letter-spacing: .5px; padding: 6px 14px;
}
.lgg-lesson-card-body { padding: 20px 14px 24px; }
.lgg-lesson-card-title { font-family: "Protest Strike", sans-serif; font-size: 2.5rem; font-weight: normal; }
.lgg-lesson-card-list { display: flex; flex-direction: column; gap: .4rem; }
.lgg-lesson-card-list li { color: #ffffff; display: flex; align-items: center; gap: .5rem; font-size: .9rem; }
.lgg-lesson-card-cta { padding: 6px 22px 6px 6px; }
.lgg-cta-icon { width: 32px; height: 32px; background: #000000; flex-shrink: 0; }

.lgg-feature-row { border-top: 1px solid #dee2e6; padding-top: 1.25rem; }
.lgg-feature-col {
    display: flex; flex-direction: column; align-items: center; text-align: center;
    gap: .35rem; padding: .25rem .4rem; border-right: 1px dashed #cbd5e1;
}
.lgg-feature-col:last-child { border-right: none; }
.lgg-feature-icon { width: 30px; height: 30px; flex-shrink: 0; }
.lgg-feature-title { font-size: .78rem; line-height: 1.2; }
.lgg-feature-desc { display: none; }
@media (min-width: 992px) {
    .lgg-feature-row { padding-top: 1.75rem; }
    .lgg-feature-col { flex-direction: row; align-items: center; text-align: left; gap: .75rem; padding: .5rem 1.25rem; }
}
@media (min-width: 768px) {
    .lgg-feature-icon { width: 40px; height: 40px; }
    .lgg-feature-title { font-size: 1rem; }
    .lgg-feature-desc { display: block; }
}
@media (max-width: 767px) {
    .lgg-feature-col img {max-height: 35px}
}

/* Cart */
.lgg-cart-title {
    font-family: "Protest Strike", sans-serif;
    font-size: 2.5rem;
    font-weight: normal;
    text-transform: uppercase;
}

.lgg-cart-card { position: relative; border: 1px solid #dee2e6; border-radius: .75rem; padding: 1.25rem 1.5rem; background: #ffffff; }
.lgg-cart-avatar { width: 40px; height: 40px; flex-shrink: 0; }
.lgg-cart-remove, .lgg-cart-remove-private { color: #616161; text-decoration: none; font-size: .875rem; }
.lgg-cart-remove:hover, .lgg-cart-remove-private:hover { color: #000000; text-decoration: underline; }
.lgg-cart-price { font-size: 1.1rem; font-weight: 600; color: #000000; white-space: nowrap; }
.lgg-cart-edit { color: var(--lgg-teal-dark); text-decoration: none; font-weight: 600; font-size: .9rem; white-space: nowrap; }
.lgg-cart-edit:hover { color: #000000; text-decoration: underline; }
.lgg-cart-divider { border: none; border-top: 1px dashed #3E3A3B; opacity: 1; }

.lgg-badge-type {
    background: var(--lgg-teal-dark); color: #ffffff; font-weight: 600; font-size: .875rem;
    padding: .35rem .9rem; border-radius: .5rem; display: inline-block;
}
.lgg-badge-outline {
    background: #ffffff; color: var(--lgg-teal-dark); font-weight: 600; font-size: .875rem;
    padding: .3rem .9rem; border: 2px solid var(--lgg-teal-dark); border-radius: .5rem; display: inline-block;
}
.lgg-badge-status {
    background: #ececec; color: #616161; font-weight: 700; font-size: .875rem;
    padding: .35rem .9rem; border-radius: 50rem; display: inline-block;
}

.lgg-summary-card { border: 1px solid #dee2e6; border-radius: .75rem; overflow: hidden; background: #ffffff; }
.lgg-summary-title { text-align: center; font-weight: 700; text-transform: uppercase; padding: 1.25rem 1.25rem .5rem; letter-spacing: .5px; }
.lgg-summary-row { display: flex; justify-content: space-between; align-items: flex-start; padding: .85rem 1.25rem; gap: 1rem; }
.lgg-summary-divider { border: none; border-top: 1px dashed #3E3A3B; margin: 0 1.25rem; opacity: 1; }
.lgg-summary-deposit { background: var(--lgg-teal); padding: 1.1rem 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
#checkoutSubmit:disabled { background-color: #616161; border-color: #616161; opacity: 1; }

.lgg-discount-card {
    background: var(--lgg-teal-tint); border-radius: .75rem; padding: 1rem 1.25rem;
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    color: #000000; font-weight: 600; cursor: pointer;
}
.lgg-discount-chevron { transition: transform .2s ease; }
.lgg-discount-chevron.open { transform: rotate(180deg); }
.lgg-discount-body { display: none; }
.lgg-discount-body.show { display: block; }

@media (max-width: 767px) {
    .lgg-cart-card { padding: 2.5rem 1.5rem 1.25rem; }
    .lgg-cart-edit { position: absolute; top: 1.25rem; right: 1.5rem; }
}

/* Checkout */
.lgg-login-banner { background: var(--lgg-teal-tint); border-radius: 0.5rem; padding: 1rem 1.5rem; box-shadow: 0 3px 6px #00000029; }

.lgg-invoice-tab { color: #000000; text-decoration: none; padding-right: 1.5rem; padding-bottom: .35rem; }
.lgg-invoice-tab.active { color: var(--lgg-teal-accent); }

#lggInvoiceTabs .lgg-invoice-tab:not(:last-child) {border-right: solid 2px #ECECEC;}

.lgg-choice-check { display: none; margin-right: .3rem; vertical-align: -2px; }
.lgg-invoice-tab.active .lgg-choice-check { display: inline-block; }

.lgg-payment-card { border: 2px solid #dee2e6; border-radius: .75rem; padding: 1.25rem 1.5rem; background: #ffffff; cursor: pointer; }
.lgg-payment-card.selected { border: 2px solid var(--lgg-teal-dark) !important; background: var(--lgg-teal-tint); }

.lgg-recommended-badge { background: #F7E09E; color: #000000; font-weight: 600; font-size: .75rem; padding: .4rem .8rem; }

.lgg-payment-icons { flex-shrink: 0; flex-wrap: wrap; }
.lgg-pay-icon {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 40px; height: 26px; padding: 0 .4rem; border: 1px solid #dee2e6; border-radius: .3rem;
    font-size: .7rem; font-weight: 700; color: #212529; background: #ffffff;
}
.lgg-pay-icon-dark { background: #111827; color: #ffffff; }
.lgg-pay-icon-visa { color: #1a1f71; font-style: italic; }
.lgg-pay-icon-mc { gap: -6px; position: relative; width: 40px; }
.lgg-mc-circle { width: 14px; height: 14px; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%); }
.lgg-mc-circle-1 { background: #eb001b; left: 8px; }
.lgg-mc-circle-2 { background: #f79e1b; left: 16px; opacity: .8; }

.lgg-note-bullet { width: 8px; height: 8px; margin-top: .4rem; background: var(--lgg-teal); border-radius: 2px; }

/* Mobile fixed payment bar (cart / checkout) */
@media (max-width: 1399px) {
    .lgg-invoice-tab { padding-right: 1rem; }
}
@media (max-width: 1199px) {
    .lgg-invoice-tab { padding-right: .5rem; }
}
@media (max-width: 767px) {
    .lgg-cart-page-content, .lgg-checkout-page-content { padding-bottom: 90px; }
    .lgg-invoice-tab { display: block; }
    #lggInvoiceTabs .lgg-invoice-tab:not(:last-child) {border-right: none;}
}
.lgg-mobile-payment-bar {
    position: fixed; z-index: 1030; bottom: 1rem; left: 1rem; right: 1rem;
    background: var(--lgg-teal); border-radius: 50rem; padding: .6rem .6rem .6rem 1.25rem;
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
}

/* Order summary: sticky solo nel layout a due colonne (cart / checkout), sotto la navbar fissa (86px) */
@media (min-width: 992px) {
    .lgg-order-summary-col { position: sticky; top: 100px; align-self: flex-start; }
}

/* Filters modal */
.lgg-filters { cursor: pointer; }

.lgg-modal-content { border: none; border-radius: 1rem; }
.lgg-modal-close {
    position: absolute; top: 1.25rem; right: 1.25rem; width: 32px; height: 32px; padding: 0;
    border: none; background: none; display: flex; align-items: center; justify-content: center; z-index: 1;
}
.lgg-modal-select { font-weight: 600; padding: 0; border: none; }
.lgg-modal-row { display: flex; align-items: center; gap: .75rem; padding: 1rem 0; border-bottom: 1px solid #dee2e6; }
.lgg-modal-row img { width: 20px; }
.lgg-modal-chevron { margin-left: auto; }

.lgg-chip-option {
    border: 2px solid #dee2e6; border-radius: 50rem; padding: .4rem 1.1rem;
    font-weight: 700; font-size: .75rem; color: #000000; background: #ffffff; cursor: pointer;
}
.lgg-chip-option.selected { border-color: var(--lgg-teal-dark); background: var(--lgg-teal-tint); }
.lgg-chip-option.lgg-chip-week { width: 120px; text-align: center; }

.lgg-modal-error { color: #dc3545; }

.lgg-btn-confirm { background: var(--lgg-teal); color: #000000; border: none; }
.lgg-btn-confirm:hover { background: #e0e0e0; color: #000000; }
.lgg-btn-confirm:disabled { background: #ECECEC; color: #000000; }

@media (max-width: 767px) {
    .lgg-btn-confirm { width: 100%; }
}

/* Levels explanation modal: tabs + accordion */
.lgg-levels-tabs .nav-link { font-weight: 600; color: #616161; border: none; border-bottom: 3px solid transparent; padding: .6rem 1rem; }
.lgg-levels-tabs .nav-link.active, .lgg-levels-tabs .nav-link:hover { color: var(--lgg-teal-dark); border-color: var(--lgg-teal-dark); background: transparent; }

.lgg-levels-video { border-radius: .75rem; overflow: hidden; }

.lgg-levels-accordion .accordion-button { font-weight: 600; }
.lgg-levels-accordion .accordion-button:not(.collapsed) { color: var(--lgg-teal-dark); background: var(--lgg-teal-tint); box-shadow: none; }
.lgg-levels-accordion .accordion-button:focus { box-shadow: none; border-color: #dee2e6; }
.lgg-levels-accordion .accordion-body ul { padding-left: 1.1rem; }

/* Payment successful */
.lgg-booking-ref { background: var(--lgg-teal); color: #000000; letter-spacing: 2px; }
.lgg-next-steps { background: #f8f9fa; }
.lgg-cta-btn { width: 100%; }
@media (min-width: 576px) {
    .lgg-cta-btn { width: auto; }
}

/* Private lessons — weekly availability grid (lesson_private.php) */
.lpv-week-input-group .form-control { border-radius: 0; }
.lpv-week-input-group .btn { border: solid 2px #ECECEC; }

.lpv-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(140px, 1fr));
    gap: .75rem;
    overflow-x: auto;
}
@media (max-width: 991px) {
    .lpv-week-grid { grid-auto-flow: column; grid-template-columns: none; }
    .lpv-week-grid .lpv-day-col { width: 160px; flex: 0 0 auto; }
}

.lpv-day-col { border: 1px solid #dee2e6; border-radius: .5rem; overflow: hidden; }
.lpv-day-head { background: #f8f9fa; padding: .6rem .75rem; border-bottom: 1px solid #dee2e6; text-align: center; }
.lpv-day-name { font-weight: 700; letter-spacing: .5px; }
.lpv-day-body { padding: .6rem; display: flex; flex-direction: column; gap: .5rem; min-height: 60px; }
.lpv-day-status { text-align: center; padding: .75rem 0; }

.lpv-slot {
    border: 1px solid #dee2e6; border-radius: .5rem; padding: .5rem .65rem;
    display: flex; flex-direction: column; gap: .2rem; background: #ffffff;
}
.lpv-slot-time { font-size: .85rem; }
.lpv-slot-price { font-size: .8rem; }
.lpv-slot-badge {
    align-self: flex-start; border-radius: .3rem; padding: .1rem .5rem;
    font-size: .7rem; font-weight: 700;
}

/* Private lessons — weekly availability as day rows (design handoff recreation, template/lesson_private.php) */
.lpv2-week-list { display: flex; flex-direction: column; gap: .65rem; }
.lpv2-day-row { border: 1px solid #dee2e6; border-radius: .5rem; background: #ffffff; overflow: hidden; }
.lpv2-day-header {
    display: flex; align-items: center; justify-content: space-between;
    background: #f8f9fa; padding: .75rem 1rem;
}
.lpv2-day-name { font-weight: 700; letter-spacing: .5px; text-transform: uppercase; }
.lpv2-day-body { padding: 1rem; }
/* same mechanism as .lgg-pkg-scroll/.pkg-card above: native horizontal scroll-snap on mobile (no JS show/hide),
   plain wrapping flex row on desktop */
.lpv2-slots { display: flex; gap: .6rem; overflow-x: auto; scroll-snap-type: x mandatory; }
.lpv2-slots::-webkit-scrollbar { display: none; }
.lpv2-slot {
    flex: 0 0 calc(50% - .3rem); scroll-snap-align: start;
    border: 1px solid #dee2e6; border-radius: .5rem; padding: .55rem .75rem;
    cursor: pointer; background: #ffffff; user-select: none;
}
.lpv2-slot:hover { border-color: #adb5bd; }
.lpv2-slot.selected { border: 2px solid var(--lgg-teal-dark); background: var(--lgg-teal-tint); padding: calc(.55rem - 1px) calc(.75rem - 1px); }
.lpv2-slot-time { font-size: .85rem; }
.lpv2-slot-price { font-size: .8rem; color: #000000; }
.lpv2-slot-status { font-size: .72rem; font-weight: 600; }
.lpv2-slot-status.status-available { color: #2E7D32; }
.lpv2-slot-status.status-low { color: #B98900; }

#lpvSelectionSummary { background-color: #ECECEC; }

/* first participant is mandatory: no mobile remove row for it (desktop keeps its inline Remove) */
.lpv-first-participant .lpv-mobile-remove-row { display: none !important; }
@media (min-width: 768px) {
    .lpv2-day-row { display: flex; align-items: flex-start; gap: 1.25rem; padding: .9rem 1rem; }
    .lpv2-day-header { display: block; background: none; padding: 0; width: 70px; flex-shrink: 0; }
    .lpv2-day-body { padding: 0; flex: 1 1 auto; }
    .lpv2-slots { overflow-x: visible; scroll-snap-type: none; flex-wrap: wrap; }
    .lpv2-slot { flex: 0 0 auto; min-width: 118px; scroll-snap-align: none; }
}

/* Customer account — my bookings overview (design handoff recreation, template/account_bookings.php) */
.lgg-account-hero {
    position: relative;
    overflow: hidden;
    background-image: url("../../img/bg_footer.png");
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    color: #ffffff;
    border-radius: 0 0 8px 8px;
}
.lgg-account-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, var(--lgg-teal-dark) 0%, var(--lgg-teal-accent) 100%);
    opacity: .92;
    pointer-events: none;
}
.lgg-account-hero > .container { position: relative; z-index: 1; }
.lgg-account-hero-avatar {
    width: 50px; height: 50px; flex-shrink: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.lgg-account-hero-title {
    font-family: "Protest Strike", sans-serif; font-weight: normal; text-transform: uppercase;
    font-size: 2.125rem; line-height: 0.8; color: #ffffff;
}
.lgg-account-hero-subtitle { color: #ffffff; }
.lgg-account-hero-email { font-size: .875rem; color: #ffffff; width: 100%; text-align: right; }
@media (min-width: 768px) {
    .lgg-account-hero-title { font-size: 4rem; }
}

.lgg-account-content { margin-top: 24px; position: relative; z-index: 2; }

.lgg-alert-bar-stack {
    display: flex; flex-direction: column; gap: .75rem;
    margin-top: -65px; /*transform: translateY(-25%);*/
}
.lgg-alert-bar, .lgg-alert-bar-warning {
    position: relative; border-radius: .5rem;
    padding: 1rem 1.5rem; box-shadow: 0 3px 6px #00000029;
}
.lgg-alert-bar { background: #F2E1E0; border-bottom: 5px solid #E8463B; }
.lgg-alert-bar-warning { background: #FBF3DC; border-bottom: 5px solid #EAC761; }
.lgg-alert-bar img, .lgg-alert-bar-warning img, .lgg-alert-bar svg, .lgg-alert-bar-warning svg { width: 20px; height: 20px; }
.lgg-alert-close {
    position: absolute; top: .6rem; right: .6rem; width: 22px; height: 22px; padding: 0;
    border: none; background: none; display: flex; align-items: center; justify-content: center;
}

.lgg-stat-card { height: 100%; border-radius: .75rem; padding: 1rem 1.25rem; text-align: center; }
.lgg-stat-card-success { background: #A5E0A466; }
.lgg-stat-card-warning { background: #EAC76166; }
.lgg-stat-card-neutral { background: #ECECEC66; }
.lgg-stat-number { font-family: "Protest Strike", sans-serif; font-size: 2.5rem; line-height: 1; }
.lgg-stat-label { font-size: 1rem; font-weight: 500; margin-top: .35rem; }

.lgg-participants-card { background: #ffffff; position: relative; }
.lgg-participants-toggle {
    border: 1px solid #dee2e6; border-radius: .75rem; padding: 1rem 1.25rem;
    background: #ffffff; min-height: 100%; cursor: pointer; box-shadow: 0px 3px 6px #00000029;
}
.lgg-participants-toggle[aria-expanded="true"] { border-color: var(--lgg-teal-dark); border-bottom: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.lgg-participants-icon {
    width: 50px; height: 50px; border-radius: 50%; flex-shrink: 0;
}
.lgg-participants-chevron img { width: 13px; height: 8px; transition: transform .2s ease; }
.lgg-participants-toggle[aria-expanded="true"] .lgg-participants-chevron img { transform: rotate(180deg); }

.lgg-participants-panel {
    display: none; position: absolute; top: 100%; left: 0; right: 0; z-index: 20;
    background: #ffffff; border: 1px solid var(--lgg-teal-dark); border-top: none;
    border-radius: 0 0 .75rem .75rem; padding: .75rem; box-shadow: 0 10px 25px rgba(0,0,0,.1);
}
.lgg-participants-item {
    display: flex; align-items: center; gap: .5rem; border: 1px solid #dee2e6; border-radius: .5rem;
    padding: .5rem .75rem; font-size: .85rem; font-weight: 500; background: #ffffff;
}
.lgg-participants-item + .lgg-participants-item { margin-top: .5rem; }
.lgg-participants-item img { width: 13px; height: 13px; }

.lgg-account-section-title { font-family: "Protest Strike", sans-serif; text-transform: uppercase; font-size: 2rem; }

.lgg-booking-card { border: 1px solid #dee2e6; border-radius: .75rem; padding: 1.25rem 1.5rem; background: #ffffff; box-shadow: 0px 3px 6px #00000029; }
.lgg-booking-card .lgg-cart-edit { color: #616161; }
.lgg-booking-card-active { border: 3px solid var(--lgg-teal); }
.lgg-booking-card-past { background: #FAFAFA; }
.lgg-booking-title { color: var(--lgg-teal-dark); font-weight: 600; font-size: 1.05rem; }
.lgg-booking-card-past .lgg-booking-title { color: #616161; }
.lgg-booking-card-past .lgg-badge-outline { color: #616161; border-color: #616161; }
.lgg-booking-date { color: #000000; font-size: .8rem; }
.lgg-booking-hint { color: #616161; }
.lgg-booking-note-success { color: var(--lgg-teal-dark); font-weight: 600; font-size: .875rem; }
.lgg-booking-note-danger { color: #E8463B; font-weight: 600; font-size: .875rem; }
.lgg-booking-note-danger img { width: 14px; height: 14px; }
.lgg-booking-note-warning { color: #8a6d1f; font-weight: 600; font-size: .875rem; }
.lgg-booking-note-warning img, .lgg-booking-note-warning svg { width: 14px; height: 14px; }

.lgg-status-pill {
    font-weight: 700; font-size: .75rem; letter-spacing: .3px; text-transform: uppercase;
    padding: .35rem .9rem; border-radius: 50rem; display: inline-block; white-space: nowrap;
}
.lgg-status-active { background: #A5E0A4; color: #000000; }
.lgg-status-upcoming { background: #EAC761; color: #000000; }
.lgg-status-completed { background: #ECECEC; color: #000000; }

/* Booking detail (design handoff recreation, template/account_booking.php) */
.lgg-detail-section-title { font-weight: 700; font-size: 1.15rem; margin-bottom: 1rem; }
.lgg-summary-deposit-paid { justify-content: center; }
.lgg-summary-due { color: #E8463B; }

/* Profile & account settings (design handoff recreation, template/account_profile.php) */
.lgg-form-section-label {
    display: block; color: var(--lgg-teal-dark); font-weight: 700; font-size: .8rem;
    text-transform: uppercase; letter-spacing: .5px; margin-bottom: 1rem;
}

@media (max-width: 767px) {
    .lgg-alert-bar-stack {
        position: fixed; bottom: 30px; left: .75rem; right: .75rem; z-index: 900;
        margin-top: 0 !important; margin-bottom: 0 !important; transform: none;
    }
    .lgg-alert-bar-stack .btn { padding: .5rem 1.1rem; font-size: .85rem; }

    .lgg-account-hero-avatar { width: 44px; height: 44px; }

    .lgg-stat-card { padding: .65rem .4rem; }
    .lgg-stat-number { font-size: 1.5rem; }
    .lgg-stat-label { font-size: .65rem; line-height: 1.2; }

    .lgg-participants-toggle { padding: .65rem 1rem; }
    .lgg-participants-icon { width: 32px; height: 32px; }

    .lgg-account-section-title { font-size: 1.4rem; }

    .lgg-booking-card { position: relative; padding: 1rem 1.1rem; }

    /* title takes the full row width so the badges wrap onto their own line below it, instead of
       squeezing next to the title on the same line (see mat/Immagine 2026-08-07 143628.png) */
    .lgg-booking-title { display: block; width: 100%; margin-bottom: .5rem; }

    /* status pill pinned to the card's top-right corner regardless of how tall the title/badges
       block grows */
    .lgg-booking-card .lgg-status-pill { position: absolute; top: 1rem; right: 1.1rem; }
    .lgg-status-pill + .lgg-booking-hint { margin-top: 1.6rem; }

    /* undo the cart page's mobile rule that pins .lgg-cart-edit to the card's top-right corner:
       inside booking cards it belongs at the bottom-left, in normal flow */
    .lgg-booking-card .lgg-cart-edit { position: static; top: auto; right: auto; }

    /* Booking detail (template/account_booking.php), same treatment applied to both the paid and the
       outstanding-balance example on the page (see mat/Immagine 2026-08-07 152855.png) */

    /* "Order value" drops below the date instead of sitting pinned to the top-right */
    .lgg-detail-header { flex-direction: column; align-items: flex-start !important; }
    .lgg-detail-header > .text-end {
        text-align: left !important; display: flex; align-items: baseline; gap: .4rem;
    }

    /* participant/lesson cards: hide the avatar, pin the status pill to the card's top-right corner,
       and let the price sit on its own line below the badges instead of beside them */
    .lgg-cart-card .lgg-status-pill { position: absolute; top: 1rem; right: 1.1rem; }
    .lgg-detail-card-head { flex-direction: column; }
    .lgg-detail-card-side { text-align: left !important; }

    /* location / date-range rows stack instead of spreading across the card */
    .lgg-detail-card-foot { flex-direction: column; align-items: flex-start; }
}