/* =========================================================
   FOLLOWMYTRAVELS — TRIP EVENTS
   ========================================================= */

   .trip-events__adjust-button-arrow {
    transition: transform .18s ease;
}

.trip-events__adjust-button[aria-expanded="true"]
.trip-events__adjust-button-arrow {
    transform: rotate(180deg);
}


.trip-events {
    position: relative;

    margin-top: 0;

    padding: 0;

    border: 0;
    border-radius: 0;

    background: transparent;

    box-shadow: none;

    overflow: visible;
}

.trip-events__intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 160px;
    gap: 28px;
    align-items: center;
}

.trip-events__intro[hidden],
.trip-events__results[hidden],
.trip-events__message[hidden] {
    display: none !important;
}

.trip-events__intro-copy h2,
.trip-events__results-header h2 {
    margin: 8px 0 8px;
    color: var(--text-primary);
    font-family: var(--font-editorial);
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1.04;
    letter-spacing: -1px;
}

.trip-events__intro-copy > p,
.trip-events__results-header p {
    max-width: 700px;
    margin: 0;
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.65;
}

.trip-events__trip-context {
    margin-top: 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.trip-events__trip-context span {
    padding: 8px 11px;
    border-radius: 999px;
    background: var(--color-white);
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 700;
    box-shadow: 0 8px 20px rgba(43, 45, 66, .05);
}

.trip-events__pulse {
    position: relative;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: var(--color-dark);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    transform: rotate(4deg);
    box-shadow: 0 18px 35px rgba(43, 45, 66, .16);
}

.trip-events__pulse::before {
    content: "";
    position: absolute;
    inset: 11px;
    border: 1px solid color-mix(in srgb, var(--color-white) 28%, transparent);
    border-radius: 50%;
}

.trip-events__pulse span {
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.trip-events__pulse strong {
    margin-top: 2px;
    font-family: var(--font-editorial);
    font-size: 25px;
    font-style: italic;
}

.trip-events__pulse i {
    width: 12px;
    height: 12px;
    margin-top: 10px;
    border-radius: 50%;
    background: var(--color-yellow);
    box-shadow:
        22px 0 0 var(--color-mint),
        -22px 0 0 var(--color-aqua);
}

.trip-events__form {
    margin-top: 0;
    padding: 0;

    border: 0;
    border-radius: 0;

    background: transparent;

    box-shadow: none;
}


.trip-events__discover-head {
    margin-top: 18px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 24px;
}


.trip-events__discover-head h3 {
    margin: 5px 0 0;

    color: var(--color-dark);

    font-family: var(--font-editorial);

    font-size: clamp(
        22px,
        2.3vw,
        30px
    );

    line-height: 1.05;

    letter-spacing: -.5px;
}


.trip-events__discover-head > small {
    max-width: 340px;

    color: var(--text-secondary);

    font-size: 11px;
    line-height: 1.5;

    text-align: right;
}


.trip-events__form[hidden] {
    display: none !important;
}

.trip-events__form-topbar {
    margin-bottom: 15px;
    padding-bottom: 13px;

    border-bottom: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 7%,
            transparent
        );

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;
}


.trip-events__form-topbar-copy {
    min-width: 0;
}


.trip-events__form-topbar-copy > span {
    display: block;

    margin-bottom: 3px;

    color: var(--text-secondary);

    font-size: 8px;
    font-weight: 900;

    letter-spacing: 1.2px;
}


.trip-events__form-topbar-copy > strong {
    display: block;

    color: var(--color-dark);

    font-size: 14px;
    font-weight: 850;
}


.trip-events__form-topbar-copy > small {
    display: block;

    margin-top: 3px;

    color: var(--text-secondary);

    font-size: 10px;
}


.trip-events__form-close {
    flex: 0 0 auto;

    min-height: 38px;

    padding: 0 11px 0 13px;

    border: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 9%,
            transparent
        );

    border-radius: 11px;

    background:
        color-mix(
            in srgb,
            var(--color-aqua) 8%,
            var(--color-white)
        );

    color: var(--color-dark);

    display: inline-flex;
    align-items: center;

    gap: 9px;

    cursor: pointer;

    font: inherit;
    font-size: 10px;
    font-weight: 800;

    transition:
        transform .15s ease,
        border-color .15s ease;
}


.trip-events__form-close:hover {
    transform: translateY(-1px);

    border-color:
        color-mix(
            in srgb,
            var(--color-mint) 60%,
            var(--color-dark)
        );
}


.trip-events__form-close b {
    width: 22px;
    height: 22px;

    border-radius: 50%;

    background: var(--color-dark);

    color: var(--color-white);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-size: 10px;
}

.trip-events__filter-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.trip-events__filter-heading--categories {
    margin-top: 16px;
}

