/* Schování odkazu "Vytvořil Shoptet" v patičce */
/* schovej oba odkazy i logo uvnitř #signature */
#signature > a,
#signature > a img {
  display: none !important;
}

/* Gradient za vším */
#header {
  background: linear-gradient(to bottom right, #673bb8, #e52799) !important;
}


/* Jemně šedé pozadí + sjednocená výška pro horní navigační lišty */
.top-navigation-menu,
.top-navigation-tools{
  background-color: #f2f2f2 !important; /* jemná šedá */
  background-image: none !important;
  height: 27.38px !important;
  min-height: 27.38px !important;
  line-height: 27.38px !important;
  display: flex !important;
  align-items: center !important;
}

/* I pseudo-elementy musí mít stejné pozadí */
.top-navigation-menu::before,
.top-navigation-menu::after,
.top-navigation-tools::before,
.top-navigation-tools::after{
  background-color: #f2f2f2 !important;
  background-image: none !important;
}

/* Hover efekt pro odkazy uvnitř */
.top-navigation-menu a:hover,
.top-navigation-tools a:hover{
  text-decoration: underline !important;
}

/* Transparentní pozadí pro vyhledávací pole */
.query-input.form-control.search-input.js-search-input {
  background-color: transparent !important; /* průhledné pozadí */
  border: 1px solid #ffffff !important;     /* bílý okraj */
  /* color: #000 !important; */             /* volitelně barva textu */
}

/* Hover + Focus efekt – pozadí zbělá */
.query-input.form-control.search-input.js-search-input:hover,
.query-input.form-control.search-input.js-search-input:focus {
  background-color: #ffffff !important;
  color: #000 !important; /* text zůstane dobře čitelný */
}

/* Placeholder (volitelný odstín) */
.query-input.form-control.search-input.js-search-input::placeholder {
  /* color: #7b1fa2 !important; */
}


a[href="/kosik/"] span {
  text-decoration: none; /* výchozí */
}

a[href="/kosik/"]:hover span {
  text-decoration: underline;
}

/* Odkazy v hamburger menu */
.menu-level-1 a {
  text-decoration: none; /* výchozí stav bez podtržení */
}

.menu-level-1 a:hover {
  text-decoration: underline; /* při najetí */
}

.menu-helper span {
  cursor: pointer;           /* ať je vidět, že je to klikatelné */
  text-decoration: none;
}

.menu-helper span:hover {
  text-decoration: underline;
}

/* tlačítka variant */
.selectButtonsContent {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
}

/* výchozí styl = oválné tlačítko */
.select-option {
  width: auto !important;       /* nevyplňuje celou řádku */
  min-width: 60px;
  height: 50px;
  padding: 0 18px;
  border-radius: 999px;         /* ovál */
  display: flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  flex: 0 0 auto;
  background: linear-gradient(135deg, #673bb8, #e52899);
  color: #fff;
  font-weight: bold;
  cursor: pointer;
  border: none;
  transition: box-shadow 0.3s ease;
  position: relative;
  text-align: center;
  font-size: 16px;
}

/* krátké popisky (1–2 znaky) = kruh */
.select-option[data-length="short"] {
  width: 50px !important;
  height: 50px !important;
  min-width: 0;
  padding: 0;
  border-radius: 50%;
  font-size: 16px;
}

/* hover efekt – intenzivní barevný glow */
.select-option:hover {
  transform: none;
  box-shadow:
    0 0 10px rgba(103, 59, 184, 0.6),   /* fialový glow */
    0 0 14px rgba(229, 40, 153, 0.5);   /* růžový glow */
}

/* vybraná varianta – poměrové zvětšení + glow */
.select-option.active {
  transform: scale(1.2);   /* zvětší celé tlačítko o 20 % */
  font-size: 18px;
  box-shadow:
    0 0 12px rgba(229, 40, 153, 0.6),
    0 0 16px rgba(103, 59, 184, 0.6),
    0 0 20px rgba(255, 255, 255, 0.5);
}

.select-option.active::after {
  content: "";
  position: absolute;
  inset: 3px;
  border: 2px solid rgba(255, 255, 255, 0.9);
  border-radius: inherit;   /* respektuje kruh i ovál */
  box-sizing: border-box;
}

/* nedostupná varianta */
.select-option.unavailable-option {
  background: linear-gradient(135deg, #bdbdbd, #e0e0e0);
  color: #fff;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}