.skoleni .training-dates {
   width: fit-content;
   display: flex;
   flex-direction: column;
   align-items: stretch;
   gap: 6px;
   margin: 12px 24px 12px 0;
}

.training-cart-add {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 10px;
   width: 100%;
   padding: 6px 10px 6px 14px;
   border: 1px solid var(--humusoft-color);
   border-radius: 18px;
   background: #fff;
   color: var(--humusoft-color);
   font: inherit;
   font-size: 0.95rem;
   line-height: 1.3;
   text-align: left;
   cursor: pointer;
   transition: background-color 0.15s, color 0.15s;
}

.training-cart-add .material-icons {
   font-size: 20px;
}

.training-cart-add:hover {
   background: #e8f0f6;
}

.training-cart-add:focus-visible {
   outline: 2px solid var(--humusoft-color);
   outline-offset: 2px;
}

.training-cart-add.in-cart {
   background: var(--humusoft-color);
   color: #fff;
}

.training-cart-add.in-cart:hover {
   background: #003a5f;
}

.training-cart-add.tooltipped .training-cart-add__date {
   text-decoration: underline dotted;
}

.training-date-full {
   padding: 6px 14px;
   color: #606060;
   word-break: break-word;
}

.training-date-full > span {
   color: #c62828;
   font-weight: bold;
}

@media screen and (max-width: 550px) {
   .skoleni div.row.training div.training-dates {
      flex-basis: 100%;
      margin: 0 15px 16px;
      text-align: left;
   }
}

/* ---------- kosik ---------- */
.training-cart__fab {
   position: fixed;
   right: 24px;
   bottom: 24px;
   z-index: 998;
   border-radius: 50% !important;
   overflow: visible;
   background-color: var(--humusoft-color) !important;
}

.training-cart__fab:focus-visible {
   outline: 3px solid #f9a825;
   outline-offset: 3px;
}

.training-cart__fab.bump {
   animation: training-cart-bump 0.35s ease;
}

@keyframes training-cart-bump {
   40% { transform: scale(1.15); }
}

.training-cart__count {
   position: absolute;
   top: -2px;
   right: -2px;
   min-width: 22px;
   height: 22px;
   padding: 0 6px;
   border-radius: 11px;
   background: #e65100;
   color: #fff;
   font-size: 0.8rem;
   font-weight: bold;
   line-height: 22px;
   text-align: center;
}

.training-cart__panel {
   position: fixed;
   right: 24px;
   bottom: 100px;
   z-index: 999;
   display: flex;
   flex-direction: column;
   width: 360px;
   max-height: min(520px, calc(100vh - 140px));
   border-radius: 8px;
   background: #fff;
   overflow: hidden;
}

.training-cart__panel[hidden] {
   display: none;
}

.training-cart__header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 12px 8px 12px 20px;
   background: var(--humusoft-color);
   color: #fff;
}

#trainingCart .training-cart__title {
   margin: 0;
   font-size: 1.15rem !important;
   font-weight: 500;
   line-height: 1.4;
}

.training-cart__close,
.training-cart__remove {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 36px;
   height: 36px;
   flex-shrink: 0;
   padding: 0;
   border: 0;
   border-radius: 50%;
   background: transparent;
   color: inherit;
   cursor: pointer;
}

.training-cart__close:hover {
   background: rgba(255, 255, 255, 0.15);
}

.training-cart__form {
   display: flex;
   flex-direction: column;
   min-height: 0;
   margin: 0;
}

.training-cart__list {
   flex: 1 1 auto;
   min-height: 0;
   margin: 0;
   padding: 4px 0;
   overflow-y: auto;
}

.training-cart__item {
   display: flex;
   align-items: center;
   gap: 8px;
   padding: 10px 8px 10px 20px;
   border-bottom: 1px solid #eee;
}

.training-cart__item-text {
   display: flex;
   flex-direction: column;
   flex: 1;
   min-width: 0;
   line-height: 1.35;
}

.training-cart__item-text strong {
   color: #222;
   font-weight: 500;
   overflow-wrap: anywhere;
}

.training-cart__item-text span {
   color: #666;
   font-size: 0.9rem;
}

.training-cart__remove {
   color: #757575;
}

.training-cart__remove:hover, .training-cart__remove:focus-visible {
   background: #fdecea;
   color: #c62828;
}

.training-cart__close:focus-visible,
.training-cart__remove:focus-visible {
   outline: 2px solid currentColor;
}

.training-cart__empty {
   margin: 0;
   padding: 20px;
   color: #666;
}

.training-cart__empty[hidden] {
   display: none;
}

.training-cart__submit {
   flex-shrink: 0;
   margin: 12px 16px 16px;
   height: auto;
   min-height: 40px;
   line-height: 1.3;
   padding: 10px 16px;
   background-color: var(--humusoft-color);
}

.training-cart__submit:hover,
.training-cart__submit:focus {
   background-color: #003a5f;
}

/* desktop - kosik se pri posouvani drzi pod hlavickou, vodorovne vzdy vpravo vedle kontejneru
   se skolenimi (.training-cart-anchor ma stejnou sirku); panel se otevira pod tlacitkem */
@media only screen and (min-width: 1047px) {
   .training-cart-anchor {
      position: sticky;
      top: calc(var(--offset-top) + 16px);
      z-index: 400;
      height: 0;
   }

   .training-cart__fab,
   .training-cart__panel {
      position: absolute;
      right: -72px;
      bottom: auto;
   }

   .training-cart__panel {
      top: calc(56px + 12px);
      max-height: min(520px, calc(100vh - var(--offset-top) - 16px - 56px - 12px - 24px));
   }
}

@media screen and (max-width: 600px) {
   .training-cart__fab {
      right: 16px;
      bottom: 16px;
   }

   .training-cart__panel {
      left: 16px;
      right: 16px;
      bottom: 88px;
      width: auto;
   }
}
