#wpadminbar,
#wpadminbar a:hover {
    --color-bg: transparent;
    --color-text: initial;
}

hr {
   height: 6px;
   background: url("../img/scallop-hr.svg") repeat-x 0 0;
   border: 0 !important;
   width: 100%;
}

/* 3 - images */
img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}
svg {
    height: auto;
    vertical-align: middle;
    width: 100%;
}
:root {
    --avatar-size: 50px;
    --height-bar: 80px;
    --scallop-size: 6px;
}
.avatar {
    border: 1px solid var(--gray-bg);
    border-radius: 50%;
    height: var(--avatar-size);
    overflow: hidden;
    width: var(--avatar-size);
}


/* 3 - links and buttons */
a, span.link {
    --color-text: var(--color-alpha);
    cursor: pointer;
    transition: color 0.7s linear;
}
a.no-underline {
    text-decoration: none;
}
a:hover, span.link:hover {
    --color-text: var(--color-bravo);
}
h1 > a,
h2 > a,
h3 > a,
h4 > a,
h5 > a,
h6 > a {
    text-decoration: none;
}
.content-main a[target='_blank']:after {
    background: var(--color-bravo);
    color: var(--white);
    content: '\2197';
    display: inline-block;
    font-size: 0.8em;
    left: 5px;
    line-height: 1.2em;
    opacity: 0.8;
    position: relative;
    text-align: center;
    top: -3px;
    width: 1.2em;
}
button, .btn,
.wp-block-button__link,
.wp-block-button__link:visited,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce button.button.alt,
input[type="submit"] {
    --border-radius: 30px;
    --color-bg: transparent;
    --color-text: var(--color-alpha);
    background-color: var(--color-bg);
    border: 2px solid var(--color-text);
    border-radius: var(--border-radius);
    color: var(--color-text);
    cursor: pointer;
    display: inline-block;
    font-family: var(--font-family-nav);
    font-size: var(--font-size);
    font-size: 1em;
    font-weight: var(--weight-bold);
    line-height: 2;
    margin: 0.5em 0;
    overflow: hidden;
    padding: 0 15px;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: color 0.2s linear, background-color 0.2s ease-in-out;
    vertical-align: middle;
    white-space: nowrap;
}
button:hover, .btn:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce button.button.alt:hover,
input[type="submit"]:hover {
    --color-bg: var(--color-alpha);
    --color-text: var(--white);
    background-color: var(--color-bg);
    border-color: var(--color-bg);
    color: var(--color-text);
}

/* 3 - Red's sections */
.reds-dark h1, .reds-wood h1,
.reds-dark h2, .reds-wood h2,
.reds-dark h3, .reds-wood h3 {
    color: var(--color-alpha);
}

/* 3 - light linen section */
.reds-light h1, 
.reds-light h2,
.reds-light h3 {
    color: var(--black);
}
.reds-light h1 em, 
.reds-light h2 em,
.reds-light h3 em {
    color: var(--color-alpha);
}

.reds-light {
    --color-text: var(--black);
    background-color: #f7f2dd;
    background-image: url('../img/bg-texture-light.png');
    background-size: 1200px 896px;
    position: relative;
}
.reds-light .scallop-top {
    background-color: #f7f2dd;
}
.reds-light .wp-block-columns {
    margin: 0 auto;
}
.reds-light ul:not(.wc-block-grid__products), .reds-light ol {
    margin: 0 auto;
}
.reds-light ul {    
    list-style: none;
}
@media all and (max-width: 781px) {
    .reds-light .wp-block-columns {
        gap: 0;
    }
}


/* 3 - dark chalkboard section */
.reds-dark {
    --color-text: var(--white);
    background-color: #1e1e1e;
    background-image: url('../img/bg-texture.png');
    background-size: 1200px 896px; 
    position: relative;       
}
.reds-dark .scallop-top {
    background-color: #1e1e1e;
}
.reds-dark .wp-block-columns {
    margin: 0 auto;
    max-width: var(--page-max-width);
}
.reds-dark a.btn,
.reds-dark a.wp-block-button__link {
    color: var(--white);
    border-color: var(--white);
}
.reds-dark ul:not(.wc-block-grid__products), .reds-dark ol {
    margin: 0 auto;
}
.reds-dark ul {    
    list-style: none;
}
.reds-dark li:not(.wc-block-grid__product) {
    font-family: var(--font-family-alt);
    font-size: 22px;
    padding: 10px 0 10px 35px;
    position: relative;
    text-transform: uppercase;
}

.reds-dark li:not(.wc-block-grid__product) a {
    font-family: var(--font-family-alt);
    font-size: 22px;
}
.reds-dark li:not(.wc-block-grid__product) a:hover {
    color: var(--color-alpha);
}
.reds-dark li em {
    font-style: normal;
    color: var(--color-alpha);
}
.reds-dark .splide__pagination li {
    padding: 0;
}
.reds-dark .splide__pagination__page {
    --color-text: var(--color-alpha);
    height: 15px;
    margin: 15px 5px;
    padding: 0;
    width: 15px;
}
.reds-dark .splide__pagination__page:hover {
    background-color: var(--color-alpha);
    border-color: var(--color-alpha);
}
.reds-dark .splide__pagination__page.is-active {
    --color-bg: var(--color-alpha);
}
@media all and (max-width: 767px) {
    .reds-dark .wp-block-columns {
        gap: 0;
    }
}

