/* ============================================
   DSGVO Cookie Consent – v1.2.1
   ============================================ */
:root {
    --dcc-primary: #2563eb;
    --dcc-primary-dark: #1d4ed8;
    --dcc-bg: #ffffff;
    --dcc-overlay-bg: rgba(0,0,0,0.5);
    --dcc-text: #1e293b;
    --dcc-muted: #64748b;
    --dcc-border: #e2e8f0;
    --dcc-radius: 14px;
    --dcc-btn-radius: 8px;
    --dcc-shadow: 0 20px 60px rgba(0,0,0,0.25);
    --dcc-toggle-on: #2563eb;
    --dcc-toggle-off: #cbd5e1;
    --dcc-btn-accept-bg: #2563eb;
    --dcc-btn-accept-txt: #ffffff;
    --dcc-btn-sel-bg: #e2e8f0;
    --dcc-btn-sel-txt: #1e293b;
    --dcc-font-size: 14px;
}

/* Overlay */
.dcc-overlay {
    position: fixed !important;
    inset: 0 !important;
    background: var(--dcc-overlay-bg) !important;
    z-index: 999999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 16px !important;
    animation: dccFadeIn 0.2s ease;
}
.dcc-overlay.dcc-visible {
    display: flex !important;
}
@keyframes dccFadeIn { from{opacity:0} to{opacity:1} }

/* Modal */
.dcc-modal {
    background: var(--dcc-bg, #fff) !important;
    border-radius: var(--dcc-radius, 14px) !important;
    box-shadow: var(--dcc-shadow) !important;
    max-width: 500px !important;
    width: 100% !important;
    max-height: 90vh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    animation: dccSlideUp 0.25s cubic-bezier(0.16,1,0.3,1);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: var(--dcc-font-size, 14px) !important;
    color: var(--dcc-text) !important;
    box-sizing: border-box !important;
}
@keyframes dccSlideUp {
    from { transform: translateY(20px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}
.dcc-modal *, .dcc-modal *::before, .dcc-modal *::after {
    box-sizing: border-box !important;
}

/* Header */
.dcc-modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 20px !important;
    border-bottom: 1px solid var(--dcc-border) !important;
    flex-shrink: 0 !important;
    background: #fff !important;
}
.dcc-header-logo img {
    max-height: 38px !important;
    max-width: 150px !important;
    object-fit: contain !important;
}
#dcc-logo-text {
    font-weight: 700 !important;
    font-size: 15px !important;
    color: var(--dcc-text) !important;
}
.dcc-close-btn {
    background: none !important;
    border: none !important;
    font-size: 18px !important;
    cursor: pointer !important;
    color: var(--dcc-muted) !important;
    padding: 4px 8px !important;
    border-radius: 6px !important;
    line-height: 1 !important;
    transition: background 0.15s !important;
    font-family: inherit !important;
}
.dcc-close-btn:hover { background: #f1f5f9 !important; }

/* Body */
.dcc-modal-body {
    padding: 16px 20px !important;
    overflow-y: auto !important;
    flex: 1 !important;
}
.dcc-modal-body::-webkit-scrollbar { width: 4px; }
.dcc-modal-body::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 2px; }

.dcc-modal-title {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--dcc-text) !important;
    margin: 0 0 8px !important;
    line-height: 1.3 !important;
}
.dcc-modal-text {
    color: var(--dcc-muted) !important;
    font-size: 13px !important;
    line-height: 1.55 !important;
    margin: 0 0 12px !important;
}

/* Links */
.dcc-links {
    display: flex !important;
    gap: 14px !important;
    margin-bottom: 14px !important;
}
.dcc-links a {
    color: var(--dcc-primary) !important;
    font-size: 13px !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    background: none !important;
}
.dcc-links a:hover { text-decoration: underline !important; }

