:root {

    /*** Cores ***/
    --primary-color: #20c777;
    --secondary-color: #2882bd;
    --bg-color: #f8f9f9;
    --background-color: #ffffff;
    --foreground-color: #222222;
    --gray-light: #e9e9e9;
    --gray-medium: #c7c7c7;
    --gray-dark: #888;
    --gray-darker: #757575;    
    --shadow-color: rgba(0, 0, 0, 0.1);
    --shadow-color-darker: rgba(0, 0, 0, 0.15);
    --text-gray: #666;
    --border-gray: #b9b9b9;
    --hover-dark: #1ebe71;
    --icon-dark: #606060;
    --border-dashed: rgb(95, 94, 94);

    /*** Cores Neutras ***/
    --neutral-color-100: #f9fafb;
    --neutral-color-200: #f3f4f6;
    --neutral-color-300: #e5e7eb;
    --neutral-color-400: #d1d5db;
    --neutral-color-500: #9ca3af;
    --neutral-color-600: #6b7280;
    --neutral-color-700: #4b5563;
    --neutral-color-800: #374151;
    --neutral-color-900: #1f2937;

    /*** EspaÃƒÆ’Ã‚Â§amentos ***/
    --spacing-xs: 3px;
    --spacing-sm: 5px;
    --spacing-md: 10px;
    --spacing-lg: 15px;
    --spacing-xl: 20px;
    --spacing-xxl: 25px;
    --spacing-xxxl: 60px;

    /*** Fontes ***/
    --font-size-xs: 8px;
    --font-size-sm: 10px;
    --font-size-md: 12px;
    --font-size-base: 14px;
    --font-size-lg: 15px;
    --font-size-xl: 16px;
    --font-size-xxl: 24px;
    --font-size-xxxl: 25px;

    /*** Bordas ***/
    --border-radius-sm: 9px;
    --border-radius-md: 12px;
    --border-radius-lg: 15px;
    --border-radius-circle: 50%;
    --border-radius-breadcrumb: 40px;
    --border-width-sm: 1px;
    --border-width-md: 2px;
    --border-style-solid: solid;
    --border-style-dashed: dashed;

    /*** ÃƒÆ’Ã‚Âcones ***/
    --icon-size-sm: 18px;
    --icon-size-md: 21px;
    --icon-size-lg: 24px;
    --logo-size-sm: 36px;
    --logo-size-md: 42px;
    --logo-size-lg: 56px;
    --logo-size-xl: 60px;

    --search-height: 40px;
    --header-height: 64px;
    --image-height: 200px;
    --scrollbar-size: 12px;

    /*** Sombras ***/
    --box-shadow-sm: 0 0.125rem 0.3125rem var(--shadow-color);
    --box-shadow-md: 0 0.35rem 0.65rem var(--shadow-color);
    --box-shadow-search: 1.95px 1.95px 2.6px var(--shadow-color-darker);
    --box-shadow-button: 0 3px 8px var(--shadow-color);
    --box-shadow-icon: 1px 2px 1px var(--shadow-color);        
    
    /*** Z Index ***/
    --z-index-base: 1;
    --z-index-elevated: 10;
    --z-index-card: 20;
    --z-index-sticky: 30;
    --z-index-dropdown: 40;
    --z-index-modal: 50;
    --z-index-overlay: 60;
    --z-index-toast: 70;
    --z-index-tooltip: 80;
    --z-index-max: 999;
}

/********
  Listas
*********/
ul.is-style-fancy li,
ul.is-style-arrow li,
ul.is-style-check li {
    list-style-type: none;
    position: relative
}

ul.is-style-arrow li::before {
    color: var(--primary-color);
    content: "➤";
    position: absolute;
    left: -20px
}