.trip-events__filter-heading > div {
    display: flex;
    align-items: center;
    gap: 10px;
}

.trip-events__filter-heading > div span {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--color-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    font-size: 11px;
    font-weight: 800;
}

.trip-events__filter-heading strong {
    color: var(--text-primary);
    font-size: 15px;
}

.trip-events__filter-heading small {
    color: var(--text-secondary);
    font-size: 12px;
    line-height: 1.45;
    text-align: right;
}

.trip-events__radius-list {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}

.trip-events__radius-option,
.trip-events__category-option {
    cursor: pointer;
}

.trip-events__radius-option input,
.trip-events__category-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.trip-events__radius-option span {
    min-height: 44px;
    padding: 0 12px;
    border: 1px solid color-mix(in srgb, var(--color-dark) 10%, transparent);
    border-radius: 13px;
    background: var(--color-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-primary);
    font-size: 13px;
    font-weight: 800;
    transition: .18s ease;
}

.trip-events__radius-option input:checked + span {
    border-color: var(--color-dark);
    background: var(--color-dark);
    color: var(--color-white);
    transform: translateY(-1px);
}

.trip-events__categories {
    margin-top: 13px;

    display: grid;

    grid-template-columns:
        repeat(5, minmax(0, 1fr));

    gap: 7px;
}

.trip-events__category-option > span {
    min-height: 48px;

    padding: 9px 10px;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--color-dark) 8%,
            transparent
        );

    border-radius: 12px;

    background:
        var(--color-white);

    color:
        var(--color-dark);

    display: flex;
    align-items: center;

    gap: 8px;

    cursor: pointer;

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease,
        color .16s ease;
}


.trip-events__category-option:hover > span {
    transform: translateY(-1px);

    border-color:
        color-mix(
            in srgb,
            var(--color-mint) 55%,
            var(--color-dark)
        );
}

.trip-events__category-option input:checked + span {
    border-color:
        var(--color-dark);

    background:
        var(--color-dark);

    color:
        var(--color-white);

    box-shadow: none;
}

.trip-events__category-icon {
    width: 29px;
    height: 29px;

    flex: 0 0 29px;

    border-radius: 9px;

    background:
        color-mix(
            in srgb,
            var(--color-yellow) 58%,
            var(--color-white)
        );

    color:
        var(--color-dark);

    display: inline-flex;
    align-items: center;
    justify-content: center;

    font-style: normal;

    font-size: 15px;
    font-weight: 900;
}


.trip-events__category-option strong {
    color: inherit;

    font-size: 10px;
    font-weight: 800;

    line-height: 1.15;
}

.trip-events__form-footer {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid color-mix(in srgb, var(--color-dark) 8%, transparent);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.trip-events__form-footer > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.trip-events__form-footer strong {
    font-size: 13px;
}

.trip-events__form-footer span {
    color: var(--text-secondary);
    font-size: 12px;
}

.trip-events__discover-button,
.trip-events__adjust-button {
    border: 0;
    cursor: pointer;
    font: inherit;
}

.trip-events__discover-button {
    min-height: 50px;
    padding: 0 18px 0 20px;
    border-radius: 14px;
    background: var(--color-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    color: var(--color-white);
    font-size: 13px;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(43, 45, 66, .14);
}

.trip-events__discover-button:hover {
    transform: translateY(-1px);
}

.trip-events__discover-button span {
    color: var(--color-white);
    font-size: 13px;
}

.trip-events__discover-button:disabled {
    cursor: not-allowed;
    opacity: .48;
    transform: none;
}

.trip-events__discover-button[data-loading="true"] {
    cursor: wait;
    opacity: .68;
}

.trip-events__message {
    margin-top: 16px;
    padding: 13px 15px;
    border-radius: 13px;
    background: color-mix(in srgb, var(--color-yellow) 24%, var(--color-white));
    color: var(--text-primary);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
}

.trip-events__message--error {
    background: #fff0ef;
}

.trip-events__unavailable {
    margin-top: 22px;
    padding: 17px 18px;
    border-radius: 16px;
    background: var(--color-white);
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 12px 30px rgba(43, 45, 66, .05);
}

.trip-events__unavailable strong {
    font-size: 14px;
}

.trip-events__unavailable span {
    color: var(--text-secondary);
    font-size: 13px;
}

.trip-events__results-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.trip-events__adjust-button {
    flex: 0 0 auto;

    min-width: 190px;
    min-height: 52px;

    padding: 7px 9px;

    border: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 85%,
            var(--color-mint)
        );

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            var(--color-dark),
            color-mix(
                in srgb,
                var(--color-dark) 86%,
                var(--color-aqua)
            )
        );

    color: var(--color-white);

    display: grid;

    grid-template-columns:
        36px minmax(0, 1fr) 27px;

    align-items: center;

    gap: 9px;

    text-align: left;

    box-shadow:
        0 10px 24px rgba(43, 45, 66, .17);

    transition:
        transform .16s ease,
        box-shadow .16s ease;
}


