/*
Theme Name: Number Plates 4D
Author: Seven Hills Creative
Author URI: https://www.sevenhillscreative.co.uk/
Description: Another custom theme for a happy customer!
Tags: accessibility-ready, one-column, two-columns, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
Version: 2022.1
Requires at least: 5.2
Requires PHP: 7.0
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}body{line-height:1}a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}




/* BASE */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    color: #000;
    box-sizing: border-box;
    font-family: "Montserrat", sans-serif;
    /* outline: 1px solid red !important; */
}

html{
    overflow-x: hidden !important;
  }
  
body{
    font-family: "Montserrat", sans-serif;
    overflow-x: hidden !important;
    display: grid;
  }


@media only screen and (max-width: 1100px) {}
@media only screen and (max-width: 960px) {}
@media only screen and (max-width: 760px) {}
@media only screen and (max-width: 660px) {}
@media only screen and (max-width: 560px) {}
@media only screen and (max-width: 460px) {}
@media only screen and (max-width: 360px) {}
@media only screen and (max-width: 320px) {
    body, header, main, section, footer {
    width: 320px;
    }
}


/* @font-face {
    font-family: 'Charles Wright Bold';
    font-style: normal;
    font-weight: normal;
    src: local('Charles Wright Bold'), url('/wp-content/themes/Number-Plates-4D/fonts/CharlesWright-Bold.woff') format('woff');
    } */

@font-face {
  font-family: 'UK Number Plate';
  font-style: normal;
  font-weight: normal;
  src: local('UK Number Plate'), url('/wp-content/themes/Number-Plates-4D/fonts/UKNumberPlate.ttf') format('truetype');
  font-display: swap;
}



/* LAYOUT */

section, article, main, nav, header, #primary {
    display: grid;
    grid-template-columns: repeat(16, 1fr);
    grid-column: 1 / 17;
    justify-self: center;
    max-width: 2000px;
    width: 100%;
}

footer {
    display: grid;
    grid-template-columns: repeat(16, 1fr);
    grid-column: 1 / 17;
    justify-self: center;
    max-width: 2000px;
    width: 100%;
}


/* BUTTON LINKS */
.all-button, input[type=submit] {
    justify-self: center;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    padding: 1em 1.5em;
    text-transform: uppercase;
    color: #000;
}

.yellow-button {
    background-color: #FFC833;
}

.green-button {
    background-color: #00AC4B;
    color: #fff;
}

.white-button {
    background-color: #fff;
}

@media only screen and (max-width: 1000px) {
    .all-button, input[type=submit] {
        padding: 1em 0.5em;
    }

}




/* TEXT */
h1, h2, h3, h4, h5, h6{
    color:#000;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
}

h1{
    font-size: 80px;
}

h1 span {
    font-size: 80px;
}

h2{
    font-size: 3.125em;
}

h3{
    font-size: 2.5em;
}

h4{
    font-size: 1em;

}

p{
    color: #000;
    font-size: 1.125em;
    line-height: 1.5;
}

label{
    font-size: 1.25em;
    text-transform: uppercase;  
}

.faqs  ul li,
.faqs  ol li {
    color: #000;
    font-size: 18px;
    line-height: 1.5;
    padding: .5em 0;
    list-style-type: disc;
}

.faqs  ul,  .faqs  ol {
    color: #000;
    font-size: 18px;
    line-height: 1.5;
    margin-left: 2em;
    padding: 1em 0;
}

img {
    width: 100%;
}

ul.main-nav{
  padding: 0;
}

.faqs ol li{
  list-style-type: decimal !important;
}

/* li {
  font-size: 16px;
} */

li::marker {

}

strong {
  font-weight: 700;
}

em {
  font-style: italic;
}

.underline{
  text-decoration: underline;
}

a{
  cursor: pointer !important;
  text-decoration: none;

}

@media only screen and (max-width: 800px) {

    h1,  h1 span{
        font-size: 35px;
    }
    
    h2{
        font-size: 35px;

    }
    
    h3{
        font-size: 30px;
    
    }
    
    h4{
        
    }
        
    p , li{
        font-size: 18px;
    }   
    
    label {
        font-size: 18px;
    }

}






/* SCROLL GALLERY*/

.scroll-gallery-outer {
    padding: 1em;
    background-color: #000;
    position: relative;
}

.scroll-gallery {
    display: flex;
    grid-column: 1 / 17;
    align-items: center;
    justify-items: center;
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-30%);
    }
}

.slider {
    margin: auto;
    overflow: hidden;
    position: relative;
    width: 100%;
    align-items: center;
}

.slider .slide-track {
    display: flex;
    animation: scroll 25s linear infinite;
    width: max-content;
}

.slider .slide {
    padding: 0 1em;
    border-right: 3px solid #FFC833;
}

.slide p, .slide i {
    color: #fff;
    align-items: center;
    display: flex;
    gap: 0.5em;
    font-size: 20px;
    font-weight: 600;
}


@media only screen and (max-width: 800px) {
    .scroll-gallery-outer {
        border-bottom: 5px solid #FFC833;
    }
}






/* MENU BAR DESKTOP VIEW */

.grid-header-section {
    display: grid;    
    z-index: 99999;  
}

#header {
    position: relative; 
    z-index: 9999;
}

@media only screen and (min-width: 1500px) {

     #header.scrolled .grid-header-section .grid-header-outer{
        position: fixed; 
        z-index: 9999;
        top: 0;
    }

    #header.scrolled .grid-header-section .grid-header-outer{
        background-color: #000;
        transition: background-color 0.3s ease;
    }

    #header.scrolled .grid-header-section .grid-header-outer .menu-item a span {
        color: #fff;
    }

    #hamburger-input:checked, #hamburger-menu #sidebar-menu{
        display: none;
    }

    .grid-header-section {
        display: grid;      
        z-index: 2;
    }

    .grid-header-outer {
       display: grid;
        grid-template-columns: 25% 1fr;
        align-items: center;
        padding: 0.5em 2em;
        position: absolute;
        z-index: 99;
        width: 100%;
        justify-self: center;
        max-width: 2000px;
    }

    .grid-header-outer a img{
        max-width: 350px;
        width: 100%;
        display: grid;
    }

    .header-menu {
        display: grid;
    }

    .header-menu ul{
        display: flex;        
        text-align: center;
        align-self: center;
        justify-content: space-evenly;
        gap: 0.5em;
    }

    .header-menu ul li {
        list-style: none;
        align-self: center;
    }

    .menu-item a span{
        text-transform: uppercase;
        color: #000;
        font-weight: 700;
        font-size: 20px;
    }

    .main-nav .current-menu-item a span {
        text-decoration: underline;
    }

    .menu-item a span i {
        color: #00AC4B;
    }

    .front-page-menu .menu-item a span{
        color: #fff;
    }
   
    #hamburger-input, .overlay, #hamburger-menu, #sidebar-menu, .header-bar  {
        display: none;
    }

    .menu-item-has-children > a:after {
        content: '\f0dd';
        margin-left: 5px;
        font-family: "Font Awesome 5 Free"; 
        font-weight: 900;
        /* font-size: 2em; */
        color: #FFC833;
    }


/* SUB MENU ***************************************************************************/

    .menu-item .sub-menu {
        display: none;
    }

    .menu-item .sub-menu .menu-item .sub-menu {
        display: none;
    }

    .menu-item .sub-menu .menu-item a {
        color:#0B233B;
        font-size: 16px;
        font-weight: 400;
        line-height: 18px;
        letter-spacing: 0.05em;
    }

    .menu-item .sub-menu .menu-item a:hover {
        font-weight: 600;
    }

    /* .menu-item .sub-menu { */
    .menu-item:hover .sub-menu {
        display: grid;
        grid-template-columns: 1fr;
        /* width: 25%; */
        gap: 1em;
        background-color: #fff;
        padding: 1em;
        text-align: left;
        z-index: 50 !important;
        justify-self: center;
        margin: auto;
        position: absolute;
        border-top: 19px solid #313537;
    }

    .menu-item .sub-menu  {
        position: relative;
    }

    .menu-item .sub-menu .menu-item {
        padding: 1em;
        border-bottom: 2px solid #FFC833;
        text-align: center;
    }

    .menu-item .sub-menu .menu-item a {
        text-transform: uppercase;
        color: #313537;
        font-weight: 600;
        font-size: 20px;
    }


}

.contact-menu-link a {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 20px;
    padding: 0.5em 1em !important;  
    background: #FFC833;    
}

.contact-menu-link a span {
    color: #000 !important;
}
    



/* RESPONSIVE MENU UNCLICKED */
@media only screen and (max-width: 1500px) {

    .grid-header-outer, .outer-banner-message-outer{
        display: none;
    }

    .header-bar {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-column: 2 / 16;
        align-self: center;
        position: absolute;
        top: 4em;
        width: 95%;
        justify-self: center;
        margin: 1em 0;
        gap: 1em;
        z-index: 99;
    }

    .responsive-menu .front-page-menu .menu-icon {
        width: 35px;
        height: 4px;
        background-color: #fff;
        margin: 3px 0;
    }

    .responsive-menu .menu-icon {
        width: 35px;
        height: 4px;
        background-color: #000;
        margin: 3px 0;
    }

    .header-bar img{
        max-width: 273px;
        width: 100%;
        object-fit: contain;
    }

    .mobile-icon {
        max-width: 55px;
    }

    .responsive-menu {
        align-self: center;
    }

    #sidebar-menu ul li a:hover{
        color:#5BBDB2;
    }

    .menu-icon {
        width: 35px;
        height: 4px;
        background-color: #fff;
        margin: 3px 0;
    }

    .overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        visibility: hidden;
        transition: opacity .35s, visibility .35s, height .35s;
        overflow: hidden;
        background: #F4F0F0;
    }
    
    #hamburger-input{
        display: none;
    }
    
    #hamburger-menu {
        display: flex;
        align-items: end;
        flex-direction: column;
    }

    #hamburger-menu #sidebar-menu {
        grid-template-columns: 1fr;
        visibility: hidden;
        position: fixed;
        top: 0;
        right: -100%;
        width: 100%;
        background-color: #EFF0F0;
        transition: 0.3s;
        box-sizing: border-box;
        z-index: 20;
        padding: 2em;
    }

    #sidebar-menu {
        overflow-y: auto;
        background-color: #EFEFEF;
        height: 100%;
    }

    #sidebar-menu {
        position: fixed;
        top: 0;
        right: -100%;
        bottom: 0;             
        width: 100%;
        padding: 2em;
        background-color: #EFF0F0;
        box-sizing: border-box;
        overflow-y: auto;         
        -webkit-overflow-scrolling: touch;
        transition: right 0.3s;
        z-index: 20;
        grid-template-columns: 1fr;
    }


    #hamburger-menu ul {
        margin: 1em 0;
        width: 100%;
    }

    #hamburger-menu ul .sub-menu{
        margin: 1em 0 2em 0;
        width: auto;
    }

    #hamburger-menu ul .sub-menu li {
        border-bottom: none;
    }

    #hamburger-menu li {
        list-style-type: none;
        padding: 1em 0;
        border-bottom: 3px solid #FFC833;
    }

    #hamburger-menu a {
        text-decoration: none;
        transition: transform 0.5s;
        align-items: center;
        display: flex;
        padding: 0.5em 0;
        justify-self: center;
        font-weight: 700;
    }

    #hamburger-menu i {
        font-size: 28px;
    }

    #hamburger-menu a:active{
        -ms-transform: translateX(30px);
        -webkit-transform: translateX(30px);
        transform: translateX(3px);
    }

    #hamburger-input:checked + #hamburger-menu #sidebar-menu {
        visibility: visible;
        right: 0;
    }

    /* #hamburger-input:checked + #hamburger-menu + #sidebar-menu {
        right: 0;
    } */
  
  #sidebar-menu ul {
    margin: 1em 0;
  }

  #sidebar-menu li {
    list-style: none;
    padding: 1em 0;
    border-bottom: 3px solid #FFC833;
  }

  #sidebar-menu li:last-child {
    border-bottom: none;
  }

  #sidebar-menu a {
    text-decoration: none;
    display: flex;
    align-items: center;
    font-weight: 700;
    font-size: 20px;
    justify-content: center;
    text-transform: uppercase;
  }

    .sub-menu.hidden {
        display: none;
    }

    .toggle-icon::before {
        content: '\f0dd'; 
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        font-size: 1.5em;
        color: #FFC833;
        cursor: pointer;
    }

    .menu-item-has-children > a .toggle-icon.open::before {
        content: '\f0de';
    }


    #hamburger-menu li .sub-menu .menu-item {
        list-style-type: none;
        padding: 0.5em 0;
        border-bottom: 1px solid #FFC833;
    }

    #hamburger-menu li .sub-menu .menu-item:nth-last-child(1) {
        border-bottom: none;
    }

    #hamburger-menu li:nth-last-child(1) {
        border-bottom: none;
    }

    .open {
        margin-top: 0.8em !important;
    }

    #hamburger-menu .get-a-quote {
        background-color: #FFC833;
        margin: 0 2em;
        color: #fff;
        border-radius: 5px;
    }

    .mobile-social-media i {
        font-size: 24px !important;
        width: 24px !important;
        color: #fff !important;
        justify-content: normal !important;
    }


    #numberplates4d-side-nav {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1em;
    }
    
    #numberplates4d-side-nav li:not(:nth-last-child(-n+2)) {
        grid-column: 1 / -1;
    }

    #numberplates4d-side-nav li:nth-last-child(-n+2),
    #numberplates4d-side-nav li:nth-last-child(-n+2) a {
        display: flex;
        justify-content: center;
        align-items: center;
        border: none;
    }
    
    ul li a span i {
        color:#00AC4B;
        font-size: 31px;
    }

    .contact-menu-link {
        border: none !important;
    }


}




