/*
 * Catalogue item card compatibility fixes
 *
 * catalogue.css contains a broad `.category-card span` rule. These selectors
 * intentionally outrank it so the refreshed item-card labels inherit their
 * component colours instead of being forced to WhatsApp green.
 */

.item-result-grid .item-card .item-card-flow-badge { color: #ffffff; }
.item-result-grid .item-card .item-card-eyebrow { color: #9A7739; }
.item-result-grid .item-card .item-card-model { color: #0D1B2A; }
.item-result-grid .item-card .view-details-btn-item > span,
.item-result-grid .item-card .item-whatsapp-btn-item > span { color: inherit; }

.item-result-grid {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 360px));
    justify-content: start;
}

.item-result-grid[data-item-count="1"] {
    grid-template-columns: minmax(min(100%, 280px), 360px);
    justify-content: center;
}

@media (min-width: 993px) {
    .item-result-grid[data-item-count]:not([data-item-count="1"]):not([data-item-count="2"]) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-content: stretch;
    }

    .item-result-grid[data-item-count]:not([data-item-count="1"]):not([data-item-count="2"]) .item-card.catalogue-category-card {
        max-width: none;
    }
}

.catalogue-pagination {
    margin: 36px auto 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    flex-wrap: wrap;
}

.catalogue-pagination__pages {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.catalogue-pagination__page,
.catalogue-pagination__control {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 14px;
    border: 1px solid rgba(205, 170, 103, 0.48);
    border-radius: 999px;
    background: #ffffff;
    color: #0D1B2A;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    transition: transform .2s ease, background-color .2s ease, border-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.catalogue-pagination__control { gap: 8px; }

.catalogue-pagination__icon {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.25;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.catalogue-pagination__page:hover,
.catalogue-pagination__control:hover,
.catalogue-pagination__page:focus-visible,
.catalogue-pagination__control:focus-visible,
.catalogue-pagination__page.is-active {
    border-color: #0D1B2A;
    background: #0D1B2A;
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(13, 27, 42, 0.14);
    outline: none;
}

.catalogue-pagination__page:hover,
.catalogue-pagination__control:hover { transform: translateY(-1px); }

.catalogue-pagination__control.is-disabled {
    opacity: .45;
    cursor: not-allowed;
}

@media (max-width: 768px) {
    .item-result-grid,
    .item-result-grid[data-item-count="1"] {
        grid-template-columns: minmax(0, 1fr);
        justify-content: center;
    }

    .catalogue-pagination { gap: 10px; }

    .catalogue-pagination__control {
        flex: 1 1 130px;
        max-width: 170px;
    }

    .catalogue-pagination__pages {
        order: -1;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .catalogue-pagination__page,
    .catalogue-pagination__control { transition: none; }
}