/* ═══════════════════════════════════════════════════════════════════
 * fahrtkosten-rechner.css · Chatbot-Optik (übernommen aus der HTML-
 * Vorlage, mit fkr-Prefix damit keine Plattform-Klassen kollidieren).
 * ═══════════════════════════════════════════════════════════════════ */

.fkr-shell{
  --fkr-navy:#0a2540; --fkr-navy-soft:#12385c;
  --fkr-red:#b63b34; --fkr-red-dark:#8f2d28;
  --fkr-forest:#2f5f4a; --fkr-sage:#dfe9e1;
  --fkr-lake:#d9e8f1; --fkr-cream:#f8f6f0;
  --fkr-paper:#fff; --fkr-ink:#0f172a; --fkr-muted:#64748b;
  --fkr-line:rgba(10,37,64,.1);
  --fkr-shadow:0 24px 70px rgba(10,37,64,.18);
  font-family:Inter,system-ui,sans-serif;
  width:min(100%,560px);
  margin:0 auto;
  border-radius:40px;
  padding:10px;
  background:linear-gradient(145deg,rgba(255,255,255,.7),rgba(255,255,255,.28));
  box-shadow:var(--fkr-shadow);
  backdrop-filter:blur(24px);
}

.fkr-chat-app{
  height:min(760px,calc(100vh - 200px));
  min-height:620px;
  display:grid;
  grid-template-rows:auto 1fr auto;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.72);
  border-radius:32px;
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(250,252,252,.93)),
             radial-gradient(circle at 20% 0%,rgba(217,232,241,.52),transparent 34%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75);
}

.fkr-chat-header{
  display:flex;align-items:center;gap:13px;
  padding:16px 16px 14px;
  border-bottom:1px solid var(--fkr-line);
  background:rgba(255,255,255,.76);
  backdrop-filter:blur(22px);
}
.fkr-logo{
  width:48px;height:48px;flex:0 0 48px;
  display:grid;place-items:center;
  border-radius:16px;color:#fff;
  background:linear-gradient(145deg,var(--fkr-red),var(--fkr-navy));
  box-shadow:0 12px 28px rgba(10,37,64,.24);
  font-weight:800;
}
.fkr-header-copy{min-width:0;flex:1}
.fkr-header-copy strong{display:block;color:var(--fkr-navy);font-size:15px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fkr-header-copy span{display:flex;align-items:center;gap:7px;margin-top:3px;
  color:var(--fkr-muted);font-size:12px;font-weight:600}
.fkr-status-dot{
  width:8px;height:8px;border-radius:50%;
  background:#25c06d;box-shadow:0 0 0 6px rgba(37,192,109,.14);
  animation:fkrPulse 1.8s ease-in-out infinite;
}
.fkr-header-action{
  width:42px;height:42px;flex:0 0 42px;
  border:0;border-radius:14px;
  background:rgba(10,37,64,.08);color:var(--fkr-navy);
  font-size:18px;cursor:pointer;
  transition:background .15s;
}
.fkr-header-action:hover{background:rgba(10,37,64,.16)}
@keyframes fkrPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.85)}}

.fkr-chat-window{
  padding:18px 16px 8px;
  overflow-y:auto;overflow-x:hidden;
  display:flex;flex-direction:column;gap:12px;
  scroll-behavior:smooth;
}
.fkr-chat-window::-webkit-scrollbar{width:6px}
.fkr-chat-window::-webkit-scrollbar-thumb{background:rgba(10,37,64,.18);border-radius:3px}

.fkr-day-pill{
  align-self:center;
  padding:4px 12px;border-radius:999px;
  background:rgba(10,37,64,.06);
  color:var(--fkr-muted);font-size:11px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;
  margin-bottom:6px;
}

.fkr-message-row{display:flex;gap:9px;align-items:flex-end;animation:fkrFade .3s ease both}
.fkr-message-row.user{justify-content:flex-end}
.fkr-message-row.user .fkr-bubble{
  background:linear-gradient(145deg,var(--fkr-navy),var(--fkr-navy-soft));
  color:#fff;border-bottom-right-radius:6px;
}
.fkr-avatar{
  width:32px;height:32px;flex:0 0 32px;
  display:grid;place-items:center;
  border-radius:10px;color:#fff;font-size:11px;font-weight:800;
  background:linear-gradient(145deg,var(--fkr-red),var(--fkr-navy));
}
.fkr-bubble-wrap{max-width:78%;min-width:0}
.fkr-bubble{
  position:relative;
  padding:10px 14px 22px;
  border-radius:18px;border-bottom-left-radius:6px;
  background:var(--fkr-paper);
  border:1px solid var(--fkr-line);
  font-size:14px;line-height:1.5;
  word-wrap:break-word;
  white-space:pre-line;
}
.fkr-time{
  position:absolute;bottom:4px;right:10px;
  font-size:10px;color:rgba(0,0,0,.4);font-weight:500;
}
.fkr-message-row.user .fkr-time{color:rgba(255,255,255,.65)}
@keyframes fkrFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

