@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

.menu-loja-actions {
  display: flex;
  align-items: center;
  justify-content: right;
}

.icone-user-topo,
.icone-atendimento-topo,
.icone-carrinho-topo {
  width: 38px;
  height: 38px;
  float: left;
}

.atendimento-topo {
  display: flex;
  align-items: center;
}
.item-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  align-self: start;
  padding-left: 5px;
  padding-right: 5px;
}

.item-qtde {
  background: #7e7d7a;
  color: #fff;
  border-radius: 50px;
  width: 20px;
  height: 20px;
  justify-content: center;
  display: flex;
  align-items: center;
  font-size: 14px;
  line-height: 20;
}

.remove-item {
  margin-top: 12px;
}

.remove-item i {
  font-size: 16px;
  color: red;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
/* carrinho */
.meu-carrinho {
  cursor: pointer;
  display: inline-block;
}

.meu-carrinho-inner {
  display: flex;
  gap: 15px;
  align-items: center;
  padding: 5px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.3s ease;
}
.meu-carrinho-inner:hover {
}

.icone-cart {
	position: relative;
}
.icone-carrinho.abrir-carrinho > span {
  display: block;
}

.carrinho-contador {
  background: #fff;
  border-radius: 32px;
  width: 24px;
  height: 24px;
  font-size: 15px;
  line-height: 32px;
  display: block;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #e5324d;
  right: -10px;
  border: 2px solid #fff;
}

/* popup base */
.popup-carrinho-lateral {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100%;
  background: #fff;
  box-shadow: -2px 0 8px rgba(0,0,0,.2);
  transition: right 0.3s ease;
  z-index: 9999;
  display: flex;
  flex-direction: column;
}
.popup-carrinho-lateral.active {
  right: 0;
}

/* header */
.popup-carrinho-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    border-bottom: 1px solid #eee;
}
.popup-carrinho-left button {
    background: none;
    border: none;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    align-items: center;
    color: #333;
}
.popup-carrinho-left .arrow-left {
    font-size: 18px;
    margin-right: 6px;
}
.popup-carrinho-right h3 {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}
.carrinho-vazio {
    text-align: center;
    padding: 20px;
    font-size: 15px;
    color: #777;
}

/* fundo escuro */
.overlay-carrinho.active {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 99;
}
.popup-carrinho-lateral.active {
    z-index: 120;
}


