/*
Theme Name: Coffo Child Theme
Theme URI: https://coffo.peerduck.com
Author: Duck-Themes
Author URI: https://peerduck.com
Description: Blank Child Theme for Coffo
Template: coffo
Version: 1.00
Requires at least: 5.0
Requires PHP: 7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, three-columns, custom-colors, featured-images, theme-options
Text Domain: coffo
*/

/* -------------------------------------------------------
    1. VARIÁVEIS CSS
------------------------------------------------------- */
/* Variáveis vindas do theme_mod */
:root {
  --primary-color: esc_html(get_theme_mod("pr_color", "#d7b464"));
  --primary-links-hover-color: esc_html(
    get_theme_mod("pr_links_h_color", "#3e1616")
  );
  --primary-bg-color: esc_html(get_theme_mod("pr_bg_color", "#e5e8eb"));
  --header-bg-color: esc_html(get_theme_mod("h_bg_color", "#fff8f1"));
  --footer-bg-color: esc_html(get_theme_mod("f_bg_color", "#fff8f1"));
  --primary-dark-color: esc_html(get_theme_mod("pr_d_color", "#3e1616"));
  --title-color: esc_html(get_theme_mod("title_color", "#3e1616"));
  --fw-title-color: esc_html(get_theme_mod("fw_title_color", "#3e1616"));
  --btn-bg-color: esc_html(get_theme_mod("btn_bg_color", "#d7b464"));
  --btn-hover-color: esc_html(get_theme_mod("btn_h_color", "#3e1616"));
  --txt-select-bg-color: esc_html(
    get_theme_mod("txt_select_bg_color", "#f5ece3")
  );
}

/* Variáveis fixas */
:root {
  --light-color: #ffffff;
  --dark-color: #000000;
  --dark-color-transparent: #00000052;
  --theme-primary-light: #613e3e;
  --theme-gray-dark: #cccccc;
  /* sobrescritas finais */
  --primary-color: #d7b464;
  --primary-color-light: #eadbb3;
  --primary-links-hover-color: #3e1616;
  --primary-dark-color: #3e1616;
  --primary-bg-color: #e5e8eb;
  --header-bg-color: #fff8f1;
  --footer-bg-color: #fff8f1;
  --title-color: #3e1616;
  --fw-title-color: #3e1616;
  --btn-bg-color: #d7b464;
  --btn-hover-color: #3e1616;
  --txt-select-bg-color: #f5ece3;
}

/* -------------------------------------------------------
    2. ELEMENTOS GERAIS
------------------------------------------------------- */
.banner-button {
  display: flex;
  justify-content: center;
}
.list-none {
  list-style: none;
}
.topo {
  margin-bottom: 50px;
}

/* -------------------------------------------------------
    3. TOPO / HEADER
------------------------------------------------------- */
.home #topo,
.page-eventos #topo,
.page-grandes-empresas #topo {
  background-color: var(--dark-color-transparent);
}
#topo {
  background-color: var(--theme-primary-light);
}
.privacy-policy,
.error404 {
  margin-top: 100px !important;
}
.input-field svg.search-icon {
  color: var(--light-color) !important;
}

/* Sticky menu */
#stickyMenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transition: all 0.3s ease;
  opacity: 0;
  transform: translateY(-100%);
  z-index: 999;
}
#stickyMenu.visible {
  opacity: 1;
  transform: translateY(0);
}

/* -------------------------------------------------------
    4. PRODUTOS
------------------------------------------------------- */
#produto-thumbs img {
  transition: opacity 0.3s ease;
}
#produto-thumbs img:hover {
  opacity: 0.7;
}
.e-n-tabs-content ul {
  margin-left: 17px !important;
}

/* -------------------------------------------------------
    5. BOTÕES / ELEMENTOR CUSTOMIZAÇÕES
------------------------------------------------------- */
.elementor-custom-button:hover {
  background-color: var(--light-color) !important;
  color: var(--dark-color) !important;
  box-shadow: none !important;
}
.elementor-lightbox-image {
  box-shadow: none !important;
}

/* -------------------------------------------------------
    6. GALERIA HOME (ZOOM)
------------------------------------------------------- */
#galeria-home .gallery-item {
  position: relative;
  overflow: hidden;
  border: 10px solid var(--light-color);
}
#galeria-home .gallery-item img {
  border: none !important;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
  transform-origin: center center;
}
#galeria-home .gallery-item:hover img {
  transform: scale(1.2);
}