.trip-events__adjust-button:hover {
    transform: translateY(-2px);

    box-shadow:
        0 14px 30px rgba(43, 45, 66, .22);
}


.trip-events__adjust-button-icon {
    width: 36px;
    height: 36px;

    border-radius: 11px;

    background: var(--color-yellow);

    color: var(--color-dark);

    display: inline-flex;
    align-items: center;
    justify-content: center;
}


.trip-events__adjust-button-copy {
    min-width: 0;
}


.trip-events__adjust-button-copy small {
    display: block;

    color:
        rgba(255, 255, 255, .58);

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .8px;
}


.trip-events__adjust-button-copy strong {
    display: block;

    margin-top: 1px;

    color: var(--color-white);

    font-size: 11px;
    font-weight: 850;
}


.trip-events__adjust-button-arrow {
    width: 27px;
    height: 27px;

    border: 1px solid
        rgba(255, 255, 255, .18);

    border-radius: 50%;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--color-white);

    font-size: 11px;
}

.trip-events__results {
    margin-top: 28px;

    padding-top: 24px;

    border-top: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 8%,
            transparent
        );

    transition:
        opacity .18s ease,
        filter .18s ease;
}


.trip-events__results--refreshing {
    opacity: .48;

    filter:
        saturate(.75);

    pointer-events: none;
}

/* =========================================================
   TRIP DAY EVENT FILTER
   ========================================================= */

.trip-events__day-filter {
    margin-top: 22px;
    padding: 15px;

    border: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 7%,
            transparent
        );

    border-radius: 18px;

    background:
        linear-gradient(
            135deg,
            color-mix(
                in srgb,
                var(--color-white) 94%,
                var(--color-aqua)
            ),
            color-mix(
                in srgb,
                var(--color-white) 95%,
                var(--color-mint)
            )
        );

    box-shadow:
        0 12px 30px
        rgba(43, 45, 66, .045);
}

.trip-events__day-filter[hidden] {
    display: none !important;
}


.trip-events__day-filter-heading {
    padding: 0 2px 12px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.trip-events__day-filter-heading > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.trip-events__day-filter-heading span {
    color:
        color-mix(
            in srgb,
            var(--color-mint) 72%,
            var(--color-dark)
        );

    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.35px;
}

.trip-events__day-filter-heading strong {
    color: var(--text-primary);

    font-size: 14px;
    line-height: 1.25;
}

.trip-events__day-filter-heading small {
    color: var(--text-secondary);

    font-size: 11px;
    line-height: 1.4;

    text-align: right;
}


.trip-events__day-filter-scroll {
    width: 100%;

    overflow-x: auto;
    overflow-y: hidden;

    scrollbar-width: thin;

    overscroll-behavior-x: contain;
}

.trip-events__day-filter-scroll::-webkit-scrollbar {
    height: 5px;
}

.trip-events__day-filter-scroll::-webkit-scrollbar-thumb {
    border-radius: 999px;

    background:
        color-mix(
            in srgb,
            var(--color-dark) 18%,
            transparent
        );
}


.trip-events__day-filter-list {
    min-width: max-content;

    padding: 1px 1px 6px;

    display: flex;
    gap: 7px;
}


.trip-events__day-option {
    min-width: 104px;
    min-height: 58px;

    padding: 9px 9px 9px 11px;

    border: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 9%,
            transparent
        );

    border-radius: 13px;

    background: var(--color-white);

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 9px;

    color: var(--text-primary);

    font: inherit;
    text-align: left;

    cursor: pointer;

    box-shadow:
        0 6px 16px
        rgba(43, 45, 66, .035);

    transition:
        transform .16s ease,
        border-color .16s ease,
        background .16s ease,
        box-shadow .16s ease;
}

.trip-events__day-option:hover {
    transform: translateY(-1px);

    border-color:
        color-mix(
            in srgb,
            var(--color-mint) 55%,
            var(--color-dark)
        );

    box-shadow:
        0 9px 20px
        rgba(43, 45, 66, .07);
}

.trip-events__day-option:focus-visible {
    outline: 2px solid var(--color-mint);
    outline-offset: 2px;
}


.trip-events__day-option-copy {
    min-width: 0;

    display: flex;
    flex-direction: column;
    gap: 2px;
}


.trip-events__day-option-weekday {
    color: var(--text-secondary);

    font-size: 8px;
    font-weight: 900;
    letter-spacing: 1.15px;
    line-height: 1;
}


