/*
Theme Name:   Palmette
Template:    twentytwentyfive
Author: Ray Studio
Author URI: https://ray.studio/
Description: A bespoke theme built exclusively for Palmette Brasserie and Bar.
Version: 1.0.0
*/

/*
:where(a,button,[role=button],input,select,textarea):focus:not(:focus-visible) {
    outline: 0!important;
    box-shadow: none!important
}

.ti-widget[data-wkey="feed-instagram"][data-style=custom-style][data-widget-type=social] .ti-widget-card[data-source=Instagram] .ti-card-body .ti-card-media:after{display:none !Important;}

:where(a,button,[role=button],input,select,textarea):focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px
}

.ti-widget[data-wkey="feed-instagram"][data-style=custom-style][data-widget-type=social] {
    margin-bottom: 0px !important;
    }
*/

main, :where(.wp-site-blocks) > * {
    margin-block-start: 0px !important;
    }    

body {
    background-color: #f7f0eb;
    font-family: "Playfair",serif!important
}

.wpcf7-text, .wpcf7-date, .wpcf7-textarea {
    background: transparent;
    font-family: 'Playfair', serif;
    font-size: 16px;
    border: 2px solid var(--wp--preset--color--forest);
    border-radius: 5px;
    padding: 5px;
    max-width: 300px;
}

.map-embed-container {
    position: relative;
    padding-bottom: 35%;
    height: 0;
    overflow: hidden;
    max-width: 100%
}

.map-embed-container embed,.map-embed-container iframe,.map-embed-container object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.home-page-logo-container {
    position: absolute;
    top: 0;
    width: 100%;
    aspect-ratio: 16 / 9;
    display: flex;
    flex-direction: column;
    justify-content: center
}

.wp-block-navigation-link:hover {
    border-bottom: 2px solid var(--wp--preset--color--seafoam) !important
}

:root :where(.wp-block-navigation a:where(:not(.wp-element-button)):hover) {
    text-decoration: none !important;
    text-decoration-thickness: 0px !important;
}

.script-font {
    font-family: Mr Dafoe;
    letter-spacing:0px!important;
    text-transform: capitalize
}

.background-pattern.top-left {
    position: absolute;
    top: -80px;
    left: -80px;
    z-index: -1
}

.background-pattern.top-right {
    position: absolute;
    top: -80px;
    right: -80px;
    z-index: -1
}

.small-divider {
    width: 100px;
    height: 2px
}

.small-divider.left {
    margin: 10px 0
}

#ot-reservation-widget div,.opentable-embed {
    margin: 0 auto
}

.ot-title,span.icon.ot-icon-sizing {
    display: none
}

.ot-dtp-picker.ot-standard {
    background: 0 0!important
}

.ot-dtp-picker-form {
    border: 0!important;
    background: 0 0!Important
}

.ot-dtp-picker-selector {
    border: 0!important;
    background: #fff!Important;
    margin-bottom: 20px!important
}

a.ot-dtp-picker-selector-link {
    text-decoration: none;
    font-family: "Gill Sans"
}

#ot-reservation-widget,.ot-button {
    text-transform: uppercase
}

#ot-reservation-widget {
    font-family: "Gill Sans"!important
}

.navbar-sticky {
    box-shadow: 0 4px 4px 0 rgba(0,0,0,.15)
}

.relative {
    position: relative
}

html {
    scroll-behavior: smooth
}

@media (prefers-reduced-motion:reduce) {
    html {
        scroll-behavior: auto
    }
}

.wp-block-navigation-item {
    border-bottom: 2px solid transparent;
    transition: all .3s
}

#reservations {
    scroll-margin-top: 200px
}

.ig-title-divider {
    border-bottom-width: 2px!Important
}

.wp-block-navigation-item__label {
    text-transform: uppercase
}

.post-footer a {
    font-family: var(--wp--preset--font-family--gill-sans)!important;
    text-decoration: none
}

.current-menu-item.wp-block-navigation-link {
    border-bottom: 2px solid;
    border-color: var(--wp--preset--color--rose)!important
}

.site-navbar {
    background: #f7f0eb;
    box-shadow: 0 4px 4px 0 rgba(0,0,0,.15)
}

header {
    z-index: 10;
    position: fixed;
    width: 100%;
    top: 0
}

.site-preheader__inner {
    padding: 5px 0 2px;
    font-size:16px !Important;
    letter-spacing: 1.25px
}

.site-preheader__inner a,.site-preheader__inner p {
    margin-block-start: 0;
    margin-block-end: 0;
    text-transform: uppercase!important;
    font-family: "Gill Sans"!important;
    text-decoration: none!important
}

.footer-grid {
    max-width: 1200px;
    margin: 0 auto;
    justify-content: space-between
}

.custom-masonry-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    grid-auto-rows: 500px;
    grid-gap: 0
}

.masonry-item {
    position: relative;
    grid-column: span 1;
    grid-row: span 1;    
    overflow: hidden;
    border-radius: 0
}

.wp-block-button {
    border-radius: 0!Important;
}

.wp-block-button.is-style-primary .wp-block-button__link {
    background: var(--wp--preset--color--forest);
    color: var(--wp--preset--color--cream)
}

.wp-block-button.is-style-primary .wp-block-button__link:hover {
    background: var(--wp--preset--color--suntan);
    color: var(--wp--preset--color--forest)
}

.wp-block-button.is-style-secondary .wp-block-button__link {
    background: var(--wp--preset--color--rose);
    color: var(--wp--preset--color--charcoal)
}

.wp-block-button.is-style-secondary .wp-block-button__link:hover {
    background: var(--wp--preset--color--dark-rose);
    color: var(--wp--preset--color--charcoal)
}