ul.is-style-fancy li::before {
    content: "✱";
    color: var(--primary-color);
    position: absolute;
    left: -20px
}
ul.is-style-check li::before {
    content: ""; /* Empty content since we're using background-image */
    position: absolute;
    left: -20px;
    top: 6px;
    width: 16px; /* Adjust size as needed */
    height: 16px; /* Adjust size as needed */
    background-image: url('data:image/svg+xml;utf8,<svg width="64" height="64" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12ZM16.0303 8.96967C16.3232 9.26256 16.3232 9.73744 16.0303 10.0303L11.0303 15.0303C10.7374 15.3232 10.2626 15.3232 9.96967 15.0303L7.96967 13.0303C7.67678 12.7374 7.67678 12.2626 7.96967 11.9697C8.26256 11.6768 8.73744 11.6768 9.03033 11.9697L10.5 13.4393L12.7348 11.2045L14.9697 8.96967C15.2626 8.67678 15.7374 8.67678 16.0303 8.96967Z" fill="%23000"></path></svg>');
    background-size: contain;
    background-repeat: no-repeat;
}

ol.is-style-fancy>li,
ol.is-style-arrow>li,
ol.is-style-check>li {
    list-style-type: none;
    position: relative
}

ol.is-style-fancy>li::before,
ol.is-style-arrow>li::before,
ol.is-style-check>li::before {
    content: counter(list-item);
    position: absolute;
    left: -32px;
    top: 2px
}