/* 3 - wood section */
.reds-wood {
    --color-text: var(--black);
    background: url('../img/wood.webp') top center / 1300px 1950px repeat;  
    position: relative;      
}
.reds-wood .scallop-top {
    background-color: #f7f7f7;
}
.reds-wood .wp-block-columns {
    margin: 0 auto;
    max-width: var(--page-max-width);
}
.reds-wood ul:not(.wc-block-grid__products), .reds-wood ol {
    margin: 0 auto;
}
.reds-wood ul {    
    list-style: none;
}
.reds-wood li:not(.wc-block-grid__product) {
    font-family: var(--font-family-alt);
    font-size: 22px;
    padding: 10px 0 10px 35px;
    position: relative;
    text-transform: uppercase;
}
.reds-wood li:not(.wc-block-grid__product) a {
    font-family: var(--font-family-alt);
    font-size: 22px;
}
.reds-wood li:not(.wc-block-grid__product) a:hover {
    color: var(--color-alpha);
}
.reds-wood li em {
    font-style: normal;
    color: var(--color-alpha);
}

@media all and (max-width: 767px) {
    .reds-wood .wp-block-columns {
        gap: 0;
    }
}
.reds-wood.wood-green {
    --color-text: var(--white);
    background: url('../img/wood-green.webp') top center / 1300px 1950px repeat;     
}
.reds-wood.wood-green h2 {
    color: var(--white);
}
.reds-wood.wood-green .scallop-top {
    background-color: var(--color-charlie);
}
.reds-wood.wood-green .wp-block-social-links a {
    --color-bg: var(--color-charlie);
}
.reds-wood.wood-blue {
    --color-text: var(--white);
    background: url('../img/wood-blue.webp') top center / 1300px 1950px repeat;     
}
.reds-wood.wood-blue .scallop-top {
    background-color: var(--color-bravo);
}
.reds-wood.wood-yellow {
    --color-text: var(--white);
    background: url('../img/wood-yellow.webp') top center / 1300px 1950px repeat;     
}
.reds-wood.wood-yellow .scallop-top {
    background-color: var(--color-delta);
}
.section > .wp-block-group__inner-container {
    margin: 0 auto;
    max-width: var(--max-width-extra);
    padding: var(--section-padding) var(--padding);
}
.wp-block-group__inner-container .scallop-top {
    left: 0;
    position: absolute;
    top: -6px;
    width: 100vw;
}


/* split fix */
.splide__list {
    height: auto !important;
}


/* checklist */
ul.checklist li {
    font-family: var(--font-family-alt);
    font-size: 22px;
    padding: 10px 0 10px 35px;
    position: relative;
    text-transform: uppercase;
}

ul.checklist li:before {
    background-image: url('../img/check-red.svg');
    background-repeat: no-repeat;
    content: '';
    display: block;
    height: 25px;
    left: 0;
    position: absolute;
    top: 13px;
    width: 25px;
}

ul.checklist li a {
    font-family: var(--font-family-alt);
    font-size: 22px;
}

/* 3 - modal related */
.main-action {
    --color-bg: transparent;
    bottom: calc(var(--height-bar) + var(--padding));
    position: fixed;
    right: var(--padding);
    z-index: 1000;
}
@media all and (min-width: 993px) {
    .main-action {
        bottom: var(--padding);
        right: calc(var(--padding) * 2);
    }
}
@media all and (min-width: 1400px) {
    .main-action {
        right: calc(50vw - (var(--page-extra-width) / 2) + (var(--padding) * 2));
    }
}
#site-modal {
    background-color: rgba(255, 255, 255, 0.8);
    bottom: 0;
    display: none;
    padding: 40px 20px var(--height-bar) 20px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 2000;
}
#site-modal.show {
    display: grid;
    align-items: center;
}
#site-modal > i {
    font-size: 26px;
    position: absolute;
    right: 10px;
    top: 10px;
}
.modal-wrap {
    padding: var(--padding);
}


/* 3 - form items */
form {
    margin: 0 auto;
    max-width: var(--max-width-medium);
}

.grid[data-fieldtype] {
    --padding: 0;
    padding-bottom: 20px;
}
.grid[data-fieldtype=checkbox] {
    --padding: 10px;
    display: flex;
    margin: var(--padding) 0;
}
.grid[data-fieldtype=clearablefile],
.grid[data-fieldtype=select],
.grid[data-fieldtype=summernote] {
    --padding: 10px;
}
.grid[data-fieldtype=checkbox] label {
    order: 2;
}
.grid[data-fieldtype=clearablefile] .file-remove {
    padding-top: var(--padding);
}
.grid[data-fieldtype=clearablefile] .file-remove label {
    order: -1;
}
label {
    --color-text: var(--gray-dark);
    display: block;
    font-weight: var(--weight-semi-bold);
}