.wp-block-button__link {
    transition: background-color .2s ease,color .2s ease;
    padding-bottom: 12px !Important;
    letter-spacing: 1px;
}

.masonry-item a,.masonry-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease
}

.masonry-item:nth-child(4n+1) {
    grid-column: span 2;
    grid-row: span 1
}

.masonry-item:nth-child(4n+2) {
    grid-column: span 1;
    grid-row: span 2
}

.masonry-item:hover img {
    transform: scale(1.03)
}

@media (max-width:1024px) {
    .custom-masonry-grid {
        grid-auto-rows: 200px;
        grid-gap: 15px
    }
}

@media (max-width:768px) {
    .custom-masonry-grid {
        grid-template-columns: repeat(2,1fr)
    }

    .masonry-item:nth-child(n) {
        grid-column: span 1!important;
        grid-row: span 1!important
    }

    .masonry-item:nth-child(3n+1) {
        grid-column: span 2!important
    }
}

.menu-wrapper {
    max-width: 1200px;
    margin: 40px auto;
    color: var(--wp--preset--color--forest)
}

.menu-nav {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 60px
}

.menu-section h3,.menu-tab-btn {
    text-transform: uppercase;
    color: var(--wp--preset--color--forest)
}

.menu-tab-btn {
    padding: 10px 25px 7px 25px;
    border: 1px solid var(--wp--preset--color--forest);
    background: 0 0;
    font-size: 16px;
    letter-spacing: 2px;
    cursor: pointer;
    transition: .3s;
    font-family: var(--wp--preset--font-family--gill-sans)
}

.menu-tab-btn.active {
    background: var(--wp--preset--color--forest);
    color: #fff
}

.menu-panel,.menu-section.is-featured .menu-divider {
    display: none
}

.menu-panel.active {
    display: block
}

.menu-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start
}

.ot-button {
    transition: all .2s ease,color .2s ease;
}

.ot-dtp-picker input[type=submit]{
	font-size: 20px !important;
	font-weight: 400 !important;
    letter-spacing: 1px !important
}

.ot-button:hover {
    background: var(--wp--preset--color--suntan)!important;
    color: var(--wp--preset--color--forest)!important;
    box-shadow: 0 0 0 .0625rem var(--wp--preset--color--suntan)!important;
    border: .0625rem solid var(--wp--preset--color--suntan)!important
}

.menu-col .menu-section {
    margin-bottom: 40px
}

@media (max-width:850px) {

    .wp-block-button__link{padding: 10px 14px 6px 14px !important }
    
    nav[role=navigation] li.current-menu-item a,nav[role=navigation] li.current-menu-parent a,nav[role=navigation] li.current_page_item a,nav[role=navigation] li.current_page_parent a {
        border: 0
    }

    .menu-grid {
        grid-template-columns: 1fr;
        gap: 0
    }
}

.menu-page-hero {
    display: flex;
    align-items: flex-end
}

.menu-page-hero div {
    max-width: 1200px;
    color: #fff;
    font-family: "Mr Dafoe"
}

.menu-section h3 {
    text-align: center;
    margin-bottom: 25px;
    border: 0
}

.menu-item {
    margin-bottom: 25px;
    line-height: 1.5
}

.item-title {
    font-weight: 700;
    text-transform: uppercase;
    margin-right: 5px
}

.item-body {
    color: #333
}

.item-price {
    font-weight: 400;
    color: #333
}

.menu-section.is-featured {
    grid-column: 2;
    grid-row: 1/span 10;
    border: 2px solid var(--wp--preset--color--forest);
    outline: 2px solid var(--wp--preset--color--forest);
    outline-offset: -8px;
    padding: 40px;
    border-radius: 30px;
    margin-top: 15px
}

.contact-form-container {
    grid-column: 2;
    grid-row: 1/span 10;
    border: 2px solid var(--wp--preset--color--forest);
    outline: 2px solid var(--wp--preset--color--forest);
    outline-offset: -8px;
    padding: 40px;
    border-radius: 30px;
    margin-top: 0px
}

.menu-divider {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 40px 0
}

.menu-divider::after,.menu-divider::before {
    content: "";
    flex: 1;
    border-bottom: 2px solid var(--wp--preset--color--forest)
}

.menu-divider span {
    padding: 0 15px;
    font-size: 20px
}

@media (max-width:850px) {
.contact-form-container {
    padding: 20px !important
}
.ig-grid-title{flex-direction:column; gap:0}
.ig-grid-title h3{font-size:40px}
	.reservation-column{order:2;}
	.fiftypx-top{padding-top:50px !important;}
    .wp-block-video {
        margin-top: 100px!important
    }

    .menu-tab-btn {
        padding: 8px
    }

    .home-page-logo-container {
        pointer-events: none;
        aspect-ratio: 1/1;
        height: auto;
        margin-top: 100px !important;
        padding: 20px
    }

    .home-video video {
        aspect-ratio: 1/1!Important;
        object-fit: cover!Important
    }

    .map-embed-container {
        padding-bottom: 100%!important
    }

    .hamburger {
        padding: 0!important
    }

    .hamburger nav {
        justify-content: center
    }

    .menu-grid {
        grid-template-columns: 1fr
    }

    .menu-section.is-featured {
        grid-column: auto;
        grid-row: auto
    }

    .wp-site-blocks {
        overflow: hidden
    }

    .site-navbar img {
        max-width: 150px
    }

    .site-navbar {
        padding: 0 10px
    }

    main {
        padding: 10px
    }

    .footer-grid {
        flex-direction: column;
        gap: 50px;
        align-items: baseline;
        padding: 10px
    }
}