/*
Theme Name: Agros - Buzzvel - V2
Theme URI: https://github.com/elementor/hello-theme/
Template: hello-elementor
Version: 1.0.1
Text Domain: agros-hello-child
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
@media only screen and (min-width: 767px) {
    .overflow-popup .dialog-message.dialog-lightbox-message {
     overflow: unset !important;
    }
}
*/

.overflow-popup {
  overflow: auto;
}

.overflow-popup .dialog-message.dialog-lightbox-message {
  overflow: unset !important;
}

/* A11y: make Elementor Media Carousel images real <img> elements */
.elementor{
  .agros-media-carousel__img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
  }
}
  

/*
.overflow-popup .elementor-widget-image .elementor-widget-container {
	margin: 0 !important;
}
*/

/*
 * When a parent has `heading-drop`, add side drips via `::before`/`::after`.
 */
.heading-drop .elementor-heading-title,
.heading-drop h1,
.heading-drop h2,
.heading-drop h3 {
  position: relative;
  display: inline-block;
  padding-left: clamp(24px, 2vw, 60px);
  padding-right: clamp(24px, 2vw, 60px);
  box-sizing: border-box;
}

.heading-drop .elementor-heading-title::before,
.heading-drop h1::before,
.heading-drop h2::before,
.heading-drop h3::before,
.heading-drop .elementor-heading-title::after,
.heading-drop h1::after,
.heading-drop h2::after,
.heading-drop h3::after {
  content: "";
  position: absolute;
  top: 50%;
  width: clamp(28px, 4.2vw, 70px);
  height: clamp(28px, 4.2vw, 70px);
  background-color: currentColor;
  transform: translateY(-50%);
  pointer-events: none;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-position: center;
  mask-position: center;
}

.heading-drop .elementor-heading-title::before,
.heading-drop h1::before,
.heading-drop h2::before,
.heading-drop h3::before {
  left: 0;
  transform: translate(-45%, 10%);
  --drip-mask: url("elementor-widgets/assets/campanhas/gota-esquerda.svg");

  -webkit-mask-position: left center;
  mask-position: left center;
  -webkit-mask-image: var(--drip-mask);
  mask-image: var(--drip-mask);
}

.heading-drop .elementor-heading-title::after,
.heading-drop h1::after,
.heading-drop h2::after,
.heading-drop h3::after {
  right: 0;
  transform: translate(45%, -50%);
  --drip-mask: url("elementor-widgets/assets/campanhas/gota-direita.svg");

  -webkit-mask-position: right center;
  mask-position: right center;
  -webkit-mask-image: var(--drip-mask);
  mask-image: var(--drip-mask);
}

/*
 * bg-svg-btn:
 * Quando o texto (h1/h2/h3/... do Elementor) tiver essa "classe de container"
 * aplica um SVG de fundo estilo botão (sem texto no SVG).
 */
.bg-svg-btn .elementor-heading-title,
.bg-svg-btn h1,
.bg-svg-btn h2,
.bg-svg-btn h3,
.bg-svg-btn h4,
.bg-svg-btn h5,
.bg-svg-btn h6 {
  display: inline-block;
  background-image: url("elementor-widgets/assets/cta/bg-btn-white.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  padding: 1.18em 2em 1.22em;
  line-height: 1.05;
}

/*
 * Quando o heading estiver "linkado" (Elementor cria um <a>),
 * o clique precisa envolver a área completa do botão.
 * Para isso, movemos o SVG/padding para o <a> quando existir.
 */
.bg-svg-btn .elementor-heading-title:has(a),
.bg-svg-btn h1:has(a),
.bg-svg-btn h2:has(a),
.bg-svg-btn h3:has(a),
.bg-svg-btn h4:has(a),
.bg-svg-btn h5:has(a),
.bg-svg-btn h6:has(a) {
  background-image: none;
  padding: 0;
}

.bg-svg-btn .elementor-heading-title:has(a) a,
.bg-svg-btn h1:has(a) a,
.bg-svg-btn h2:has(a) a,
.bg-svg-btn h3:has(a) a,
.bg-svg-btn h4:has(a) a,
.bg-svg-btn h5:has(a) a,
.bg-svg-btn h6:has(a) a {
  display: inline-block;
  background-image: url("elementor-widgets/assets/cta/bg-btn-white.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  padding: 1.18em 2em 1.22em;
  line-height: 1.05;
  color: inherit;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.bg-svg-btn .elementor-heading-title:has(a) a:hover,
.bg-svg-btn h1:has(a) a:hover,
.bg-svg-btn h2:has(a) a:hover,
.bg-svg-btn h3:has(a) a:hover,
.bg-svg-btn h4:has(a) a:hover,
.bg-svg-btn h5:has(a) a:hover,
.bg-svg-btn h6:has(a) a:hover {
  transform: translateY(-1px);
  color: #006433;
}

.bg-svg-btn .elementor-heading-title:has(a) a:focus-visible,
.bg-svg-btn h1:has(a) a:focus-visible,
.bg-svg-btn h2:has(a) a:focus-visible,
.bg-svg-btn h3:has(a) a:focus-visible,
.bg-svg-btn h4:has(a) a:focus-visible,
.bg-svg-btn h5:has(a) a:focus-visible,
.bg-svg-btn h6:has(a) a:focus-visible {
  outline: 3px solid #0f5a34;
  outline-offset: 3px;
}