:root {
    /* Farben */
    --sb-primary: #3b82f6;
    --sb-primary-hover: #2563eb;
    --sb-secondary: #1e40af;
    --sb-success: #22c55e;
    --sb-text: #1e293b;
    --sb-text-muted: #64748b;
    --sb-background: #ffffff;
    --sb-border: #e2e8f0;
    --sb-results-bg: #1e40af;
    --sb-results-text: #ffffff;
    --sb-admin-primary: #3b82f6;
    --sb-admin-secondary: #1e40af;
    /* Größen */
    --sb-max-width: 800px;
    --sb-font-size-base: 16px;
    --sb-font-size-title: 30px;
    --sb-font-size-subtitle: 16px;
    --sb-font-size-option: 16px;
    --sb-font-size-button: 16px;
    --sb-padding-wrapper: 34px;
    --sb-border-radius: 12px;
    --sb-option-padding: 34px;
    --sb-icon-size: 40px;
}

/* Größen-Überschreibungen - mit !important für höhere Priorität */
.sb-calculator-wrapper {
    max-width: 800px !important;
    padding: 34px !important;
    font-size: 16px !important;
    color: var(--sb-text) !important;
}

.sb-step-content h2 {
    font-size: 30px !important;
}

.sb-subtitle {
    font-size: 16px !important;
    color: var(--sb-text-muted) !important;
}

.sb-option {
    padding: 34px calc(34px / 2) !important;
    border-radius: 12px !important;
    background: var(--sb-background) !important;
    border-color: var(--sb-border) !important;
}

.sb-option-label {
    font-size: 16px !important;
    color: var(--sb-text) !important;
}

.sb-option-icon {
    width: 40px !important;
    height: 40px !important;
    color: var(--sb-primary) !important;
}

.sb-option-icon svg {
    width: 40px !important;
    height: 40px !important;
}

.sb-submit-btn,
.sb-btn {
    font-size: 16px !important;
    border-radius: calc(12px / 1.5) !important;
    padding: calc(16px * 0.875) calc(16px * 1.5) !important;
}

.sb-results-card {
    border-radius: 12px !important;
    background: var(--sb-results-bg) !important;
}

.sb-contact-section {
    border-radius: 12px !important;
}

.sb-form-field {
    font-size: 16px !important;
    border-radius: calc(12px / 1.5) !important;
    padding: calc(16px * 0.75) calc(16px * 1) !important;
}

.sb-step-number {
    width: calc(16px * 2) !important;
    height: calc(16px * 2) !important;
    font-size: calc(16px * 0.875) !important;
}

.sb-step-label {
    font-size: calc(16px * 0.875) !important;
}

.sb-btn-back {
    font-size: 16px !important;
    padding: calc(16px * 0.75) calc(16px * 1.25) !important;
}

.sb-progress-steps {
    margin-bottom: calc(34px * 1.5) !important;
}

.sb-savings-amount {
    font-size: calc(30px * 1.2) !important;
}

.sb-savings-label {
    font-size: 16px !important;
}

/* Ergebnis-Karte Größen */
.sb-results-card {
    padding: 34px !important;
}

.sb-results-card h3 {
    font-size: calc(30px * 0.8) !important;
}

.sb-results-main .sb-savings-amount {
    font-size: calc(30px * 1.4) !important;
}

.sb-results-details {
    gap: 34px !important;
}

/* Kontaktformular Größen */
.sb-contact-section {
    padding: 34px !important;
}

.sb-contact-section h2 {
    font-size: calc(30px * 0.9) !important;
    margin-bottom: calc(34px * 0.75) !important;
}

.sb-form-row {
    gap: calc(34px * 0.5) !important;
    margin-bottom: calc(34px * 0.5) !important;
}

.sb-form-group label {
    font-size: calc(16px * 0.875) !important;
}

/* Benefits Liste */
.sb-benefits {
    font-size: 16px !important;
}

.sb-benefits li {
    padding: calc(16px * 0.5) 0 !important;
}

/* Options Grid Gap */
.sb-options-grid,
.sb-options-grid-2,
.sb-options-grid-5,
.sb-options-grid-6 {
    gap: calc(34px * 0.5) !important;
}

/* Dynamic Styles Override */
.sb-step.active .sb-step-number,
.sb-step.completed .sb-step-number {
    background: var(--sb-primary);
    border-color: var(--sb-primary);
}

.sb-step.active .sb-step-label {
    color: var(--sb-primary);
}

.sb-option:hover {
    border-color: var(--sb-primary);
    box-shadow: 0 2px 4px rgba(255, 0, 0, 0.1);
}

.sb-option.active {
    background: color-mix(in srgb, var(--sb-primary) 5%, white);
    border-color: var(--sb-primary);
}

.savings-text {
    color: var(--sb-success);
}

.sb-submit-btn {
    background: var(--sb-primary);
}

.sb-submit-btn:hover:not(:disabled) {
    background: var(--sb-primary-hover);
    box-shadow: 0 2px 4px rgba(255, 0, 0, 0.2);
}

.sb-form-field:focus {
    border-color: var(--sb-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--sb-primary) 10%, transparent);
}

.sb-benefits li::before {
    color: var(--sb-primary);
}

.sb-info-message {
    background: color-mix(in srgb, var(--sb-primary) 5%, white);
    border: 1px solid var(--sb-primary);
    border-radius: var(--sb-border-radius);
}

.sb-info-message h2 {
    color: var(--sb-primary);
}

.sb-btn-reset {
    background: var(--sb-primary);
}

.sb-btn-reset:hover {
    background: var(--sb-primary-hover);
}

.sb-step-number {
    border-color: var(--sb-border);
    color: var(--sb-text-muted);
}

.sb-step-label {
    color: var(--sb-text-muted);
}

.sb-savings-label {
    color: #9ca3af;
}

.sb-savings-value {
    color: var(--sb-results-text);
}

.sb-contact-section {
    background: var(--sb-background);
}

.sb-contact-section h2 {
    color: var(--sb-text);
}

.sb-form-field {
    border-color: var(--sb-border);
}

.sb-form-note {
    color: var(--sb-text-muted);
}

/* Admin Styles */
.admin-header {
    background: linear-gradient(135deg, var(--sb-admin-primary) 0%, var(--sb-admin-secondary) 100%);
}

.modern-btn-primary {
    background: linear-gradient(135deg, var(--sb-admin-primary) 0%, var(--sb-admin-secondary) 100%);
}

.modern-input:focus, .modern-select:focus {
    border-color: var(--sb-admin-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sb-admin-primary) 10%, transparent);
}

.toggle-switch input:checked + .toggle-slider {
    background: var(--sb-admin-primary);
}

.smtp-toggle-section, .smtp-auth-section {
    border-left: 4px solid var(--sb-admin-primary);
}

.info-icon {
    background: linear-gradient(135deg, var(--sb-admin-primary) 0%, var(--sb-admin-secondary) 100%);
}

.preset-btn:hover {
    border-color: var(--sb-admin-primary);
}