ol.is-style-fancy>li::before,
ol.is-style-arrow>li::before,
.wp-block-gallery.is-style-numbered .wp-block-image::before,
.wp-block-image.is-style-numbered::before {
    width: 24px;
    height: 24px;
    background: var(--primary-color);
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/************
  Numerados
************/
ol.is-style-fancy>li::before,
.wp-block-gallery.is-style-numbered .wp-block-image::before,
.wp-block-image.is-style-numbered::before {
    width: 24px;
    height: 24px;
    background: var(--primary-color);
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wp-block-gallery.is-style-numbered .wp-block-image,
.wp-block-image.is-style-numbered {
    position: relative
}

.wp-block-gallery.is-style-numbered .wp-block-image::before,
.wp-block-image.is-style-numbered::before {
    content: counter(gallery);
    counter-increment: gallery;
    position: absolute;
    top: 8px;
    right: 8px
}

/*** Estilo dos Botões ***/
.wp-element-button.is-style-outline,
.wp-block-button.is-style-outline>.wp-block-button__link {
    border: 1px solid currentColor;
    padding: 10px 15px
}

.wp-element-button.is-style-outline.has-background,
.wp-block-button.is-style-outline>.wp-block-button__link.has-background {
    padding: 10px 15px
}

.wp-element-button.is-style-outline:not(.has-background),
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background) {
    background: var(--background-color)
}

.wp-element-button.is-style-outline:not(.has-text-color),
.wp-block-button.is-style-outline>.wp-block-button__link:not(.has-text-color) {
    color: var(--primary-color)
}

/*** Button - Style Fancy ***/
.wp-element-button.is-style-fancy,
.wp-block-button.is-style-fancy .wp-block-button__link,
.wp-element-button.is-style-fancy,
.wp-block-button.is-style-fancy.wp-block-button__link {
    color: #ffffff;
    background-color: var(--primary-color);
    border-radius: var(--border-radius-sm);
    box-shadow: var(--box-shadow-sm);
    padding: var(--spacing-sm) var(--spacing-lg);
}

/*** Button - Style Arrow ***/
.wp-element-button.is-style-arrow,
.wp-block-button.is-style-arrow .wp-block-button__link,
.wp-element-button.is-style-link,
.wp-block-button.is-style-link .wp-block-button__link {
    background: rgba(0, 0, 0, 0);
    padding-left: 0;
    padding-right: 0;
    gap: 0;
    text-decoration: underline
}

.wp-element-button.is-style-arrow:not(.has-text-color),
.wp-block-button.is-style-arrow .wp-block-button__link:not(.has-text-color),
.wp-element-button.is-style-link:not(.has-text-color),
.wp-block-button.is-style-link .wp-block-button__link:not(.has-text-color) {
    color: var(--secondary-color)
}

.wp-element-button.is-style-arrow:hover,
.wp-block-button.is-style-arrow .wp-block-button__link:hover,
.wp-element-button.is-style-link:hover,
.wp-block-button.is-style-link .wp-block-button__link:hover {
    text-decoration: underline
}

.wp-element-button.is-style-arrow::after,
.wp-block-button.is-style-arrow .wp-block-button__link::after {
    content: " →"
}

.has-background a:where(:not(.wp-element-button)),
.has-background .wp-block-button:is(.is-style-arrow, .is-style-link) .wp-element-button {
    color: inherit
}

/*** Citação ***/
blockquote.is-style-line,
blockquote.wp-block-quote.is-style-line {    
  font-style:italic;
  color: var(--neutral-color-600);
  padding: 24px 32px 24px 60px;
  border-left:8px solid var(--secondary-color);
  line-height:1.6;
  position: relative;
  background:#EDEDED;
}

blockquote.is-style-line::before,
blockquote.wp-block-quote.is-style-line::before {
  font-family:Arial;
  content: "\201C";
  color: var(--secondary-color);
  font-size:4em;
  position: absolute;
  left: 10px;
  top:-10px;
}

blockquote.is-style-line::after,
blockquote.wp-block-quote.is-style-line::after {
  content: '';
}

blockquote.is-style-line span,
blockquote.wp-block-quote.is-style-line span {
  display:block;
  color:#333333;
  font-style: normal;
  font-weight: bold;
  margin-top:1em;
}

/* blockquote, blockquote.wp-block-quote {
    background: 0 0;
    color: #888888;    
    font-weight: 700;
    text-align: left;    
} */

blockquote.is-style-line,
blockquote.wp-block-quote.is-style-line {
    /* border-left: 10px solid var(--primary-color);
    padding-left: 14px; */
}

blockquote.is-style-classic,
blockquote.wp-block-quote.is-style-classic {
    border-top: 1px solid var(--neutral-color-300);
    border-bottom: 1px solid var(--neutral-color-300);
    padding-block: var(--spacing-xxl);
    font-size: var(--font-size-xxl);
    text-align: center;
}

/*** Texto ***/
/* p.is-style-heading {
    font-family: var(--wp--custom--typography--heading--font-family);
    font-size: var(--wp--custom--typography--heading--font-size);
    font-weight: var(--wp--custom--typography--heading--font-weight);
    letter-spacing: var(--wp--custom--typography--heading--letter-spacing);
    line-height: var(--wp--custom--typography--heading--line-height);
    text-transform: var(--wp--custom--typography--heading--text-transform)
}

p.is-style-interface {
    font-family: var(--wp--custom--typography--interface--font-family);
    font-size: var(--wp--custom--typography--interface--font-size);
    font-weight: var(--wp--custom--typography--interface--font-weight);
    letter-spacing: var(--wp--custom--typography--interface--letter-spacing);
    line-height: var(--wp--custom--typography--interface--line-height);
    text-transform: var(--wp--custom--typography--interface--text-transform)
} */

/*** Group - Borders ***/
div.is-style-borders,
section.is-style-borders {
    border-bottom: solid 1px var(--neutral-color-300);
    border-top: solid 1px var(--neutral-color-300);
}

div.is-style-light-texture,
section.is-style-light-texture {
    background-image: url(../images/textures/textura-clara.png);
    box-shadow: inset 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
}

/*** Column - Rounded Borders ***/
div.is-style-rounded-borders {
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--neutral-color-300);    
}

/*** Column - Rounded Square ***/
div.is-style-square-borders {
    border-radius: 0px;
    border: 1px solid var(--neutral-color-300);    
}

/*** Column - Card ***/
div.is-style-card {
    border: 1px solid var(--neutral-color-300);
    border-radius: var(--border-radius-sm);
    padding: var(--spacing-xxl);    
    background-color: var(--background-color);
}
div.is-style-card-shadow {
    border: 1px solid var(--neutral-color-300);
    border-radius: var(--border-radius-sm);
    padding: var(--spacing-xxl);    
    background-color: var(--background-color);
    box-shadow: var(--box-shadow-sm);
}

/*** Image - Rounded - Shadow ***/
.wp-block-image.is-style-rounded img {
    border-radius: var(--border-radius-sm);
}
.wp-block-image.is-style-rounded-shadow img {
    border-radius: var(--border-radius-sm);
    box-shadow: var(--box-shadow-sm);
}