/* MAIN BANNER */
.main-banner {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 100vh;
    border-bottom: 5px solid #FFC833;
    padding-top: 7em;
    padding-bottom: 5em;
}

.main-banner img {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    object-fit: cover;
    filter: blur(5px);
}

.black-overlay {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    background: linear-gradient(
      rgba(0,0,0,0.5),
      rgba(0,0,0,0.5)
    );  
}

.outer-main-banner {
    display: grid;
    grid-template-columns: 1fr;
    grid-column: 3 / 16;
    gap: 2em;
    align-self: center;
    position: relative; 
    z-index: 1; 
}

.outer-main-banner label{
    text-transform: uppercase;
    color: #fff;
}

.outer-main-banner h1 {
    color: white;
    max-width: 800px;
    text-shadow: 0px 3px 6px #00000029;
    font-weight: 800;
}

.outer-main-banner p {  
    text-shadow: 0px 3px 6px #00000029;
    color: white;
    max-width: 800px;
}

.main-banner-title {
    display: flex;
    flex-wrap: wrap;
    gap: 2em;
    align-items: end;
}

.main-banner-title p label {
    font-size: 50px;
    font-weight: 600;
}


.main-banner-title strong {
    color: #fff;
}
    
.main-banner-title span {
    color: #FFC833;
}

.header-contents {
    display: grid;
    gap: 2em;
}


/* SUB BANNER */

.sub-page-banner {
    background-color: #EFF0F0;
    margin-top: 4.5em;
    padding: 0;
}

.about-page {
    margin-bottom: 2em;
}

.sub-page-banner h1 {
    grid-column: 2 / 16;
    font-size: 40px;
    max-width: 800px;
    justify-self: center;
    text-align: center;
    line-height: 61px;    
    font-weight: 700;
    text-transform: uppercase;
}

.sub-page-banner-inner {
    grid-column: 2/16;
}

.sub-page-inner-tax h1,
.sub-page-banner-inner h1 {
    font-weight: 700;
    text-transform: uppercase;
}


@media  only screen and  (max-width: 1000px){

    .search-container {
        display: none;
    }

    .main-banner {
        min-height: 75vh;
    }

    .main-banner-title {
        flex-direction: column;
        text-align: center;
        display: grid;
    }

    .outer-main-banner {
        padding: 0;
        gap: 1em;
        grid-column: 2 / 16;
    }

    .outer-main-banner label{
        text-align: center;
    }

    .main-banner img {
        filter: blur(5px);
    }

    .sub-page-banner {
        margin-top: 4.5em;
    }

    .sub-page-banner h1 {
        font-size: 35px;
        line-height: 55px;
    }

    .main-banner-title p label {
        font-size: 22px;
        font-weight: 600;
    }

    .header-contents {
        gap: 1em;
    }
    
}














/* FOOTER */

.footer {
    background-color: #EFF0F0;
}

.footer-areas {
    display: grid;
    grid-template-columns: 25% auto auto auto 25%;
    grid-column: 2 / 16;
    margin: 2em 0;
    gap: 2em;
}

.footer-box {
    display: grid;
    align-content: start;
    gap: 1em;
}

.footer-box p {
    font-size: 20px;
}

.footer-box p a {
    font-size: 22px;
    font-weight: 600;
}

.footer-box p a i {
    font-size: 15px !important;
    padding: 0.5em;
    background: #FFC833;
    margin-right: 0.5em;
}

