/* Custom Klaro styles to match prettysim.pl brand */
/* Clean, simple approach - override Klaro's defaults directly */

/* Override Klaro's CSS variables at the root .klaro level */
.klaro {
  /* Brand colors replacing Klaro's greens with gold */
  --green1: #DABC73;
  --green2: #d0b166;
  --green3: #B29A50;

  /* Brand blues */
  --blue1: #006685;
  --blue2: #3B576C;

  /* Brand darks */
  --dark1: #263646;
  --dark2: #263646;  /* Changed from #637381 to brand dark for button backgrounds */
  --dark3: #86897E;

  /* Brand lights - changed light1 from white to dark for text */
  --light1: #263646;
  --light2: #DFE4E8;
  --light3: #C0CBCF;

  /* Typography */
  --font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Button text - white for dark buttons */
  --button-text-color: #FFFFFF;
}

/* Cookie Notice Banner - clean card style */
.klaro .cookie-notice {
  background-color: #FFFFFF !important;
  border: 2px solid #DFE4E8 !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 12px rgba(38, 54, 70, 0.15) !important;
  padding: 2rem !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Title - dark text */
.klaro .cookie-notice .cn-title {
  color: #263646 !important;
  text-align: center !important;
  font-weight: 600 !important;
  text-transform: lowercase !important;
  margin-bottom: 0.75rem !important;
}

/* Description - dark text */
.klaro .cookie-notice .cn-body {
  color: #263646 !important;
  text-align: center !important;
  line-height: 1.6 !important;
}

/* Override Klaro's default light text for ALL elements */
.klaro .cookie-notice p,
.klaro .cookie-notice strong,
.klaro .cookie-notice h1,
.klaro .cookie-notice h2,
.klaro .cookie-notice ul,
.klaro .cookie-notice li {
  color: #263646 !important;
}

/* All buttons - generous padding */
.klaro .cookie-notice .cm-btn {
  padding: 1rem 2rem !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  text-transform: lowercase !important;
  min-height: 48px !important;
  border: 2px solid transparent !important;
  transition: all 0.2s ease !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Decline button - white text on dark background */
.klaro .cookie-notice .cm-btn-decline {
  color: #FFFFFF !important;
  background-color: #263646 !important;
}

/* Accept (selected) button - white text on dark background */
.klaro .cookie-notice .cm-btn-accept-selected,
.klaro .cookie-notice .cm-btn-accept {
  color: #FFFFFF !important;
  background-color: #263646 !important;
}

/* Accept All button - keep dark text on gold */
.klaro .cookie-notice .cm-btn-accept-all {
  color: #263646 !important;
  background-color: #DABC73 !important;
}

/* Cookie Modal */
.klaro .cookie-modal .cm-modal {
  background-color: #FFFFFF !important;
  border: 2px solid #DFE4E8 !important;
  border-radius: 8px !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.klaro .cookie-modal .cm-header {
  border-bottom: 2px solid #DFE4E8 !important;
  padding: 2rem !important;
}

.klaro .cookie-modal .cm-title {
  color: #263646 !important;
  font-weight: 600 !important;
  text-transform: lowercase !important;
}

.klaro .cookie-modal .cm-footer {
  border-top: 2px solid #DFE4E8 !important;
}

/* Modal buttons */
.klaro .cookie-modal .cm-btn {
  padding: 1rem 2rem !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  text-transform: lowercase !important;
  border: 2px solid transparent !important;
  transition: all 0.2s ease !important;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

/* Toggle switches - gold background track when checked */
.klaro .cookie-modal .cm-switch input:checked + .cm-switch-slider {
  background: #DABC73 !important;
}

/* Toggle switches - light grey background track when unchecked */
.klaro .cookie-modal .cm-switch input:not(:checked) + .cm-switch-slider {
  background: #DFE4E8 !important;
}

/* The slider circle - white when checked (shows on gold background) */
.klaro .cookie-modal .cm-switch input:checked + .cm-switch-slider:before {
  background-color: #FFFFFF !important;
}

/* The slider circle - light grey when unchecked (shows on light background) */
.klaro .cookie-modal .cm-switch input:not(:checked) + .cm-switch-slider:before {
  background-color: #C0CBCF !important;
}

/* Links */
.klaro a {
  color: #DABC73 !important;
}

.klaro a:hover {
  color: #263646 !important;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
  .klaro .cookie-notice {
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
  }
}
