html{
    scroll-behavior: smooth;
}

/* Remove underline from linked headings */
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    text-decoration: none;
}

/* Remove DuoTone on hover for image and cover */
[class*="wp-block"][class]:hover > img,
[class*="wp-block"][class]:hover > picture > img {
    filter: none;
}

/* Default form styles */
.button,
button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: var(--wp--preset--color--tertiary);
    border: none;
    border-radius: var(--wp--custom--border-radius--default);
    box-shadow: none;
    color: var(--wp--preset--color--base);
    font-family: var(--wp--custom--font-primary);
    font-size: var(--wp--preset--font-size--normal);
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1;
    max-width: 100%;
    opacity: 1;
    padding: calc(0.667em + 2px) calc(1.333em + 2px);
    text-decoration: none;
    text-align: center;
    transition: all 0.2s ease-in-out;
    transform: scale(1);
}

.wp-block-button__link{
    transition: all 0.2s ease-in-out;
    transform: scale(1);
}

.wp-block-button__link:hover,
.button:hover,
button:hover,
input:hover[type='button'],
input:hover[type='reset'],
input:hover[type='submit'],
.button:active,
button:active,
input:active[type='button'],
input:active[type='reset'],
input:active[type='submit'],
.button:focus,
button:focus,
input:focus[type='button'],
input:focus[type='reset'],
input:focus[type='submit'] {
    opacity: 0.9;
    transform: scale(1.05)
}

input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='search'],
input[type='number'],
input[type='tel'],
input[type='range'],
input[type='date'],
input[type='month'],
input[type='week'],
input[type='time'],
input[type='datetime'],
input[type='datetime-local'],
input[type='color'],
input[type='checkbox'],
textarea {
    background: var(--wp--preset--color--base-alt-1);
    border: 1px solid var(--wp--preset--color--base-alt-1);
    border-radius: 5px;
    transition: all 0.2s ease-in-out;
    color: var(--wp--preset--color--contrast);
    font-weight: var(--wp--custom--font-weight--normal);
    line-height: 1.5;
    max-width: 100%;
    padding: 8px;
    transition: all 0.2s ease-in-out;
    transform: scale(1)
}

input[type='text']::-moz-placeholder,
input[type='email']::-moz-placeholder,
input[type='url']::-moz-placeholder,
input[type='password']::-moz-placeholder,
input[type='search']::-moz-placeholder,
input[type='number']::-moz-placeholder,
input[type='tel']::-moz-placeholder,
input[type='range']::-moz-placeholder,
input[type='date']::-moz-placeholder,
input[type='month']::-moz-placeholder,
input[type='week']::-moz-placeholder,
input[type='time']::-moz-placeholder,
input[type='datetime']::-moz-placeholder,
input[type='datetime-local']::-moz-placeholder,
input[type='color']::-moz-placeholder,
input[type='checkbox']::-moz-placeholder,
textarea::-moz-placeholder {
    color: #4a4a4a;
}

input[type='text']::placeholder,
input[type='email']::placeholder,
input[type='url']::placeholder,
input[type='password']::placeholder,
input[type='search']::placeholder,
input[type='number']::placeholder,
input[type='tel']::placeholder,
input[type='range']::placeholder,
input[type='date']::placeholder,
input[type='month']::placeholder,
input[type='week']::placeholder,
input[type='time']::placeholder,
input[type='datetime']::placeholder,
input[type='datetime-local']::placeholder,
input[type='color']::placeholder,
input[type='checkbox']::placeholder,
textarea::placeholder {
    color: #4a4a4a;
}