.footer-box h3 {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.outer-footer-details {
    display: grid;
    gap: 1em;
    align-content: start;
}

.outer-footer-details ol li, 
.outer-footer-details ul li,
.outer-footer-details ul,
.outer-footer-details ol {
    list-style-type: none;
    margin: 0;
}

.footer-box li {
    color: #000;
    font-size: 18px;
    padding: 0.5em;
    margin: 0;
}

.footer-box li a span {
    text-transform: none;
    font-weight: 400;
    font-size: 18px;
}


.footer-logo{
    display: grid;
    grid-column: 2 / 16;
    padding: 5em 0 0;
}

.footer-logo img {
    max-width: 462px;
}



/* FOOTER COLUMN TWO */



/* FOOTER COLUMN THREE */



/* FOOTER COLUMN FOUR */





/* FOOTER COLUMN FIVE */

.inner-contact-details {
    display: flex;
    gap: 1em;
    align-items: start;
}

.inner-contact-details i {
    color: #000;
    font-size: 28px;
    background-color: #FFC833;
    padding: 0.5em;
}

.sign-up-form form p{
    background-color: #fff;
    display: grid;
    grid-template-columns: auto auto;
    padding: 8px;
}

.sign-up-form form br, .sign-up-form form span.wpcf7-spinner{
    display: none;
}

.sign-up-form form input[type=submit]{
    margin: 8px 0;
    border: 0;
    background-color: #FFC833;
    cursor: pointer;
    padding: 0.5em 1em;
}

.sign-up-form form p > span{
    align-self: center;
}

.sign-up-form form p > span input{
    padding-left: 1em;
    border: 0;
    width: 100%;
}







/* LOWER FOOTER BAR */


.lower-footer {
    align-self: center;
    padding: 1em 0 !important;
    border-top: #000 1px solid;
    grid-column: 2/16;
}

.inner-lower-footer {
    display: grid;
    grid-template-columns: 1fr;
    grid-column: 1 / 17;
    text-align: center;
}

.inner-lower-footer .policy{
    text-align: right;
}

.inner-lower-footer p, .inner-lower-footer a strong {
    color: #000;
    margin: 0;
    padding: 0.5em 0;
    font-size: 18px;
    font-weight: 300;
}

.lower-content-image {
    display: flex;
    justify-content: center; 
    gap: 1em; 
}

.lower-content-image img {
    max-width: 193px;
    object-fit: contain;
}



@media only screen and (max-width: 1300px) {

    .footer-areas {
        grid-template-columns: 1fr;     
    }

    .footer-areas {
        grid-template-columns: 1fr;
        gap: 3em;
        justify-content: center;
        text-align: center;
        justify-items: center;
    }

    .footer-logo img {
        justify-self: center;
    }

    .inner-lower-footer {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .outer-footer-details {
        justify-items: center;
    }
    
    .footer-nav {
        grid-template-columns: 1fr;
    }

    .footer-box a img {
        max-width: 368px;
    }

    .footer-box p a {
        font-size: 15px;
    }

    .footer-box p {
        font-size: 18px;
    }

    .inner-contact-details {
        justify-content: center;
    }

    .sign-up-form form p {
        padding: 0;
        background-color: transparent;
        grid-template-columns: 1fr;
        gap: 1em;
    }

    .sign-up-form form p > span input {
       min-height: 62px; 
    }

    .lower-content-image img {
        max-width: 130px;
    }
}




 




/* REPEATED ELEMENTS */

.repeated-element-questions {
    padding: 4em 0;
    row-gap: 3em;
}

.req-header {
    display: grid;
    grid-column: 2/16;
    text-align: center;
    gap: 1em;
}

.req-header h2 {
    font-weight: 700;
}

.req-header p {
    font-weight: 600;
    font-size: 30px;
}

.req-header p a {
    color: #00AC4B;
    text-decoration: underline;
}

.inner-repeated-element-questions {
    display: flex;
    flex-wrap: wrap;
    grid-column: 2/16;
    gap: 2em;
    justify-self: center;
    justify-content: center;
}

.inner-repeated-element-questions a {
    flex: 0 0 auto;
}

.req-box {
    background-color: #EFF0F0;
    display: grid;
    gap: 0.5em;
    box-shadow: 0px 3px 6px #00000029;
    text-align: center;
    padding: 1.5em;
    transition: ease  0.5s;
    height: 100%;
}

.req-box p {
    font-weight: 600;
    font-size: 18px;
}

.req-box h5 {
    text-transform: uppercase;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-self: center;
    gap: 0.5em;
    text-align: left;
}

.req-box i {
    color: #00AC4B;
    font-size: 33px;
}

.req-box:hover {
    transform: scale(1.05);
    transition: ease 0.5s;
}



@media only screen and (max-width: 550px) {

    .inner-repeated-element-questions a {
        flex: 0 0 100%;
    }

    .req-box {
        padding: 2em 0;
    }

    .req-box p {      
        font-size: 16px;
    }

    .req-header p {
        font-size: 20px;
    }
    

}












/* STYLE LISTS */

.style-lists {
    padding: 4em 0;
  }
  
  .style-lists-header {
    width: 100%;
    text-align: center;
    margin-bottom: 4em;
    gap: 1em;
    grid-column: 2/16;
  }

  .style-lists-header h2 {
    font-weight: 400;
  }

  .style-lists-header p {
    font-weight: 600;
  }

  .style-lists-header p {
    font-size: 30px;
  }

  .style-lists-header p a {
    color: #00AC4B;
    text-decoration: underline;
  }

  .inner-style-lists {
    display: flex;
    grid-column: 2/16;
    flex-wrap: wrap;
    gap: 2em;
    justify-self: center;
    justify-content: center;
  }
 
  .style-lists-box {
    flex: 0 0 250px;
    box-sizing: border-box;
    display: grid;
    align-content: start;
    transition: ease 0.5s;
  }
  
  .style-lists-box h4 {
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 1em;
  }

  .style-lists-box li {
    font-size: 18px;
    color: #808080;
    border-bottom: 3px solid #EFF0F0;
    padding: 1em 0;
  }

 .style-lists-box li a{
    color: #808080;
 }

  .style-lists-box i {
    color: #00AC4B;
    font-size: 33px;
  }

  .style-link {
    display: grid;
    grid-column: 2/16;
    justify-self: center;
    padding: 2em 0;
  }
  


  @media only screen and (max-width: 550px) {

    .style-lists-box {
        flex: 0 0 100%;
        padding: 2em 0;
        text-align: center;
    }
    .style-lists-header {
        margin-bottom: 2em;
    }

    .inner-style-lists {
        gap: 0;
    }


  }
  










/* INFO WITH LINK BANNER */

.info-banner {
    background-color: #00AC4B;
    padding: 4em 0;
}

.inner-info-banner {
    display: grid;
    grid-column: 2/16;
    gap: 1em;
    text-align: center;
}

.inner-info-banner h2 {
    font-weight: 600;
}

.inner-info-banner h2, .inner-info-banner p {
    color: #fff;
}

.inner-info-banner p {
    font-size: 30px;
}

.inner-info-link {
    display: flex;
    grid-column: 1/17;
    gap: 1em;
    align-items: center;
    padding-top: 2em;
}

.inner-info-link hr {
    width: 100%;
    border: none;
    border-bottom: 1px solid #fff;
}

.inner-info-banner-button {
    padding: 1em 3em;
}

@media only screen and (max-width: 900px) {
    
    .inner-info-banner h2{
        font-size: 35px;
    }

    .inner-info-banner p {
        font-size: 22px;
    }
    
}





























/* INFO BOXES */

.info-boxes {
    padding: 4em 0;
    row-gap: 3em;
    background-color: #EFF0F0;
}

.info-boxes-header {
    display: grid;
    grid-column: 2/16;
    text-align: center;
    gap: 1em;
    max-width: 1000px;
    justify-self: center;
}

.info-boxes-header h2 {
    line-height: 61px;
}

.inner-info-boxes {
    display: flex;
    flex-wrap: wrap;
    grid-column: 2/16;
    gap: 1em;
    justify-self: center;
    justify-content: center;
}

.info-boxes-box {
    background-color: #fff;
    box-shadow: 0px 3px 6px #00000029;
    display: grid;
    gap: 1em;
    text-align: center;
    padding: 2em 1em;
    align-content: start;
    max-width: 300px;
    width: 100%;
}

.info-boxes-box p {
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
}

.info-boxes-box h5 {
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
}

.info-boxes-box img {
    max-width: 93px;
    font-size: 33px;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    justify-self: center;
}

.info-boxes-box:hover {
    background-color: #FFC833;
}

.info-boxes-link {
    padding: 0;
}


/* VALUE BOXES */

.value-boxes {
    background-color: #00AC4B;
}

.inner-value-boxes {
    padding: 2em 0;
    gap: 2em;
}

.value-boxes-header h2,
.value-boxes-header h2 strong {
    color: #fff;
}

.value-boxes-box {
    background-color: #FFC833;
    aspect-ratio: 1 / 1;
    align-content: center;
}

.value-boxes-box p {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 40px;
    line-height: 1.5;
}

.value-boxes-box:hover {
    background-color: #FFC833;
}





@media only screen and (max-width: 550px) {

    .inner-info-boxes a {
        flex: 0 0 100%;
    }

    .info-boxes-box p {      
        font-size: 16px;
    }

    .info-boxes-box {
        min-width: 100%;
        padding: 2em 1em;
    }

    .inner-info-boxes {
        grid-column: 3/15;
        gap: 1em;
    }

    .value-boxes-box p {
        font-size: 30px;
    }

    .info-boxes-header h2 {
        line-height: 43px;
    }

}









/* HOME PRODUCTS GRID */

.home-products {
    padding: 5em 0;
    row-gap: 4em;
}

.home-products-stars {
    display: flex;
    gap: 0.5em;
    justify-content: center;
    padding-bottom: 1em;
}

.home-products-stars i {
    font-size: 50px;
    color: #FFC833;
}

.home-products-header {
    gap: 1em;
}

.home-products-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column: 2/16;
    gap: 4em;
}

.home-product-display {
    max-width: 377px;
    width: 100%;
}

.home-product-display a {
    display: grid;
}

.home-product-display img {
    object-fit: cover;
}

.home-product-content {
    display: grid;
    gap: 1em;
    text-align: center;
    padding: 1.5em;
    background-color: #FFC833;
}

.home-product-content .price span bdi,
.home-product-content .price span bdi span{
    color: #000;
    background-color: transparent;
    font-size: 20px !important;
    font-weight: 700;
}

.home-product-display:hover .home-product-content {
    background-color: #00AC4B;
}

.home-product-content h4 {
    color: #000;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
}

.home-product-content .price {
    font-size: 20px;
}

.home-product-display:hover .home-product-content h4,
.home-product-display:hover .home-product-content .price,
.home-product-display:hover .home-product-content .price bdi,
.home-product-display:hover .home-product-content .price bdi span {
    color: #fff;
}


@media only screen and (max-width: 1000px) {

    .home-products-container {
        grid-template-columns: 1fr;
        gap: 2em;
        justify-items: center;
    }

    .home-products-stars i {
        font-size: 35px;
    }

    .home-products {
        row-gap: 2em;
    }

}










/* PRODUCT INFO BOXES */

.product-info-boxes {
    background-color: #FFC833;
    padding: 6em 0;
}

.product-boxes-header h2 {
    font-weight: 700;
}

.product-boxes-box {
    max-width: 280px;
}

.product-boxes-box:hover {
    background-color: #EFF0F0;
}

@media only screen and (max-width: 1000px) {

    .product-info-boxes {
        padding: 4em 0;
    }

    .inner-product-boxes {
        grid-column: 3/15;
    }
 

}





















/* GOOGLE REVIEWS */

.all-google-reviews {
    background-color: #EFF0F0;
    padding: 5em 0;
    gap: 2em;
}

.all-google-reviews h2 {
    grid-column: 2/16;
    text-align: center;
    font-weight: 700;
    text-transform: uppercase;
}

.google-reviews {
    grid-column: 2/16;
    text-align: center;
    margin-bottom: 1em;
}

.inner-google-reviews {
    justify-self: center;
}

.ti-widget-container {
    flex-direction: column;
    justify-self: center;
    justify-content: center;
    display: flex !important;
    text-align: center;
    justify-items: center;
    row-gap: 3em;
    align-items: center !important;
}



.inner-google-reviews .ti-footer .ti-fade-container {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0;
    align-items: center;
}

.inner-google-reviews .ti-widget.ti-goog .ti-widget-container:not(.ti-col-1) .ti-footer {
    max-width: 100% !important;
    background-color: #fff;
    max-height: 50px !important;
    margin-top: 0 !important;
    padding: 0 1em !important;
}

/* .inner-google-reviews .ti-widget.ti-goog .ti-widget-container:not(.ti-col-1) .ti-reviews-container {
    max-width: 100% !important;
} */

.inner-google-reviews .ti-v-center {
    order: 1;
}

.inner-google-reviews .ti-stars {
    order: 2;
}

.inner-google-reviews .ti-rating-text {
    order: 3;
}

.google-links {
   display: grid;
    grid-column: 1 / 17;
    grid-template-columns: 1fr auto 1fr;
    gap: 1em;
    align-items: center;
    padding-top: 2em;
    justify-self: auto;
}

.google-links hr {
    width: 100%;
    border: none;
    border-bottom: 1px solid #fff;
}

.ti-footer.source-Google {
    background-color: #fff;
}

.ti-prev {

}


@media only screen and (max-width: 1000px) {

    .all-google-reviews h2 {
        padding-bottom: 1em;
    }
    
    .all-google-reviews {
        gap: 1em;
    }

}

@media only screen and (max-width: 800px) {

    .ti-widget-container {
        row-gap: 1em;
    }

    .inner-google-reviews .ti-footer {
        grid-template-columns: 1fr;
        margin-top: 0 !important;
    }

    .google-links {
        padding-top: 0;    
     }
     

}



















/* NUMBERED BOX GRID */

.number-boxes {
    background-color: #00AC4B;
    padding: 5em 0;
    gap: 2em;
}

.number-boxes-header h2,
.number-boxes-header h2 strong,
.number-boxes-header p,
.number-boxes-header p strong {
    color: #fff;
    max-width: 800px;
}

.number-boxes-box {
    /* flex: 0 0 32%;  */
    max-width: 474px;
    gap: 2em;
}

.number-boxes-box:hover {
    background-color: #fff;
}

.inner-number-boxes {
    padding: 2em 0;
    gap: 3em;
}

.number-boxes-box h3 {
    font-size: 35px;
    font-weight: 700;
    text-transform: uppercase;
}

.number-boxes-box label {
    color: #00AC4B;
    font-size: 50px;
    font-weight: 700;
}

.number-boxes-box p {
    font-weight: 300;
    font-size: 22px;
}

.number-boxes-box p i {
    color: #00AC4B;
    font-size: 65px;
}

.number-boxes-box p a {
    color: #00AC4B;
    text-transform: uppercase;
    font-weight: 600;
}


@media only screen and (max-width: 1000px) {

    .number-boxes {
        gap: 0;
        row-gap: 1em;
    }

    .inner-number-boxes {
        padding: 0;
        grid-column: 2 / 16;
        justify-content: center;
    }

}











/* SIGN UP CTA */



.re-sign-up {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.re-sign-up img {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    object-fit: cover;
    filter: blur(5px);
}

.black-overlaysp {
    position: absolute;
    top: 0; 
    left: 0;
    width: 100%; 
    height: 100%;
    background: linear-gradient(
      rgba(0,0,0,0.5),
      rgba(0,0,0,0.5)
    );  
}

.inner-re-sign-up {
    display: grid;
    grid-column: 2/16;
    gap: 1em;
    align-content: center;
    text-align: center;
    justify-self: center;
    padding: 5em 0;
    z-index: 10;
}

.inner-re-sign-up h2 {
    font-weight: 700;
}

.inner-re-sign-up h2,
.inner-re-sign-up p,
.inner-re-sign-up p strong {
    color: #fff;
}

.inner-re-sign-up h2 i {
    color: #FFC833;
}

.inner-re-sign-up form input[type=email] {
    padding: 1em;
    width: 100%;
    max-width: 665px;
}

.inner-re-sign-up form p {
    display: grid;
    gap: 1em;
}

.inner-re-sign-up form input[type=submit] {
    justify-self: center;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    padding: 1em;
    text-transform: uppercase;
    color: #000;
    border: none;
    background-color: #FFC833;
}

.wpcf7-spinner {
    display: none;
}

.wpcf7-form-control-wrap + br {
    display: none;
  }


/* .variations_form,
.woocommerce-page div.product div.images {

    width: 87% !important;

} */









/* SHOP PAGE */

.shop-page {
    padding: 4em 0;
    border-bottom: 3px solid #FFC833;
  }
  
  .inner-shop-page {
    display: grid;
    grid-column: 3 / 15;
    gap: 2em;
  }
  
  .shop-product-boxes {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .shop-product-image {
    display: grid;
  }
  
  .shop-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-height: 300px;
  }
  
  .shop-product-content {
    display: grid;
    gap: 1em;
    padding: 2em;
    background-color: #EFF0F0;
    align-content: center;
  }
  
  .shop-product-boxes:hover .shop-product-content {
    background-color: #00AC4B;
  }
  .shop-product-boxes:hover .shop-product-content h2,
  .shop-product-boxes:hover .shop-product-content p {
    color: #fff;
  }

.tax-product-boxes:nth-child(odd) .shop-product-image {
    order: 1;
}

.tax-product-boxes:nth-child(odd) .shop-product-content {
    order: 2;
}

.tax-product-boxes:nth-child(even) .shop-product-image {
    order: 2;
}

.tax-product-boxes:nth-child(even) .shop-product-content {
    order: 1;
}
  
  .shop-product-content h2 {
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
  }

  .shop-product-links {
    display: flex;
    gap: 1em;
    align-items: center;
  }


  .shop-product-links a {
    display: inline-grid;
  }

  .shop-product-boxes:hover .shop-product-links .green-button {
    background-color: #fff;
    color: #000;
  }

  .shop-product-boxes.shop-no-products {
    grid-template-columns: 1fr;
  }
  .shop-product-boxes.shop-no-products .shop-product-content {
    text-align: center;
  }
  
  .woocommerce-result-count,
  .woocommerce-ordering {
    display: none;
  }
  


  .shop-attribute-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 24px;
}
.shop-attribute-box {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 16px;
  text-align: center;
  transition: transform .15s ease, box-shadow .15s ease;
}
.shop-attribute-box:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}
.shop-attribute-image {
  aspect-ratio: 1 / 1;
  display: grid;
  place-items: center;
  margin-bottom: 10px;
  overflow: hidden;
  border-radius: 8px;
  background: #f7f7f7;
}
.shop-attribute-image img { width: 100%; height: 100%; object-fit: cover; }
.shop-attribute-title { font-size: 1rem; margin: 0; }




@media only screen and (max-width: 1000px) {

    .inner-shop-page {
        grid-column: 2/16;
    }

    .shop-product-content {
        padding: 2em 1em;
    }

    .shop-product-boxes {
        grid-template-columns: 1fr;
    }

    .shop-product-content {
        text-align: center;
    }

    .shop-product-links {
        display: grid;
        justify-self: auto;
    }

    .shop-product-image img {
        min-height: 300px;
    }

    .shop-page {
        padding: 2em 0;
    }

    .tax-product-boxes:nth-child(even) .shop-product-image {
        order: 1;
    }

    .tax-product-boxes:nth-child(even) .shop-product-content {
        order: 2;
    }

}








.outer-faq-produts {
    grid-template-columns: 1fr 1fr;
    gap: 2em;
    grid-column: 2/16;
    display: grid
}

/* ACCORDION FAQS */
.faqs {
    padding: 4em 0;
    border-bottom: 3px solid #FFC833;
}

.faq-container {
    display: grid;
}

.faq-main {
    grid-column: 2/16;
}

.faq-container-product,
.faq-body-product {
    background-color: #EFF0F0 !important;
}

.faq-box > .faq-container {
    width: 100%;
}

.faq-box {
    margin-bottom: 1em;
}

.faq-box-product {
    border-bottom: 3px solid #FFC833;
    width: 90%;
    margin-left: 2em;
}

.faq-box h3 p {
    font-size: 30px;
    font-weight: 700;
}

.faq-box-product p {
    font-size: 25px !important;
}

.faq-page {
    color: black;
    cursor: pointer;
    padding: 1em;
    transition: 0.4s;
    font-weight: 400;
    font-size: 20px;
    align-items: center;
    background-color: #EFF0F0;  
    display: flex;
    justify-content: space-between;
}

.faq-page-product {
    font-weight: 700;
    text-transform: uppercase;
    padding: 1em 0;
    font-size: 25px;
}

.faq-box-product:first-of-type .faq-page-product{
    border-top: 3px solid #FFC833;
}

.faq-page:hover,
.faq-page.active {
    background-color: #FFC833;   
}

