/** Shopify CDN: Minification failed

Line 578:0 Unexpected "#"

**/
/* ========================================
   LOJA MORELA - CUSTOMIZAÇÕES TEMA SENSE
   ESTRUTURA ORGANIZADA E DESIGN PREMIUM
========================================= */

/* =========================
   TIPOGRAFIA GLOBAL (AJUSTADA)
   ========================= */

/* Tamanho para Celular (Valores menores para não quebrar a tela) */
:root h1, :root .h1 {
  font-size: calc(var(--font-heading-scale) * 2.6rem);
}
:root h2, :root .h2 {
  font-size: calc(var(--font-heading-scale) * 1.7rem);
}

/* Tamanho para Desktop (Aqui aplicamos o seu valor de 3rem e 2rem) */
@media screen and (min-width: 750px) {
  :root h1, :root .h1 {
    font-size: calc(var(--font-heading-scale) * 3rem);
  }
  :root h2, :root .h2 {
    font-size: calc(var(--font-heading-scale) * 2rem);
  }
}

  /* =====================================
   FOOTER – ACCORDION MOBILE (SENSE)
   ======================================= */
@media screen and (max-width: 749px) {

  /* Bloco geral */
  footer .footer-block {
    border-bottom: 1px solid #eee;
    padding: 8px 0;          /* leve respiro entre seções */
    margin-bottom: 6px;
  }

  /* TÍTULOS (Sobre a Morela, Informações…) */
  footer .footer-block__heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
    padding: 4px 0;          /* um pouco mais afastado */
    margin-bottom: 6px;     /* separação sutil do conteúdo */
  }

  /* Ícone + / – */
  footer .footer-block__heading::after {
    content: "+";
    font-size: 16px;
    color: #C97A92;
    transition: transform 0.2s ease;
  }

  footer .footer-block.is-open .footer-block__heading::after {
    content: "–";
  }

  /* Conteúdo do accordion */
  footer .footer-block__details-content {
    display: none;
    padding-top: 0;
    margin-bottom: 0;
  }

  footer .footer-block.is-open .footer-block__details-content {
    display: block;
  }

  /* Zera espaçamentos herdados */
  footer .footer-block__details-content ul,
  footer .footer-block__details-content li {
    margin: 0;
    padding: 0;
  }

  /* LINKS (Políticas, Quem somos…) */
  footer .footer-block__details-content a {
    display: block;
    padding: 4px 0;       /* links mais juntos */
    line-height: 1.4;
    font-size: 15px;
  }

  /* Pequeno respiro antes da linha */
  footer .footer-block__details-content li:last-child {
    margin-bottom: 6px;
  }
}

/*=== Footer legal clean fix - Sense ===== */

.footer__copyright {
  text-align: center;
}

.footer__copyright .footer-line {
  display: block;
  width: 100%;
  white-space: normal;
  line-height: 1.6;
  font-size: 11px;
}

.footer__copyright .footer-line--address {
  font-size: 11px;
  opacity: 0.85;
}

/* AJUSTE: Aumento de fonte e peso para destaque do parcelamento */
.custom-payment-info p {
  margin: 4px 0;
  font-size: 1.3rem !important; 
  color: #1F1F1F;
  line-height: 1.4;
  font-weight: 500;
}

/* ============================================================
   SEÇÃO DE PREÇOS - AJUSTE DE CORES NOS VALORES
   ============================================================ */

/* 1. PREÇO EM PROMOÇÃO - Rosa Escuro da Paleta */
.price--on-sale .price-item--sale,
.product__info-container .price-item--sale {
  color: #C97A92; /* Rosa mais fechado e forte */
  font-weight: 700;
}

/* 2. PREÇO PADRÃO - Preto Mais Forte e Nítido */
.price:not(.price--on-sale) .price-item--regular,
.product__info-container .price:not(.price--on-sale) .price-item--regular {
  color: #1F1F1F; /* Preto Profundo */
  font-weight: 700; /* Garante que o preto tenha presença */
}

/* ============================================================
   PÁGINA DE PRODUTO - EXIBIÇÃO DE PREÇOS (VENDA) 
   ============================================================ */

/* ============================================================
   PÁGINA DE PRODUTO - PREÇO PRINCIPAL (UNIFORMIZADO)
   ============================================================ */

