/* Nastavení výchozího fontu pro celý Klaro komponent */
#klaro * {
  font-family: 'Open Sans', sans-serif !important;
  color: white
}
.klaro .cookie-notice:not(.cookie-modal-notice) {
        background-color: #f5f5f5;
        background-color: var(--dark1, #F5F5F5);
}

@media (min-width: 1024px) {
    .klaro .cookie-notice:not(.cookie-modal-notice) {
        border-radius: 4px;
        border-radius: var(--border-radius, 4px);
        position: fixed;
        position: var(--notice-position, fixed);
        left: 20px;  /* Změněno z right: 20px na left: 20px */
        right: auto; /* Zajištění, že right nebude kolidovat */
        bottom: 20px;
        bottom: var(--notice-bottom, 20px);
        top: auto;
        top: var(--notice-top, auto);
        max-width: 400px;
        max-width: var(--notice-max-width, 400px);
        box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.2), 5px 5px 10px 0 rgba(0, 0, 0, 0.19);
    }
}
.klaro .cn-notice {
  background-color: #ffffff !important;
  padding: 20px;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  font-family: 'Open Sans', sans-serif !important;
}

/* Barva pozadí modal okna a notifikace */
.klaro .cm-modal,
.klaro .cn-notice {

  border-radius: 6px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}
.klaro .cn-notice {
  position: fixed !important;
  bottom: 0 !important;
  top: auto !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  border-radius: 0 !important;
  z-index: 10000 !important;
  background-color: #ffffff !important;
  padding: 20px !important;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
  font-family: 'Open Sans', sans-serif !important;
}

.klaro .cookie-notice:not(.cookie-modal-notice) {

    z-index: 999;
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;  /* Změněno z right: 0 na left: 0 */
    right: auto; /* Zajištění, že right nebude kolidovat */
}
.klaro .cookie-notice:not(.cookie-modal-notice) {
        background: #f5f5f5;
        z-index: 999;
        position: fixed;
        width: 100%;
        bottom: 0;
        right: 0;
}
/* Tlačítka */
.klaro .cm-btn,
.klaro .cm-list-buttons button,
.klaro .cn-buttons button {
  background-color: #01b3e1 !important;
  color: #ffffff !important;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-weight: bold;
  cursor: pointer;
}

.klaro .cm-btn:hover,
.klaro .cn-buttons button:hover {
  background-color: #009ec4 !important;
}

/* Případné další úpravy pro přehlednost */
.klaro .cm-modal h1,
.klaro .cm-modal h2 {
  font-size: 1.4em;
  margin-bottom: 0.5em;
}
@media (max-width: 1024px) {
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-body {
        margin-right: 80px;
        text-align: left;
}
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-body .cn-ok {

        justify-content: left;

}
}