.faq-page:after {         
    content: "\f2ec";  
    font-family: "Font Awesome 6 Pro";             
    transform: rotate(59deg);
    color: #00AC4B;
    font-weight: 900;           
    font-size: 29px;
    float: right;
}

.faq-page-product:after {
    font-family: "Font Awesome 6 Pro";
    font-weight: 900;           
    content: "\f2ec";               
    color: #000; 
    font-size: 15px;
    float: right;
    padding-right: 1em;
}

.faq-page.active:after {
    transform: rotate(0deg);
  }

.faq-page-product.active:after {
    transform: rotate(0deg);
}

.faq-body {
    background-color: white;
    display: none;
    overflow: hidden;
    align-items: center;
    background-color: #EFF0F0;
    padding: 2em;
    margin-top: 1em;
}

.faq-body ol ul li {
    list-style-type: disc !important;
}

.faq-body p {
    margin-bottom: 1em;
}

.faq-body-product p {
    margin: 0;
    padding: 1em;
    font-size: 18px !important;
}

.faq-body a {
    color: #00AC4B;
}

.faq-box > .faq-container {
    display: none;
  }
  /* hide all the .faq-body answer panels */
  .faq-body {
    display: none;
  }


@media only screen and (max-width: 800px) {

    .faq-body p {
        padding: 1em;
    }

    .faqs {
        padding: 2em 0;
    }

    .faq-box h3 p {
        font-size: 18px;
        font-weight: 700;
    }

    .faq-box-product p {
        font-size: 25px !important;
    }

    .faq-page {
        gap: 0.5em;
        padding: 5px;
    }

    .faqs ul, .faqs ol {
        margin-left: 1em;
    }

    .outer-faq-produts {
        grid-template-columns: 1fr;
        gap: 0;
    }
}







/* LOGIN PAGE */

.customer-login-tabs {
    padding: 2em 0;
    display: grid;
    grid-column: 2 / 16;
    max-width: 800px;
    justify-self: center;
    width: 100%;
    text-align: center;
  }
  
  .customer-login-tabs .tabs-nav {
    list-style: none;
    display: flex;
    margin: 2em 0 0 0;
    padding-left: 0;
    justify-content: center;
  }
  
  .tab-pane h2 {
    text-align: center;
  }
  
  .customer-login-tabs .tabs-nav li {
    padding: 0.6em 1em;
    cursor: pointer;
    border-bottom: none;
    margin-right: 5px;
    text-transform: uppercase;
    font-size: 35px;
    font-weight: 600;
    background-color: #F4F3F2;
    width: 100%;
    position: relative;
  }
  
  .customer-login-tabs .tabs-nav li.active {
    background-color: #FFC833;
    color: #000;
    width: 100%;
    text-transform: uppercase;
    font-size: 35px;
    font-weight: 600;
  }
  
  .customer-login-tabs .tabs-nav li.active::after {
    content: "\25BC";
    display: block;
    font-size:45px; 
    color: #FFC833;
    position: absolute;
    left: 46%;
  }
  
  .customer-login-tabs .tab-pane {
    display: none;
  }
  
  .customer-login-tabs .tab-pane.active {
    display: block;
  }
  
  .woocommerce form.checkout_coupon,
  .woocommerce form.login,
  .woocommerce form.register {
    border: none;
    margin: 0 !important;
    padding: 2em 0 0 0 !important;
  }
  
  .login-dets {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }
  
  .remember-me label,
  .lost_password a {
    font-size: 20px !important;
    font-weight: 400 !important;
  }
  
  .lost_password {
    display: grid;
  }
  
  .lost_password a {
    justify-self: end;
  }
  
/* INPUTS: fixed height + calculated vertical padding */
.customer-login-tabs form input[type=text],
.customer-login-tabs form input[type=password],
.customer-login-tabs form input[type=email] {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 80px !important;          /* total height */
  padding: 22px 1.5em !important;   /* (80 - 35) ÷ 2 ≃ 22.5 → use 22px */
  border: none !important;
  background: #F4F3F2 !important;
  border-radius: 0 !important;
  font-size: 35px !important;
  font-weight: 600 !important;
}

/* Placeholder styling remains the same */
.customer-login-tabs form input[type=text]::placeholder,
.customer-login-tabs form input[type=password]::placeholder,
.customer-login-tabs form input[type=email]::placeholder {
  color: #000;
  font-size: inherit;
  font-weight: inherit;
  opacity: 1;  /* ensure full opacity */
}
/*   
  .woocommerce-form-row label {
    font-size: 30px;
    font-weight: bold;
  }

  .woocommerce-EditAccountForm  .woocommerce-form-row label {
    font-weight: 400;
    text-transform: none;
    font-size: 20px;
  }
  
  .woocommerce .woocommerce-form-login .woocommerce-form-login__submit,
  .woocommerce-form-register__submit {
    float: none;
    margin: 0;
    justify-self: center !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    text-align: center !important;
    padding: 0.5em 2em !important;
    text-transform: uppercase !important;
    align-self: center !important;
    display: grid !important;
    background: #FFC833 !important;
    border-radius: 0 !important;
    color: #000 !important;
  }
  
  .register-button,
  .login-button {
    margin-top: 2em !important;
  }
  
  @media only screen and (max-width: 960px) {
    .customer-login-tabs {
      grid-column: 1 / 17;
    }
    .login-dets {
      grid-template-columns: 1fr;
      justify-self: center;
      text-align: center;
    }
    .customer-login-tabs .tabs-nav li.active::after {
      left: 42%;
    }

    .customer-login-tabs .tabs-nav li.active,
    .customer-login-tabs .tabs-nav li {
        font-size: 25px;
        padding: 0.5em;
    }
  } */
























/* ACCOUNTS PAGE */

/* .woocommerce {
    grid-column: 2 / 16; 
} */

.yellow-top-border {
    border-top: 3px solid #FFC833;
}

.accounts-page h1 {
    grid-column: 2 / 16;
    text-align: center;
    padding: 1em 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
    grid-template-columns: auto;
    padding: 2em 0;
}

.woocommerce-form-login .woocommerce-form-row {
    display: grid !important;
}

.login-button, .register-button {
    justify-self: center;
}

