/* 
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
*/

/*--- Globalne ---*/

.p-no-margin p {
	margin-bottom: 0px !important;
}

.p-no-margin-end p {
	margin-block-end: 0px !important;
}

.elementor-icon-wrapper {
  line-height: 0;
}

b, strong {
  font-weight: 700;
}

.e-loop-nothing-found-message__text {
    text-align: left;
}

:focus-visible {
outline: 1px solid var(--e-global-color-aa2b409);
}

.video-4-5 .elementor-wrapper {
  aspect-ratio: 4 / 5 !important;
  overflow: hidden !important;
}

/*--- Link w paragrafach ---*/

p a {
  text-decoration: underline !important;
}

.e-loop-nothing-found-message__text a {
    text-decoration: underline;
}

/*--- Woo - Ogolne ---*/
.woocommerce-orders-table__cell.woocommerce-orders-table__cell-order-number, .woocommerce-Address .edit, .woocommerce-LostPassword.lost_password {
font-family: var( --e-global-typography-586ecdc-font-family ), Sans-serif !important;
font-size: var( --e-global-typography-586ecdc-font-size ) !important;
font-weight: var( --e-global-typography-586ecdc-font-weight ) !important;
text-transform: var( --e-global-typography-586ecdc-text-transform ) !important;
line-height: var( --e-global-typography-586ecdc-line-height ) !important;
}

.woocommerce-Address .edit {
text-decoration: underline;
}

.woocommerce-Address address {
font-style: normal !important;
}

#account_display_name_description em {
font-style: normal;
font-family: var( --e-global-typography-5212e1a-font-family ), Sans-serif;
font-size: var( --e-global-typography-5212e1a-font-size );
font-weight: var( --e-global-typography-5212e1a-font-weight );
line-height: var( --e-global-typography-5212e1a-line-height );
}

.woocommerce-EditAccountForm.edit-account legend {
font-family: var( --e-global-typography-585b10a-font-family ), Sans-serif !important;
font-size: var( --e-global-typography-585b10a-font-size ) !important;
font-weight: var( --e-global-typography-585b10a-font-weight ) !important;
line-height: var( --e-global-typography-585b10a-line-height ) !important;
}

.elementor-widget-woocommerce-my-account, .e-my-account-tab.e-my-account-tab__ .woocommerce-message {
font-family: var( --e-global-typography-b3c169e-font-family ), Sans-serif !important;
font-size: var( --e-global-typography-b3c169e-font-size ) !important;
font-weight: var( --e-global-typography-b3c169e-font-weight ) !important;
line-height: var( --e-global-typography-b3c169e-line-height ) !important;
color: var( --e-global-color-a5d6a18 ) !important;
}

.woocommerce-form.woocommerce-form-login.login, .woocommerce-ResetPassword.lost_reset_password {
padding: 0 !important;
}

@media (min-width: 1025px) {
  .woocommerce-form.woocommerce-form-login.login {
    max-width: 45% !important;
  }
}

@media (min-width: 1025px) {
  .woocommerce-ResetPassword.lost_reset_password {
    max-width: 45% !important;
  }
}

.woocommerce-order-details .order-again {
display: none !important;
}

.woocommerce-form.woocommerce-form-login.login {
margin: 1rem 0 !important;
}

.woocommerce-message a.button.wc-forward {
color: var(--e-global-color-8c65c8e) !important;
}

.woocommerce-message a.button.wc-forward:hover {
color: var(--e-global-color-879b953) !important;
background-color: var(--e-global-color-a5d6a18) !important;
}

.woocommerce-ResetPassword.lost_reset_password .woocommerce-form-row.woocommerce-form-row--last.form-row.form-row-last {
float: left !important;
}

.show-password-input:hover, .show-password-input:focus {
background-color: var(--e-global-color-50adc01) !important;
}

.woocommerce-password-strength {
margin-top: 10px !important;
border-radius: 8px !important;
}

body.woocommerce-account.woocommerce-lost-password .fbm-login-intro {
display: none !important;
}

.woocommerce div.product form.cart .group_table td {
padding: 1em !important;
}

.woocommerce-notices-wrapper {
  width: min(100%, 1410px);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}

@media (min-width: 1440px) {
  .woocommerce-notices-wrapper {
    padding-left: 0;
    padding-right: 0;
  }
}


/*--- Info o slabym hasle ---*/

body.logged-in.woocommerce-account .woocommerce-password-strength,
body.woocommerce-account .woocommerce-password-hint {
display: none !important;
}

body.woocommerce .woocommerce-password-strength,
body.woocommerce .woocommerce-password-hint {
display: none !important;
}