/* itens */
.popup-carrinho-itens {
  flex: 1;
  overflow-y: auto;
  padding: 0px 15px;
}
.item-carrinho {
    padding: 20px 0 10px 0;
  display: flex;
  gap: 10px;
  margin-bottom: 0;
  opacity: 1;
  transform: translateX(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}
.item-carrinho:last-of-type {
  border-bottom: 0;
}
.item-carrinho {
  border-bottom: 1px solid #ddd;
}
.item-carrinho.removendo {
  opacity: 0;
  transform: translateX(-20px);
}
.item-img img {
  max-width: 60px;
  border: 0;
  border-radius: 6px;
}
.item-info {
  flex: 1;
}
.item-info > span {
  font-weight: bold;
}
.item-info p {
  margin-bottom: 4px;
  font-size: 14px;
  line-height: 18px;
  font-weight: normal;
}
.remove-item {
  width: 30px;
  height: 30px;
  bottom: 10px;
  color: red;
  border: 1px solid #eaeaea;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
}

.popup-carrinho-right h3 {
  font-size: 14px !important;
  font-weight: normal !important;
  color: #5d5d5d;
}

/* footer */
.popup-carrinho-footer .btn-checkout {
  background: #e5324d;
  color: #ffffff !important;
}
.popup-carrinho-footer .btn-checkout:hover {
  background:#e5324d;
  color: #ffffff !important;
}
.popup-carrinho-footer .btn-cart {
  background: #fef90f;
  color: #00afef !important;
}
.popup-carrinho-footer .btn-cart:hover {
  background: #fcdc00;
  color: #00afef !important;
}
.popup-carrinho-footer {
  padding: 15px;
  border-top: 1px solid #ddd;
}
.popup-carrinho-footer p {
  margin: 0 0 10px;
  font-weight: bold;
}
.btn-cart,
.btn-checkout {
  display: block;
  text-align: center;
  background: #333;
  color: #fff;
  padding: 12px;
  margin-top: 10px;
  text-decoration: none;
  border-radius: 4px;
  transition: background 0.3s ease;
}
.btn-cart:hover {
  background: #444;
}
.btn-checkout {
  background: #0073aa;
}

/* highlight quando adicionar produto */
.meu-carrinho-inner.highlight {
  background: rgba(0, 115, 170, 0.1);
  border-radius: 6px;
  transition: background 0.6s ease;
}

/* animação valores */
.carrinho-contador,
.carrinho-total,
.carrinho-subtotal {
  transition: opacity 0.2s ease;
}
.carrinho-contador.fade,
.carrinho-total.fade,
.carrinho-subtotal.fade {
  opacity: 0.2;
}

/* ===================
   RESPONSIVIDADE
   =================== */

/* Mobile first (default já é 100%) */

/* Tablets e acima */
@media (min-width: 768px) {
  .popup-carrinho-lateral {
    width: 430px; /* popup lateral mais estreito */
    right: -430px;
  }
  .popup-carrinho-lateral.active {
    right: 0;
  }
}

/* Telas muito grandes */
@media (min-width: 1200px) {
  .popup-carrinho-header h3 {
    font-size: 20px;
  }
  .item-img img {
    max-width: 85px;
  }
  .btn-cart, .btn-checkout {
    font-size: 16px;
  }
}



.header-login {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

.header-login-inner {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 5px 10px;
  border-radius: 6px;
  transition: background 0.3s ease;
}
.header-login-inner:hover {

}

.login-icone span {
  font-size: 20px;
}
#popup-carrinho-itens a, #popup-carrinho-itens {
  color: #444;
}
.header-login-submenu  .w-btn.us-btn-style_11.usg_btn_1,
.header-login-submenu  .w-btn.us-btn-style_1.ush_btn_1 {
   color: #fff !important; 
   width: 100%;
}

.header-login-submenu  .w-btn.us-btn-style_11.usg_btn_1 {
   margin-bottom:10px;
}
.submenu-msg {
  margin-bottom: 10px;
}

.header-login-submenu {
  position: absolute;
  top: 100%;
  right: 0;
  width: 280px;
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  padding: 15px;
  display: none;
  gap: 15px;
  border-radius: 6px;
  z-index: 9999;
  color: #444;
  text-align: center;
}
.header-login-submenu a {
  color: #444 !important;
}
.header-login-submenu a:hover {
  color: #444 !important;
}
.header-login:hover .header-login-submenu {
  display: grid;
  animation: fadeInUp 0.3s ease;
}

/* colunas */
.submenu-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.submenu-icone span span {
  font-size: 30px;
  color: #cdcdcd;
}
.header-login-submenu .dashicons > span {
  border: 1px solid;
  border-radius: 100px;
  width: 50px;
  height: 50px;
  display: block;
  margin: auto;
}
.submenu-msg {
  margin-bottom: 10px;
  margin-top: 5px;
  font-size: 15px;
  line-height: 20px;
}
.btn-minha-conta {
  display: inline-block;
  padding: 8px 12px;
  background: #0073aa;
  color: #fff;
  border-radius: 4px;
  text-decoration: none;
  font-size: 14px;
  text-align: center;
}
/* links coluna 2 */
.submenu-col a {
  text-decoration: none;
  font-size: 14px;
  color: #333;
  padding: 5px 0;
  transition: color 0.2s ease;
}
.submenu-col a:hover {
  color: #0073aa;
}

.contato-submenu-x {
  text-align: left;
  padding: 0.5rem;
}

.d-none-desktop.menu-item.menu-item-type-custom {
  display: none !important;
}
.d-none-desktop.menu-item.menu-item-type-custom ul.w-nav-list.level_2{
  opacity: 1;
  height: auto;
  display: none !important;
  padding-top: 0px;
  padding-bottom: 0px;
}
.d-none-desktop.menu-item.menu-item-type-custom > a {
  display: none;
}



/*menu account mobile*/
.w-nav.type_mobile.m_align_left .menu-item-has-children > .w-nav-anchor .w-nav-arrow {
  right: 20px !important;
}
.menu-header-account-mobile {
  visibility: visible !important;
}
.menu-header .account-info .text {
    
  }
.menu-header .account-info svg {
    fill: #fff;
    height: auto;
    margin-right: 1rem;
    width: 3rem;
  }
.menu-header-account-mobile .menu-header {
  background: #e5324d;
  color: #fff;
  display: flex;
  padding: 1rem;
}
.account-info {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
}
.menu-header-inner {
  width: 100%;
}
.close-menu {
  align-items: center;
  background: #fff;
  border-radius: 100%;
  color: #e5324d;
  display: inline-flex;
  font-family: fontawesome;
  font-size: 1rem;
  height: 2.5rem;
  justify-content: center;
  line-height: .9em;
  padding: .5rem;
  position: absolute;
  right: 0;
  top: calc(50% - 1.25rem);
  width: 2.5rem;
  z-index: 1002;
}
.w-nav-control.active:hover {
    color: #e5324d !important;
}
.close-menu .w-nav-control.active{
    margin-left:0px !important;
}
.w-nav.type_mobile.m_layout_panel .w-nav-list.level_1 {
  padding: 0 !important;
  min-width: 100% !important;
   max-width: 100% !important;
  width: 100% !important;
}
  .menu-header .account-info .text span {
  display: block;
}
.menu-header .account-info .text span.message-name {
  font-size: 20px;
}
.menu-avatars span {
  display: block;
}
.submenu-subtitle {
  padding: 0.7rem;
}
.submenu-subtitle h4.subtitle {
  font-size: 16px;
}
.account-submenu {
  padding: 0.7rem 0.7rem 0.1rem 0.7rem;
}
.account-submenu ul {
  list-style: none;
  margin: 0;
}
.account-submenu ul li {
  list-style: none;
  margin-top: 12px !important;
  margin-bottom: 12px !important;
  display: flex;
  align-items: center;
}
.account-submenu ul li svg {
    margin-right: 6px;
}
.account-submenu ul li a:hover {
  text-decoration: underline;
  color: #e5324d !important;
}
/*menu account mobile*/

@media (max-width: 1024px) {
  .d-none-desktop.menu-item.menu-item-type-custom {
      display: block !important;
    }
    .d-none-desktop.menu-item.menu-item-type-custom ul.w-nav-list.level_2 {
      opacity: 1;
      height: auto;
      display: block !important;
      padding-top: 0px;
      padding-bottom: 0px;
    }
    .d-none-desktop.menu-item.menu-item-type-custom > a {
      display: none !important;
    }
    
    .l-subheader.at_bottom .l-subheader-cell.at_left {
  display: none;
}
.w-search-close {
  display: none;
}
.l-subheader.at_bottom, .l-subheader.at_bottom .w-dropdown-list, .l-subheader.at_bottom .type_mobile .w-nav-list.level_1 {
  background: #e5324d !important;
  color: #fff !important;
}
.w-form-row {
  position: relative;
  width: 100%;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.w-form-row.for_text {
  display: flex;
  width: 100% !important;
}
.w-search-form {
    padding-top:10px;
    padding-bottom:10px;
}
.w-search-form form {
    background: #f2f4f7;
    display: block;
    position: relative;
    overflow: hidden;
    border-radius: 6px;
  }
button.w-search-form-btn {
  font-size: var( --inputs-font-size );
  line-height: var(--inputs-height,2em);
  width: var(--inputs-height,2em);
  padding: 0;
  color: #e5324d;
  background: #f2f4f7;
  border: 0px solid #f2f4f7 !important;
  box-shadow: none !important;
}
.w-form-row-field {
  position: relative;
  width: 100%;
  border: 0 !important;
}
.icone-carrinho-topo {
  width: 36px;
  height: 36px;
  float: left;
}
}



/* animação suave */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.login-text span {
  display: block;
}

.contato {
  position: relative;
  display: inline-block;
}

.contato-submenu {
  position: absolute;
  top: 100%;
  right: 0;
  min-width: 280px;
  background: #fff;
  border: 1px solid #ddd;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  border-radius: 6px;
  padding: 15px;
  display: none;
  z-index: 9999;
  color: #444;
  font-size: 15px;
}
.contato-submenu a {
  color: #444 !important;
}
.contato-submenu a:hover {
  color: #444 !important;
}

.contato:hover .contato-submenu {
  display: block;
}

.menu-loja-actions .contato {
  padding: 5px 10px;
}

.atendimento-text span, .login-text span, .icone-carrinho.abrir-carrinho > span {
  display: block;
  line-height: 18px;
  font-size: 15px;
}
.carrinho-total .woocommerce-Price-amount.amount bdi {
  font-size: 15px;
}
.atendimento-icone {
  margin-right: 10px;
}

.login-icone {
  margin-right: 0;
}
.atendimento-inside-telefone {
  border-bottom: 1px solid #ddd;
  padding: 12px 0px;
}
.atendimento-inside-whatsapp {
  border-bottom: 1px solid #ddd;
  padding: 12px 0px;
}
.atendimento-inside-email {
  border-bottom: 1px solid #ddd;
  padding: 12px 0px;
}
.atendimento-inside-rastrear {
  padding: 12px 0px;
}
.header-wrapper__form {
  display: flex;
  align-items: center;
  position: relative;
}
.header-wrapper__button {
  position: absolute;
  right: 0;
  width: 40px;
  background: #efefef;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}
.contatos-loja-atendimento-inside-telefone span,
.contatos-loja-atendimento-inside-whatsapp span,
.contatos-loja-atendimento-inside-email span,
.contatos-loja-atendimento-inside-rastreio span {
  display: flex;
  align-items: center;
}
.contatos-loja-atendimento-inside-telefone span svg,
.contatos-loja-atendimento-inside-whatsapp span svg,
.contatos-loja-atendimento-inside-email span svg,
.contatos-loja-atendimento-inside-rastreio span svg {
  margin-right:4px;
  width:22px;
}
.msg-raster.alert.alert-danger {
  font-size: 14px;
  margin-top: 10px;
}
.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}
.alert {
  position: relative;
  padding: 0.5rem 0.5rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: .25rem;
  font-size: 13px;
}