/**
 * Fahrschule Kostenrechner – Leads, WhatsApp, PDF, CTA, Stats (v2.0.0)
 *
 * Baut auf calculator.css und dessen CSS-Custom-Properties auf.
 * Keine !important-Regeln, saubere BEM-Benennung.
 *
 * @package FahrschuleKostenrechner
 */

/* ─────────────────────────────────────────────────────────────────
   Lokale Design-Token (Fallbacks, wenn Elementor-Kit fehlt)
   ───────────────────────────────────────────────────────────────── */
:root {
    --fkr-primary:          var( --e-global-color-primary, #f7a600 );
    --fkr-primary-hover:    #d9920a;
    --fkr-whatsapp:         #25d366;
    --fkr-whatsapp-hover:   #1ebe5d;
    --fkr-radius:           10px;
    --fkr-shadow-sm:        0 2px 8px rgba(0,0,0,.08);
    --fkr-shadow-md:        0 4px 20px rgba(0,0,0,.10);
    --fkr-font:             var( --e-global-typography-text-font-family, system-ui, sans-serif );
    --fkr-text:             #1a1a2e;
    --fkr-muted:            #64748b;
    --fkr-border:           #e2e8f0;
    --fkr-success:          #16a34a;
    --fkr-error:            #dc2626;
    --fkr-lead-bg:          #f0f9ff;
    --fkr-lead-border:      #bae6fd;
    --fkr-input-focus:      #3b82f6;
}

/* ─────────────────────────────────────────────────────────────────
   Aktions-Leiste  (.fkr-action-bar)
   ───────────────────────────────────────────────────────────────── */
.fkr-action-bar {
    display:         flex;
    flex-wrap:       wrap;
    gap:             10px;
    margin-top:      18px;
    padding-top:     16px;
    border-top:      1px solid var( --fkr-border );
}

/* Basis-Button */
.fkr-action-btn {
    display:         inline-flex;
    align-items:     center;
    gap:             8px;
    padding:         10px 20px;
    border:          none;
    border-radius:   var( --fkr-radius );
    font-family:     var( --fkr-font );
    font-size:       .9rem;
    font-weight:     600;
    cursor:          pointer;
    text-decoration: none;
    transition:      background .2s, transform .15s, box-shadow .2s;
    box-shadow:      var( --fkr-shadow-sm );
}

.fkr-action-btn:focus-visible {
    outline:         3px solid var( --fkr-primary );
    outline-offset:  3px;
}

.fkr-action-btn:active {
    transform:       scale( .97 );
}

/* PDF */
.fkr-action-btn--pdf {
    background: var( --fkr-primary );
    color:      #fff;
}
.fkr-action-btn--pdf:hover {
    background: var( --fkr-primary-hover );
    box-shadow: var( --fkr-shadow-md );
}

/* WhatsApp */
.fkr-action-btn--whatsapp {
    background: var( --fkr-whatsapp );
    color:      #fff;
}
.fkr-action-btn--whatsapp:hover {
    background: var( --fkr-whatsapp-hover );
    box-shadow: 0 4px 16px rgba( 37, 211, 102, .35 );
}

/* Print-Fallback */
.fkr-action-btn--print {
    background: transparent;
    color:      var( --fkr-muted );
    border:     1px solid var( --fkr-border );
    box-shadow: none;
}
.fkr-action-btn--print:hover {
    background: #f8fafc;
    color:      var( --fkr-text );
}

/* Icon in Button */
.fkr-action-btn svg {
    flex-shrink: 0;
}

/* ─────────────────────────────────────────────────────────────────
   CTA-Block  (.fkr-cta-block)
   ───────────────────────────────────────────────────────────────── */
.fkr-cta-block {
    margin-top:      20px;
    padding:         20px 24px;
    background:      linear-gradient( 135deg, #fff8e1 0%, #fffbf0 100% );
    border:          1px solid #fde68a;
    border-radius:   var( --fkr-radius );
    text-align:      center;
}

.fkr-cta-block__heading {
    margin:          0 0 14px;
    font-size:       1.1rem;
    font-weight:     700;
    color:           var( --fkr-text );
    line-height:     1.4;
}

.fkr-cta-block__btn {
    display:         inline-block;
    padding:         13px 32px;
    background:      var( --fkr-primary );
    color:           #fff;
    font-family:     var( --fkr-font );
    font-size:       1rem;
    font-weight:     700;
    text-decoration: none;
    border-radius:   var( --fkr-radius );
    box-shadow:      0 4px 14px rgba( 247, 166, 0, .4 );
    transition:      background .2s, box-shadow .2s, transform .15s;
}

.fkr-cta-block__btn:hover {
    background: var( --fkr-primary-hover );
    box-shadow: 0 6px 20px rgba( 247, 166, 0, .5 );
    transform:  translateY( -1px );
    color:      #fff;
}

.fkr-cta-block__btn:active {
    transform: scale( .97 );
}

/* ─────────────────────────────────────────────────────────────────
   Lead-Sektion  (.fkr-lead-section)
   ───────────────────────────────────────────────────────────────── */
.fkr-lead-section {
    margin-top:      24px;
    transition:      opacity .3s;
}

.fkr-lead-section--sent {
    opacity: .6;
    pointer-events: none;
}

.fkr-lead-form-wrap {
    background:      var( --fkr-lead-bg );
    border:          1px solid var( --fkr-lead-border );
    border-radius:   var( --fkr-radius );
    padding:         24px;
}

.fkr-lead__title {
    margin:          0 0 6px;
    font-size:       1.15rem;
    font-weight:     700;
    color:           var( --fkr-text );
}

.fkr-lead__subtitle {
    margin:          0 0 20px;
    font-size:       .9rem;
    color:           var( --fkr-muted );
}

/* Zeile mit zwei Feldern nebeneinander */
.fkr-lead-form__row {
    display:         flex;
    gap:             14px;
    margin-bottom:   14px;
}

@media ( max-width: 540px ) {
    .fkr-lead-form__row {
        flex-direction: column;
    }
}

.fkr-lead-form__group {
    display:         flex;
    flex-direction:  column;
    flex:            1;
    margin-bottom:   14px;
}

.fkr-lead-form__row .fkr-lead-form__group {
    margin-bottom: 0;
}

.fkr-lead-form__label {
    display:         block;
    margin-bottom:   5px;
    font-size:       .85rem;
    font-weight:     600;
    color:           var( --fkr-text );
}

.fkr-lead-form__label span[aria-hidden] {
    color: var( --fkr-error );
    margin-left: 2px;
}

/* Inputs */
.fkr-lead-form__input,
.fkr-lead-form__textarea {
    width:           100%;
    padding:         10px 14px;
    border:          1.5px solid var( --fkr-border );
    border-radius:   8px;
    font-family:     var( --fkr-font );
    font-size:       .95rem;
    color:           var( --fkr-text );
    background:      #fff;
    transition:      border-color .2s, box-shadow .2s;
    -webkit-appearance: none;
}

.fkr-lead-form__input:focus,
.fkr-lead-form__textarea:focus {
    outline:         none;
    border-color:    var( --fkr-input-focus );
    box-shadow:      0 0 0 3px rgba( 59, 130, 246, .15 );
}

.fkr-lead-form__input--error {
    border-color:    var( --fkr-error );
}

.fkr-lead-form__input--error:focus {
    border-color:    var( --fkr-error );
    box-shadow:      0 0 0 3px rgba( 220, 38, 38, .12 );
}

.fkr-lead-form__textarea {
    resize:          vertical;
    min-height:      80px;
}

/* Datenschutz-Checkbox */
.fkr-lead-form__privacy {
    display:         flex;
    align-items:     flex-start;
    gap:             10px;
    margin-bottom:   18px;
    font-size:       .85rem;
    color:           var( --fkr-muted );
    cursor:          pointer;
    line-height:     1.5;
}

.fkr-lead-form__privacy-chk {
    flex-shrink:     0;
    margin-top:      2px;
    width:           16px;
    height:          16px;
    accent-color:    var( --fkr-primary );
    cursor:          pointer;
}

.fkr-lead-form__privacy a {
    color:           var( --fkr-primary );
    text-decoration: underline;
}

/* Submit-Button */
.fkr-lead-form__submit {
    width:           100%;
    padding:         13px 24px;
    background:      var( --fkr-primary );
    color:           #fff;
    border:          none;
    border-radius:   var( --fkr-radius );
    font-family:     var( --fkr-font );
    font-size:       1rem;
    font-weight:     700;
    cursor:          pointer;
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    transition:      background .2s, box-shadow .2s, transform .15s;
    box-shadow:      0 4px 14px rgba( 247, 166, 0, .3 );
}

.fkr-lead-form__submit:hover:not( :disabled ) {
    background: var( --fkr-primary-hover );
    box-shadow: 0 6px 20px rgba( 247, 166, 0, .45 );
    transform:  translateY( -1px );
}

.fkr-lead-form__submit:active {
    transform: scale( .98 );
}

.fkr-lead-form__submit:disabled {
    opacity:    .65;
    cursor:     not-allowed;
}

/* Feedback-Box */
.fkr-lead-form__feedback {
    margin-bottom:   14px;
    padding:         12px 16px;
    border-radius:   8px;
    font-size:       .9rem;
    line-height:     1.5;
}

.fkr-lead-form__feedback--success {
    background:      #dcfce7;
    color:           var( --fkr-success );
    border:          1px solid #86efac;
}

.fkr-lead-form__feedback--error {
    background:      #fee2e2;
    color:           var( --fkr-error );
    border:          1px solid #fca5a5;
}

/* ─────────────────────────────────────────────────────────────────
   Admin: Statistik-Dashboard
   ───────────────────────────────────────────────────────────────── */
.fkr-kpi-grid {
    display:         grid;
    grid-template-columns: repeat( auto-fit, minmax( 200px, 1fr ) );
    gap:             16px;
    margin-top:      20px;
}

.fkr-kpi-card {
    background:      #fff;
    border:          1px solid var( --fkr-border );
    border-radius:   var( --fkr-radius );
    padding:         24px 20px;
    text-align:      center;
    box-shadow:      var( --fkr-shadow-sm );
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    gap:             8px;
}

.fkr-kpi-card__icon {
    font-size:       2rem;
}

.fkr-kpi-card__value {
    font-size:       1.8rem;
    font-weight:     700;
    color:           var( --fkr-text );
    line-height:     1;
}

.fkr-kpi-card__label {
    font-size:       .82rem;
    color:           var( --fkr-muted );
}

.fkr-stats-card {
    background:      #fff;
    border:          1px solid var( --fkr-border );
    border-radius:   var( --fkr-radius );
    padding:         20px 24px;
    box-shadow:      var( --fkr-shadow-sm );
}

.fkr-stats-card--danger {
    border-color:    #fca5a5;
    background:      #fff5f5;
}

.fkr-stats-filter {
    display:         flex;
    flex-wrap:       wrap;
    gap:             8px;
    margin-bottom:   4px;
}

.fkr-stats-filter__btn--active {
    background:      var( --fkr-primary ) !important;
    border-color:    var( --fkr-primary ) !important;
    color:           #fff !important;
}

/* Fortschrittsbalken */
.fkr-progress {
    display:         flex;
    align-items:     center;
    gap:             8px;
    min-width:       120px;
}

.fkr-progress__bar {
    height:          8px;
    background:      var( --fkr-primary );
    border-radius:   4px;
    flex-shrink:     0;
    transition:      width .4s;
}

/* Leads-Tabelle */
.fkr-leads-table .fkr-lead-msg {
    cursor:          help;
    font-size:       .85rem;
    color:           var( --fkr-muted );
}

.fkr-count-badge {
    display:         inline-block;
    background:      var( --fkr-primary );
    color:           #fff;
    border-radius:   99px;
    padding:         1px 10px;
    font-size:       .75rem;
    font-weight:     700;
    vertical-align:  middle;
    margin-left:     6px;
}