/* ─── 1. TIPOGRAFIA ─────────────────────────────────────── */

/* Body text: Epilogue */
body,
body p,
body span,
body li,
body a,
body div,
body td,
body th,
body input,
body textarea,
body select,
body button,
.site-content,
.entry-content,
.entry-content p {
    font-family: 'Epilogue', sans-serif !important;
}

/* Headings: DM Sans */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6,
.woocommerce h1,
.woocommerce h2,
.woocommerce h3 {
    font-family: 'DM Sans', sans-serif !important;
}

/* Títol custom (Elementor) */
.titol-custom {
    font-family: 'DM Sans', sans-serif;
    font-size: 56px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin: 0;
}

@media (max-width: 1024px) {
    .titol-custom { font-size: 40px; }
}

@media (max-width: 767px) {
    .titol-custom { font-size: 28px; }
}


/* ─── 2. HEADER: Layout i posició ───────────────────────── */

/* Forçar logo correcte */
header.sticky img.main-logo,
header.sticky img.sticky-logo {
    content: url('https://ebikesarea.com/wp-content/uploads/2026/03/cropped-Logo_Ebikes.png') !important;
    max-height: 36px !important;
    width: auto !important;
}

/* Amagar barra de cerca */
.inspect-quick-search-wrapper,
header.sticky .header-search-form,
header.sticky section.inspect-quick-search-wrapper {
    display: none !important;
}

/* FIX: Header sempre enganxat al top */
header.sticky {
    top: 0 !important;
    margin-top: 0 !important;
}

/* FIX: Header-right alineat */
header.sticky .header-right {
    display: flex !important;
    align-items: center !important;
}

/* FIX: Element "Compte" centrat quan logat */
a.turbo-join-us-btn {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    line-height: 1 !important;
}

body.logged-in {
    padding-top: 0 !important;
    margin-top: 0 !important;
}


/* ─── 3. HEADER: Colors de text ─────────────────────────── */

/* Home — text sempre blanc */
body.home header.sticky a,
body.home header.sticky span:not(.bg-brand):not(.tm-cart-counter),
body.home header.sticky #menu-header-principal a {
    color: #FFFFFF !important;
}

/* Altres pàgines — text fosc al top */
body:not(.home) header.sticky a,
body:not(.home) header.sticky span:not(.bg-brand):not(.tm-cart-counter),
body:not(.home) header.sticky #menu-header-principal a {
    color: #202020 !important;
    transition: color 0.3s ease !important;
}

/* Altres pàgines — text blanc al scroll */
body:not(.home) header.sticky.scrolled a,
body:not(.home) header.sticky.scrolled span:not(.bg-brand):not(.tm-cart-counter),
body:not(.home) header.sticky.scrolled #menu-header-principal a {
    color: #FFFFFF !important;
}

/* "Reserva" — sempre verd */
body.home header.sticky #menu-header-principal li.menu-item-type-post_type a,
body:not(.home) header.sticky #menu-header-principal li.menu-item-type-post_type a,
body:not(.home) header.sticky.scrolled #menu-header-principal li.menu-item-type-post_type a {
    color: #94D609 !important;
}


/* ─── 4. HEADER: Navegació ──────────────────────────────── */

#menu-header-principal a {
    position: relative;
    text-decoration: none !important;
    text-transform: none !important;
    font-size: 18px !important;
    font-weight: 500 !important;
}

#menu-header-principal li {
    text-transform: none !important;
    margin: 0 16px !important;
}

#menu-header-principal li a,
.header-navigation-menu a {
    text-transform: none !important;
}

/* Línia verda sota la paraula */
#menu-header-principal a::after {
    content: '';
    position: absolute;
    bottom: 50%;
    left: 0;
    right: 0;
    height: 3px;
    background-color: #94D609;
    border-radius: 2px;
    transform: scaleX(0) translateY(18px);
    transition: transform 0.3s ease;
}

#menu-header-principal a:hover::after {
    transform: scaleX(1) translateY(18px);
}

#menu-header-principal a.active-section::after {
    transform: scaleX(1) translateY(18px);
}

/* Pàgina activa — NOMÉS pàgines no-home */
body:not(.home) #menu-header-principal .current_page_item a::after,
body:not(.home) #menu-header-principal .current-menu-item a::after {
    transform: scaleX(1) translateY(18px) !important;
}