/* Tabs */
.dcc-tabs-nav {
    display: flex !important;
    border-bottom: 2px solid var(--dcc-border) !important;
    margin-bottom: 12px !important;
    background: none !important;
}
.dcc-tab-btn {
    padding: 8px 16px !important;
    border: none !important;
    background: none !important;
    cursor: pointer !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--dcc-muted) !important;
    border-bottom: 2px solid transparent !important;
    margin-bottom: -2px !important;
    transition: color 0.15s !important;
    font-family: inherit !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
}
.dcc-tab-btn.active {
    color: var(--dcc-primary) !important;
    border-bottom-color: var(--dcc-primary) !important;
}
.dcc-tab-pane { display: none !important; }
.dcc-tab-pane.active { display: block !important; }

/* ── TOGGLE SWITCH – einheitlich überall ── */
.dcc-toggle {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    width: 48px !important;
    height: 26px !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
}
.dcc-toggle input {
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    position: absolute !important;
    margin: 0 !important;
}
.dcc-toggle-slider {
    position: absolute !important;
    cursor: pointer !important;
    inset: 0 !important;
    background: var(--dcc-toggle-off, #cbd5e1) !important;
    border-radius: 26px !important;
    transition: background 0.2s !important;
    display: block !important;
    width: 48px !important;
    height: 26px !important;
}
.dcc-toggle-slider::before {
    content: '' !important;
    position: absolute !important;
    height: 20px !important;
    width: 20px !important;
    left: 3px !important;
    top: 3px !important;
    background: white !important;
    border-radius: 50% !important;
    transition: transform 0.2s !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25) !important;
}
.dcc-toggle input:checked + .dcc-toggle-slider {
    background: var(--dcc-toggle-on, var(--dcc-primary)) !important;
}
.dcc-toggle input:checked + .dcc-toggle-slider::before {
    transform: translateX(22px) !important;
}
.dcc-toggle-disabled {
    cursor: not-allowed !important;
}
.dcc-toggle-disabled .dcc-toggle-slider {
    cursor: not-allowed !important;
    opacity: 0.55 !important;
}
.dcc-toggle input:disabled:checked + .dcc-toggle-slider {
    background: #94a3b8 !important;
}

/* Category blocks */
.dcc-cat-block {
    border: 1px solid var(--dcc-border) !important;
    border-radius: 8px !important;
    margin-bottom: 8px !important;
    overflow: hidden !important;
    background: #fff !important;
}
.dcc-cat-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 14px !important;
    background: #f8fafc !important;
    gap: 10px !important;
}
.dcc-cat-left {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    flex: 1 !important;
    min-width: 0 !important;
}
.dcc-cat-toggle-btn {
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    padding: 0 4px !important;
    color: var(--dcc-muted) !important;
    font-size: 10px !important;
    flex-shrink: 0 !important;
    margin-top: 4px !important;
    font-family: inherit !important;
    outline: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
.dcc-chevron {
    display: inline-block !important;
    transition: transform 0.2s !important;
}
.dcc-cat-toggle-btn.open .dcc-chevron {
    transform: rotate(180deg) !important;
}
.dcc-cat-text strong {
    display: block !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--dcc-text) !important;
    margin: 0 !important;
}
.dcc-cat-text small {
    display: block !important;
    font-size: 12px !important;
    color: var(--dcc-muted) !important;
    margin-top: 2px !important;
    line-height: 1.4 !important;
    font-weight: normal !important;
}