.trip-events__day-option-date {
    color: var(--text-primary);

    font-size: 12px;
    font-weight: 850;
    line-height: 1.15;

    white-space: nowrap;
}


.trip-events__day-option-count {
    flex: 0 0 auto;

    min-width: 27px;
    height: 27px;

    padding: 0 6px;

    border-radius: 999px;

    background:
        color-mix(
            in srgb,
            var(--color-aqua) 28%,
            var(--color-white)
        );

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--color-dark);

    font-size: 10px;
    font-weight: 900;
}


/* ACTIVE DAY */

.trip-events__day-option--active {
    border-color: var(--color-dark);

    background: var(--color-dark);

    box-shadow:
        0 10px 22px
        rgba(43, 45, 66, .15);

    transform: translateY(-1px);
}

.trip-events__day-option--active:hover {
    border-color: var(--color-dark);
    background: var(--color-dark);
}

.trip-events__day-option--active
.trip-events__day-option-weekday {
    color:
        color-mix(
            in srgb,
            var(--color-aqua) 82%,
            var(--color-white)
        );
}

.trip-events__day-option--active
.trip-events__day-option-date {
    color: var(--color-white);
}

.trip-events__day-option--active
.trip-events__day-option-count {
    background: var(--color-yellow);
    color: var(--color-dark);
}



.trip-events__map-shell {
    position: relative;
    z-index: 0;
    isolation: isolate;

    margin-top: 24px;

    border-radius: 20px;
    overflow: hidden;

    background: transparent;

    box-shadow:
        0 18px 42px
        rgba(43, 45, 66, .13);
}

.trip-events__map-heading {
    padding: 15px 18px 14px;

    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    background: var(--color-dark);

    color: var(--color-white);
}

