/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* Solway product card redesign */
:root {
    --solway-card-width: min(300px, calc(100vw - 32px));
    --solway-card-height: 490px;
    --solway-card-media-height: 315px;
    --solway-card-radius: 8px;
    --solway-card-border: #e6e7eb;
    --solway-card-muted: #69707f;
    --solway-card-accent: #697cd2;
}

.wi-filter-results {
    box-sizing: border-box;
    grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 300px)) !important;
    justify-content: center;
    align-items: start;
    max-width: 100%;
    overflow-x: clip;
}

.wi-filter-wrapper,
.wi-filter-column-content {
    box-sizing: border-box;
    max-width: 100%;
}

.wi-filter-results.loading {
    overflow: hidden;
}

@supports not (overflow: clip) {
    .wi-filter-results {
        overflow-x: hidden;
    }
}

.wi-loop-item-card.solway-product-card,
.solway-product-card {
    box-sizing: border-box;
    position: relative;
    display: flex;
    flex: 0 0 var(--solway-card-width);
    flex-direction: column;
    width: var(--solway-card-width);
    max-width: 100%;
    height: var(--solway-card-height);
    min-height: var(--solway-card-height);
    max-height: var(--solway-card-height);
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid var(--solway-card-border);
    border-radius: var(--solway-card-radius);
    background: #fff;
    box-shadow: 0 8px 24px rgb(17 24 39 / 8%);
    cursor: pointer;
    transition: box-shadow 180ms ease;
}

.wi-loop-item-card.solway-product-card:hover,
.solway-product-card:hover {
    transform: none !important;
    box-shadow: 0 14px 34px rgb(17 24 39 / 14%);
}

.wi-loop-item-card.solway-product-card .solway-product-card__media,
.solway-product-card__media {
    position: relative;
    width: 100%;
    height: var(--solway-card-media-height) !important;
    min-height: var(--solway-card-media-height);
    overflow: hidden;
    background: #f7f7f8;
    line-height: 0;
}

.solway-product-card__image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.wi-loop-item-card.solway-product-card .solway-product-card__media img,
.solway-product-card__media img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
    object-position: center;
    transition: transform 220ms ease;
}

.wi-loop-item-card.solway-product-card:hover .solway-product-card__media img,
.solway-product-card:hover .solway-product-card__media img,
.solway-product-card:focus-within .solway-product-card__media img {
    transform: scale(1.035);
}

.wi-loop-item-card.solway-product-card.has-truncated-title:hover .solway-product-card__media img,
.solway-product-card.has-truncated-title:hover .solway-product-card__media img,
.solway-product-card.has-truncated-title:focus-within .solway-product-card__media img {
    transform: none;
}

.solway-product-card .card-badges {
    top: 12px;
    left: 12px;
    gap: 6px;
}

.solway-product-card .card-badge {
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    box-shadow: 0 6px 16px rgb(17 24 39 / 14%);
}

.solway-product-card__body {
    box-sizing: border-box;
    display: flex !important;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px !important;
    height: calc(var(--solway-card-height) - var(--solway-card-media-height));
    padding: 12px !important;
    background: #fff;
}

.wi-loop-item-card.solway-product-card .solway-product-card__title,
.solway-product-card__title {
    position: relative;
    z-index: 3;
    min-height: 2.5em;
    margin: 0;
    color: #28292a;
    font-size: 15px !important;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0;
    overflow: visible;
}

