/* Variables */
:root {
    --wa-font-family-body: 'Geist', sans-serif;
    --wa-font-family-heading: 'Geist', sans-serif;
    --wa-font-weight-heading: 700;

    --wa-border-radius-scale: 5;
    --wa-panel-border-radius: var(--wa-border-radius-s);

    --wa-color-text-normal: #292929;
    --wa-color-text-quiet: #7C7C7C;
    --wa-color-text-link: #6A7615;

    --wa-color-green-95: #FCFDE8;
    --wa-color-green-90: #F8F9CE;
    --wa-color-green-80: #F0F4A2;
    --wa-color-green-70: #E3EA6C;
    --wa-color-green-60: #D0DC3F;
    --wa-color-green-50: #AFBD20;
    --wa-color-green-40: #879612;
    --wa-color-green-30: #6A7615;
    --wa-color-green-20: #535D17;
    --wa-color-green-10: #474F18;
    --wa-color-green-05: #252C07;
    --wa-color-green: var(--wa-color-green-60);
    --wa-color-green-key: 60;

    --wa-color-blue-95: #F1F8FE;
    --wa-color-blue-90: #E2EFFC;
    --wa-color-blue-80: #BFDFF8;
    --wa-color-blue-70: #86C5F3;
    --wa-color-blue-60: #45A7EB;
    --wa-color-blue-50: #1D8CDA;
    --wa-color-blue-40: #0F6CB6;
    --wa-color-blue-30: #0E5896;
    --wa-color-blue-20: #104B7C;
    --wa-color-blue-10: #133F67;
    --wa-color-blue-05: #0C2845;
    --wa-color-blue: var(--wa-color-blue-50);
    --wa-color-blue-key: 50;

    --wa-link-decoration-default: none;
}

/* Utility classes */
.w100 {
    width: 100%;
}

.h100 {
    height: 100%;
}

.w100p {
    width: 100px;
}

.centered {
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
}

.man {
    margin: 0;
}

.mts {
    margin-top: var(--wa-space-s);
}

.mtm {
    margin-top: var(--wa-space-m);
}

.pre {
    white-space: pre-line;
}

.col-30 {
    --min-column-size: 30ch;
}

.colored {
    color: var(--wa-color-on-quiet);
}

/* Responsive */
@media screen and (min-width: 768px) {
    .mobile_only {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {
    .desktop_only {
        display: none !important;
    }

    .wa-stack.centered {
        padding: var(--wa-space-3xl);
    }
}

/* Site sections */
[slot='header'] {
    padding: var(--wa-space-xs) var(--wa-space-3xl);
    --wa-color-text-link: var(--wa-color-text-normal);
}

wa-page[view='desktop'] [slot='navigation'] {
    display: none;
}

wa-page[view='mobile'] #header_nav {
    display: none;
}

wa-page::part(header) {
    background-color: white;
}

.hero {
    padding: var(--wa-space-2xl) 0 var(--wa-space-2xl) var(--wa-space-3xl);
    background-color: var(--wa-color-green-95);
}

.hero h1 {
    color: var(--wa-color-green-30);
}

.hero .wa-frame {
    aspect-ratio: 5 / 3;
}

.hero img {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.categories-3-4 .wa-frame {
    aspect-ratio: 3 / 4;
}

.categories-4-3 .wa-frame {
    aspect-ratio: 4 / 3;
}

.categories-16-10 .wa-frame {
    aspect-ratio: 16 / 10;
}

.categories-1-1 .wa-frame {
    aspect-ratio: 1 / 1;
}

.wa-grid wa-card {
    --wa-panel-border-radius: var(--wa-border-radius-s);
}

.wa-grid .wa-stack.wa-link-plain {
    margin-bottom: var(--wa-space-m);
}

.map_with_text > div {
    overflow: hidden;
    background-color: var(--wa-color-blue-95);
}

.map_container {
    width: 100%;
    height: 320px;
}

.map_container + div {
    padding: 0 var(--wa-space-xl);
}

.details h1 {
    margin-bottom: var(--wa-space-s);
}

.details wa-button[appearance='plain'] {
    --wa-form-control-padding-inline: 0;
    --wa-form-control-border-radius: 0;
}

.details wa-button[appearance='plain']::part(label) {
    text-decoration: underline;
}

.details .categories-1-1 .wa-frame {
    max-height: 60vh;
}

#widgit .widgit_result, #widgit .widgit_filters {
    border-radius: var(--wa-border-radius-m);
    overflow: hidden;
}

#directions_map {
    height: 100%;
}

#search_results[complete] + .search_grid {
    display: none;
}

.list_filters_wrapper {
    gap: var(--wa-space-l);
}

.filters_form wa-input[type='date'] {
    position: relative;
}

.filters_form wa-input[type='date']::part(hint) {
    position: absolute;
    top: -14px;
    left: 15px;
    background-color: white;
    padding: 0 4px;
    font-size: 12px;
}

.weather_steps wa-scroller {
    white-space: nowrap;
}

.weather_steps wa-card {
    width: 120px;
    display: inline-block;
    text-align: center;
}