/*** Header - Underline ***/
h1.is-style-underline::after,
h2.is-style-underline::after,
h3.is-style-underline::after,
h4.is-style-underline::after,
h5.is-style-underline::after,
h6.is-style-underline::after {
    content: '';
    display: block;
    width: 35px;
    height: 5px;
    margin-top: 15px;
    background: var(--primary-color);
}

/*** Header - Fancy ***/
h1.is-style-fancy,
h2.is-style-fancy,
h3.is-style-fancy,
h4.is-style-fancy,
h5.is-style-fancy,
h6.is-style-fancy {
    background: linear-gradient(135deg, var(--primary-color), var(--background-color));
    color: #fff;
    padding: 1rem 1.5rem;        
    border-radius: 0.5rem;
    position: relative;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    font-weight: 600;
    letter-spacing: 0.5px;
}

/*** Header - Highlight ***/
h1.is-style-highlight,
h2.is-style-highlight,
h3.is-style-highlight,
h4.is-style-highlight,
h5.is-style-highlight,
h6.is-style-highlight {    
    color: var(--primary-color);
    text-transform: uppercase;
}

/*** Paragraph - Justify ***/
p.is-style-justify {
    text-align: justify;
}

/* Destaca o bloco selecionado no editor Gutenberg com animação */
body.block-editor-page .wp-block.is-selected {
    outline: 2px dashed #007CBA !important;
    animation: pulse-outline 0.6s ease-in-out forwards;
}

/*** Responsivo ***/
@media (max-width: 768px) {
    h1.is-style-mobile,
    h2.is-style-mobile,
    h3.is-style-mobile,
    h4.is-style-mobile,
    h5.is-style-mobile,
    h6.is-style-mobile {
        text-align: center;
    }
    h2.is-style-mobile {
        font-size: var(--wp--preset--font-size--big) !important;
    }
    .wp-block-button.is-style-mobile:not(.is-style-whatsapp) {
        flex-basis: 100%;
        width: 100%;
    }
    .wp-block-button__link.is-style-mobile {
        width: 100%;
    }
    .wp-block-column.is-style-mobile,
    .wp-block-group.is-style-mobile {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }    
    .wp-block-group.is-style-mobile {
        justify-content: start !important;
    }
    figure.is-style-mobile img {
        width: 212px !important;
    }
    .wp-block-buttons.is-style-mobile-center {
        justify-content: center !important;
    }
    .wp-block-column.is-style-list-store {
        display: flex;
        flex-direction: row;
    }
    .wp-block-columns.is-style-list-store {
        margin: 0px !important;
    }
    .wp-block-column.is-style-list-store figure {
        align-items: center;
        display: flex;
        justify-content: center;
        min-height: 40px;
    }
    .wp-block-column.is-style-list-store img {
        width: 90px !important;
    }
    hr.is-style-right-gradient.is-style-mobile,
    hr.is-style-left-gradient.is-style-mobile {
        display: none;
    }
}

.centralizado {
  display: flex;
  justify-content: center;
}

/* Estilo personalizado para botões do tipo WhatsApp */
.is-style-whatsapp.wp-block-button,
.is-style-whatsapp-dark.wp-block-button {
    width: auto !important;
    flex-basis: auto !important;
}

.is-style-whatsapp .wp-block-button__link,
.is-style-whatsapp-dark .wp-block-button__link {
    position: relative;
    padding-left: 3em !important; /* Espaço para o ícone à esquerda */    
}