input[type=email],
input[type=password],
input[type=text],
input[type=tel],
input[type=url],
select.forminator-select--field,
textarea,
#mc_embed_signup .mc-field-group input[type=email],
#mc_embed_signup .mc-field-group input[type=text] {
    background-color: var(--white);
    border: 2px solid var(--gray-light);
    border-radius: var(--border-radius);
    color: var(--black);
    font-family: var(--font-family);
    font-size: var(--font-size);
    line-height: 1.8;
    margin: 0.5em 0;
    padding: 0.5em;
    text-indent: 0;
    width: 100%;
}
input[type=checkbox] {
    --size: 1.4em;
    border: 1px solid var(--color-text);
    height: var(--size);
    margin: 0;
    width: var(--size);
}
input[type=submit],
#mc_embed_signup input[type=submit] {
    background-color: var(--color-bg);
    border: 2px solid var(--color-alpha);
    border-radius: var(--border-radius);
    color: var(--color-alpha);
    font-size: 1em;
    height: auto;
    line-height: 2;
    margin: 0.5em 0;
    padding: 0 15px;
}
input[type=submit]:hover,
#mc_embed_signup input[type=submit]:hover {
    background-color: var(--color-alpha);
    color: var(--white);
}
select {
    padding: 5px 3px;
}
ul.errorlist {
    --color-text: var(--error);
    padding: 0 0 10px 1em;
}
#mc_embed_signup form {
    padding: 0;
}
#mc_embed_signup .mc-field-group {
    width: 100%;
}
.forminator-checkbox-label {
    margin-left: 0.5em;
}
#ui-datepicker-div {
    background: var(--white);
    border: 2px solid var(--gray-light);
    margin-top: 10px;
    padding: 10px;
}
@media screen and (min-width: 783px) {
    select.forminator-select--field {
        max-width: 60%;
    }   
}
@media screen and (min-width: 850px) {
    select.forminator-select--field {
        max-width: 50%;
    }   
}
/* 3 - image related */

.wp-block-image.rotate-left img,
img.rotate-left {
    transform: rotate(-5deg);
}
.wp-block-image.rotate-right img,
img.rotate-right {
    transform: rotate(5deg);    
}
.wp-block-image.rotate-left, 
.wp-block-image.rotate-right {
    margin: 1rem 0 3rem 0;
}
.wp-block-image.image-frame img,
img.image-frame {
    border: 10px solid var(--white);
}
.wp-block-image.image-shadow img,
img.image-shadow {
    box-shadow: -5px 5px 10px #aaa;
}
/* 3 - utilities */
.section-padding {
    padding: var(--section-padding) var(--padding);
}
.bottom-space {
    margin-bottom: var(--padding);
}
.no-bottom-space {
    margin-bottom: 0;
}
.small-width {
    max-width: var(--max-width-small) !important;
}
.medium-width {
    max-width: var(--max-width-medium) !important;
}
.large-width{
    max-width: var(--max-width-large) !important;
}
.extra-width {
    max-width: var(--max-width-extra) !important;
}
.center-block {
    margin: 0 auto;
}
.left-flair,
.right-flair {
    display: inline-block;
    position: relative;
}
.left-flair:before {
    background-image: url('../img/left-flair.svg');
    background-repeat: no-repeat;
    content: '';
    display: block;
    height: 25px;
    left: -25px;
    position: absolute;
    top: -10px;
    width: 25px;
}

.right-flair:after {
    background-image: url('../img/right-flair.svg');
    background-repeat: no-repeat;
    content: '';
    display: block;
    height: 25px;
    right: -25px;
    position: absolute;
    top: -10px;
    width: 25px;
}

.scallop-bottom {
    background-color: inherit;
    bottom: calc(-1 * var(--scallop-size));
    height: var(--scallop-size);
    margin-top: var(--padding);
    -webkit-mask-repeat: repeat-x;
    mask-repeat: repeat-x;
    -webkit-mask-image: url('../img/scallop.svg');
    mask-image: url('../img/scallop.svg');
    position: relative;
    width: 100%;
    z-index: 10;
}

.scallop-top {
    background-color: inherit;
    height: var(--scallop-size);
    -webkit-mask-repeat: repeat-x;
    mask-repeat: repeat-x;
    -webkit-mask-image: url('../img/scallop.svg');
    mask-image: url('../img/scallop.svg');
    position: absolute;
    top: calc(-1 * var(--scallop-size));
    transform: rotate(180deg);
    width: 100%;
    z-index: 10;
}

/* 3 - wordpress */
.has-small-font-size a {
    font-size: var(--wp--preset--font-size--small) !important;
}
@media all and (max-width: 781px) {
    .wp-block-image .alignright {
        float: none;
        margin: 0 auto;
    }
}