/*--- Dekoracyjne podkreslenie ---*/

.deco-underline{
  --du-color: var(--e-global-color-dfd2fe5);
  --du-height: 0.48em;
  --du-offset: 0.02em;
  --du-side: 0em;

  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;

  /* wysunięcie po bokach */
  padding: 0 var(--du-side);

  /* 3 warstwy: lewy kapsel, środek, prawy kapsel */
  background:
    radial-gradient(circle closest-side, var(--du-color) 99%, transparent 100%)
      left calc(100% - var(--du-offset)) / var(--du-height) var(--du-height) no-repeat,
    radial-gradient(circle closest-side, var(--du-color) 99%, transparent 100%)
      right calc(100% - var(--du-offset)) / var(--du-height) var(--du-height) no-repeat,
    linear-gradient(var(--du-color), var(--du-color))
      center calc(100% - var(--du-offset)) / calc(100% - var(--du-height)) var(--du-height) no-repeat;
}


/*--- Icon List: spraw, żeby SVG było kolorowane przez Elementor ---*/
.fbm-iconlist .elementor-icon-list-icon svg path {
  fill: inherit !important;
  stroke: inherit !important;
}

/* ---- Animacja ikony tylko dla widgetów button z klasą fly-icon ---- */

.fly-icon .elementor-button .elementor-button-icon svg{
  display: inline-block;
  transform-origin: center;
  will-change: transform, opacity;
}

.fly-icon .elementor-button:hover .elementor-button-icon svg{
  animation: arrow-escape 0.55s ease-out forwards;
}

@keyframes arrow-escape {
  0%   { transform: translate(0, 0);   opacity: 1; }
  40%  { transform: translate(8px,-8px); opacity: 0; }
  41%  { transform: translate(-8px,8px); opacity: 0; }
  100% { transform: translate(0, 0);   opacity: 1; }
}

/* ----- Animacja ikony solo ----- */

.fly-icon-solo .elementor-icon svg {
  transform-origin: center;
  will-change: transform, opacity;
}

.fly-icon-solo .elementor-icon:hover svg {
  animation: arrow-escape 0.55s ease-out forwards;
}

/* ------ Animacja ikony w prawo ----- */

.fly-icon-right-solo .elementor-icon svg {
  transform-origin: center;
  will-change: transform, opacity;
}

.fly-icon-right-solo:hover .elementor-icon svg {
  animation: arrow-escape-right 0.5s ease-out forwards;
}

/* ----- Animacja ikony Menu ----- */

.mobile-menu .elementor-button .elementor-button-icon svg path{
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .28s ease, opacity .22s ease;
}

/* stan OTWARTY off-canvas */
.mobile-menu a.elementor-button[aria-expanded="true"]
  .elementor-button-icon svg path:nth-child(2){
  /* górna linia schodzi do środka */
  transform: translateY(8px);
  opacity: 0;
}

.mobile-menu a.elementor-button[aria-expanded="true"]
  .elementor-button-icon svg path:nth-child(3){
  /* dolna linia idzie do środka */
  transform: translateY(-8px);
  opacity: 0;
}

.mobile-menu .elementor-button .elementor-button-icon svg{
  will-change: transform, opacity;
}

/* ------ Animacja strzalki karuzeli ------ *

/* baza */
.elementor-swiper-button svg {
  transform-origin: center;
  will-change: transform, opacity;
}

/* NEXT → w prawo */
.elementor-swiper-button-next:hover svg {
  animation: arrow-escape-right 0.5s ease-out forwards;
}

/* PREV → w lewo */
.elementor-swiper-button-prev:hover svg {
  animation: arrow-escape-left 0.5s ease-out forwards;
}

/* KEYFRAMES */