/* Services inside category */
.dcc-cat-services { background: #fff !important; }
.dcc-svc-row {
    display: flex !important;
    align-items: center !important;
    padding: 10px 14px 10px 28px !important;
    border-top: 1px solid var(--dcc-border) !important;
    gap: 10px !important;
    background: #fff !important;
}
.dcc-svc-row .dcc-svc-name {
    flex: 1 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--dcc-text) !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
}
.dcc-svc-row .dcc-svc-name span {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Services flat tab */
.dcc-services-flat-item {
    display: flex !important;
    align-items: center !important;
    padding: 10px 4px !important;
    border-bottom: 1px solid var(--dcc-border) !important;
    gap: 10px !important;
    background: #fff !important;
}
.dcc-services-flat-item:last-child { border-bottom: none !important; }
.dcc-services-flat-item .dcc-svc-name {
    flex: 1 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--dcc-text) !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
}
.dcc-services-flat-item .dcc-svc-name span {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.dcc-info-btn {
    background: none !important;
    border: 1.5px solid currentColor !important;
    border-radius: 50% !important;
    width: 16px !important;
    height: 16px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: var(--dcc-muted) !important;
    cursor: pointer !important;
    padding: 0 !important;
    line-height: 14px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
    transition: all 0.15s !important;
    font-style: italic !important;
    font-family: Georgia, serif !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.dcc-info-btn:hover {
    background: var(--dcc-primary) !important;
    border-color: var(--dcc-primary) !important;
    color: #fff !important;
}

/* Info Popup */
.dcc-info-popup {
    position: absolute !important;
    z-index: 9999999 !important;
    background: #1e293b !important;
    color: #fff !important;
    padding: 10px 14px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    max-width: 240px !important;
    width: 240px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
    pointer-events: none !important;
    animation: dccFadeIn 0.15s ease !important;
}
.dcc-info-popup::before {
    content: '' !important;
    position: absolute !important;
    bottom: -6px !important;
    left: 16px !important;
    border: 6px solid transparent !important;
    border-bottom: none !important;
    border-top-color: #1e293b !important;
}
.dcc-info-popup.dcc-info-popup-below::before {
    bottom: auto !important;
    top: -6px !important;
    border-top: none !important;
    border-bottom: 6px solid #1e293b !important;
}

/* Footer */
.dcc-modal-footer {
    display: flex !important;
    gap: 10px !important;
    padding: 14px 20px !important;
    border-top: 1px solid var(--dcc-border) !important;
    background: #f8fafc !important;
    flex-shrink: 0 !important;
}
.dcc-btn {
    flex: 1 !important;
    padding: 11px 16px !important;
    border-radius: var(--dcc-btn-radius, 8px) !important;
    font-size: var(--dcc-font-size, 14px) !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    border: none !important;
    transition: all 0.15s !important;
    font-family: inherit !important;
    text-align: center !important;
    outline: none !important;
    box-shadow: none !important;
}
.dcc-btn-primary {
    background: var(--dcc-btn-accept-bg, var(--dcc-primary)) !important;
    color: var(--dcc-btn-accept-txt, #fff) !important;
}
.dcc-btn-primary:hover {
    filter: brightness(0.92) !important;
}
.dcc-btn-secondary {
    background: var(--dcc-btn-sel-bg, #e2e8f0) !important;
    color: var(--dcc-btn-sel-txt, var(--dcc-text)) !important;
}
.dcc-btn-secondary:hover { filter: brightness(0.94) !important; }

/* Powered by */
.dcc-powered-by {
    text-align: center !important;
    font-size: 11px !important;
    color: #94a3b8 !important;
    padding: 8px 20px 12px !important;
    background: #f8fafc !important;
    flex-shrink: 0 !important;
    font-weight: normal !important;
}
.dcc-powered-by strong { color: var(--dcc-muted) !important; }

/* Reopen */
.dcc-reopen-btn {
    position: fixed !important;
    bottom: 20px !important;
    left: 20px !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background: var(--dcc-primary) !important;
    color: white !important;
    font-size: 20px !important;
    border: none !important;
    cursor: pointer !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important;
    z-index: 99998 !important;
    transition: transform 0.15s !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    overflow: hidden !important;
}
.dcc-reopen-btn.dcc-reopen-visible {
    display: flex !important;
}
.dcc-reopen-btn:hover { transform: scale(1.1) !important; }
#dcc-reopen-img {
    display: none !important;
    width: 60% !important;
    height: 60% !important;
    object-fit: contain !important;
}
#dcc-reopen-img.dcc-img-active {
    display: block !important;
}
#dcc-reopen-emoji {
    line-height: 1 !important;
}

@media (max-width: 480px) {
    .dcc-modal-footer { flex-direction: column !important; }
    .dcc-btn { flex: none !important; width: 100% !important; }
}