.solway-product-card__title-link {
    display: -webkit-box;
    color: inherit;
    overflow: hidden;
    text-decoration: none;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.solway-product-card__title-link::after {
    content: attr(data-solway-title);
    position: absolute;
    right: -2px;
    bottom: calc(100% + 12px);
    left: -2px;
    z-index: 7;
    display: block;
    max-height: min(220px, calc(var(--solway-card-media-height) - 24px));
    padding: 10px 12px;
    overflow: hidden;
    border: 1px solid #e7e9ee;
    border-radius: 6px;
    background: rgb(255 255 255 / 96%);
    color: #28292a !important;
    font-size: 15px !important;
    font-weight: 600;
    line-height: 1.28;
    white-space: normal;
    overflow-wrap: anywhere;
    opacity: 0;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
    visibility: hidden;
    box-shadow: 0 12px 28px rgb(17 24 39 / 18%);
}

.solway-product-card.has-truncated-title:hover .solway-product-card__title-link::after,
.solway-product-card.has-truncated-title:focus-within .solway-product-card__title-link::after {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.solway-product-card__meta,
.solway-card-meta {
    min-width: 0;
}

.solway-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 28px;
}

.solway-color-pill,
.solway-size-range {
    display: inline-flex;
    flex: 0 1 auto;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: 26px;
    padding: 5px 9px;
    border: 1px solid #eceef3;
    border-radius: 999px;
    background: #f8f9fb;
    color: #28292a;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0;
    white-space: nowrap;
}

.solway-color-pill {
    position: relative;
    gap: 4px;
}

.solway-color-pill.is-static {
    cursor: default;
}

.solway-color-pill.has-tooltip {
    cursor: help;
}

.solway-color-pill .solway-arrow {
    margin-left: 2px;
    font-size: 9px;
    line-height: 1;
}

.solway-size-range {
    max-width: 45%;
    color: var(--solway-card-muted);
    overflow: hidden;
    text-overflow: ellipsis;
}

.solway-product-card .solway-color-tooltip {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    z-index: 8;
    display: flex !important;
    flex-direction: column;
    gap: 4px;
    width: min(240px, calc(100vw - 32px)) !important;
    min-width: 140px;
    height: auto !important;
    min-height: 0 !important;
    max-height: 180px;
    padding: 10px 12px !important;
    overflow: auto;
    border: 1px solid #e5e7eb;
    border-radius: 8px !important;
    background: #fff !important;
    color: #28292a !important;
    font-size: 12px !important;
    font-weight: 500;
    line-height: 1.35;
    white-space: normal;
    opacity: 0 !important;
    pointer-events: none;
    transform: translateY(4px);
    transition: opacity 160ms ease, transform 160ms ease;
    visibility: hidden !important;
    box-shadow: 0 12px 28px rgb(17 24 39 / 16%);
}

.solway-color-tooltip__item {
    display: block;
    color: #28292a !important;
}

.solway-product-card .solway-color-pill.has-tooltip:hover .solway-color-tooltip,
.solway-product-card .solway-color-pill.has-tooltip:focus .solway-color-tooltip,
.solway-product-card .solway-color-pill.has-tooltip:focus-within .solway-color-tooltip {
    opacity: 1 !important;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible !important;
}

.solway-product-card__divider {
    width: 100%;
    height: 1px;
    margin-top: 4px;
    background: #eceef3;
}

.wi-loop-item-card.solway-product-card .solway-product-card__price,
.solway-product-card__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: center;
    gap: 8px;
    min-height: 24px;
    margin-top: 0 !important;
    color: #28292a;
    font-size: 17px !important;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
}

.solway-product-card__price del {
    color: #9ca3af;
    font-size: 13px;
    font-weight: 500;
    opacity: 1;
}

.solway-product-card__price ins {
    color: #cc6b69;
    text-decoration: none;
}

@media (min-width: 768px) {
    .wi-filter-results {
        justify-content: start;
    }

    .wi-loop-item-card.solway-product-card,
    .solway-product-card {
        margin-right: 0;
        margin-left: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wi-loop-item-card.solway-product-card,
    .solway-product-card,
    .wi-loop-item-card.solway-product-card .solway-product-card__media img,
    .solway-product-card__media img,
    .solway-product-card .solway-color-tooltip {
        transition: none;
    }

    .wi-loop-item-card.solway-product-card:hover .solway-product-card__media img,
    .solway-product-card:hover .solway-product-card__media img,
    .solway-product-card:focus-within .solway-product-card__media img {
        transform: none;
    }

    .solway-product-card__title-link::after {
        transition: none;
    }
}