.fkr-typing{display:flex;gap:9px;align-items:flex-end;animation:fkrFade .3s ease both}
.fkr-typing-bubble{
  padding:14px 16px;
  border-radius:18px;border-bottom-left-radius:6px;
  background:var(--fkr-paper);border:1px solid var(--fkr-line);
  display:flex;gap:4px;
}
.fkr-typing-bubble i{
  display:block;width:6px;height:6px;border-radius:50%;
  background:rgba(10,37,64,.4);
  animation:fkrTyping 1.2s ease-in-out infinite;
}
.fkr-typing-bubble i:nth-child(2){animation-delay:.15s}
.fkr-typing-bubble i:nth-child(3){animation-delay:.3s}
@keyframes fkrTyping{0%,80%,100%{transform:scale(.8);opacity:.4}40%{transform:scale(1);opacity:1}}

.fkr-choices{
  display:flex;flex-wrap:wrap;gap:6px;
  margin-left:41px;animation:fkrFade .3s ease both;
}
.fkr-choice{
  padding:9px 14px;border-radius:14px;
  background:#fff;border:1px solid var(--fkr-line);
  color:var(--fkr-navy);font-size:13px;font-weight:600;
  cursor:pointer;
  transition:transform .12s,background .15s,box-shadow .15s;
}
.fkr-choice:hover{background:var(--fkr-lake);transform:translateY(-1px);box-shadow:0 4px 12px rgba(10,37,64,.1)}
.fkr-choice:disabled{opacity:.5;cursor:not-allowed;transform:none}
.fkr-choice.fkr-yes{background:var(--fkr-sage);border-color:var(--fkr-forest);color:var(--fkr-forest)}
.fkr-choice.fkr-yes:hover{background:#cfe2d3}
.fkr-choice.fkr-no{background:#fdecea;border-color:var(--fkr-red);color:var(--fkr-red-dark)}
.fkr-choice.fkr-no:hover{background:#f9d6d3}

.fkr-route-card,.fkr-result-card,.fkr-pdf-card,.fkr-loading-card{
  margin-left:41px;
  padding:16px;border-radius:18px;
  background:var(--fkr-paper);
  border:1px solid var(--fkr-line);
  animation:fkrFade .3s ease both;
}
.fkr-route-card h3,.fkr-result-card h3,.fkr-pdf-card h3{
  margin:0 0 6px;font-size:15px;color:var(--fkr-navy);font-weight:700;
}
.fkr-route-card p,.fkr-pdf-card p{margin:0 0 12px;font-size:13px;color:var(--fkr-muted);line-height:1.5}
.fkr-cost-list{display:flex;flex-direction:column;gap:8px}
.fkr-cost-line{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:6px 0;border-bottom:1px dashed var(--fkr-line);
  font-size:13px;
}
.fkr-cost-line:last-child{border-bottom:none}
.fkr-cost-line span{color:var(--fkr-muted)}
.fkr-cost-line strong{color:var(--fkr-navy);font-weight:600}

.fkr-result-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.fkr-result-top span{display:block;font-size:11px;color:var(--fkr-muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.fkr-result-total{font-size:26px;font-weight:800;color:var(--fkr-navy);font-family:"Playfair Display",Georgia,serif}
.fkr-result-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:8px;
  margin-bottom:12px;padding:10px;
  background:rgba(217,232,241,.32);border-radius:12px;
}
.fkr-metric{display:flex;flex-direction:column;gap:1px}
.fkr-metric small{color:var(--fkr-muted);font-size:10px;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.fkr-metric strong{color:var(--fkr-navy);font-size:13px;font-weight:600}

.fkr-recommendation{
  margin-top:14px;padding:10px 12px;border-radius:12px;
  background:linear-gradient(135deg,rgba(47,95,74,.08),rgba(217,232,241,.4));
  border-left:3px solid var(--fkr-forest);
  font-size:12px;line-height:1.5;color:var(--fkr-navy);
}

.fkr-pdf-card{
  background:linear-gradient(160deg,var(--fkr-navy),var(--fkr-navy-soft));
  color:#fff;border:none;
}
.fkr-pdf-card h3,.fkr-pdf-card strong{color:#fff}
.fkr-pdf-card p{color:rgba(255,255,255,.78)}
.fkr-pdf-price{
  font-size:28px;font-weight:800;font-family:"Playfair Display",Georgia,serif;
  margin:8px 0;color:#ffcc00;
}
.fkr-pdf-button{
  display:inline-block;padding:11px 22px;border-radius:14px;
  background:#ffcc00;color:var(--fkr-navy);
  border:none;font-weight:700;font-size:14px;cursor:pointer;
  transition:transform .12s,filter .15s;
}
.fkr-pdf-button:hover{filter:brightness(.95);transform:translateY(-1px)}
.fkr-pdf-info{font-size:11px;color:rgba(255,255,255,.65);margin-top:10px;line-height:1.4}

.fkr-loading-card{display:flex;flex-direction:column;gap:8px}
.fkr-progress{
  height:6px;border-radius:3px;background:rgba(10,37,64,.08);overflow:hidden;position:relative;
}
.fkr-progress span{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--fkr-red),var(--fkr-navy));
  animation:fkrProg 1.4s ease-out forwards;
}
@keyframes fkrProg{to{width:100%}}
.fkr-loading-card strong{color:var(--fkr-navy);font-size:13px;font-weight:600}

.fkr-composer{
  display:flex;gap:10px;padding:12px;
  border-top:1px solid var(--fkr-line);
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(22px);
}
.fkr-composer input{
  flex:1;height:46px;
  padding:0 16px;border-radius:18px;
  border:1px solid var(--fkr-line);
  background:#fff;
  font-size:14px;color:var(--fkr-ink);
  font-family:inherit;
}
.fkr-composer input:focus{outline:none;border-color:var(--fkr-navy);box-shadow:0 0 0 3px rgba(10,37,64,.1)}
.fkr-composer input:disabled{background:#f1f5f9;color:#94a3b8}
.fkr-send{
  width:46px;height:46px;flex:0 0 46px;
  border:0;border-radius:16px;
  background:linear-gradient(145deg,var(--fkr-navy),var(--fkr-navy-soft));
  color:#fff;font-size:18px;cursor:pointer;
  transition:transform .12s,filter .15s;
}
.fkr-send:hover{filter:brightness(1.1);transform:translateY(-1px)}
.fkr-send:disabled{opacity:.5;cursor:not-allowed;transform:none}

/* Modal für Bestellformular */
.fkr-modal-bg{
  position:fixed;inset:0;z-index:100;
  background:rgba(10,37,64,.65);
  backdrop-filter:blur(6px);
  display:none;align-items:center;justify-content:center;
  padding:20px;
}
.fkr-modal-bg.fkr-open{display:flex;animation:fkrFade .25s ease both}
.fkr-modal{
  background:#fff;border-radius:20px;
  max-width:440px;width:100%;
  padding:24px;
  box-shadow:0 30px 80px rgba(10,37,64,.4);
}
.fkr-modal h2{margin:0 0 6px;font-family:"Playfair Display",Georgia,serif;color:#0a2540;font-size:24px}
.fkr-modal-sub{color:#64748b;font-size:13px;margin:0 0 16px;line-height:1.5}
.fkr-modal label{display:block;font-size:13px;font-weight:600;color:#0a2540;margin-bottom:4px}
.fkr-modal input{
  width:100%;padding:10px 12px;border-radius:10px;border:1px solid rgba(10,37,64,.18);
  font-size:14px;margin-bottom:12px;font-family:inherit;
}
.fkr-modal input:focus{outline:none;border-color:#0a2540;box-shadow:0 0 0 3px rgba(10,37,64,.1)}
.fkr-modal-actions{display:flex;gap:10px;margin-top:8px}
.fkr-modal-actions button{flex:1;padding:11px;border-radius:12px;font-weight:700;font-size:14px;cursor:pointer;border:none;font-family:inherit}
.fkr-btn-pay{background:#ffcc00;color:#0a2540}
.fkr-btn-pay:hover{filter:brightness(.95)}
.fkr-btn-cancel{background:#f1f5f9;color:#475569}
.fkr-btn-cancel:hover{background:#e2e8f0}
.fkr-modal-error{color:#b63b34;font-size:12px;margin-bottom:10px}
.fkr-modal-hint{font-size:11px;color:#64748b;line-height:1.5;margin-top:14px;padding:10px;background:#f8f6f0;border-radius:10px}

@media (max-width:640px){
  .fkr-chat-app{min-height:560px;height:min(680px,calc(100vh - 220px))}
  .fkr-bubble-wrap{max-width:84%}
  .fkr-choices,.fkr-route-card,.fkr-result-card,.fkr-pdf-card,.fkr-loading-card{margin-left:0}
  .fkr-result-grid{grid-template-columns:1fr}
}