/* 1. Preço de Venda (Rosa) OU Preço Regular (Preto) quando NÃO há promoção */
.product__info-container .price-item--sale,
.product__info-container .price:not(.price--on-sale) .price-item--regular {
    font-size: 2.1rem !important; /* Tamanho idêntico para o preço principal */
    font-weight: 700 !important;
    letter-spacing: -0.5px;
    color: #1F1F1F; /* Cor base preta */
}

/* Força o Rosa apenas quando o item estiver em oferta */
.product__info-container .price--on-sale .price-item--sale {
    color: #C97A92 !important;
}

/* 2. Preço de Comparação (Apenas o que fica RISCADO ao lado do rosa) */
.product__info-container .price--on-sale .price-item--regular {
    font-size: 1.5rem !important; 
    font-weight: 400 !important;
    color: #1F1F1F !important; 
    opacity: 0.7 !important;    
    margin-right: 8px;
    text-decoration: line-through;
}

/* Ajuste Mobile */
@media screen and (max-width: 749px) {
    .product__info-container .price-item--sale,
    .product__info-container .price:not(.price--on-sale) .price-item--regular {
        font-size: 1.8rem !important;
    }
}

/* ============================================================
   PÁGINA DE PRODUTO - CAIXA DE PAGAMENTO E ÍCONE PIX
   ============================================================ */
/* Alinhamento entre ícone PIX e texto */
.pix-line {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}

/* AJUSTE: Trava de segurança para o ícone PIX */
.pix-icon {
  height: 18px !important; /* Travado com !important */
  width: auto !important;
  display: inline-block;
  vertical-align: middle;
}

.payment-wrapper {
  position: relative;
  border: 1px solid #EFE6EA;
  border-radius: 8px;
  padding: 14px 10px 10px;
  margin-top: 14px;
  text-align: center;
}

/* Título “cortando” a borda */
.payment-title {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: #FFF;
  padding: 0 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #4A4652;
}

  /* ===== FORMAS DE PAGAMENTO – ESTILO PREMIUM ===== */

.payment-badges {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

/* Quadrinho individual */
.payment-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 32px;
  border: 1px solid #EFE6EA;
  border-radius: 6px;
  background: #FFF;
}

/* Logos normalizados */
/* AJUSTE: Blindagem total de nitidez e alinhamento das bandeiras */
.payment-item img {
  max-height: 18px !important; 
  max-width: 34px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important; /* Trava o encaixe para não distorcer */
  opacity: 1 !important;        /* Força nitidez máxima em qualquer tela */
}

/* Ajustes finos individuais (peso visual) */
.payment-item img[alt="Visa"] {
  max-height: 16px;
}

.payment-item img[alt="Pix"] {
  max-height: 17px;
}

.payment-item img[alt="American Express"] {
  max-height: 19px;
}

/* =========================
   FORMAS DE PAGAMENTO – MOBILE
   ========================= */

@media (max-width: 480px) {
  .payment-badges {
    gap: 6px;
  }

  .payment-item {
    width: 44px;
    height: 30px;
  }

  .payment-item img {
    max-width: 32px;
    max-height: 16px;
  }
}

/* DIVISÕES PROFISSIONAIS */

.section-divider {
  width: 100%;
  height: 1px;
  background-color: #ECECEC;
  margin: 26px 0;
}

.section-divider-text {
  width: 100%;
  text-align: center;
  margin: 34px 0 28px;
  position: relative;
}

.section-divider-text::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #ECECEC;
  z-index: 1;
}

.section-divider-text span {
  position: relative;
  z-index: 2;
  background: #fff;
  padding: 0 14px;
  font-size: 1rem;
  font-weight: 600;
  color: #1f1f1f;
}

/* Remove texto de frete calculado no checkout */
.product__tax,
.product__shipping-policy,
.tax-note,
.shipping-policy {
  display: none !important;
}

/***********************************************************
   AJUSTE: SELOS DE CONFIANÇA - LOJA MORELA
************************************************************/

.custom-benefits {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 20px 0;
}

.benefit-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.benefit-item img {
  width: 22px !important;
  height: auto;
  display: block;
}

.benefit-item span {
  font-size: 14px;
  color: #333;
}