/* Adiciona o ícone SVG do WhatsApp antes do texto do botão */
.is-style-whatsapp .wp-block-button__link::before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 1em;
    top: 50%;
    transform: translateY(-50%);
    width: 1.2em;
    height: 1.2em;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.003 3C9.383 3 3.973 8.412 3.973 15.03c0 2.652.866 5.112 2.334 7.105L4 29l7.113-2.271a12.013 12.013 0 004.89 1.069c6.618 0 12.027-5.412 12.027-12.03C28.03 8.412 22.621 3 16.003 3zm0 21.882a9.85 9.85 0 01-5.016-1.4l-.36-.21-3.613 1.152 1.184-3.516-.235-.374a9.813 9.813 0 01-1.528-5.2c0-5.433 4.42-9.853 9.854-9.853s9.854 4.42 9.854 9.854c0 5.433-4.42 9.847-9.854 9.847zm5.51-7.355c-.303-.151-1.79-.88-2.068-.981-.276-.101-.478-.151-.68.152-.2.303-.781.981-.956 1.184-.175.2-.351.227-.654.076-.303-.152-1.278-.47-2.433-1.499-.9-.802-1.507-1.79-1.684-2.093-.175-.303-.019-.467.133-.618.137-.136.303-.351.455-.527.152-.176.202-.303.303-.505.1-.2.05-.379-.025-.53-.076-.151-.68-1.64-.93-2.252-.245-.588-.497-.508-.68-.518l-.58-.01c-.2 0-.527.076-.802.379-.276.303-1.053 1.03-1.053 2.507 0 1.478 1.077 2.91 1.226 3.107.151.2 2.12 3.233 5.138 4.535.718.31 1.278.496 1.715.634.72.228 1.373.196 1.89.119.576-.085 1.79-.731 2.044-1.437.252-.703.252-1.307.176-1.437-.076-.126-.277-.2-.58-.351z'/%3E%3C/svg%3E");
}

.is-style-whatsapp-dark .wp-block-button__link::before {
    content: '';
    display: inline-block;
    position: absolute;
    left: 1em;
    top: 50%;
    transform: translateY(-50%);
    width: 1.2em;
    height: 1.2em;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.003 3C9.383 3 3.973 8.412 3.973 15.03c0 2.652.866 5.112 2.334 7.105L4 29l7.113-2.271a12.013 12.013 0 004.89 1.069c6.618 0 12.027-5.412 12.027-12.03C28.03 8.412 22.621 3 16.003 3zm0 21.882a9.85 9.85 0 01-5.016-1.4l-.36-.21-3.613 1.152 1.184-3.516-.235-.374a9.813 9.813 0 01-1.528-5.2c0-5.433 4.42-9.853 9.854-9.853s9.854 4.42 9.854 9.854c0 5.433-4.42 9.847-9.854 9.847zm5.51-7.355c-.303-.151-1.79-.88-2.068-.981-.276-.101-.478-.151-.68.152-.2.303-.781.981-.956 1.184-.175.2-.351.227-.654.076-.303-.152-1.278-.47-2.433-1.499-.9-.802-1.507-1.79-1.684-2.093-.175-.303-.019-.467.133-.618.137-.136.303-.351.455-.527.152-.176.202-.303.303-.505.1-.2.05-.379-.025-.53-.076-.151-.68-1.64-.93-2.252-.245-.588-.497-.508-.68-.518l-.58-.01c-.2 0-.527.076-.802.379-.276.303-1.053 1.03-1.053 2.507 0 1.478 1.077 2.91 1.226 3.107.151.2 2.12 3.233 5.138 4.535.718.31 1.278.496 1.715.634.72.228 1.373.196 1.89.119.576-.085 1.79-.731 2.044-1.437.252-.703.252-1.307.176-1.437-.076-.126-.277-.2-.58-.351z'/%3E%3C/svg%3E");
}

/*** Semicírculo ***/
div.is-style-circle {
  background-image: url("../images/semi-circulo.webp");
  background-position: top right;
  background-repeat: no-repeat;
  background-size: 46% auto;
}

@media (max-width: 768px) {
    div.is-style-circle {
        background-size: 32% auto !important;
    }    
}

/*** Linha divisória ***/
hr.is-style-simple-divider {
    background-color: #e5e5e5;
    height: 1px;
    border: 0px;
}

hr.is-style-left-gradient {
    background-image: linear-gradient(90deg, transparent, #c6c6c6);
    height: 1px;
    border: 0px;
}

hr.is-style-right-gradient {
    background-image: linear-gradient(90deg, #c6c6c6, transparent);
    height: 1px;
    border: 0px;
}