/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* Offers widget CTA button: refined sizing + no shadow */
a.offer-card__moreline,
.offer-card__moreline {
  /* Full image visible. Size follows content width; height from aspect-ratio */
  background-image: url('/wp-content/uploads/2025/10/super-primary_desktop.4422bbeb192a9c2f.webp') !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important; /* show the whole image */
  background-position: center center !important;

  color: #fff !important;
  display: inline-grid !important;
  place-items: center;
  text-align: center;
  white-space: nowrap; /* button grows instead of wrapping */
  line-height: 1.1;
  border-radius: 999px;
  padding: 0 40px !important; /* breathing room for text */
  width: fit-content; /* grow with content */
  max-width: 100%;
  height: auto;
  aspect-ratio: 500 / 174; /* keep original proportion */
  box-sizing: border-box;

  /* kill plugin hover effects by default */
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;

  /* remove slanted clipping from plugin */
  -webkit-clip-path: none !important;
  clip-path: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  overflow: visible !important;
}

a.gs-slide__btn,
.gs-slide__btn {
  /* Center the play button exactly */
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;

  /* Replace textual look with image */
  width: var(--gs-play-size, 55px) !important;
  aspect-ratio: 1 / 1;
  height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 999px;
  color: transparent !important; /* hide text visually */
  text-indent: -9999px; /* keep text for a11y but not visible */
  overflow: visible;
}

.gs-slide__btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url('/wp-content/uploads/2025/11/imgi_189_play-button.650c7b8e43790779.webp') center/contain no-repeat;
  pointer-events: none;
}

@media (min-width: 1201px) {
  .gs-slide__btn { --gs-play-size: 55px; }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .gs-slide__btn { --gs-play-size: 45px; }
}
@media (max-width: 767px) {
  .gs-slide__btn { --gs-play-size: 36px; }
}

a.offer-card__moreline:hover,
a.offer-card__moreline:focus-visible,
.offer-card__moreline:hover,
.offer-card__moreline:focus-visible {
  background-position: center center !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Typography + responsive sizing */
@media (min-width: 1201px) {
  a.offer-card__moreline,
  .offer-card__moreline {
    font-size: 22px;
  }
}

@media (min-width: 768px) and (max-width: 1200px) {
  a.offer-card__moreline,
  .offer-card__moreline {
    font-size: 18px;
  }
}

@media (max-width: 767px) {
  a.offer-card__moreline,
  .offer-card__moreline {
    white-space: normal; /* allow wrap on very small screens */
    font-size: 15px;
  }
}
a.gs-slider__nav .gs-prev,
.gs-slider__nav .gs-next,
.gs-slider__nav .gs-prev:where(*) /* specificity boost */,
.gs-slider__nav .gs-next:where(*) {
  /* Use provided wrapper image for nav buttons */
  --gs-nav-size: 44px;
  width: var(--gs-nav-size) !important;
  height: var(--gs-nav-size) !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: url('/wp-content/uploads/2025/10/icon-button-wrapper-default@2x.4304527b1cf7bb9b.webp') center/contain no-repeat !important;
  box-shadow: none !important;
}

/* Keep arrow glyphs visible over the new background (already drawn via ::before/::after) */
.gs-slider__nav .gs-prev::before,
.gs-slider__nav .gs-next::before {
  /* hide thin shaft; we'll use a bold chevron */
  content: none !important;
}

/* Bold chevron in the center */
.gs-slider__nav .gs-prev::after,
.gs-slider__nav .gs-next::after {
  left: 50% !important;
  top: 50% !important;
  width: calc(var(--gs-nav-size) * 0.36) !important;
  height: calc(var(--gs-nav-size) * 0.36) !important;
  margin: 0 !important;
  border: none !important;
  border-right: var(--gs-arrow-thick, 5px) solid var(--gs-nav-arrow, #fff) !important;
  border-top:   var(--gs-arrow-thick, 5px) solid var(--gs-nav-arrow, #fff) !important;
  background: transparent !important;
  transform: translate(-50%, -50%) rotate(45deg) !important;
}
.gs-slider__nav .gs-prev::after {
  transform: translate(-50%, -50%) rotate(225deg) !important;
}

/* Responsive nav sizes */
@media (min-width: 1201px) {
  .gs-slider__nav .gs-prev,
  .gs-slider__nav .gs-next { --gs-nav-size: 48px; }
}
@media (max-width: 767px) {
  .gs-slider__nav .gs-prev,
  .gs-slider__nav .gs-next { --gs-nav-size: 40px; }
}

/* Arrow thickness responsive tweak */
@media (max-width: 767px) {
  .gs-slider__nav { --gs-arrow-thick: 3px; }
}