/* -------------------------------------------------------
    7. FLIPBOX
------------------------------------------------------- */
.flipbox {
  position: relative;
  width: 240px;
  height: 300px;
  perspective: 1000px;
  margin: 0 auto;
  display: block;
}
.flipbox .front,
.flipbox .back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  top: 0;
  left: 0;
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.6s ease;
}
.flipbox .front {
  z-index: 2;
  transform: rotateY(0deg);
}
.flipbox .back {
  transform: rotateY(180deg);
}
.flipbox:hover .front {
  transform: rotateY(-180deg);
}
.flipbox:hover .back {
  transform: rotateY(0);
}

/* -------------------------------------------------------
    8. FORMULÁRIOS (Elementor)
------------------------------------------------------- */
.select-caret-down-wrapper {
  display: none !important;
}
.label-group-segmentos {
  margin-left: 20px;
}
#form-field-funcionarios option:first-child {
  color: var(--theme-gray-dark) !important;
}
.elementor-field-group-segmentos .elementor-field-subgroup {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 20px;
  margin: 0 0 20px 30px;
}
.elementor-field-group-segmentos .elementor-field-option {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 0 !important;
}
.elementor-field-group-segmentos .elementor-field-option label {
  margin: 0 !important;
  line-height: 1.2;
}
.grecaptcha-badge {
  position: fixed !important;
  left: 0 !important;
  bottom: 20px !important;
  width: 70px !important;
  overflow: hidden !important;
  transition: all 0.3s ease !important;
  opacity: 0 !important;
  z-index: 9999 !important;
}
.grecaptcha-badge:hover {
  width: 256px !important;
}

/* -------------------------------------------------------
    9. MENU DE CATEGORIAS (EXPANDIDO)
------------------------------------------------------- */
nav.elementor-nav-menu--dropdown {
  display: block !important;
  height: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
  --menu-height: auto !important;
}
nav.elementor-nav-menu--dropdown .sub-menu {
  display: block !important;
  height: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
}
nav.elementor-nav-menu--dropdown .sub-arrow,
nav.elementor-nav-menu--dropdown .elementor-nav-menu--dropdown-toggle {
  display: none !important;
}
nav.elementor-nav-menu--dropdown,
nav.elementor-nav-menu--dropdown * {
  transition: none !important;
}
nav.elementor-nav-menu--dropdown .menu-item-has-children > a {
  background-color: var(--primary-color-light) !important;
}
nav.elementor-nav-menu--dropdown .menu-item-has-children > a:hover {
  color: var(--primary-color) !important;
}
#menu-produtos a.elementor-item {
  font-size: 18px !important;
}
#menu-produtos a.elementor-sub-item {
  font-size: 14px !important;
}

/* -------------------------------------------------------
    10. BREADCRUMB
------------------------------------------------------- */
.upmkt-breadcrumb {
  margin: 10px 0 20px;
  font-size: 14px;
}
.upmkt-breadcrumb ol {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.upmkt-breadcrumb li {
  display: flex;
  align-items: center;
}
.upmkt-breadcrumb li a {
  text-decoration: none;
  color: #fff;
  background: #3e1616;
  padding: 4px 8px;
  border-radius: 4px;
  transition: 0.2s ease;
  font-weight: 500;
}
.upmkt-breadcrumb li a:hover {
  background: #d7b464;
  color: #fff;
}
.upmkt-breadcrumb li:not(.active)::after {
  content: "/";
  margin-left: 6px;
  color: #bbb;
}
.upmkt-breadcrumb li.active {
  padding: 4px 6px;
  color: #d7b464;
  font-weight: 700;
}

/* -------------------------------------------------------
    11. RESPONSIVIDADE
------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  #galeria-home .gallery-item img {
    transition: none;
    transform: none;
  }
}
@media (max-width: 1199px) {
  .custom-logo {
    max-height: 50px !important;
  }
  .navbar-fixed .custom-logo {
    max-height: 40px !important;
  }
}
@media (min-width: 1200px) {
  .custom-logo {
    max-height: 60px !important;
  }
  .navbar-fixed .custom-logo {
    max-height: 40px !important;
  }
}