/* ============================================================
   CARRINHO — Pagamento 100% Protegido e Selos de Pagamentos
   ============================================================ */

/* 1. Container do Selo de Segurança */
.cart__footer .cart-security {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  gap: 8px;
  width: 100%;
  clear: both;
}

/* 2. Texto do Selo de Segurança */
.cart__footer .cart-security__text {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  color: #1F1F1F; /* Cor ajustada para melhor contraste */
  text-transform: uppercase;
  letter-spacing: 1.2px;
  font-weight: 600;
  line-height: 1.2;
}

/* 3. Ícone de Cadeado (SVG via Mask) */
.cart__footer .cart-security__icon {
  width: 14px;
  height: 14px;
  background-color: #000;
  display: inline-block;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8a2 2 0 0 0-2-2h-1V7a5 5 0 0 0-5-5zm3 8H9V7a3 3 0 0 1 6 0v3z'/%3E%3C/svg%3E") no-repeat center;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Cpath d='M12 2a5 5 0 0 0-5 5v3H6a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8a2 2 0 0 0-2-2h-1V7a5 5 0 0 0-5-5zm3 8H9V7a3 3 0 0 1 6 0v3z'/%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  -webkit-mask-size: contain;
}

/* 4. Ajuste do Container de Bandeiras (Espaçamento) */
.cart__footer .cart-payment-adjust {
  margin-top: 25px; /* Respiro entre o selo e as bandeiras */
  padding: 12px 5px 8px;
  border-color: #EFE6EA;
}

/* 5. Título das Formas de Pagamento no Carrinho */
.cart__footer .cart-payment-adjust .payment-title {
  font-size: 0.85rem;
  background-color: #fff;
  padding: 0 10px;
}

/* ========================================
   PÁGINA DE PRODUTO — BOTÃO COMPRAR
   (Destaque Premium e Força na Fonte)
   ======================================== */
.product-form__submit {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700; /* Deixa forte como o botão do carrinho */
  font-size: 1.5rem;  
  transition: opacity 0.3s ease;
  background-color: #C97A92; /* Garante a cor da sua marca */
}

/* Destaque em negrito do Total do Carrinho */
.cart__footer .totals__total,
.cart__footer .totals__total-value {
  font-weight: 700;
  color: #000;
}

/* ==============================
   BLOCO FRETE – CARRINHO
   Modelo informativo (Yampi)
   ==============================
*/
.custom-shipping-box {
  margin-top: 15px;
  margin-bottom: 20px;
  padding: 18px;
  border: 1px solid #e2e2e2;
  border-radius: 8px;
  background-color: #ffffff;
  box-sizing: border-box; /* Garante que o padding não aumente a largura total */
}

.shipping-title {
  display: block;
  font-size: 12px;
  font-weight: 700;
  margin-bottom: 12px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #121212;
}

.shipping-form {
  display: flex;
  gap: 8px;
  align-items: center;
  width: 100%; /* Ocupa toda a largura disponível */
}

.shipping-cep-input {
  flex: 1; /* Faz o campo de CEP crescer o máximo possível */
  min-width: 0; /* Impede que o input "empurre" o botão para fora */
  padding: 12px;
  border-radius: 4px;
  border: 1px solid #d1d1d1;
  font-size: 14px;
  outline: none;
}

.shipping-calc-button {
  padding: 12px 15px; /* Reduzi um pouco o preenchimento lateral */
  border-radius: 4px;
  border: none;
  background: #121212;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap; /* Impede que o texto do botão quebre linha */
}

/* Resultados do Frete */
.shipping-location {
  font-size: 13px;
  color: #666;
  margin: 12px 0;
  padding-bottom: 8px;
  border-bottom: 1px dashed #eee;
}

.shipping-table {
  margin-top: 10px;
}

.shipping-row {
  display: grid;
  grid-template-columns: 1.4fr 1.2fr 0.9fr; /* Ajuste para caber melhor em telas pequenas */
  padding: 10px 0;
  font-size: 13px;
  border-bottom: 1px solid #f5f5f5;
  color: #121212;
}

.shipping-row:last-child {
  border-bottom: none;
}

.shipping-header {
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
}

.shipping-row span:last-child {
  text-align: right;
}

