/* EstiCRM - Karuzela. Light/dark, bez head, strzałki pod kartami, loop.
   Body prefix + !important żeby pobić Astrę. */

body .esticrm-carousel {
    --esticrm-carousel-gap: 14px;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    color: var(--esticrm-text) !important;
    font-family: var(--esticrm-font-sans) !important;
    overflow: visible !important;
}

body .esticrm-carousel--dark {
    color: #f0ebe0 !important;
}

body .esticrm-carousel__viewport {
    width: 100% !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

body .esticrm-carousel__track {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: var(--esticrm-carousel-gap) !important;
    transition: transform .4s cubic-bezier(.4, 0, .2, 1) !important;
    will-change: transform !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

body .esticrm-carousel__track > .esticrm-card {
    flex: 0 0 calc((100% - (var(--esticrm-carousel-gap) * (var(--esticrm-carousel-visible) - 1))) / var(--esticrm-carousel-visible)) !important;
    width: calc((100% - (var(--esticrm-carousel-gap) * (var(--esticrm-carousel-visible) - 1))) / var(--esticrm-carousel-visible)) !important;
    max-width: calc((100% - (var(--esticrm-carousel-gap) * (var(--esticrm-carousel-visible) - 1))) / var(--esticrm-carousel-visible)) !important;
    min-width: 0 !important;
}

/* Dark variant - kolory kart */
body .esticrm-carousel--dark .esticrm-card__media {
    background: #2a2828 !important;
}

body .esticrm-carousel--dark .esticrm-card__fav {
    background: rgba(30, 28, 28, 0.85) !important;
    color: #ccc !important;
}

body .esticrm-carousel--dark .esticrm-card__fav:hover {
    background: #2a2828 !important;
    color: var(--esticrm-accent) !important;
}

body .esticrm-carousel--dark .esticrm-card__title,
body .esticrm-carousel--dark .esticrm-card__title a,
body .esticrm-carousel--dark .esticrm-card__price {
    color: #f0ebe0 !important;
}

body .esticrm-carousel--dark .esticrm-card__title a:hover {
    color: var(--esticrm-accent) !important;
}

body .esticrm-carousel--dark .esticrm-card__spec {
    color: #9a9590 !important;
}

body .esticrm-carousel--dark .esticrm-card__location,
body .esticrm-carousel--dark .esticrm-card__sqm,
body .esticrm-carousel--dark .esticrm-card__sep {
    color: #aaa39d !important;
}

/* Strzałki nawigacji - WIDOCZNE z border, kolor i wymiarami EXPLICITE */
body .esticrm-carousel__nav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
}

body .esticrm-carousel__arrow {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border: 1px solid var(--esticrm-border) !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: var(--esticrm-text) !important;
    cursor: pointer !important;
    transition: border-color .15s, color .15s, background .15s !important;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    font-size: 0 !important;
    line-height: 1 !important;
}

body .esticrm-carousel__arrow svg {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    color: currentColor !important;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 2 !important;
}

body .esticrm-carousel__arrow:hover:not(:disabled) {
    border-color: var(--esticrm-accent) !important;
    color: var(--esticrm-accent) !important;
    background: #fff !important;
}

body .esticrm-carousel__arrow:disabled {
    opacity: .35 !important;
    cursor: default !important;
    pointer-events: none !important;
}

body .esticrm-carousel--dark .esticrm-carousel__arrow {
    border-color: #444 !important;
    background: #1a1818 !important;
    color: #f0ebe0 !important;
}

body .esticrm-carousel--dark .esticrm-carousel__arrow:hover:not(:disabled) {
    border-color: var(--esticrm-accent) !important;
    color: var(--esticrm-accent) !important;
    background: #1a1818 !important;
}

@media (max-width: 640px) {
    body .esticrm-carousel__track > .esticrm-card {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (min-width: 641px) and (max-width: 960px) {
    body .esticrm-carousel__track > .esticrm-card {
        flex: 0 0 calc((100% - var(--esticrm-carousel-gap)) / 2) !important;
        width: calc((100% - var(--esticrm-carousel-gap)) / 2) !important;
        max-width: calc((100% - var(--esticrm-carousel-gap)) / 2) !important;
    }
}

/* v8.1.1 BUG #14: nav positions */
body .esticrm-carousel__nav {
    display: flex !important;
    gap: 8px !important;
    margin: 0 0 12px !important;
}
body .esticrm-carousel--arrows-top-right .esticrm-carousel__nav--top { justify-content: flex-end !important; }
body .esticrm-carousel--arrows-top-center .esticrm-carousel__nav--top { justify-content: center !important; }
body .esticrm-carousel--arrows-top-left .esticrm-carousel__nav--top { justify-content: flex-start !important; }
body .esticrm-carousel__nav--bottom { justify-content: center !important; margin: 16px 0 0 !important; }

body .esticrm-carousel__viewport { position: relative !important; }
body .esticrm-carousel__arrow--side {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 5 !important;
}
body .esticrm-carousel__arrow--side.esticrm-carousel__arrow--prev { left: -8px !important; }
body .esticrm-carousel__arrow--side.esticrm-carousel__arrow--next { right: -8px !important; }

/* Kształty */
body .esticrm-carousel--shape-circle .esticrm-carousel__arrow { border-radius: 50% !important; }
body .esticrm-carousel--shape-square .esticrm-carousel__arrow { border-radius: 0 !important; }
body .esticrm-carousel--shape-rounded .esticrm-carousel__arrow { border-radius: 6px !important; }
body .esticrm-carousel--shape-pill .esticrm-carousel__arrow { border-radius: 999px !important; padding: 0 16px !important; width: auto !important; }

/* Dots */
body .esticrm-carousel__dots {
    display: flex !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 16px !important;
}
body .esticrm-carousel__dot {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    border: 0 !important;
    background: var(--esticrm-border, #d8d0c4) !important;
    padding: 0 !important;
    cursor: pointer !important;
    transition: background .2s ease, transform .2s ease !important;
}
body .esticrm-carousel__dot.is-active {
    background: var(--esticrm-accent, #d6b068) !important;
    transform: scale(1.3) !important;
}

/* v9 B8: shape kropek */
body .esticrm-dots-shape-circle .esticrm-carousel__dot { border-radius: 50% !important; }
body .esticrm-dots-shape-square .esticrm-carousel__dot { border-radius: 0 !important; }
body .esticrm-dots-shape-pill .esticrm-carousel__dot { border-radius: 999px !important; width: 24px !important; }
body .esticrm-dots-shape-line .esticrm-carousel__dot { border-radius: 0 !important; height: 2px !important; width: 20px !important; }

/* v9 B8: sides-outside (obok karuzeli, NIE overlay) */
body .esticrm-carousel--arrows-sides-outside {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    gap: 12px !important;
    align-items: center !important;
}
body .esticrm-carousel--arrows-sides-outside .esticrm-carousel__viewport {
    grid-column: 2 !important;
}
body .esticrm-carousel--arrows-sides-outside .esticrm-carousel__arrow--side {
    position: static !important;
    transform: none !important;
}
body .esticrm-carousel--arrows-sides-outside .esticrm-carousel__arrow--prev { grid-column: 1 !important; }
body .esticrm-carousel--arrows-sides-outside .esticrm-carousel__arrow--next { grid-column: 3 !important; }
@media (max-width: 640px) {
    body .esticrm-carousel--arrows-sides-outside {
        grid-template-columns: 1fr !important;
    }
    body .esticrm-carousel--arrows-sides-outside .esticrm-carousel__viewport { grid-column: 1 !important; }
    body .esticrm-carousel--arrows-sides-outside .esticrm-carousel__nav--side {
        display: flex !important; justify-content: center !important; gap: 8px !important;
    }
}