.woocommerce-MyAccount-content {
    padding: 2em 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: grid;
    gap: 1em;
    padding-bottom: 2em;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    background-color: #F4F3F2;
    padding: 1em;
    position: relative
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:hover,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active {
  background-color: #FFC833;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active::after,
.woocommerce-account .woocommerce-MyAccount-navigation ul li:hover:after {
    content: "\25BC";
    position: absolute;
    top: 5px;   
    right: -0.5em;        
    transform: translateX(-50%); 
    font-size: 45px;
    color: #FFC833;
    transform: rotate(270deg);
  }

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    font-size: 25px;
    font-weight: 600;
}


@media only screen and (max-width: 1000px) {

    .woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active::after,
    .woocommerce-account .woocommerce-MyAccount-navigation ul li:hover:after {
        content: "\25BC";
        position: absolute;
        top: auto;
        right: 40%;
        transform: translateX(-50%);
        font-size: 45px;
        color: #FFC833;
        transform: rotate(0);
        justify-self: center;
        bottom: -0.4em;
    }


}

























/* BLOG PAGE */

.blog-page {
    padding: 4em 0;
    position: relative;
    border-bottom: 5px solid #FFC833;
}

.inner-blog-page {
    display: grid;
    grid-template-columns: 30% 1fr;
    grid-column: 2/16;
    gap: 2em;
}

/* Blog Search and Categories */
.blog-catergories-search {
    display: grid;
    gap: 2em;
    align-self: start;
}

.bog-search, .blog-categories {
    background-color: #EFF0F0;
    padding: 2em 1em;
}

.blog-categories {
    display: grid;
    gap: 1em;  
    z-index: 5;  
}

.blog-categories h3 {
    font-family: "Work Sans", sans-serif;
    font-size: 30px;
    color: #000;
    text-transform: uppercase;
    font-weight: 700;
}

.blog-categories ul {
    display: grid;
    gap: 1em;
}

.blog-categories ul li {
    background-color: #EFF0F0;
    padding: 0.5em;
    border-bottom: 1px solid #fff;
}

.blog-categories ul li a {
    font-size: 20px;
    color: #000;
    font-weight: 400;
}

.blog-categories-search {
    display: grid;
    gap: 2em;
    align-content: start;
}

.blog-search {
    background-color: #EFF0F0;
}

.blog-search .search-submit {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.blog-search form {
    display: grid;
    grid-template-columns: 1fr 20%;
}

.blog-search .search-submit span, .screen-reader-text {
    display: none;
}


/* search form */
.blog-search form input[type=search] {
    border: none;
    resize: vertical;
    background-color: transparent;
    padding: 0.8em;
    width: 100%;
    text-transform: none;
    font-size: 25px;
    font-weight: 500;
    text-align: left;
}

.blog-search form input[type=search]::placeholder {
    color: #000;
}

.search-submit {
    text-align: right;
    padding-right: 1em !important;
}

.search-submit i {
    font-size: 35px;
    color: #000;
}


/* Blog Boxes display */
.blog-boxes-page {
    grid-template-columns: 1fr 1fr;
    display: grid;
    gap: 3em;
    z-index: 2;
}

.blog-boxes-page h2 {
    display: grid;
    grid-column-start: span 2;
    text-align: center;
    padding-bottom: 0.5em;
}

.blog-box {
    padding: 1em;
    background-color: #EFF0F0;
    box-shadow: 0px 3px 6px #00000029;
}

.blog-box, .blog-content, .blog-box-img {
    position: relative;
    z-index: 1;
}

.blog-boxes-page .blog-box-img img {
    max-width: none;
    width: 100%;
    max-height: 350px;
    object-fit: cover;
}

.blog-box:hover {
    background-color: #00AC4B !important;
}

.blog-box h4 {
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
}

.blog-box:hover h4, .blog-box:hover p {
    color: #fff;
}

.blog-box a {
    color: #00AC4B;
    text-transform: uppercase;
    font-weight: 600;
}

.blog-box:hover a {
    color: #FFC833;
}

.blog-button {
    grid-column-start: span 2;
    justify-self: center;
    margin: 2em 0;
    display: grid;
}

.blog-box-img {
    position: relative;
}

.post-category {
    position: absolute;
    bottom: -1em;
    right: 1em;
    padding: 0.5em 1em;
    box-shadow: 0px 3px 6px #00000029;
    font-weight: 600;
}

.blog-box-content {
    display: grid;
    gap: 1em;
    padding: 4em 1em 1em 1em;
    position: relative;
}

.post-date {
    position: absolute;
    padding: 0.5em;
    display: grid;
    max-width: 94px;
    max-height: 86px;
    background-color: #FFC833;
    top: -2em;
    left: 0.5em;
    z-index: 5;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    height: 100%;
    align-items: center;
    width: 100%;
}

.post-date-year {
    font-size: 18px;
    font-weight: 700;
}



.main-search-page {
    grid-template-columns: 1fr;
}



@media only screen and (max-width: 1120px) {

    .inner-blog-page {
        grid-template-columns: 1fr;
    }

    .blog-boxes-page {
        grid-template-columns: 1fr;
    }
    
    .blog-boxes-page .blog-content {
        display: flex;
        gap: 1em;
        flex-direction: column;
        align-items: start;
    }

    .blog-large-triangle {
        display: none;
    }

    .blog-page {
        padding: 2em 0;
    }

    .blog-categories-search {
        gap: 1em;
    }

    .blog-content a {
        padding: 0.5em 2.5em;
        font-size: 22px;
    }

    .post-date {
        left: 0.2em;        
    }

    .post-category {
        right: 0.2em;
    }
}










/* SINGLE BLOG POST */

section.single-post {
    border-bottom: 5px solid #FFC833;
    position: relative;
    padding: 5em 0;
  }
  
  .inner-single-post {
    display: grid;
    grid-column: 3 / 15;
    margin: 0 0 4em 0;
    gap: 3em;
  }
  
  .inner-single-post h1 {
    text-align: center;
  }
  
  .single-blog {
    overflow: auto;
  }
  
 .single-blog-image {
    position: relative;
}

  .single-blog-image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
  }

  .single-content {
    padding: 6em 0 0;
    display: grid;
    gap: 1em;
}
  
  .single-content p {
    color: #000;
    font-size: 16px;
  }

  .single-content h2 {
    font-weight: 600;
    text-transform: uppercase;
  }
    
  .single-content a {
    color: #069E85;
  }

  .post-date-single {
    bottom: -2em;
    top: auto;
    left: 2em;
}
  
  .post-category-single {
    right: 2em;
  }

  .outer-blog-boxes-single {
    grid-column: 2 / 16;
  }

  .blog-boxes-page-single {
    grid-template-columns: 1fr 1fr 1fr;
    display: grid;
    gap: 3em;
    padding: 4em 0;
  }

  .blog-page-single h2 {
    grid-column: 2/16;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
  }

  .all-blogs-button {
    grid-column: 2/16;
    justify-self: center;
  }




@media only screen and (max-width: 1120px) {

    .blog-boxes-page-single {
        grid-template-columns: 1fr;
        padding: 2em 0;
    }

}



@media only screen and (max-width: 960px) {

    .single-blog img {
        max-height: 349px;
    }
    
    .inner-single-post {
        grid-column: 2/16;
        margin: 0 0 2em 0;
    }

    .single-date-blog {
        left: auto;
        bottom: -3em;
        top: auto;
    }

    .single-blog {
        gap: 3em;
    }

    .single-content,
    .single-content h1 {
        text-align: center;
    }

    .single-blog-image {
        float: none;
        width: 100%;
        margin: 0;
    }   

    .single-blog img {
        z-index: 1;
    }

    .post-category-p {
        margin-top: 2em;
    }

    .single-post {
        padding: 2em 0;
    }

    .post-date-single {
        left: 0.5em;
    }
      
      .post-category-single {
        right: 0.5em;
      }

      .single-content  {
        padding: 4em 0 0;
      }
    

}










/* 404 PAGE */

section.error{
    min-height: 60vh;
    align-content: center;
    grid-column: 2 / 16;
}

section.error h1 {
    color: #171731;
    text-align: center;
    grid-column: 2 / 16;
}

section.error p {
    text-align: center;
    grid-column: 2 / 16;
}






/* SEARCH ERROR */
.blog-search-error {
    grid-template-columns: 1fr;
    align-content: center;
    text-align: center;

}




.search-outer .blog-boxes {
    padding: 2em 0;
}







/* WP CONTENT */
.wp-content-section {
    grid-column: 4 / 14;
    grid-template-columns: 1fr;
    display: grid;
    gap: 2em;
    margin: 5em 0;
    text-align: center;
    justify-items: center;
}

.wp-content-section ul li {
    font-size: 20px;
    font-weight: 300;
}

p.reading-time{
    color: #FCFAF8;
    font-size: 16px;
    margin: 0 8px;
}



.wp-content-section .woocommerce {
    width: 100%;
}


.cart-checkout-section {
    grid-column: 2 / 16;
    grid-template-columns: auto; 
    justify-items: unset; 
}




@media only screen and (max-width: 1000px) {

    .wp-content-section {
        grid-column: 2 / 16;
    }

}










					



/* SEARCH HEADER */


.search-box {
    display: none;
    padding: 3px;
    justify-self: center;
    margin: 1em 0;
    width: 100%;
}

.search-box {
    display: none;
}

.search-box.active {
    display: grid;
    grid-column-start: span 3;
    background-color: #fff;
    padding: 0.5em 1em;
}

.search-box form {
    display: flex;
    width: 267px;
}

.search-box form label{
  width: 100%;
}

.search-box input[type="search"] {
    width: 100%;
    padding: 5px;
    border: 0;
    z-index: 99;
    background-color: #F4F3F2;
}

.search-box input[type="submit"] {
    padding: 5px 10px;
    border: none;
    background-color: #0073aa;
    color: #fff;
    cursor: pointer;
}

.search-box .search-submit {
    border: 0 !important;
    background-color: #FFC833;
}

.search-container {
    border: 0 !important;
    background-color: transparent;
    position: absolute;
    top: 8.7em;
    right: 3em;
    z-index: 2;
}

.search-container .search-icon i {
    color: #000;
    background-color: #FFC833;
    font-size: 2em;
    padding: 10px;
}

.search-container .search-icon {
    border: none;
    background-color: #FFC833;
}

  .search-container .search-box {
    display: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: calc(100% - 0em);  
    width: auto !important;
    margin: 0 !important;  
    z-index: 2;
  }
  
  .search-container .search-box.active {
    display: grid;  
  }












/* CART and CHECKOUT PAGE */


.woocommerce-order {
    display: grid;
    grid-template-columns: repeat(16, 1fr);
}

.woocommerce-thankyou-order-received,
.woocommerce-order-overview,
.woocommerce-order p  {
    grid-column: 1/17;
    padding: 2em 0;
}

.woocommerce ul.order_details {
    margin: 0 !important;
}

.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-customer-details address,
.woocommerce-table  {
    grid-column: 1/17;
}

.wc-item-meta li p {
    padding: 0 !important;
}

.woocommerce .woocommerce-customer-details address,
.woocommerce-table {
    margin: 2em 0 !important;
}


.wp-block-woocommerce-cart {
    /* grid-column: 2/16;
    padding: 0 0 6em 0; */
}

table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image img {
    min-width: 185px;
}

.wc-block-cart-items tbody {
    display: grid;
    gap: 1em;
    background-color: #fff;
}

.wc-block-cart-items__row {
    background-color: #F4F3F2 !important;
}

.wc-block-checkout__sidebar {
    background-color: #fff !important;
}

.wc-block-components-sidebar {
    background-color: #00AC4B;   
}

.wp-block-woocommerce-cart-order-summary-block div,
.wp-block-woocommerce-cart-order-summary-block div span,
.wp-block-woocommerce-cart-order-summary-block div svg path {
    color: #fff;
}

.wc-block-cart-items thead,
.wc-block-cart-item__total{
    display: none;
}

.is-large.wc-block-cart .wc-block-cart-items td,
.wc-block-cart-item__product,
.is-large.wc-block-cart .wc-block-cart-items {
    border: none !important;
    padding: 24px 16px !important;
    text-align: left;
}



.wc-block-cart table.wc-block-cart-items, .wc-block-cart table.wc-block-cart-items td, .wc-block-cart table.wc-block-cart-items th {
    margin: 0 !important;
}

.is-large.wc-block-cart .wc-block-components-sidebar {
    padding: 24px 16px;
}


.wc-block-components-product-name {
    font-size: 50px !important;
    color: #000 !important;
    text-transform: uppercase;
    font-weight: 600;
}

.wc-block-cart__totals-title {
    font-size: 30px !important;
    color: #FFC833 !important;
}

.wc-block-components-product-price span {
    font-size: 30px !important;
    color: #fff !important;
    background-color: #00AC4B;
    border-radius: 9px;
    padding: 0.2em;
    font-weight: 600;
}

.wc-block-cart__submit-button,
body:not(.woocommerce-block-theme-has-button-styles) .wc-block-components-button:not(.is-link) {
    justify-self: center;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    padding: 1em 1.5em;
    text-transform: uppercase;
    color: #000;
    background-color: #FFC833;

}

.wc-block-components-button__text,
.wc-block-components-checkout-place-order-button__text {
    color: #000 !important;
}

.wc-block-components-sidebar-layout .wc-block-components-main {
    padding-right: 2em !important;
}

.is-large.wc-block-cart {
    margin: 0 !important;
}

.wc-block-cart {
    padding-top: 3em !important;
}

.wc-block-components-order-summary-item__total-price {
    display: none !important;
}

.wc-block-checkout__form {
    text-align: left;
}



@media only screen and (max-width: 1000px) {

    .wp-block-woocommerce-cart {
        padding: 3em 0;
    }

    .wc-block-cart {
        padding-top: 0 !important;
    }

    .is-small .wc-block-cart__sidebar {
        padding: 1em m !important;
    }

    .is-medium table.wc-block-cart-items .wc-block-cart-items__row {
        grid-template-columns: auto auto !important;
    }

    table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image img {
        min-width: 100%;
    }

    .is-medium table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image, .is-mobile table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image, .is-small table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image {
        grid-column-start: span 3 !important;
        padding: 0 !important;
    }

    .wc-block-components-sidebar-layout .wc-block-components-main {
        padding: 0 !important;
    }

    .wc-block-components-sidebar-layout {
        flex-direction: column !important;
        gap: 1em !important;
        width: 100% !important;
    }

    .wc-block-components-main,
    .wc-block-components-sidebar{
        width: 100% !important;
    }

    .wc-block-components-checkout-order-summary__title {
        display: none !important;
    }

    .wp-block-woocommerce-checkout {
        padding-top: 6em !important;
    }

 .is-mobile.wc-block-components-sidebar-layout .wc-block-components-sidebar {
    padding: 1em !important;
 }

}



@media only screen and (max-width: 600px) {

    .is-small table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product {
        grid-column-start: 1 !important;
        grid-row-start: 2 !important;
    }

}

@media only screen and (max-width: 460px) {


 .is-mobile table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product{
        grid-column-start: 1 !important;
        grid-row-start: 2 !important;
    }

    .wp-block-woocommerce-checkout {
        padding-top: 0em !important;
    }

}























  

/* SPLIT CONTENT */

.split-section {
    padding: 5em 0;
    background-color: #EFF0F0;
}

.split-inner {
    display: grid;
    grid-column: 2 / 16;
    grid-template-columns: 1fr 1fr;
    position: relative;
}

.split-content {
    display: grid;
    gap: 1.5em;
    align-content: center;
    padding: 1em 6em;
    order: 1;
}

.image-outer {
    order: 1;
    display: grid;
}

.image-outer img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
    z-index: 1;
    height: 100%;
    border: 1em solid #fff;
    border-radius: 27px;
    max-width: 452px;
    justify-self: center;
    transform: rotate(10deg);
}



/* LEFT IMAGE */

.split-inner.image-left .split-content {
    order: 2;
}

.split-inner.image-left .image-outer img {
    transform: rotate(350deg);
}





.image-needed .split-text-center  {
    text-align: left;
    justify-items: left;
}

.split-text-left {
    text-align: left;
}

.split-text-center {
    text-align: center;
    justify-self: center;
    max-width: 1000px;
    justify-items: center;
}




@media only screen and (max-width: 1000px) {

    .split-section {
        padding: 2em 0;
    }

    .split-content {
        padding: 1em;
        text-align: center;
    }

    .split-inner {
        grid-template-columns: 1fr;
        gap: 3em;
    }

    .split-inner.image-left .split-content {
        order: 1;
    }

    .split-inner.image-left .image-outer {
        order: 2;
    }
}




/* CONTACT INFO */

.contact {
    position: relative;
    padding: 5em 0;
}

.inner-contact {
    display: grid;
    grid-template-columns: 40% 1fr;
    grid-column: 3 / 15;
    gap: 3em;
    padding: 2em 0;
    z-index: 2;
}

.contact-details {
    display: grid;
    gap: 2em;
    align-content: start;
}

.inner-contact {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.5em;
}

.contact-details p {
    font-weight: 600;
    font-size: 1.375em;
}

.contact-details i {
    color: #000;
    background-color: #FFC833;
    font-size: 1.5em;
    min-width: 40px;
    align-self: start;
    aspect-ratio: 1 / 1;
    max-width: 1.5em;
    max-height: 1.5em;
    height: 100%;
    width: 100%;
    align-content: center;
    text-align: center;
    margin-right: 0.5em;
}

.contact-form form {
    max-width: 786px;
    margin: 0 auto;
    width: 100%;
}

form input.wpcf7-form-control.wpcf7-submit {
    margin: 0 auto;
    cursor: pointer;
 }

.contact-form form input[type=text], 
.contact-form form input[type=tel],
.contact-form form input[type=email],
.contact-form form select,
.contact-form form textarea {
    width: 100%;
    padding: 1em;
    border: none;
    margin-bottom: 1em;
    resize: vertical;
    background: #EFF0F0;
    justify-items: start;
    font-size: 25px;
}

.contact-form form input[type=text]::placeholder,
.contact-form form input[type=email]::placeholder,
.contact-form form input[type=tel]::placeholder,
.contact-form form select option,
.contact-form form select,
.contact-form form textarea::placeholder {
    font-size: 25px;
    text-align: center;
    color: #000;
    font-weight: 600;
}


/* FORM SUBMIT BUTTON */
.contact-form form input[type=submit] {
    justify-self: center;
    font-size: 20px !important;
    font-weight: 600 !important;
    text-align: center !important;
    padding: 0.5em 2em;
    text-transform: uppercase !important;
    align-self: center !important;
    display: grid !important;
    background: #FFC833 !important;
    border: none;
    
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1em;
}

.full-width {
    grid-template-columns: 1fr;
}

.contact-left-flower {
    left: -10em;
    opacity: 0.1;
}

.contact-right-flower {
    right: -10em;   
    opacity: 0.1;
    bottom: 2em;
    left: auto;
    top: auto;
}

.address {
    display: grid;
    grid-template-columns: auto 1fr;
    font-size: 22px;
    font-weight: 600;
    line-height: 1;
}

.maps {
    position: relative;
    border-bottom: 5px solid #FFC833;
    min-height: 65vh;
}

.floating-map-info {
    position: absolute;
    top: 5em;
    left: 10em;
    background-color: rgba(242, 205, 78, 0.9);
    padding: 2em;
}