.shipping-free {
  color: #2e9e5b;
  font-weight: 700;
}

.shipping-note {
  font-size: 11px;
  color: #888;
  margin-top: 10px;
  line-height: 1.4;
}

/* ==============================
   AJUSTES RESPONSIVOS - (CARRINHO MOBILE)
   ==============================
*/
@media (max-width: 768px) {
  .shipping-form {
    flex-direction: row !important; /* Mantém na mesma linha */
    justify-content: space-between;
  }

  .shipping-calc-button {
    padding: 12px 12px; /* Redução extra no mobile para caber em telas estreitas */
    font-size: 12px;
  }

  .custom-shipping-box {
    margin-bottom: 15px !important;
    padding: 12px; /* Reduzi levemente o padding interno no mobile */
  }

  /* Ajuste de proximidade com o TOTAL */
  .cart-shipping-wrapper + div {
    margin-top: 15px !important; 
  }

  .cart__blocks .js-contents {
    margin-top: 10px !important;
  }
}

/* ==============================
   ANIMAÇÃO DE ENTRADA (FADE IN)
   Suaviza a exibição dos resultados
   ============================== */
##shipping-table,
#shipping-address {
  animation: fadeIn 0.3s ease-in-out;
  will-change: opacity, transform;
}


@keyframes fadeIn {
  from { 
    opacity: 0; 
    transform: translateY(-5px); 
  }
  to { 
    opacity: 1; 
    transform: translateY(0); 
  }
}

/* =========================
   CARRINHO — Destaque do TOTAL
   ========================= */
.cart__footer .totals__total {
  font-size: 1.4rem;
  letter-spacing: 0.02em;
  color: #4A4652; /* Um tom levemente mais suave que o preto puro */
}

.cart__footer .totals__total-value {
  font-size: 1.6rem; /* Valor um pouco maior que o selo "TOTAL" para destaque */
  font-weight: 700;
  color: #000;
}

/* =========================
   CARRINHO — BOTÃO FINALIZAR COMPRA
   ========================= */
.cart__checkout-button {
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 700;
  transition: opacity 0.3s ease;
}

.cart__checkout-button:hover {
  opacity: 0.9;
}

/* ============================================================
   Redução do Box de Quantidade
   ============================================================ */
/* 1. Ajuste da Altura do Box de Quantidade (Produto e Carrinho) */
.quantity {
  min-height: 35px;
  height: 35px;
  width: 100px; /* Deixa o seletor mais estreito */
}

.quantity__input {
  font-size: 1.3rem !important;
}

/* 2. Ajuste do Box de Variantes (Dropdown/Cor) na Página de Produto */
.product-form__input select.select__select {
  height: 40px !important; /* Altura reduzida para o seletor de cor */
  min-height: 40px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 1.3rem !important;
}

/* Ajuste da seta do seletor para acompanhar a nova altura */
.product-form__input .select .icon-caret {
  right: 1.5rem !important;
}

/* 3. Ajuste fino nos botões de + e - (Quantidade) */
.quantity__button {
  width: 30px !important;
}

/* 4. No Carrinho Mobile: ajuste para o box não ocupar muito espaço vertical */
@media (max-width: 749px) {
  .cart-item__quantity .quantity {
    height: 32px !important;
    min-height: 32px !important;
  }
}

/* ========================================
   CARRINHO — BOTÃO ESCOLHER MAIS PRODUTOS
   ======================================= */

.cart-continue-shopping {
  margin: 8px 0 16px;
  text-align: center;
}

.cart-continue-shopping a {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 100%;

  min-height: 4.6rem;      /* mantém altura confortável */
  padding: 0 3rem;         /* mantém presença visual */

  font-size: 1.35rem;      /* discreta, sem parecer fraca */
  font-weight: 500;
  line-height: 1;

  color: #4A4652;
  background-color: #FFFFFF;
  text-decoration: none;

  border: 0.1rem solid rgba(18, 18, 18, 0.15);
  border-radius: var(--buttons-radius);

  transition: background-color 0.25s ease,
              border-color 0.25s ease,
              box-shadow 0.25s ease,
              color 0.25s ease;

  cursor: pointer;
}

.cart-continue-shopping a:hover {
  background-color: #FFF7FA;
  border-color: #C97A92;
  color: #121212;
  box-shadow: 0 0 0 0.1rem #C97A92;
}