.trip-events__map-heading > div {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.trip-events__map-heading span {
    color: color-mix(in srgb, var(--color-aqua) 88%, var(--color-white));
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.trip-events__map-heading strong {
    font-size: 16px;
}

.trip-events__map-heading small {
    color: color-mix(in srgb, var(--color-white) 65%, transparent);
    font-size: 11px;
}

.trip-events__map {
    position: relative;
    z-index: 0;

    height: 500px;

    border-radius: 0 0 18px 18px;
    overflow: hidden;

    background: var(--color-surface);
}

.trip-events__map-credit {
    position: absolute;
    right: 10px;
    bottom: 7px;

    z-index: 500;

    padding: 3px 7px;

    border-radius: 6px;

    background: rgba(255, 255, 255, .78);

    color: var(--text-secondary);

    font-size: 10px;
    line-height: 1.2;

    backdrop-filter: blur(5px);

    pointer-events: auto;
}

.trip-events__map-credit a {
    color: inherit;
    text-decoration: none;
}

.trip-events__map-credit a:hover {
    text-decoration: underline;
}

.trip-events__cards {
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.trip-events__card {
    min-width: 0;
    border: 1px solid color-mix(in srgb, var(--color-dark) 7%, transparent);
    border-radius: 19px;
    background: var(--color-white);
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(43, 45, 66, .05);
}

.trip-events__card-visual {
    position: relative;
    aspect-ratio: 16 / 8.6;
    background:
        radial-gradient(circle at 78% 25%, var(--color-yellow) 0 8%, transparent 9%),
        radial-gradient(circle at 18% 78%, var(--color-mint) 0 17%, transparent 18%),
        linear-gradient(135deg, var(--color-aqua), var(--color-surface));
    overflow: hidden;
}

.trip-events__card-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.trip-events__card-placeholder {
    position: absolute;
    inset: 0;
    padding: 18px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    color: var(--color-dark);
}

.trip-events__card-placeholder span {
    max-width: 72%;
    font-family: var(--font-editorial);
    font-size: 24px;
    line-height: 1;
}

.trip-events__card-placeholder strong {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--color-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    font-size: 16px;
}

.trip-events__card-body {
    padding: 17px;
}

.trip-events__card-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.trip-events__card-category {
    color: var(--text-primary);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .9px;
    text-transform: uppercase;
}

.trip-events__card-distance {
    padding: 5px 8px;
    border-radius: 999px;
    background: var(--color-surface);
    color: var(--text-primary);
    font-size: 11px;
    font-weight: 800;
}

.trip-events__card h3 {
    margin: 10px 0 7px;
    color: var(--text-primary);
    font-size: 18px;
    line-height: 1.18;
    letter-spacing: -.35px;
}

.trip-events__card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 700;
}

.trip-events__card-description {
    margin: 11px 0 0;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.55;
}

.trip-events__card-footer {
    margin-top: 15px;
    padding-top: 13px;
    border-top: 1px solid color-mix(in srgb, var(--color-dark) 7%, transparent);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.trip-events__card-price {
    min-width: 0;
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.trip-events__card-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.trip-events__card-link,
.trip-events__card-source {
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.trip-events__card-source {
    color: var(--text-secondary);
    font-weight: 700;
}

.trip-events__card-link:hover,
.trip-events__card-source:hover {
    text-decoration: underline;
}

.trip-events__empty {
    grid-column: 1 / -1;
    padding: 28px;
    border-radius: 18px;
    background: var(--color-white);
    text-align: center;
}

.trip-events__empty strong {
    display: block;
    font-size: 16px;
}

.trip-events__empty span {
    display: block;
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: 13px;
}

/* =========================================================
   EVENT MAP MARKERS
   ========================================================= */

.trip-events__map-marker-icon {
    border: 0 !important;
    background: transparent !important;
}

.trip-events__map-marker {
    width: 30px;
    height: 30px;

    border: 2px solid var(--color-dark);
    border-radius: 50%;

    background: var(--color-mint);

    display: flex;
    align-items: center;
    justify-content: center;

    color: var(--color-dark);

    font-size: 12px;
    font-weight: 900;

    box-shadow:
        0 4px 12px rgba(43, 45, 66, .20),
        0 0 0 4px rgba(104, 237, 198, .18);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.trip-events__map-marker-icon:hover
.trip-events__map-marker {
    transform: scale(1.12);

    box-shadow:
        0 7px 18px rgba(43, 45, 66, .25),
        0 0 0 5px rgba(104, 237, 198, .22);
}

.trip-events__map-marker--multiple {
    width: 36px;
    height: 36px;

    background: var(--color-yellow);

    box-shadow:
        0 6px 16px rgba(43, 45, 66, .22),
        0 0 0 5px rgba(247, 216, 90, .22);
}


/* =========================================================
   EVENT MAP POPUP
   ========================================================= */

.trip-events__map-popup-shell
.leaflet-popup-content-wrapper {
    padding: 0;

    border: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 8%,
            transparent
        );

    border-radius: 18px;

    background: var(--color-white);

    color: var(--text-primary);

    overflow: hidden;

    box-shadow:
        0 22px 55px
        rgba(43, 45, 66, .20);
}

.trip-events__map-popup-shell
.leaflet-popup-content {
    width: auto !important;
    margin: 0;
}

.trip-events__map-popup-shell
.leaflet-popup-tip {
    background: var(--color-white);
}

.trip-events__map-popup-shell
.leaflet-popup-close-button {
    top: 9px;
    right: 9px;

    width: 30px;
    height: 30px;

    border-radius: 50%;

    background: var(--color-surface);

    color: var(--color-dark);

    font-size: 19px;
    line-height: 28px;

    transition: .15s ease;
}

.trip-events__map-popup-shell
.leaflet-popup-close-button:hover {
    background: var(--color-yellow);
    color: var(--color-dark);
}


.trip-events__map-popup {
    width: min(
        330px,
        calc(100vw - 80px)
    );

    background: var(--color-white);
}


.trip-events__map-popup-header {
    padding: 15px 48px 13px 15px;

    border-bottom: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 7%,
            transparent
        );

    background:
        linear-gradient(
            135deg,
            color-mix(
                in srgb,
                var(--color-aqua) 20%,
                var(--color-white)
            ),
            color-mix(
                in srgb,
                var(--color-mint) 12%,
                var(--color-white)
            )
        );
}

.trip-events__map-popup-header strong {
    display: block;

    color: var(--text-primary);

    font-family: var(--font-editorial);
    font-size: 17px;
    line-height: 1.15;
}

.trip-events__map-popup-header span {
    display: block;

    margin-top: 3px;

    color: var(--text-secondary);

    font-size: 11px;
    font-weight: 700;
}


.trip-events__map-popup-list {
    max-height: 405px;

    overflow-y: auto;
    overscroll-behavior: contain;
}


.trip-events__map-popup-card {
    width: 100%;

    padding: 10px 12px;

    border: 0;
    border-bottom: 1px solid
        color-mix(
            in srgb,
            var(--color-dark) 6%,
            transparent
        );

    background: var(--color-white);

    display: grid;
    grid-template-columns:
        54px
        minmax(0, 1fr)
        18px;

    align-items: center;
    gap: 11px;

    color: var(--text-primary);

    text-align: left;
    font: inherit;

    cursor: pointer;

    transition:
        background .16s ease,
        transform .16s ease;
}

.trip-events__map-popup-card:last-child {
    border-bottom: 0;
}

.trip-events__map-popup-card:hover {
    background:
        color-mix(
            in srgb,
            var(--color-mint) 10%,
            var(--color-white)
        );
}

.trip-events__map-popup-card:focus-visible {
    position: relative;
    z-index: 2;

    outline: 2px solid var(--color-mint);
    outline-offset: -2px;
}


.trip-events__map-popup-visual {
    width: 54px;
    height: 54px;

    border-radius: 12px;

    overflow: hidden;

    background: var(--color-surface);
}

.trip-events__map-popup-visual img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;
}

.trip-events__map-popup-visual--fallback {
    display: flex;
    align-items: center;
    justify-content: center;

    background:
        linear-gradient(
            145deg,
            var(--color-aqua),
            var(--color-mint)
        );

    color: var(--color-dark);

    font-family: var(--font-editorial);
    font-size: 20px;
    font-weight: 700;
}


.trip-events__map-popup-copy {
    min-width: 0;

    display: flex;
    flex-direction: column;
}


.trip-events__map-popup-category {
    margin-bottom: 3px;

    color:
        color-mix(
            in srgb,
            var(--color-mint) 68%,
            var(--color-dark)
        );

    font-size: 9px;
    font-weight: 900;
    letter-spacing: .7px;

    text-transform: uppercase;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.trip-events__map-popup-title {
    color: var(--text-primary);

    font-size: 13px;
    font-weight: 800;
    line-height: 1.25;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    overflow: hidden;
}


.trip-events__map-popup-meta {
    margin-top: 5px;

    color: var(--text-secondary);

    font-size: 11px;
    font-weight: 650;
    line-height: 1.3;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.trip-events__map-popup-arrow {
    color: var(--color-dark);

    font-size: 17px;
    font-weight: 800;

    transition: transform .16s ease;
}

.trip-events__map-popup-card:hover
.trip-events__map-popup-arrow {
    transform: translateX(2px);
}

/* =========================================================
   EVENT CARD INTERACTION + EVENT DETAIL DIALOG
   ========================================================= */

.trip-events__card {
    cursor: pointer;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.trip-events__card:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--color-mint) 46%, var(--color-dark));
    box-shadow: 0 18px 42px rgba(43, 45, 66, .10);
}

.trip-events__card:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--color-mint) 72%, var(--color-white));
    outline-offset: 3px;
}