.floating-map-info p a i {
    margin-right: 0.8em;
    font-size: 22px;
}

.maps {
    display: grid;
}

.maps .acf-map{
    width: 100%;
    grid-column: 1 / 17;
}

.acf-map img {
   max-width: inherit !important;
}




@media only screen and (max-width: 960px) {

    .contact {
        padding: 2em 0;
    }
    
    .inner-contact {
        grid-template-columns: 1fr;
        grid-column: 2 / 16;
        padding: 0;
    }

    .contact-details {
        justify-items: center;
        gap: 1em;
        text-align: center;
    }

    .contact-social {
        display: flex;
        gap: 1em;
    }

    .contact-details p a {
        justify-self: center;
        display: grid;
        justify-items: center;
    }

    .contact-details p {
        font-size: 1.125em;
    }


    .contact-details .inner-contact-details {
        gap: 0.5em;
    }

    .inner-contact-details i {
        font-size: 1.625em;
    }

    .contact-form {
        order: 2;
    }

    .contact-details {
        order: 1;
    }

    .inner-contact {
        gap: 2em;
    }

    .address {
        grid-template-columns: 1fr;
    }

    .form-grid {
        grid-template-columns: 1fr;
    }

    .contact-details .contact-social i {
        margin: 0;
    }

    .floating-map-info {
        top: 4em;
        left: 1em;
        padding: 1em;
    }

    .address {
        font-size: 18px;
    }
}

















/* SINGLE PRODUCT PAGE */

.outer-single-product {
    padding: 2em 0 0;
}

.woocommerce div.product {
    position: inherit;
}

.woocommerce div.product div.images .flex-control-thumbs {
    display: flex;
    padding-top: 0.5em;
}

.woocommerce div.product div.images .flex-control-thumbs li {
    width: 12.5%;
}

.wc-block-cart .wc-block-cart__submit-container--sticky {
    z-index: 9 !important;
}

.woocommerce div.product form.cart .variations label {
    font-weight: 800;
    font-size: 16px;
}





.field-info,
.attr-note{
  display:block;
  margin:.35rem 0 0;
  font-size:.875rem;
  line-height:1.35;
  color:#555;
}












.woocommerce div.product form.variations_form.cart {
  order: 3;
  grid-column-start: span 1;
  background-color: #EFF0F0;
  margin: 0;
  padding: 2em;
  text-align: left;
  margin-top: -18em; /* default when not started and no summary */
}

/* when the inner gallery has started OR summary exists */
.outer-single-product:has(.inner-gallery-scroll.gallery-started) form.variations_form.cart,
.outer-single-product:has(.inner-gallery-scroll.gallery-scrolling) form.variations_form.cart {
  margin-top: 0;
}








.single-product {
    grid-column: 2/16;
}

.single-product .product {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 4em;
    row-gap: 0;
}

.woocommerce div.product div.summary {
    display: grid;
    gap: 2em;
    /* padding: 0 2em; */
    order: 1;
    align-content: start;
}

.condition-single {
    display: grid;
    gap: 1em;
    font-weight: 600;
    margin-bottom: 1em;
    gap: 0.5em;
    font-size: 30px;
}

.condition-single strong {
    font-size: 24px;
}

.quanitity-title {
    text-transform: uppercase;
    font-size: 24px;
    font-weight: 600;
}

.woocommerce div.product form.cart {
    display: flex;
    flex-wrap: wrap;
}


.woocommerce div.product form.variations_form.cart {
    margin-bottom: 0;
    display: grid;
    justify-content: left;
}

.product_meta, .related {
    display: none;
}

.woocommerce div.product .product_title {
    font-size: 30px;
}

.single-product .woocommerce-Price-currencySymbol, .summary .woocommerce-Price-amount bdi,
.summary .woocommerce-Price-currencySymbol, .summary .woocommerce-Price-amount bdi  {
    font-size: 40px;
}

.tax-price .woocommerce-Price-amount bdi .woocommerce-Price-currencySymbol, 
.tax-price .woocommerce-Price-amount bdi {
    font-size: 30px;
}

.woocommerce-product-gallery__image a img {
    /* padding: 0.2em 0.3em; */
    aspect-ratio: 1 / 1;
    object-fit: cover;
    max-height: 270px;
}




.outer-gallery-scroll {
    order: 2;
}

.outer-gallery-scroll { position: relative; }

.inner-gallery-scroll {
  position: relative;
  will-change: transform;
  transition: none !important;
}


/* default: zero (stick right to top) */
:root { --gallery-offset-top: 0px; }

/* give it a bit of breathing room on wider screens */
@media (min-width: 1280px) {
  :root { --gallery-offset-top: 75px; }
}
@media (max-width: 1280px) {
  :root { --gallery-offset-top: 40px; }
}


.woocommerce-tabs {
    order: 3;
    /* width: 47.65%; */
    display: grid;
    gap: 2em;
    grid-template-columns: 1fr 1fr;
}


/* Force product tabs to break below the two columns */
.single-product .woocommerce-tabs.wc-tabs-wrapper{
  clear: both;          /* fixes float-based layouts */
  width: 100%;
  float: none;
}

.woocommerce div.product .woocommerce-tabs .panel {
    margin: 0 !important;
    padding: 2em;
}

/* If your single product uses flexbox/grid for the two columns,
   make tabs span full row and come after the summary */
.single-product .product .woocommerce-tabs.wc-tabs-wrapper{
  flex-basis: 100%;
  order: 99;            /* pushes tabs after summary in flex layouts */
  grid-column: 1 / -1;  /* spans full row in grid layouts (safe no-op if not grid) */
}



.woocommerce-page div.product div.images,
.woocommerce-page div.product div.summary  {
    width: 100%;
}

.product-icon img {
    max-height: 60px;
    max-width: 60px;
    object-fit: contain;
    height: 100%;
}

.product-description, .woocommerce #reviews #comments h2 {
    font-size: 24px;
    font-weight: 600;
    text-transform: uppercase;
}

.woocommerce-tabs .description {
    display: grid;
    gap: 1em;
    border-top: 2px solid #D0C9BB;
    border-bottom: 2px solid #D0C9BB;
    padding: 3em 0;
}

.woocommerce-tabs .comment_container  .description{
    border: none !important;
    padding: 0 !important;
    display: block !important;
}

.commentlist {
    display: flex;
    gap: 2em;
    flex-wrap: wrap;
    justify-content: center;
}

.woocommerce #reviews #comments ol.commentlist li {
    max-width: 479px;
    width: 100%;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
    margin: 0;
    border: none;
    background: #F4F3F2;
}

.woocommerce #reviews #comments ol.commentlist li img.avatar {
    display: none;
}

.reviews {
    display: none;
}

#comments {
    display: grid;
    gap: 2em;
}

.woocommerce .quantity .qty {
    width: 5em;
    height: 3em;
    border: none;
}







/* .single-product .woocommerce div.product form.cart {
    display: flex;
    gap: 1em;
    align-items: center;
} */

.woocommerce div.product form.cart {
    display: flex;
    flex-wrap: wrap;
}

.woocommerce div.product form.cart .quantity .qty {
    border: 1px solid #000;
    height: 100%;
}

.woocommerce div.product form.variations_form.cart {
    margin-bottom: 0;
    display: grid;
    justify-content: left;
}

.woocommerce div.product form.variations_form.cart .quantity .qty {
    height: 4.5em;
}





.single_variation_wrap .quantity .qty {
    width: 5em;
    height: 4.5em;
    border: none;
}

.woocommerce-message {
    border-top-color: #FFC833 ;
    margin-top: 5em;
}

.woocommerce-message::before {
    color: #FFC833 ;
}

.woocommerce-no-products-found {
    display: grid;
    grid-column: 2 / 16;
    margin-top: 2em;
}

.woocommerce .woocommerce-error .button, .woocommerce .woocommerce-info .button, .woocommerce .woocommerce-message .button, .woocommerce-page .woocommerce-error .button, .woocommerce-page .woocommerce-info .button, .woocommerce-page .woocommerce-message .button {
    justify-self: center;
    font-size: 24px !important;
    text-align: center !important;
    padding: 0.7em 2.2em;
    text-transform: uppercase !important;
    align-self: center !important;
    border-radius: 31px !important;
    display: grid !important;
    background: #FFC833  !important;
    border: 2px solid #FFC833  !important;
    color: #fff !important;
}

.woocommerce-info,
.woocommerce-error, .woocommerce-info, .woocommerce-message,
.woocommerce-info::before {
    border-top-color: #FFC833;
    color: #000;
}


.woocommerce-breadcrumb {
    display: none;
}

/* then in your stylesheet */
.product-variable .woocommerce-product-details__short-description {
  display: none;
}

.acf-single_side_custom_information input[type=text],
.acf-double_sided_custom_information input[type=text] 
{
    width: 100%;
    padding: 0.2em;
    border: none;
    margin-bottom: 0.5em;
    resize: vertical;
    justify-items: center;
    font-family: 'UK Number Plate';
    font-size: 60px;
    letter-spacing: 6px;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 1.74px;
}

.summary  #custom-option-preview  {
    display: none !important;
}


/* FIELD NOTE Information */

.field-note,
.attr-note{ 
    margin:.4rem 0 0; 
    font-size:.875rem; 
    line-height:1.35; 
}

.field-note .note-prefix,
.attr-note .note-prefix { 
    font-weight:600; 
    margin-right:.3rem; 
}

.field-note .note-toggle,
.attr-note .note-toggle { 
    text-decoration:underline; 
    cursor:pointer; 
}

.field-note .note-content,
.attr-note .note-content{ 
    display: none;
    margin-top: 0.5em;
    background: #fff;
    padding: 1em;
    color: red;
}









 #custom-option-preview {
    display: grid !important;
    gap: 1em;
    margin: 0 !important;
    padding: 1em;
    justify-items: center;
  }

  /* Panel wrapper */
  #custom-option-preview .preview-panel {
    position: relative;
    display: grid;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 8px;
    grid-template-columns: auto 1fr;
    text-align: center;
    aspect-ratio: 520 / 111;
    width: min(100%, 520px);
    height: auto;
  }

  #custom-option-preview .overlay-text-reg {
    color: #000;
    pointer-events: none;
    white-space: nowrap;
    font-family: 'UK Number Plate';
    text-transform: uppercase;
    line-height: 1;
    height: 100%;
    position: relative;
    align-content: center;
    display: grid;
  }

  #custom-option-preview .overlay-text-content::after {
    content: "";       
    display: inline-block; 
    width: 0;         
    height: 0;
  }

  .preview-panel-front {
    background-color: #e7e8e9;
  }

  .preview-panel-rear {
    background-color: #e6b725;
  }

  

  /* ALTERNATIVE SIZES and BORDERS */



/* STANDARD PLATE SIZE */
#custom-option-preview .preview-panel.standard {
    aspect-ratio: 520 / 111;
    width: min(100%, 520px);
    height: auto;
}




/* JAP PLATE SIZE */
#custom-option-preview  .preview-panel.japanese {
    aspect-ratio: 330 / 178;
    width: min(100%, 330px);
    height: auto;
}

#custom-option-preview .preview-panel.japanese .plate-border {
    height: 92%;
    width: 96%;
}

#custom-option-preview .preview-panel.japanese .overlay-text-content {
    max-width: 300px;
    justify-self: center;
    text-wrap: wrap;
    line-height: 0.84;
}



/* RANGE ROVER PLATE SIZE */
    #custom-option-preview .preview-panel-rear.rover {
    aspect-ratio: 533 / 152;
    width: min(100%, 533px);
    height: auto;
}

#custom-option-preview .preview-panel-rear.has-badge.rover .badge-icon,
#custom-option-preview .preview-panel-rear.rover.has-badge .badge-icon {
    width: 45px;
}


#custom-option-preview .preview-panel-rear.has-badge.rover .plate-border {
    width: 96.9%;
    height: 89.5%; 
}

#custom-option-preview .preview-panel-rear.rover .plate-border {
    width: 96.9%;
    height: 88.5%;
    /* transform: translate(-49.9%, -50%); */
}


.preview-panel.has-badge.rover .badges {
    padding-left: 9px
}




/* 4 X 4 PLATE SIZE */
#custom-option-preview .preview-panel.fourbyfour {
    aspect-ratio: 279 / 203;
    width: min(100%, 279px);
    height: auto;
}

#custom-option-preview .preview-panel.fourbyfour .overlay-text-content {
    max-width: 300px;
    justify-self: center;
    text-wrap: wrap;
    line-height: 0.82;
}

#custom-option-preview .preview-panel.fourbyfour .plate-border {
    height: 92%;
    width: 94%;
    /* transform: translate(-49.7%, -50%); */
}

#custom-option-preview .preview-panel.fourbyfour.has-badge .plate-border {
    height: 97%;
}










