.sum-resort-details {
    .resort-container {
        display: grid;
        grid-gap: var(--wp--preset--spacing--80);
        grid-template-areas: 
        "slider"
        "content"
        "sidebar";
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
    }

    .resort-section-slider {
        grid-area: slider;
        min-width: 0;
    }

    .resort-section-sidebar {
        grid-area: sidebar;
        min-width: 0;
        overflow: hidden;
    }

    .resort-section-content {
        grid-area: content;
        min-width: 0;
        overflow: hidden;

        display: grid;
        grid-gap: var(--wp--preset--spacing--80);
        grid-template-areas:
        "tabs"
        "content";
        grid-template-columns: 1fr;
        grid-template-rows: auto;
    }

    .resort-section-content .ui-tabs-nav {
        grid-area: nav;
        min-width: 0;
        overflow: hidden;
        padding: 0;
        margin: 0;
        transform: translate(0, -8px);
    }

    .resort-section-content .ui-tabs-tab {
        grid-area: panel;
        min-width: 0;
        border-bottom: 1px solid var(--wp--custom--color--divider);
    }

    .resort-section-content .ui-tabs-tab a {
        font-family: var(--wp--preset--font-family--ubuntu);
        font-size: var(--wp--preset--font-size--large);
        font-weight: 500;
        color: #000;
        text-decoration: none;
        display: block;
        padding-right: 50px;
        position: relative;
    }

    .resort-section-content .ui-tabs-tab a::after {
        content: '\f105';
        font: var(--fa-font-regular);
        font-size: var(--wp--preset--font-size--large);
        position: absolute;
        top: 50%;
        right: 0;
        transform: translate(0, -50%);
    }

    .resort-section-content .ui-tabs-tab a.external::after {
        content: '\e09f';
    }

    .resort-section-content .ui-tabs-tab span {
        display: inline-block;
        padding: 16px 0;
        position: relative;
    }

    .resort-section-content .ui-tabs-tab span::after {
        content: '';
        position: absolute;
        bottom: -1px;
        left: 0;
        width: 100%;
        height: 1px;
        background: #000;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .resort-section-content .ui-tabs-tab a:hover span::after {
        opacity: 1;
    }

    .resort-section-content .ui-tabs-tab.ui-tabs-active span::after {
        opacity: 1;
        height: 2px;
    }

    @media (min-width: 768px) {
        .resort-section-content {
            grid-template-areas:
            "nav panel";
            grid-template-columns: 23% 1fr;
        }
    }

    @media (min-width: 992px) {
        .resort-container {
            grid-template-areas:
            "slider sidebar"
            "content sidebar";
            grid-template-columns: 1fr 23%;
        }
    }

    .sum-component-data-grid .value:has([class|="slopes"]) {
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    .sum-component-data-grid .value [class|="slopes"] {
        display: inline-block;
        width: 12px;
        height: 12px;
        border-radius: 999px;
    }

    .sum-component-data-grid .value .slopes-green {
        background-color: #70B542;
    }

    .sum-component-data-grid .value .slopes-red {
        background-color: #D0021B;
    }

    .sum-component-data-grid .value .slopes-blue {
        background-color: #4A90E2;
    }

    .sum-component-data-grid .value .slopes-black {
        background-color: #000000;
    }
}