.trip-events__card-details {
    flex: 0 0 auto;
    color: var(--text-primary);
    font-size: 12px;
    font-weight: 800;
}

.trip-events__map .leaflet-interactive {
    cursor: pointer;
}

.trip-events .leaflet-tooltip {
    padding: 8px 10px;
    border: 0;
    border-radius: 10px;
    background: var(--color-dark);
    color: var(--color-white);
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(43, 45, 66, .18);
}

.trip-events .leaflet-tooltip-top::before {
    border-top-color: var(--color-dark);
}

body.trip-events-dialog-open {
    overflow: hidden;
}

.trip-events__dialog {
    width: min(940px, calc(100vw - 34px));
    max-width: 940px;
    max-height: calc(100dvh - 34px);
    padding: 0;
    border: 0;
    border-radius: 26px;
    background: transparent;
    color: var(--text-primary);
    overflow: auto;
    box-shadow: 0 30px 80px rgba(19, 23, 42, .28);
}

.trip-events__dialog::backdrop {
    background: rgba(24, 28, 47, .64);
    backdrop-filter: blur(8px);
}

.trip-events__dialog[open] {
    animation: trip-events-dialog-in .18s ease-out;
}

.trip-events__dialog [hidden] {
    display: none !important;
}

.trip-events__dialog-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, .88fr) minmax(0, 1.12fr);
    min-height: 520px;
    border: 1px solid color-mix(in srgb, var(--color-dark) 8%, transparent);
    border-radius: 26px;
    background: var(--color-white);
    overflow: hidden;
}

.trip-events__dialog-close {
    position: absolute;
    z-index: 5;
    top: 16px;
    right: 16px;
    width: 42px;
    height: 42px;
    padding: 0 0 2px;
    border: 1px solid color-mix(in srgb, var(--color-dark) 9%, transparent);
    border-radius: 50%;
    background: color-mix(in srgb, var(--color-white) 92%, transparent);
    color: var(--color-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font: inherit;
    font-size: 25px;
    line-height: 1;
    box-shadow: 0 10px 26px rgba(43, 45, 66, .12);
    backdrop-filter: blur(7px);
    transition: .18s ease;
}

.trip-events__dialog-close:hover {
    transform: rotate(4deg) scale(1.04);
}

.trip-events__dialog-visual {
    position: relative;
    min-height: 100%;
    background:
        radial-gradient(circle at 72% 20%, var(--color-yellow) 0 9%, transparent 10%),
        radial-gradient(circle at 18% 82%, var(--color-mint) 0 18%, transparent 19%),
        linear-gradient(145deg, var(--color-aqua), var(--color-surface));
    overflow: hidden;
}

.trip-events__dialog-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(43, 45, 66, 0) 48%,
        rgba(43, 45, 66, .38) 100%
    );
    pointer-events: none;
}