/* Mobile: quase imperceptível */
@media (max-width: 749px) {
  .cart-continue-shopping a {
    min-height: 4.4rem;
    font-size: 1.3rem;
  }
}

@media screen and (max-width: 749px) {
  .header { padding-bottom: 0px !important; }
  .section-header { margin-bottom: 0px !important; }
}

/* ====================================
   FAQ — Linha divisória e espaçamento
   ====================================*/

.page-faq {
  line-height: 1.55;
}

.page-faq p {
  margin-bottom: 14px;
}

.page-faq ul {
  margin: 8px 0 14px;
  padding-left: 18px;
}

.page-faq li {
  margin-bottom: 6px;
}

.page-faq hr {
  border: none;
  border-top: 1px solid rgba(0,0,0,0.12);
  margin: 18px 0;
}


/* =================================================
   FOOTER — CENTRAL DE ATENDIMENTO (DESKTOP x MOBILE)
   Loja: Morela | Tema: Sense
   Objetivo: Refinamento visual premium sem impacto no mobile
   ================================================= */


/* =================================================
   DESKTOP — TEXTO INFORMATIVO
   ================================================= */
.footer .footer-block__details-content p {
  font-size: 15px;          /* confortável e elegante no desktop */
  line-height: 1.6;          /* mais respiro visual */
  color: #4A4652;             /* cinza sofisticado */
  margin-bottom: 10px;         /* espaçamento equilibrado */
}

/* =================================================
   DESKTOP — TÍTULOS / DESTAQUES (STRONG)
   ================================================= */
.footer .footer-block__details-content p strong {
  display: block;
  margin-top: 12px;           /* separação clara entre blocos */
  margin-bottom: 4px;
  font-size: 12px;            /* hierarquia discreta */
  font-weight: 600;
  letter-spacing: 0.06em;     /* leitura premium */
  text-transform: uppercase;
  color: #1F1F1F;             /* preto institucional */
}

/* =================================================
   DESKTOP — LINKS DE CONTATO (PADRÃO PREMIUM)
   ================================================= */
.footer .footer-block__details-content a {
  color: #1F1F1F;             /* preto/grafite como base */
  font-weight: 400;
  font-size: 15.2px;
  text-decoration: none;
  display: inline-block;
  line-height: 1.35;
  transition: color 0.25s ease, opacity 0.25s ease;
}


/* =================================================
   DESKTOP — HOVER / ESTADOS ATIVOS
   ================================================= */
.footer .footer-block__details-content a:hover,
.footer .footer-block__details-content a:active {
  color: #C97A92;             /* rosa da marca no hover */
  opacity: 0.9;
}

/* =================================================
   FOOTER — LINKS DE AÇÃO (EMAIL & WHATSAPP)
   ================================================= */

.footer a[href^="mailto:"],
.footer a[href*="wa.me"],
.footer a[href*="whatsapp"] {
  color: #C97A92;           /* rosa da marca */
  font-weight: 500;
}

.footer a[href^="mailto:"]:hover,
.footer a[href*="wa.me"]:hover,
.footer a[href*="whatsapp"]:hover {
  color: #1F1F1F;
  opacity: 0.9;
}

/* =================================================
   HEADER — LINKS DE NAVEGAÇÃO (PADRÃO PREMIUM)
   ================================================= */

.header__menu-item,
.header__menu-item span {
  color: #1F1F1F;
  transition: color 0.25s ease;
}

.header__menu-item:hover,
.header__menu-item:hover span {
  color: #C97A92;
}

/* Item ativo (página atual) */
.header__menu-item--active,
.header__menu-item--active span {
  color: #1F1F1F;
  font-weight: 600;
}

/* =================================================
   MOBILE — MANTÉM PADRÃO DEFINIDO
   (Não alterar: tamanhos já validados)
   ================================================= */
@media (max-width: 749px) {
  .footer .footer-block__details-content p,
  .footer .footer-block__details-content a {
    font-size: 14px;          /* tamanho ideal no mobile */
  }

  .footer .footer-block__details-content p strong {
    font-size: 11.2px;
  }
}

.section-slideshow-custom {
  margin: 0 !important;
  padding: 0 !important;
}