/* ─── 5. HEADER: Cart icon i badge ──────────────────────── */

/* Badge i counter SEMPRE blanc */
header.sticky .bg-brand,
header.sticky span.bg-brand,
header.sticky .tm-cart-counter {
    color: #FFFFFF !important;
}

/* Header right spans EXCEPTE badge */
header.sticky .header-right span:not(.bg-brand):not(.tm-cart-counter),
header.sticky .header-right button span:not(.bg-brand):not(.tm-cart-counter) {
    color: #FFFFFF !important;
}

body:not(.home) header.sticky:not(.scrolled) .header-right span:not(.bg-brand):not(.tm-cart-counter),
body:not(.home) header.sticky:not(.scrolled) .header-right button span:not(.bg-brand):not(.tm-cart-counter) {
    color: #202020 !important;
}

body:not(.home) header.sticky.scrolled .header-right span:not(.bg-brand):not(.tm-cart-counter),
body:not(.home) header.sticky.scrolled .header-right button span:not(.bg-brand):not(.tm-cart-counter) {
    color: #FFFFFF !important;
}

/* Cart icon SVG */
header.sticky .cart-icon svg,
header.sticky .turbo-mini-cart-drawer-handler svg {
    color: #FFFFFF !important;
    stroke: #FFFFFF !important;
}

body:not(.home) header.sticky:not(.scrolled) .cart-icon svg,
body:not(.home) header.sticky:not(.scrolled) .turbo-mini-cart-drawer-handler svg {
    color: #202020 !important;
    stroke: #202020 !important;
}

body:not(.home) header.sticky.scrolled .cart-icon svg,
body:not(.home) header.sticky.scrolled .turbo-mini-cart-drawer-handler svg {
    color: #FFFFFF !important;
    stroke: #FFFFFF !important;
}


/* ─── 6. BOTONS ─────────────────────────────────────────── */

button.single_add_to_cart_button,
button.redq_add_to_cart_button,
button.btn-book-now {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

button.single_add_to_cart_button:hover,
button.redq_add_to_cart_button:hover,
button.btn-book-now:hover {
    background-color: #7fb800 !important;
    border-color: #7fb800 !important;
    color: #202020 !important;
}

button#login-modal-btn {
    background-color: #94D609 !important;
    color: #202020 !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 0 !important;
}

button#login-modal-btn::after {
    content: 'Inicia Sessió';
    font-size: 14px;
}