.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
    top: 40%
}




/* SCROLLING SIGLE PRODUCT ELEMENT */
    .outer-single-product {
        position: relative;
        column-gap: 4em;
        row-gap: 0;
    }

    .inner-gallery-scroll.is-stuck {
        position: fixed;
        /* top: 100px; */
        z-index: 1000;
    }

    .inner-gallery-scroll .flex-viewport {
        height: 100% !important;
    }

    /* .inner-gallery-scroll #custom-option-preview,
    .inner-gallery-scroll #custom-options-summary {
        padding: 1em 0;
    } */

    .inner-gallery-scroll.is-bottom {
        position: absolute;
        bottom: 0;
        top: auto;
        z-index: 1000;
    }





/* PLACE DROPDOWN OPTIONS ON TOP OF PLATE IMAGES */

    #custom-options-summary {
        /* padding: 1em; */
        background: #fff;
        font-size: 0.9em;
    }
    .selected-options-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: grid;
        gap: 0.2em;
        grid-template-columns: auto auto;
    }
    .selected-options-list li {
        margin-bottom: 0.25em;
        font-size: 12px;
    }
    .selected-options-list span.label {
        font-weight: bold;
         font-size: 12px;
    }





.flex-control-nav {
    gap: 8px;

}



@media only screen and (max-width: 1000px) {

        .outer-single-product {
            column-gap: 0em;
        }


/* .woocommerce-page div.product div.images,
.woocommerce-page div.product div.summary  {

        width: 87%;
    } */

    /* .woocommerce div.product div.images.woocommerce-product-gallery {
        position: unset;
    } */

    /* #custom-option-preview .preview-panel-rear.size-11-x-8-4x4.has-badge .plate-border {
        aspect-ratio: 11/9.6;
    } */

    #custom-option-preview .preview-panel-rear.size-21-x-6-range-rover.has-badge .plate-border  {
        height: 93%;
    }


     #custom-option-preview {
        padding: 0;
    }

    .preview-panel.has-badge .badges.green-background {
        min-width: 46px !important;
    }

    .woocommerce div.product div.images .flex-control-thumbs {
        flex-wrap: wrap;
        gap: 0.2em;
    }

    .mobile-title-price {
        margin-bottom: 1rem;
        text-align: center;
    }

    .mobile-title-price .price {
        margin: 0.25rem 0;
    }

    .mobile-price-only {
        text-align: center;   
        justify-self: center;
    }

.mobile-price-only .price .woocommerce-Price-currencySymbol,
.mobile-price-only .price .woocommerce-Price-amount bdi {
    color: #fff !important;
    font-size: 40px !important;
    background: #00AC4B;
    padding: 0.1em;
}

    .mobile-price-only p {
    font-size: 22px !important;
    }

 .inner-gallery-scroll {
    position: static !important;
    width: 100% !important;
    top: auto !important;
    bottom: auto !important;
  }

  .inner-gallery-scroll.is-stuck,
  .inner-gallery-scroll.is-bottom {
    position: static !important;
  }

  .summary #custom-option-preview {
    display: grid !important;
  }

}


  #custom-reg-text-visible {
    width: 100%;
    max-width: 300px;
    font-family: 'UK Number Plate';
    font-size: 55px;
    letter-spacing: 6px;
    text-transform: uppercase;
    background: #EFF0F0;
    border: 0;
    text-align: center;
    aspect-ratio: 520 / 111;
    letter-spacing: 1.74px;
    border-radius: 8px;
  }

  #custom-reg-text-visible::placeholder {
    color: #d0d1d1;
  }

  .reg-label {
    font-size: 25px;
    font-weight: 700;
  }



  /* BORDERS */

  .overlay-text-content {
    position: relative;
    z-index: 101;
  }

  .plate-border {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 2px solid #000;
    z-index: 100;
    width: 97%;
    border-radius: 6px;
    height: 86%;
  }



  /* PLATE ID TEXT */

    .plate-id-content, .plate-id-text {
        position: absolute;  
        font-size: 0.3em;  
        letter-spacing: 0;
        bottom: 0.25em;
        z-index: 999;
        padding: 0 0.2em;
        justify-self: center;
    }

    .plate-id-text {
        font-size: 0.2em;
        bottom: 0.5em;
        right: 0.8em;
    }

    .plate-id-content {
        display: flex;
    }
    
    .preview-panel-front .plate-id-content,
    .preview-panel-front .plate-id-text {
        background: #e7e8e9;
    }

    .preview-panel-rear .plate-id-content,
    .preview-panel-rear .plate-id-text  {
        background: #e6b725;
    }

    .plate-id-content img {
        max-width: 1.5em;
        margin-right: 0.1em;      
        padding: 0 !important;
        aspect-ratio: inherit !important;
        object-fit: contain !important;
        max-height: none !important;
    }

    .plate-id-content p, .plate-id-text p {
        font-size: 0.2em;
        text-transform: none;
    }


.preview-panel { container-type: size; }

/* Base font-size = X% of the container HEIGHT */
.overlay-text-reg {
    font-size: calc(var(--plate-base, 71.1) * 1cqh);
    line-height: 1;
}

.overlay-text-reg .overlay-text-content { 
    font-size: 1.4em;
    word-spacing: -13px;
    letter-spacing: 0.8px; 
    padding-top: 3px;
}



    

  /* BADGES */

  .badges {
    align-self: center;
    display: grid;

  }

  .preview-panel.has-badge .badges {
    padding-left: 9px;
  }

  .preview-panel.has-badge .badges.green-background {
    padding: 0 0.2em;
    background: #00AC4B;
    height: 100%;
    align-content: center;
    min-width: 60px;
  }

  .badge-icon {
    width: 41px;
    height: 100%;
    max-width: none !important;
  }

  .badge-text {
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    color: #1C3A7C;
    letter-spacing: 0;
  }

  .badges.green-background .badge-text {
    color: #fff;
  }




.variations_form select option,
.single_variation_wrap div p {
    width: auto;
    padding: 1em 0;
    border: none;
    resize: vertical;
    justify-items: start;
    display: grid;
    font-weight: 600;
}

#custom-reg-input-visible {
    padding: 1em 0 4em 0;
    border-bottom: 3px solid #FFC833;
    display: grid;
}

.product_title {
    font-size: 50px;
    font-weight: 700;
    text-transform: uppercase;
}

.acf-select_if_other_sizes_are_required,
.acf-printed_number_plate_border {
    display: flex !important;
    gap: 1em;
    flex-wrap: wrap;
}



/* large green arrow */
.form-field.acf-alternative_front_size,
.form-field.acf-single_side_custom_information,
.form-field.acf-border_colour {
    position: relative;
}

.form-field.acf-alternative_front_size::after,
.form-field.acf-single_side_custom_information::after,
.form-field.acf-border_colour::after {
    content: "\f309";        
    font-family: "Font Awesome 6 Pro";      
    color: #00AC4B;
    font-size: 2.5em;
    position: absolute;
    top: 0;
    left: -1em;
    font-weight: 600;
}

/* Make the rear field the positioning context for the icon */
.form-field.acf-alternative_rear_size { position: relative; }

/* Only when the FRONT field is hidden (inline display:none) */
.form-field.acf-alternative_front_size[style*="display: none"]
  + .form-field.acf-alternative_rear_size::after {
  content: "\f309";
  font-family: "Font Awesome 6 Pro";
  color: #00AC4B;
  font-size: 2.5em;
  position: absolute;
  top: 0;
  left: -1em;
  font-weight: 600;
}


.acf-printed_number_plate_border {
display: NONE !important;
}

.woocommerce div.product form.cart .variations {
    margin-bottom: 0;
}

.reset_variations {
    display: none;
}

.woocommerce div.product form.cart .variations select {
    background: none;
    appearance: auto;
}

.woocommerce form .form-row select,
select,
.variations tr td select {
    font-family: inherit;
    font-weight: 600;
    letter-spacing: normal;
    padding: .5em;
    display: block;
    background-color: #FFF !important;
    border: none;
    border-radius: 0;
    color: #000;
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    line-height: normal;
    height: auto;
}

.form-field label,
.form-row label {
    font-weight: 800;
    text-transform: uppercase;
    padding: 0 0 0.4em 0;
    font-size: 16px;
}

.variations tr {
    display: grid;
    padding: 0 0 2em 0;
}

.woocommerce form .form-row {
    padding: 0;
}

.woocommerce form .form-row,
.form-field {
    display: grid;
}

.acf-fields-pack {
    display: grid;
    gap: 2em;
}

.acf-pack-row {
    padding: 0 !important;
}

.woocommerce-input-wrapper {
    width: 100%;
}





/* base */
.help-tip, .help-astrix {
  color: #C9491A;
  font-weight: bold;
  transition: color .2s;
}

/* required wrapper - keep color but let border follow it */
.form-field.required .help-tip,
.letter_style_thickness.required .help-tip {
  color: #C9491A;
  border-color: currentColor;
}

/* detailed base styling */
.help-tip {
  display:inline-block;
  width:1em; 
  height:1em; 
  line-height:1; 
  text-align:center;
  border:1px solid currentColor;
  border-radius:50%;
  font-size:1.2em;
  cursor:help;
  position:relative;
}

/* make FA icons follow the tip color no matter what */
.help-tip i, .help-tip svg {
  color: inherit !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

/* .help-tip::after {
    content: attr(data-tip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + .5em);
    transform: translateX(-50%);
    background: rgba(0,0,0,.8);
    color: #fff;
    padding: .4em .6em;
    border-radius: .3em;
    white-space: nowrap;
    font-size: .75em;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s;
    z-index: 10;
    min-width: 300px;
    text-wrap: wrap;
} */

/* Default: grey for all tips/stars */
.help-tip,
.help-astrix {
  color: #9aa0a6;              /* grey */
  border-color: currentColor;  /* keep ring same colour */
}


/* Keep the "?" visible even if data-tip is empty, but hide the bubble */
.help-tip[data-tip=""]::after { display: none; }

/* First three should start red */
label[for="custom-reg-text-visible"] .help-tip,
label[for="custom-reg-text-visible"] .help-astrix,
label[for="letter_style_thickness"] .help-tip,
label[for="letter_style_thickness"] .help-astrix,
label[for="number_plates_required"] .help-tip,
label[for="number_plates_required"] .help-astrix {
  color: #C9491A; /* red */
}








/* Put filename text next to the icon; truncate if long */
.form-field.acf-identification_upload,
.form-field.acf-entitlement_upload {
  --upload-size: 56px;
  position: relative;
  padding-bottom: 6em;
  padding-right: calc(var(--upload-size) + 12px);
}

/* your existing icon (unchanged) */
.form-field.acf-identification_upload::after,
.form-field.acf-entitlement_upload::after {
  content: "\f0ee";
  font-family: "Font Awesome 6 Pro";
  color: #00AC4B;
  font-size: 1.6em;
  position: absolute;
  left: 0;
  bottom: 1.2em;
  width: var(--upload-size);
  height: var(--upload-size);
  border: 2px dotted #000;
  border-radius: 8px;
  text-align: center;
  line-height: var(--upload-size);
  pointer-events: none;
}



/* keep the real input clickable */
.form-field.acf-identification_upload input[type="file"],
.form-field.acf-entitlement_upload input[type="file"] {
  position: absolute;
  left: 0;
  bottom: 3em;
  width: var(--upload-size);
  height: var(--upload-size);
  opacity: 0;
  cursor: pointer;
  z-index: 2;
}

/* filename bubble */
.form-field.acf-identification_upload.has-file::before,
.form-field.acf-entitlement_upload.has-file::before {
  content: attr(data-filename);
  position: absolute;
  left: calc(var(--upload-size) + 12px);
  bottom: calc(1.2em + (var(--upload-size) - 1.2em)/2);
  max-width: calc(100% - var(--upload-size) - 16px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: .95em;
  color: #333;
}










.fa-circle-check {
    font-size: 1.4em;
}

.help-tip:hover::after {
    opacity: 1;
}

.letter_style_thickness.required .help-tip {
    color: #C9491A;
    border-color: #C9491A;
}

.small-text {
    font-size: 12px;
}

.letter_style_thickness {
    display: grid !important;
}






.wc-block-components-product-details li {
    padding: 0.3em 0;

}

.wc-block-components-product-details.wc-block-components-product-details {
    margin: 0 !important;
}

.wp-block-woocommerce-checkout-order-summary-cart-items-block .wc-block-components-product-name {
    font-size: 25px !important;
    font-weight: 600 !important;
}

.wp-block-woocommerce-checkout-order-summary-cart-items-block .wc-block-components-product-details li{
    font-size: 18px !important;
}

.wp-block-woocommerce-checkout-order-summary-cart-items-block .wc-block-components-order-summary-item__description {
    text-align: left !important;
}

.wp-block-woocommerce-checkout-order-summary-block .wc-block-components-product-price span {
    font-size: 18px !important;
}


/* OTHER SIZES */

.form-field.acf-alternative_front_size,
.form-field.acf-alternative_rear_size,
.form-field .acf-border_colour,
.acf-single_side_custom_information, 
.acf-double_sided_custom_information,
.form-field.acf-border_colour {
    margin-left: 5em;
}

/* <i class="fa-solid fa-down-long"></i> */


#alternative_front_size,
#alternative_rear_size,
#border_colour,
#single_side_custom_information,
#double_sided_custom_information {
    width: 100%;
}

/* PRICE */

.woocommerce-variation-price { 
    display: none !important; 
}

.ss-from-price {
    font-weight: 600;
    font-family: "Montserrat", sans-serif;
    color: #000 !important;
}

.summary .woocommerce-Price-amount bdi,
.tax-price .woocommerce-Price-amount bdi {
    background: #00AC4B;
    padding: 0.2em;
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
}

.summary .woocommerce-Price-amount bdi .woocommerce-Price-currencySymbol,
.tax-price .woocommerce-Price-amount bdi .woocommerce-Price-currencySymbol  {
    color: #fff;
    font-family: "Montserrat", sans-serif;
}

/* hide the original variation-price if you still need it gone */
.woocommerce-variation-price {
  display: none !important;
}

/* style only the numeric price badge */
.price.ss-from-price .from-amount {
  display: inline-block;    /* shrink-wrap */
  background: #00AC4B;      /* green background */
  color: #fff !important;   /* white text */
  padding: 0.2em 0.4em;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
}




/* ADD TO CART BUTTON */

.single_variation_wrap button,
.single_add_to_cart_button  {
    justify-self: center;
    font-family: "Montserrat", sans-serif;
    font-size: 20px !important;
    font-weight: 700 !important;
    text-align: center;
    padding: 1em !important;
    text-transform: uppercase;
    color: #000 !important;
    background-color: #FFC833 !important;
}



.wc-block-components-quantity-selector,
.wc-tabs,
.wc-tab h2{
    display: none !important;
}

.wc-tab {
    background-color: #EFF0F0;
    padding: 0 2em 2em 2em;
}

.product-icon-info-outer {
    display: grid;
    /* grid-column: 2 / 16; */
    background: #EFF0F0;
    gap: 2em;
    padding: 2em;
    /* width: 49.3%; */
}

.product-icon-info {
    display: flex;
    gap: 2em;
    align-items: center;
}

.product-icon  {
    max-width: 60px;
    width: 100%;
    aspect-ratio: 1/1;
}

.info-text {
    display: flex;
    font-weight: 800;
    text-transform: uppercase;
}



/* CART */
.wc-block-components-product-details.wc-block-components-product-details li {
    line-height: 1.5;
}



/* 1) Make the wrapper the containing block */
.reg-input-with-brand {
  position: relative;
}

/* 2) Input: leave relative if you like, but it doesn't affect siblings */
#custom-reg-text-visible {
  position: relative;   /* optional; not used for absolute siblings */
  width: 100%;
}