.trip-events__dialog-visual > img {
    width: 100%;
    height: 100%;
    min-height: 520px;
    object-fit: cover;
    display: block;
}

.trip-events__dialog-placeholder {
    position: absolute;
    inset: 0;
    padding: 34px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 12px;
    color: var(--color-dark);
}

.trip-events__dialog-placeholder span {
    max-width: 280px;
    font-family: var(--font-editorial);
    font-size: 34px;
    line-height: .98;
}

.trip-events__dialog-placeholder strong {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: var(--color-dark);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-white);
    font-size: 20px;
}

.trip-events__dialog-category {
    position: absolute;
    z-index: 2;
    left: 20px;
    top: 20px;
    max-width: calc(100% - 40px);
    padding: 8px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    color: var(--color-dark);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .9px;
    text-transform: uppercase;
    box-shadow: 0 10px 24px rgba(43, 45, 66, .12);
    backdrop-filter: blur(7px);
}

.trip-events__dialog-content {
    min-width: 0;
    padding: 42px 42px 34px;
    display: flex;
    flex-direction: column;
}

.trip-events__dialog-topline {
    padding-right: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.trip-events__dialog-topline > span:first-child {
    color: color-mix(in srgb, var(--color-mint) 78%, var(--color-dark));
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 1.5px;
}

.trip-events__dialog-distance {
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--color-surface);
    color: var(--text-primary);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.trip-events__dialog h2 {
    margin: 18px 0 0;
    color: var(--text-primary);
    font-family: var(--font-editorial);
    font-size: clamp(30px, 3vw, 42px);
    line-height: 1.04;
    letter-spacing: -1px;
}

.trip-events__dialog-description {
    margin: 16px 0 0;
    color: var(--text-secondary);
    font-size: 14px;
    line-height: 1.7;
}

.trip-events__dialog-facts {
    margin-top: 24px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}

.trip-events__dialog-fact {
    min-width: 0;
    min-height: 92px;
    padding: 14px 15px;
    border: 1px solid color-mix(in srgb, var(--color-dark) 7%, transparent);
    border-radius: 15px;
    background: color-mix(in srgb, var(--color-surface) 72%, var(--color-white));
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.trip-events__dialog-fact:nth-child(1) {
    box-shadow: inset 3px 0 0 var(--color-yellow);
}

.trip-events__dialog-fact:nth-child(2) {
    box-shadow: inset 3px 0 0 var(--color-aqua);
}

.trip-events__dialog-fact:nth-child(3) {
    box-shadow: inset 3px 0 0 var(--color-mint);
}

.trip-events__dialog-fact:nth-child(4) {
    box-shadow: inset 3px 0 0 var(--color-dark);
}

.trip-events__dialog-fact > span {
    color: var(--text-secondary);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 1.1px;
}

.trip-events__dialog-fact strong {
    margin-top: 5px;
    color: var(--text-primary);
    font-size: 13px;
    line-height: 1.35;
}

.trip-events__dialog-source {
    display: inline-block;

    margin-top: 5px;

    color: var(--text-primary);

    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;

    text-decoration: none;
}

.trip-events__dialog-source:hover {
    text-decoration: underline;
}

.trip-events__dialog-fact small {
    margin-top: 3px;
    color: var(--text-secondary);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
}

.trip-events__dialog-actions {
    margin-top: auto;
    padding-top: 26px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.trip-events__dialog-primary,
.trip-events__dialog-secondary {
    min-height: 48px;
    padding: 0 16px;
    border-radius: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition: .18s ease;
}

.trip-events__dialog-primary {
    min-width: 190px;
    background: var(--color-dark);
    color: var(--color-white);
    box-shadow: 0 12px 26px rgba(43, 45, 66, .15);
}

.trip-events__dialog-secondary {
    border: 1px solid color-mix(in srgb, var(--color-dark) 10%, transparent);
    background: var(--color-surface);
    color: var(--text-primary);
}

.trip-events__dialog-primary:hover,
.trip-events__dialog-secondary:hover {
    transform: translateY(-1px);
}

@keyframes trip-events-dialog-in {
    from {
        opacity: 0;
        transform: translateY(10px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 1000px) {

    .trip-events__categories {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

}

@media (max-width: 980px) {
    .trip-events__cards {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {

    /*
     * Events yra jau trip-places viduje,
     * todėl papildomo mobile padding nereikia.
     */
    .trip-events {
        padding: 0;
    }


    /*
     * Tokia pati heading struktūra kaip Places.
     */
    .trip-events__discover-head {
        margin-top: 25px;

        display: block;
    }


    .trip-events__discover-head h3 {
        margin: 3px 0 0;

        font-size: 25px;

        line-height: 1.05;
    }


    .trip-events__discover-head > small {
        display: block;

        margin-top: 7px;

        text-align: left;
    }


    .trip-events__intro {
        grid-template-columns: 1fr;
    }

    .trip-events__pulse {
        display: none;
    }

    .trip-events__filter-heading,
    .trip-events__form-footer,
    .trip-events__results-header,
    .trip-events__map-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .trip-events__filter-heading small,
    .trip-events__map-heading small {
        text-align: left;
    }

    .trip-events__radius-list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .trip-events__categories {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 7px;
    }

    .trip-events__discover-button,
    .trip-events__adjust-button {
        width: 100%;
    }

    .trip-events__day-filter {
        margin-top: 18px;
        padding: 12px;
    }

    .trip-events__day-filter-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .trip-events__day-filter-heading small {
        text-align: left;
    }

    .trip-events__day-option {
        min-width: 98px;
    }

    .trip-events__map {
        height: 390px;
    }

    .trip-events__map-popup-list {
        max-height: 280px;
    }

    .trip-events__dialog {
        width: min(680px, calc(100vw - 20px));
        max-height: calc(100dvh - 20px);
        border-radius: 20px;
    }

    .trip-events__dialog-card {
        grid-template-columns: 1fr;
        min-height: 0;
        border-radius: 20px;
    }

    .trip-events__dialog-visual {
        min-height: 230px;
        aspect-ratio: 16 / 8.6;
    }

    .trip-events__dialog-visual > img {
        min-height: 230px;
    }

    .trip-events__dialog-content {
        padding: 26px 20px 22px;
    }

    .trip-events__dialog-topline {
        padding-right: 0;
    }

    .trip-events__dialog h2 {
        font-size: 30px;
    }

    .trip-events__dialog-facts {
        grid-template-columns: 1fr;
    }

    .trip-events__dialog-fact {
        min-height: 76px;
    }

    .trip-events__dialog-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .trip-events__dialog-primary,
    .trip-events__dialog-secondary {
        width: 100%;
    }
}



/* =========================================================
   TRIP PLANNER INTEGRATION
   ========================================================= */

.trip-events__dialog-plan {
    min-height: 42px;
    padding: 0 14px;

    border: 0;
    border-radius: 11px;

    background: var(--color-yellow);
    color: var(--color-dark);

    font-size: 11px;
    font-weight: 900;

    cursor: pointer;

    transition:
        transform .16s ease,
        box-shadow .16s ease;
}

.trip-events__dialog-plan:hover {
    transform: translateY(-1px);

    box-shadow:
        0 8px 18px
        rgba(43, 45, 66, .10);
}

.trip-events__dialog-plan--added {
    background:
        color-mix(
            in srgb,
            var(--color-mint) 45%,
            var(--color-white)
        );
}

.trip-events__card-planned {
    margin-left: auto;

    padding: 5px 7px;

    border-radius: 999px;

    background:
        color-mix(
            in srgb,
            var(--color-mint) 32%,
            var(--color-white)
        );

    color: var(--color-dark);

    font-size: 8px;
    font-weight: 900;
    letter-spacing: .45px;

    text-transform: uppercase;
}

@media (max-width: 720px) {

    .trip-events__dialog-plan {
        width: 100%;
    }

}



/* =========================================================
   EVENT SEARCH DRAWER
   ========================================================= */

.trip-events__form--drawer {
    overflow: hidden;

    max-height: 0;

    margin-top: 0;

    padding-top: 0;
    padding-bottom: 0;

    border-color: transparent;

    opacity: 0;

    transform:
        translateY(-10px);

    box-shadow: none;

    pointer-events: none;

    transition:
        max-height .26s ease,
        margin-top .26s ease,
        padding .26s ease,
        opacity .18s ease,
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
}


.trip-events__form--drawer.is-open {
    max-height: 900px;

    margin-top: 16px;

    padding-top: 18px;
    padding-bottom: 18px;

    border-color:
        color-mix(
            in srgb,
            var(--color-mint) 42%,
            var(--color-dark)
        );

    opacity: 1;

    transform:
        translateY(0);

    box-shadow:
        0 16px 38px rgba(43, 45, 66, .08);

    pointer-events: auto;
}


/* In adjust mode we do not need the long footer explanation. */

.trip-events__form--drawer
.trip-events__form-footer > div {
    display: none;
}


.trip-events__form--drawer
.trip-events__form-footer {
    justify-content: flex-end;
}


.trip-events__categories:has(
    input:disabled
) {
    pointer-events: none;
    opacity: .72;
}


.trip-events__category-option input:disabled + span {
    cursor: wait;
}