/* tvoj štýl */

.custom-option {
            border: 1px solid #e5e7eb;
            border-radius: 8px;
            padding: 10px;
            margin-bottom: 10px;
            background-color: #ffffff;
        }
        .sub-menu {
            display: none;
            margin-left: 28px;
            margin-top: 8px;
            padding-left: 10px;
        }
        .flex-row {
            display: flex;
            align-items: center;
            gap: 10px;
            cursor: pointer;
            justify-content: flex-start;

        }

        input[type="checkbox"], input[type="radio"] {
            cursor: pointer;
            margin: 0px !important;
        }

.price {
  margin-left: 3px; 
  color: #16B743; 
 font-weight: 800;
}


.tooltip {
            position: relative;
            display: inline-block;
        }
        
.hidden {
display:none
}        

        .tooltip .tooltiptext {
            visibility: hidden;
            width: 120px;
            background-color: #333;
            color: #fff;
            text-align: left;
            border-radius: 5px;
            padding: 8px;
            position: absolute;
            z-index: 1;
            Top: 125%;
            left: 50%;
            margin-left: -60px;
            opacity: 0;
            transition: opacity 0.3s;
            font-size: 12px;
        }

        .tooltip:hover .tooltiptext {
            visibility: visible;
            opacity: 3;
        }
        
        /* Základný kontajner */
.custom-control {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 16px;
  user-select: none;
}

/* Skryjeme predvolený vzhľad prehliadača */
.custom-control input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Vytvoríme vlastný štvorček (box) */
.custom-control .box {
  position: absolute;
  top: 0;
  left: 0;
  height: 14px;
  width: 14px;
  background-color: #eee;
  border: 2px solid #bbb;
  border-radius: 4px; /* Tu robíme štvorec */
  transition: all 0.2s;
}

/* Efekt pri prejdení myšou */
.custom-control:hover input ~ .box {
  background-color: #ccc;
}

/* Farba pozadia, keď je zaškrtnuté (funguje pre radio aj checkbox) */
.custom-control input:checked ~ .box {
  background-color: #eee;
  border-color: #FE4387;
}

/* Vytvorenie fajky (skrytá, kým nie je zaškrtnuté) */
.custom-control .box:after {
  content: "";
  position: absolute;
  display: none;
  left: 4px;
  top: 0px;
  width: 4px;
  height: 8px;
  border: solid #FE4387;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

/* Zobrazenie fajky pri zaškrtnutí */
.custom-control input:checked ~ .box:after {
  display: block;
}