button.bg-brand.border-brand {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

button.bg-brand.border-brand:hover {
    background-color: #7fb800 !important;
    border-color: #7fb800 !important;
    color: #202020 !important;
}

button.turbo-login-submit.bg-brand {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
}

button.turbo-login-submit.bg-brand:hover {
    background-color: #7fb800 !important;
    border-color: #7fb800 !important;
}

button.turbo-register-submit,
button.turbo-register-submit.bg-brand {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
    border-radius: 8px !important;
}

button.turbo-register-submit:hover,
button.turbo-register-submit.bg-brand:hover {
    background-color: #7fb800 !important;
    border-color: #7fb800 !important;
    color: #202020 !important;
}

.woocommerce-button.woocommerce-form-login__submit,
.woocommerce-button.woocommerce-form-register__submit,
.woocommerce button.button[type="submit"] {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

.woocommerce-button.woocommerce-form-login__submit:hover,
.woocommerce-button.woocommerce-form-register__submit:hover,
.woocommerce button.button[type="submit"]:hover {
    background-color: #7fb800 !important;
    border-color: #7fb800 !important;
    color: #202020 !important;
}

.turbo-product-page div.product form.cart.rnb-cart button.single_add_to_cart_button,
.turbo-product-page div.product form.cart.rnb-cart button.redq_add_to_cart_button,
.turbo-product-page div.product form.cart.rnb-cart button.btn-book-now,
div.product form.cart button.single_add_to_cart_button.button.alt,
div.product form.cart button.redq_add_to_cart_button.button.alt,
div.product form.cart button.btn-book-now.button.alt {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

button.single_add_to_cart_button,
button.redq_add_to_cart_button,
button.btn-book-now,
button[type="submit"].bg-brand,
.woocommerce button.button,
a.button.bg-brand {
    --brand-color: #94D609;
    --lighter-text-color: #202020;
    background-color: #94D609 !important;
    color: #202020 !important;
    border-color: #94D609 !important;
}

/* ─── CART: Botons ──────────────────────────────────────── */

.woocommerce-cart button[name="apply_coupon"],
button.button[name="apply_coupon"] {
    background-color: #202020 !important;
    border-color: #202020 !important;
    color: #ffffff !important;
}

button.button[name="apply_coupon"]:hover {
    background-color: #404040 !important;
    border-color: #404040 !important;
    color: #ffffff !important;
}

a.checkout-button.button.alt.wc-forward,
.wc-proceed-to-checkout a.checkout-button {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
}

a.checkout-button.button.alt.wc-forward:hover,
.wc-proceed-to-checkout a.checkout-button:hover {
    background-color: #7fb800 !important;
    border-color: #7fb800 !important;
    color: #202020 !important;
}

/* ─── CART: Botons secundaris — fosc ────────────────────── */

.woocommerce-cart .woocommerce button[name="apply_coupon"],
.woocommerce-cart .woocommerce button[name="update_cart"],
.woocommerce form.woocommerce-cart-form button[name="apply_coupon"],
.woocommerce form.woocommerce-cart-form button[name="update_cart"] {
    background-color: #202020 !important;
    border-color: #202020 !important;
    color: #ffffff !important;
    --brand-color: #202020 !important;
}

.woocommerce-cart .woocommerce button[name="apply_coupon"]:hover,
.woocommerce-cart .woocommerce button[name="update_cart"]:hover,
.woocommerce form.woocommerce-cart-form button[name="apply_coupon"]:hover,
.woocommerce form.woocommerce-cart-form button[name="update_cart"]:hover {
    background-color: #404040 !important;
    border-color: #404040 !important;
    color: #ffffff !important;
}
/* ─── 7. MODALS (Login / Registre) ──────────────────────── */

#login-modal h4,
#login-modal p,
#registration-modal h4,
#registration-modal p {
    font-family: 'DM Sans', sans-serif !important;
}


/* ─── 8. BOOKING: Resum de preus ────────────────────────── */

.booking_cost li.category {
    display: none !important;
}

.talla-summary-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 4px 0 !important;
    border-bottom: 1px dashed #e8e8e8 !important;
    font-size: 14px !important;
    color: #333 !important;
}

.talla-summary-label {
    font-weight: 500;
}

.talla-summary-value {
    font-weight: 700;
    color: #1a202c;
}


/* ─── 9. BOOKING: Talles ────────────────────────────────── */

/* Amagar elements innecessaris */
.categories-attr label.custom-block::before,
.categories-attr label.custom-block::after {
    display: none !important;
}

.categories-attr .pull-right {
    display: none !important;
}

.categories-attr .woocommerce-Price-amount,
.categories-attr .rnb-cost-type {
    display: none !important;
}

/* Layout */
.categories-attr {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 15px !important;
    margin-bottom: 6px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
    background: #fff !important;
}

.categories-attr label.custom-block {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    font-weight: 500 !important;
    font-size: 15px !important;
    color: #1a202c !important;
    width: auto !important;
    flex: 1 !important;
}

.categories-attr .quantity {
    display: flex !important;
    align-items: center !important;
}

/* Estats */
.categories-attr.talla-selected {
    border-color: #1a202c !important;
    background-color: #f7fafc !important;
}

.categories-attr.talla-selected label.custom-block {
    font-weight: 700 !important;
}

.categories-attr.talla-disabled {
    opacity: 0.3 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
    background: #f1f5f9 !important;
}

.redq-quantity.talla-disabled {
    opacity: 0.3 !important;
    pointer-events: none !important;
}

/* Missatges de validació */
.talla-validation-msg {
    font-weight: 600;
    padding: 10px 15px;
    border-radius: 6px;
    background: #fdf0f0;
    color: #e74c3c;
    text-align: center;
    margin: 10px 0;
    font-size: 14px;
}

.talla-validation-msg.talla-info {
    background: #f0f4fd;
    color: #2c5282;
}


/* ─── 10. FAQS ──────────────────────────────────────────── */

.accordion-item.shadow-faq {
    box-shadow: none !important;
}

.accordion_title {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    border-bottom: 1px solid rgba(32, 32, 32, 0.5) !important;
    padding-bottom: 16px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.accordion-body {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.accordion-icon:not(.hidden) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    order: 99 !important;
    margin-left: auto !important;
    background-color: #FFFFFF !important;
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
}

.accordion-icon svg {
    color: #94D609 !important;
    fill: #94D609 !important;
    width: 14px !important;
    height: 14px !important;
    display: block !important;
}

.accordion-icon svg path {
    fill: #94D609 !important;
}


/* ─── 11. SLIDER DE MARQUES ─────────────────────────────── */

.brands-container {
    position: relative;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.marquee-brands {
    mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}


/* ─── 12. PÀGINA 404 ───────────────────────────────────── */

body.error404 #content,
body.error404 main,
body.error404 .site-main {
    margin: 0 !important;
    padding: 0 !important;
}

body.error404 .container {
    max-width: 100% !important;
    padding: 0 !important;
}

body.error404 .site-main {
    margin-top: -80px;
    height: calc(100vh - 80px);
    display: flex;
    align-items: center;
    justify-content: center;
}

body.error404 img {
    max-height: 70vh;
    object-fit: cover;
}

/* ─── MINI-CART (cistella lateral) ─────────────────────── */

/* Textos visibles al mini-cart */
.turbo-drawer-body .product-details a,
.turbo-drawer-body .woocommerce-mini-cart-item,
.turbo-drawer-body .woocommerce-mini-cart__total,
.turbo-drawer-body span,
.turbo-drawer-body p,
.turbo-drawer-body .quantity {
    color: #202020 !important;
}

/* Botó "Finalitza la compra" — verd amb text fosc */
a.button.checkout.wc-forward,
.woocommerce-mini-cart__buttons a.checkout,
.woocommerce-mini-cart__buttons a.button {
    background-color: #94D609 !important;
    border-color: #94D609 !important;
    color: #202020 !important;
}

a.button.checkout.wc-forward:hover,
.woocommerce-mini-cart__buttons a.checkout:hover {
    background-color: #7fb800 !important;
    color: #202020 !important;
}

/* Botó "Visualitza la cistella" — fosc amb text blanc */
.woocommerce-mini-cart__buttons a.button.wc-forward:not(.checkout) {
    color: #ffffff !important;
}

/* ─── CHECKOUT: Labels tipografia DM Sans ───────────────── */

.woocommerce-billing-fields label,
.woocommerce-shipping-fields label,
.woocommerce-additional-fields label,
label.required_field,
.form-row label,
.checkout .form-row label,
#order_review label,
#order_review th {
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    color: #202020 !important;
}

/* Ocultar preu unitari RnB al llistat de productes */
.inspect-filter-results-container span.amount[class*="rnb_price_unit_"] {
    display: none !important;
}

/* Centrar botó Reservar al llistat quan no hi ha preu unitari */
.inspect-filter-results-container .mt-6.flex.justify-between.items-center.gap-3 {
    justify-content: center !important;
}

/* Fix visual quan RnB no troba li.resource */
.booking_cost li.resource {
    display: block !important;
    min-height: 0;
}

/* ─── 13. FIX GTRANSLATE: Toggle custom + preus visibles ─── */

#resourcePreview .attributes label.custom-block {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#resourcePreview .attributes input.booking-extra[type="checkbox"] {
    display: block !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 40px !important;
    min-width: 40px !important;
    height: 22px !important;
    background-color: #9ca3af !important;
    border-radius: 96px !important;
    position: relative !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    border: none !important;
    outline: none !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
    order: -1 !important;
}

#resourcePreview .attributes input.booking-extra[type="checkbox"]:checked {
    background-color: #1a202c !important;
}

#resourcePreview .attributes input.booking-extra[type="checkbox"]::before {
    content: '' !important;
    position: absolute !important;
    top: 2px !important;
    left: 2px !important;
    width: 18px !important;
    height: 18px !important;
    background: #fff !important;
    border-radius: 50% !important;
    transition: transform 0.3s ease !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.15) !important;
    display: block !important;
}

#resourcePreview .attributes input.booking-extra[type="checkbox"]:checked::before {
    transform: translateX(18px) !important;
}

#resourcePreview .attributes .pull-right {
    all: unset !important;
    margin-left: auto !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    color: #333 !important;
    flex-shrink: 0 !important;
}

#resourcePreview .attributes .pull-right::before,
#resourcePreview .attributes .pull-right::after,
#resourcePreview .attributes .pull-right *::before,
#resourcePreview .attributes .pull-right *::after {
    display: none !important;
    content: none !important;
}