input[type='text']:hover,
input[type='text']:active,
input[type='text']:focus,
input[type='email']:hover,
input[type='email']:active,
input[type='email']:focus,
input[type='url']:hover,
input[type='url']:active,
input[type='url']:focus,
input[type='password']:hover,
input[type='password']:active,
input[type='password']:focus,
input[type='search']:hover,
input[type='search']:active,
input[type='search']:focus,
input[type='number']:hover,
input[type='number']:active,
input[type='number']:focus,
input[type='tel']:hover,
input[type='tel']:active,
input[type='tel']:focus,
input[type='range']:hover,
input[type='range']:active,
input[type='range']:focus,
input[type='date']:hover,
input[type='date']:active,
input[type='date']:focus,
input[type='month']:hover,
input[type='month']:active,
input[type='month']:focus,
input[type='week']:hover,
input[type='week']:active,
input[type='week']:focus,
input[type='time']:hover,
input[type='time']:active,
input[type='time']:focus,
input[type='datetime']:hover,
input[type='datetime']:active,
input[type='datetime']:focus,
input[type='datetime-local']:hover,
input[type='datetime-local']:active,
input[type='datetime-local']:focus,
input[type='color']:hover,
input[type='color']:active,
input[type='color']:focus,
input[type='checkbox']:hover,
input[type='checkbox']:active,
input[type='checkbox']:focus,
textarea:hover,
textarea:active,
textarea:focus {
    border: 1px solid var(--wp--preset--color--primary);
    outline: none;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: var(--wp--preset--color--base-alt-1);
    background-image: linear-gradient(45deg, transparent 50%, #4a4a4a 50%), linear-gradient(135deg, #4a4a4a 50%, transparent 50%), linear-gradient(to right, #4a4a4a, #4a4a4a);
    background-position: calc(100% - 22px) calc(0.9em + 2px), calc(100% - 17px) calc(0.9em + 2px), calc(100% - 2.5em) 0.4em;
    background-size: 5px 5px, 5px 5px, 1px 1.5em;
    background-repeat: no-repeat;
    border: 1px solid var(--wp--preset--color--base-alt-1);
    color: #4a4a4a;
    border-radius: 5px;
    max-width: 100%;
    max-width: 100%;
    margin: 0.25em 0 0.5em;
    padding-right: 60px !important;
    line-height: 1.5
}

textarea {
    max-width: 100%
}

label{
    font-size: var(--wp--preset--font-size--normal) !important;
}

/* Sticky Header Styles */

@media screen and (min-width: 768px) {
    .site-header.is-position-sticky {
        position: fixed !important;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 100;
        background-color: transparent !important;
        transition: background-color 0.3s ease-in-out;
    }

    .site-header.is-position-sticky.scrolled {
        background-color: var(--wp--preset--color--primary) !important;
    }

    .site-header.is-position-sticky > div {
        border-top: 1px solid rgba(255,255,255,0.25);
        padding-top: 3px;
        padding-bottom: 3px;
        transition: border 0.3s ease-in-out;
    }

    .site-header.is-position-sticky > div:last-child {
        border-bottom: 1px solid rgba(255,255,255,0.25);
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .site-header.is-position-sticky > div:last-child > div{
        overflow: visible;
    }

    .site-header.is-position-sticky.scrolled > div {
        border-top: 0;
        border-bottom: 0;
    }

    .site-header.is-position-sticky.scrolled > div:last-child {
        padding-top: 3px;
        padding-bottom: 3px;
    }

    .site-header.is-position-sticky .wp-block-site-logo img {
        transition: max-width 0.3s ease-in-out;
    }

    .site-header.is-position-sticky.scrolled .wp-block-site-logo img{
        max-width: 113px !important;
        height: auto;
    }

    main.header-is-sticky {
        margin-top: 0 !important;
        position: relative;
        z-index: 1;
    }

    footer.header-is-sticky {
        position: relative;
        z-index: 1;
    }

    .sticky-header-spacer {
        min-height: 160px !important; 
    }
}

@media screen and (max-width: 767px) {
    .site-header.is-position-sticky {
        position: static !important;
    }

    .site-header .wp-block-site-logo img {
        max-width: 150px !important;
        height: auto;
    }

    .sticky-header-spacer {
        min-height: 1px !important; 
        display: none;
    }
}

:is(.is-position-sticky):not(main .is-position-sticky) {
    position: static; 
}

/* 
 * Add vertical dividers between navigation items in the site header on desktop.
 * Removes gap between items and adds a right border (except for the last item).
 */
@media screen and (min-width: 768px) {
    .site-header .wp-block-navigation__container > .wp-block-navigation-item:not(:last-child) {
        position: relative;
        margin-right: 12px;
        padding-right: 12px;
        margin-left: 0;
        padding-left: 0;
    }

    .site-header .wp-block-navigation__container > .wp-block-navigation-item:not(:last-child)::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        width: 1px;
        height: 1.5em;
        background: var(--wp--preset--color--primary);
        display: block;
    }
    .site-header .wp-block-navigation__container {
        gap: unset;
    }
}

/* Style for round pagination numbers with grey background */
.wp-block-query-pagination-numbers .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.2em;
    height: 2.2em;
    margin: 0 0.2em;
    border-radius: 50%;
    background: #e0e0e0;
    color: #222;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}

.wp-block-query-pagination-numbers .page-numbers.current,
.wp-block-query-pagination-numbers .page-numbers:hover {
    background: var(--wp--preset--color--primary, #333);
    color: #fff;
}


/* 
 * Responsive navigation styles for screens up to 767px wide:
 * - Adds a dash ("- ") before submenu items for better visual hierarchy.
 * - Increases left padding for submenu containers to improve indentation.
 * - Sets larger font size for navigation items for better readability on mobile.
 * - Restricts the responsive navigation container's width to 350px, aligns it to the right,
 *   and ensures it uses the full available width with proper box-sizing.
 */
@media screen and (max-width: 767px) {
    .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content::before {
        content: "- ";
        font-weight: normal;
        margin-right: 0.5em;
    }

    .wp-block-navigation__submenu-container {
        padding-left: 10px !important;
    }

    .wp-block-navigation__submenu-container > .wp-block-navigation-item > .wp-block-navigation-item__content,
    .site-header .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
        font-size: var(--wp--preset--font-size--large);
    }

    .wp-block-navigation__responsive-container {
        max-width: 350px !important;
        right: 0;
        left: auto;
        width: 100%;
        box-sizing: border-box;
    }
}