@keyframes arrow-escape-right {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  40% {
    transform: translateX(10px);
    opacity: 0;
  }
  41% {
    transform: translateX(-10px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes arrow-escape-left {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  40% {
    transform: translateX(-10px);
    opacity: 0;
  }
  41% {
    transform: translateX(10px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

/* ------ Marquee list ------ */
/* Ticker – Icon List w jednej linii */
.scroll-ticker .elementor-icon-list-items{
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  width: max-content !important;   /* super ważne */
  margin: 0 !important;
  padding: 0 !important;
}

/* Każdy element listy jako “klocek” bez łamania */
.scroll-ticker .elementor-icon-list-item{
  display: inline-flex !important;
  align-items: center;
  white-space: nowrap !important;
}

/* Tekst też niech się nie łamie */
.scroll-ticker .elementor-icon-list-text{
  white-space: nowrap !important;
}

/* Ikona + tekst w jednej linii (u Ciebie te romby) */
.scroll-ticker .elementor-icon-list-icon{
  display: inline-flex;
  align-items: center;
}

.scroll-ticker .elementor-icon-list-items{
    display:flex;
    flex-wrap:nowrap;
    white-space:nowrap;
    will-change: transform;
    animation: ticker-move 36s linear infinite;
    transform: translate3d(0,0,0);
  }

  @keyframes ticker-move{
    from { transform: translate3d(0,0,0); }
    to   { transform: translate3d(-50%,0,0); }
  }

/* Maska po bokach */
.scroll-ticker-mask {
  position: relative;
  overflow: hidden;

  /* maska */
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    black 8%,
    black 92%,
    transparent 100%
  );
}

/*--- Maska tylko po prawej – karuzela ---*/
/* Klasa na widgecie karuzeli */
.scroll-ticker-mask-right{
  overflow: visible !important; /* nie tniemy dołu/paginacji */
}

/* Maskujemy tylko obszar slajdów */
.scroll-ticker-mask-right .swiper{
  overflow: hidden; /* tu może być ucinanie boków */
  
  -webkit-mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 88%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 88%,
    transparent 100%
  );

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;

  -webkit-mask-position: left top;
  mask-position: left top;
}

/* ---- Bunny steam - embed kod ---- */

/* 1) Wymuś normalny box na HTML widget */
.bunny-steam-embed,
.bunny-steam-embed .elementor-widget-container{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  overflow: visible !important;
}

/* 2) Bulletproof ratio-box (padding hack, NIE aspect-ratio) */
.bunny-steam-embed .bunny-ratio{
  position: relative !important;
  width: 100% !important;

  height: 0 !important;
  padding-top: 56.25% !important; /* 16:9 */

  overflow: hidden !important;
  display: block !important;

  /* jeżeli rodzic jest flex i daje 0 */
  flex: 1 1 100% !important;
  min-width: 0 !important;
}

/* 3) Iframe w środku */
.bunny-steam-embed iframe{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  display: block !important;
}

/* żeby scrollIntoView nie chował playera pod headerem */
.bunny-steam-embed {
  scroll-margin-top: 120px;
}

@media (max-width: 767px){
  .bunny-steam-embed {
    scroll-margin-top: 90px;
  }
}

/* dluga lista na desktop */

@media (min-width: 768px){

  /* kluczowe przy flex */
  .elementor-widget-n-tabs .e-n-tabs{
    min-height: 0 !important;
  }

  /* lista odcinków */
  .elementor-widget-n-tabs .e-n-tabs-heading{
    max-height: 70vh;              /* limit wysokości */
    overflow-y: auto;              /* ← scrollbar TYLKO gdy trzeba */
    overflow-x: hidden;

    flex-direction: column !important;
    flex-wrap: nowrap !important;

    padding-right: 10px;           /* miejsce na scrollbar */
    box-sizing: border-box;

    scrollbar-gutter: stable;      /* nie skacze layout */
  }

  /* przyciski pełna szerokość */
  .elementor-widget-n-tabs .e-n-tab-title{
    width: 100%;
  }

  /* ===== Firefox ===== */
  .elementor-widget-n-tabs .e-n-tabs-heading{
    scrollbar-width: thin;
    scrollbar-color: 
      var(--e-global-color-a7d8899) 
      var(--e-global-color-aff2e8d);
  }

  /* ===== Chrome / Edge / Safari ===== */
  .elementor-widget-n-tabs .e-n-tabs-heading::-webkit-scrollbar{
    width: 8px;
  }

  .elementor-widget-n-tabs .e-n-tabs-heading::-webkit-scrollbar-track{
    background: var(--e-global-color-aff2e8d);
    border-radius: 8px;
  }

  .elementor-widget-n-tabs .e-n-tabs-heading::-webkit-scrollbar-thumb{
    background-color: var(--e-global-color-a7d8899);
    border-radius: 8px;
  }

  .elementor-widget-n-tabs .e-n-tabs-heading::-webkit-scrollbar-thumb:hover{
    background-color: var(--e-global-color-a7d8899);
  }
}

/* --- Produkt grupowy --- */
/* cały wiersz wygląda jak klikalny */
.woocommerce-grouped-product-list.group_table tr.woocommerce-grouped-product-list-item {
  cursor: pointer;
}

/* link wygląda jak zwykły tekst */
.woocommerce-grouped-product-list.group_table .woocommerce-grouped-product-list-item__label a {
  text-decoration: none;
  color: inherit;
}

