/*!
 * CC – Cookie Consent Styles
 * Copyright (c) 2026 osterzgebirge.net
 * Version 1.5
 */
:root {
  --cc-primary:       #2c5f2e;
  --cc-primary-dark:  #1e4220;
  --cc-primary-light: #e8f5e9;
  --cc-primary-text:  #ffffff;
  --cc-bg:            #ffffff;
  --cc-bg-subtle:     #fafafa;
  --cc-bg-hover:      #f3f3f3;
  --cc-bg-info:       #f8f8f8;
  --cc-bg-tag:        #f0f0f0;
  --cc-border:        #e8e8e8;
  --cc-border-info:   var(--cc-primary);
  --cc-text:          #222222;
  --cc-text-body:     #444444;
  --cc-text-subtle:   #555555;
  --cc-text-muted:    #aaaaaa;
  --cc-text-info:     #666666;
  --cc-text-tag:      #333333;
  --cc-toggle-off:    #cccccc;
  --cc-backdrop:      rgba(20,20,20,0.65);
  --cc-error-color:   #c0392b;
  --cc-toast-bg:      #222222;
  --cc-toast-text:    #ffffff;
  --cc-font-ui:       'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  --cc-font-size-base:  0.88rem;
  --cc-font-size-small: 0.82rem;
  --cc-font-size-xs:    0.78rem;
  --cc-font-size-tiny:  0.75rem;
  --cc-radius:        6px;
  --cc-radius-sm:     4px;
  --cc-radius-pill:   20px;
  --cc-padding-modal: 1.4rem 1.6rem;
  --cc-gap:           0.6rem;
  --cc-shadow:        0 24px 64px rgba(0,0,0,0.25);
  --cc-float-size:    44px;
  --cc-float-bottom:  1.2rem;
  --cc-float-left:    1.2rem;
}
#cc-backdrop {
  position: fixed; inset: 0;
  background: var(--cc-backdrop);
  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
  z-index: 99998; display: flex; align-items: center; justify-content: center;
  padding: 1rem; opacity: 0; transition: opacity 0.35s ease;
}
#cc-backdrop.cc-visible { opacity: 1; }
#cc-modal {
  background: var(--cc-bg); border-radius: var(--cc-radius);
  max-width: 580px; width: 100%; box-shadow: var(--cc-shadow);
  overflow: hidden; transform: translateY(28px) scale(0.97);
  transition: transform 0.35s cubic-bezier(0.22,1,0.36,1);
  font-family: var(--cc-font-ui);
  display: flex; flex-direction: column; max-height: 90vh;
}
#cc-backdrop.cc-visible #cc-modal { transform: translateY(0) scale(1); }
#cc-header {
  background: var(--cc-primary); padding: var(--cc-padding-modal);
  padding-bottom: 1.2rem; display: flex; align-items: center; gap: 0.8rem;
}
#cc-header svg { flex-shrink: 0; }
#cc-header h2 { color: var(--cc-primary-text); font-size: 1.1rem; font-weight: 600; letter-spacing: 0.02em; flex: 1; }
#cc-version-badge {
  font-size: 0.7rem; color: rgba(255,255,255,0.6); background: rgba(0,0,0,0.2);
  padding: 0.2rem 0.5rem; border-radius: var(--cc-radius-pill); white-space: nowrap;
}
#cc-body { padding: var(--cc-padding-modal); overflow-y: auto; flex: 1; }
#cc-intro { font-size: var(--cc-font-size-base); line-height: 1.65; color: var(--cc-text-body); margin-bottom: 1.2rem; }
#cc-intro a { color: var(--cc-primary); text-decoration: underline; }
#cc-info-box {
  background: var(--cc-bg-info); border-left: 3px solid var(--cc-border-info);
  border-radius: 0 var(--cc-radius-sm) var(--cc-radius-sm) 0;
  padding: 0.6rem 0.9rem; font-size: var(--cc-font-size-xs); color: var(--cc-text-info);
  margin-bottom: 1.1rem; display: none; line-height: 1.5;
}
#cc-info-box.cc-show { display: block; }
#cc-info-box strong { color: var(--cc-text); }
.cc-category { border: 1px solid var(--cc-border); border-radius: var(--cc-radius-sm); margin-bottom: var(--cc-gap); overflow: hidden; }
.cc-category-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0.75rem 1rem; cursor: pointer; user-select: none;
  gap: 0.8rem; background: var(--cc-bg-subtle); transition: background 0.15s;
}
.cc-category-header:hover { background: var(--cc-bg-hover); }
.cc-cat-left { display: flex; align-items: center; gap: 0.6rem; flex: 1; }
.cc-cat-name { font-size: 0.9rem; font-weight: 600; color: var(--cc-text); }
.cc-cat-required {
  font-size: 0.72rem; background: var(--cc-primary-light); color: var(--cc-primary);
  padding: 0.15rem 0.5rem; border-radius: var(--cc-radius-pill); font-weight: 500;
}
.cc-toggle-arrow { font-size: 0.7rem; color: var(--cc-text-muted); transition: transform 0.2s; flex-shrink: 0; }
.cc-category.open .cc-toggle-arrow { transform: rotate(180deg); }
.cc-category-body {
  font-size: var(--cc-font-size-small); color: var(--cc-text-subtle); line-height: 1.6;
  padding: 0 1rem; max-height: 0; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s;
}
.cc-category.open .cc-category-body { max-height: 300px; padding: 0.75rem 1rem; }
.cc-services { margin-top: 0.6rem; display: flex; flex-wrap: wrap; gap: 0.4rem; }
.cc-service-tag {
  background: var(--cc-bg-tag); border-radius: var(--cc-radius-sm);
  padding: 0.15rem 0.55rem; font-size: var(--cc-font-size-tiny); color: var(--cc-text-tag);
}
.cc-switch { position: relative; width: 42px; height: 24px; flex-shrink: 0; }
.cc-switch input { opacity: 0; width: 0; height: 0; }
.cc-slider { position: absolute; inset: 0; background: var(--cc-toggle-off); border-radius: var(--cc-radius-pill); cursor: pointer; transition: background 0.2s; }
.cc-slider::before {
  content: ''; position: absolute; width: 18px; height: 18px; left: 3px; top: 3px;
  background: var(--cc-primary-text); border-radius: 50%; transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.cc-switch input:checked + .cc-slider { background: var(--cc-primary); }
.cc-switch input:checked + .cc-slider::before { transform: translateX(18px); }
.cc-switch input:disabled + .cc-slider { opacity: 0.6; cursor: not-allowed; }
#cc-footer { padding: 1rem 1.6rem 1.4rem; display: flex; flex-wrap: wrap; gap: var(--cc-gap); border-top: 1px solid var(--cc-border); }
.cc-btn {
  padding: 0.65rem 1.1rem; border-radius: var(--cc-radius-sm);
  font-size: var(--cc-font-size-small); font-weight: 600; cursor: pointer; border: none;
  letter-spacing: 0.02em; transition: opacity 0.15s, transform 0.1s;
  flex: 1; min-width: 130px; text-align: center; font-family: var(--cc-font-ui);
}
.cc-btn:hover { opacity: 0.88; }
.cc-btn:active { transform: scale(0.98); }
.cc-btn-accept-all { background: var(--cc-primary); color: var(--cc-primary-text); }
.cc-btn-save       { background: var(--cc-bg-tag);  color: var(--cc-text); }
.cc-btn-reject     { background: transparent; color: var(--cc-text-muted); border: 1px solid var(--cc-border); }
#cc-legal { padding: 0 1.6rem 1rem; font-size: 0.76rem; color: var(--cc-text-muted); text-align: center; }
#cc-legal a { color: var(--cc-text-muted); text-decoration: underline; }
#cc-toast {
  position: fixed; bottom: 5rem; left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--cc-toast-bg); color: var(--cc-toast-text); padding: 0.6rem 1.2rem;
  border-radius: var(--cc-radius-pill); font-size: var(--cc-font-size-small); font-family: var(--cc-font-ui);
  opacity: 0; transition: opacity 0.3s, transform 0.3s; pointer-events: none; z-index: 99999; white-space: nowrap;
}
#cc-toast.cc-show { opacity: 1; transform: translateX(-50%) translateY(0); }
#cc-reopen-floating {
  position: fixed; bottom: var(--cc-float-bottom); left: var(--cc-float-left); z-index: 99997;
  background: var(--cc-primary); color: var(--cc-primary-text); border: none; border-radius: 50%;
  width: var(--cc-float-size); height: var(--cc-float-size); cursor: pointer;
  display: none; align-items: center; justify-content: center;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25); transition: transform 0.2s;
}
#cc-reopen-floating:hover { transform: scale(1.08); }
#cc-reopen-floating.cc-show { display: flex; }
#cc-domain-error {
  display: none; position: fixed; inset: 0; z-index: 999999;
  background: rgba(0,0,0,0.85); align-items: center; justify-content: center;
}
#cc-domain-error.cc-show { display: flex; }
#cc-domain-error-box {
  background: var(--cc-bg); border-radius: 8px; padding: 2rem 2.5rem;
  max-width: 420px; text-align: center; font-family: var(--cc-font-ui);
}
#cc-domain-error-box h3 { color: var(--cc-error-color); margin-bottom: 0.8rem; font-size: 1.1rem; }
#cc-domain-error-box p  { font-size: var(--cc-font-size-base); color: var(--cc-text-subtle); line-height: 1.6; }
#cc-domain-error-box a  { color: var(--cc-primary); }
@media (max-height: 600px) {
  #cc-modal { max-height: 98vh; }
  #cc-header { padding: 0.8rem 1.2rem; }
  #cc-body { padding: 0.8rem 1.2rem; }
  #cc-footer { padding: 0.6rem 1.2rem 0.8rem; }
  #cc-legal { padding: 0 1.2rem 0.6rem; }
  #cc-intro { margin-bottom: 0.7rem; }
}