/* 3) Absolutely position BOTH chip blocks inside the wrapper */
.plate-id-chip-media {
  position: absolute;
  bottom: 2px;
  align-items: center;
  gap: 2px;
  pointer-events: none; 
  display: flex;
  left: 120px;
  font-weight: 600;
}

.plate-id-chip-text {
    position: absolute;
    bottom: 2px;
    display: flex;
    flex-direction: column;
    line-height: 1.1;
    font-size: 22px;
    pointer-events: none;
    left: 12em;
    z-index: 1;
    font-weight: 600;
}

/* Small tidy-ups */
.plate-id-chip-media img {
  height: 3px;
  width: auto;
  display: block;
}
.plate-id-chip-media p,
.plate-id-chip-text p {
  margin: 0;
  font-size: 4px;
}




@media only screen and (max-width: 1000px) {

    .single-product .product {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1em
    }

    .woocommerce-product-gallery {
        order: 1;
    }

    .woocommerce div.product div.summary {
        order: 2;
        text-align: center;
    }
    
    .woocommerce-tabs {
        grid-template-columns: 1fr;
        grid-column-start: span 1;
        width: 100%;
        gap: 0;
    }

    .single-product {
        grid-column: 2/16;
    }

    .woocommerce div.product form.variations_form.cart {
        grid-column-start: span 1;
        padding: 0.5em;
        margin-top: 0;
    }

    .product-icon-info-outer {
        grid-column: 2 / 16;
        width: 100%;
    }

    .faq-container-product {
        grid-column: 2 / 16;
        width: 100%;
    }

    .faq-box-product {
        width: 95%;
        margin-left: 0.5em;
    }
    
    .outer-single-product {
        padding: 2em 0;
    }

    .woocommerce div.product div.summary {
        padding: 0;
    }

    .preview-panel.has-badge .badges {
        padding-left: 0.5em;
    }
    .badges {
        gap: 0.2em;
    }

    .badge-icon {
        width: 40px;
    }

    .badge-text {
        font-size: 16px;
    }

    #custom-reg-text-visible {
        justify-self: center;
    }

    .wc-tab {
        padding: 2em;
    }

   #custom-option-preview .overlay-text-reg {
        letter-spacing: 9px !important;
    }   
    
    .woocommerce-product-gallery__wrapper #custom-option-preview {
        display: none !important;
    }

}













/* GREY BOX INFO */

.outer-grey-boxes {
    padding: 5em 0;
    border-bottom: 3px solid #FFC833;
}

.inner-grey-box {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column: 2/16;
    gap: 2em;
    align-items: stretch;
}

.grey-boxes {
    background-color: #EFF0F0;
    padding: 2.5em;
    height: 100%;
}

.grey-boxes h3 {
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 1em;
}

.grey-boxes p {
    font-size: 20px;
}


@media only screen and (max-width: 1000px) {

    .inner-grey-box {
        grid-template-columns: 1fr;
        gap: 1em;
    }

    .grey-boxes {
        text-align: center;
        padding: 1.5em;
    }

    .grey-boxes p {
        font-size: 16px;
    }

    .outer-grey-boxes {
        padding: 2em 0;
    }

}

       



/* ACCOUNT PAGE */

.woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout a::after {
    content: "\e668";        
    font-family: "Font Awesome 6 Pro";
    font-weight: 600;    
    margin-left: 0.3em;       
    vertical-align: middle;
    color: #00AC4B;
    font-size: 1.5em;
  }
  
 
  













/* PRODUCTS INFO WITH IMAGES */

.product-info-page {
    padding: 5em 0 0;
}

.product-info-display {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column: 2/16;
    gap: 3em;
}

.product-info-image {
    display: grid;
    grid-template-rows: auto auto;
    gap: 1em; 
  }

.product-info-image img {
    object-fit: cover;
    max-height: 555px;
    height: 100%;
}
  
.product-gallery-thumbs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5em;
}

.product-gallery-thumbs img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border: 1px solid #ddd;
    border-radius: 4px;
}
  
.product-info-content {
    display: grid;
    gap: 1em;
    align-content: start;
}

.product-info-content .excerpt {
    font-size: 20px;
    line-height: 1.5;
}

.product-info-content h2 {
    font-weight: 700;
}

.product-info-content .price-info {
    color: #00AC4B;
    font-size: 30px;
    font-weight: 600;
}

.price-info span bdi,
.price-info span bdi span {
    background-color: transparent;
    color: #00AC4B !important;
    font-size: 30px !important;
}

.product-info-button {
    justify-self: start;
    margin: 2em 0;
}



@media only screen and (max-width: 1000px) {

    .product-info-display {
        grid-template-columns: 1fr;
    }

    .product-info-content {
        text-align: center;
    }

    .product-info-button {
        justify-self: center;
        margin: 1em 0;
    }

}





/* make the badge sit nicely beside the icon */
.main-nav .menu-item-243 .cart-count {
    margin-left: 0.3em;
    color: #fff;
    font-size: 1em;
    line-height: 1.5;
    font-weight: bold;
    vertical-align: middle;
    display: inline-block;
    text-align: center;
    align-content: center;
  }

  .basket-count a {
    display: flex;
  }
  









/* PLATES */

.outer-plates {
    padding: 5em 0 0;
}

.inner-plates {
    display: grid;
    gap: 1em;
    grid-column: 2 / 16;
}

.plates-boxes {
    display: grid;
    grid-template-columns: auto 1fr 1fr;
    gap: 3em;
    align-items: center;
}

.plates-boxes img {
    object-fit: cover;
}

.plate-boxes-images p {
    text-align: center;
}

.plates-boxes span p {
    font-size: 50px;
    font-weight: 700;
}




@media only screen and (max-width: 1000px) {

    .plates-boxes {
        grid-template-columns:  1fr;
        gap: 1em;
    }

    .plates-boxes span p {
        text-align: center;
    }

}








/* ONE COLUMN CONTENT */

.one-column {
    padding: 5em 0;
    background-color: #EFF0F0;
    margin: 5em 0 0;
}

.inner-one-column {
    display: grid;
    grid-column: 2/16;
    gap: 2em;
    text-align: center;
    justify-content: center;
}

.inner-one-column img {
    max-width: 759px;
    background-color: #fff;
    padding: 2em;
    border-radius: 29px;
}








/* PLATE SIZES */

.outer-sizes {
    padding: 5em 0;
    border-bottom: 5px solid #FFC833;;
}

.outer-sizes h2 {
    grid-column: 2/16;
    text-align: center;
    text-transform: uppercase;
    padding-bottom: 2em;
    font-weight: 600;
}

.inner-plates-sizes {
    grid-column: 3/15;
}

.plates-sizes {
    grid-template-columns: 1fr 1fr;
    border-bottom: 3px solid #FFC833;
    padding: 4em 0;
}

.plates-sizes:first-of-type {
    border-top: 3px solid #FFC833;
}

.inner-plate-content {
    display: grid;
    gap: 1em;
}

.inner-plate-content h4 {
    font-size: 30px;
    text-transform: uppercase;
    font-weight: 600;
}

.inner-plate-content p {
    font-size: 20px;
}

.plates-sizes img {
    aspect-ratio: 41/9;
    object-fit: contain;
}



@media only screen and (max-width: 1000px) {

    .inner-plates-sizes {
        grid-column: 2/16;
    }
    
    .plates-sizes {
        grid-template-columns: 1fr;
    }

    .inner-plate-content {
        justify-content: center;
        text-align: center;
    }
}








/* single product summary scroller */

@media (min-width: 1024px) {

  .single-product .product {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 2rem;
  }

}

.single-product1,
.single-product2,
.single-product .product {
  overflow: visible !important;
}










/* PRODUCT PAGE CONTACT FORM */

.faq-container-product form{
    margin: 0 auto;
    width: 100%;
    padding: 2em 0;
}

.faq-container-product form input[type=text], 
.faq-container-product form input[type=tel],
.faq-container-product form input[type=email],
.faq-container-product form select,
.faq-container-product form textarea {
    width: 100%;
    padding: 0.5em;
    border: none;
    margin-bottom: 0.5em;
    resize: vertical;
    background: #fff;
    justify-items: start;
    font-size: 18px;
}

.faq-container-product form textarea {
    margin-bottom: 0;
}

.faq-container-product form input[type=text]::placeholder,
.faq-container-product form input[type=email]::placeholder,
.faq-container-product form input[type=tel]::placeholder,
.faq-container-product form select option,
.faq-container-product form select,
.faq-container-product form textarea::placeholder {
    font-size: 18px;
    text-align: center;
    color: #000;
}


/* FORM SUBMIT BUTTON */
.faq-container-product form input[type=submit] {
    justify-self: center;
    font-size: 20px !important;
    font-weight: 600 !important;
    text-align: center !important;
    padding: 0.5em 2em;
    text-transform: uppercase !important;
    align-self: center !important;
    display: grid !important;
    background: #FFC833 !important;
    border: none;
    
}






.shc-variation-gallery .shc-thumb-list{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 6px;padding:0;list-style:none;}
.shc-variation-gallery .shc-thumb{position:relative;border:1px solid #ccc;background:#fff;padding:2px;border-radius:2px;cursor:move}
.shc-variation-gallery .shc-thumb img{display:block;width:60px;height:60px;object-fit:cover}
.shc-variation-gallery .shc-remove{position:absolute;top:-6px;right:-2px;background:#fff;border:1px solid #ccc;border-radius:50%;width:18px;height:18px;line-height:16px;text-align:center;font-weight:bold;color:#555}
.shc-thumb-placeholder{width:60px;height:60px;border:2px dashed #bbb;background:#f7f7f7;visibility:visible}
.shc-variation-gallery .shc-controls .button{margin-right:6px}