.sim-chatInputWrapper-demo{--cycle:8s;--card:#1f2937;--line:rgba(255, 255, 255, 0.14);--txt:#f9fafb;--muted:#9ca3af;--ok-soft:rgba(16, 185, 129, 0.18);min-height:747px;padding:24px;display:grid;justify-items:center;align-content:start;font-family:"Sora", "Segoe UI", sans-serif;color:var(--txt);background:transparent;}
.sim-chat-card{width:min(860px, 100%);background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 20px 40px rgba(0, 0, 0, 0.35);}
.sim-main-title{margin:0 0 14px;}
.sim-h2-steps{margin:0;font-size:clamp(22px, 3vw, 34px);font-weight:800;letter-spacing:-0.02em;color:#f8fafc;position:relative;line-height:1.05;height:1.05em;overflow:hidden;}
.sim-h2-step{position:absolute;inset:0;opacity:0;transform:translateY(6px);white-space:nowrap;}
.sim-h2-step-1{animation:titlePhase1 var(--cycle) linear infinite;}
.sim-h2-step-2{animation:titlePhase2 var(--cycle) linear infinite;}
.sim-h2-step-3{animation:titlePhase3 var(--cycle) linear infinite;}
.sim-main-subtitle{margin:10px 0 0;font-size:14px;color:#a5b4c7;line-height:1.4;}
.sim-title{font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:#7dd3fc;}
.sim-title-cta{margin-bottom:12px;display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;}
.sim-start-btn{display:inline-block;padding:8px 16px;font-size:13px;font-weight:700;line-height:1.1;text-decoration:none;color:#27221B !important;border-color:#FFFFFF !important;border-style:solid;border-width:2px !important;background-image:initial;background-color:#fdc662;border-radius:100px;transition:transform 0.2s ease, box-shadow 0.2s ease;}
.sim-start-btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(253, 198, 98, 0.35);}
.sim-select{position:relative;margin-bottom:14px;}
.sim-select-trigger{position:relative;border:1px solid var(--line);background:#0f172a;border-radius:12px;min-height:48px;display:flex;align-items:center;padding:0 14px;overflow:hidden;}
.sim-default-text, .sim-picked-text{font-size:14px;line-height:1;}
.sim-default-text{color:var(--muted);animation:simDefaultText var(--cycle) linear infinite;}
.sim-picked-text{position:absolute;left:14px;color:#d1fae5;font-weight:700;opacity:0;animation:simPickedText var(--cycle) linear infinite;}
.sim-chevron{margin-left:auto;width:10px;height:10px;border-right:2px solid #cbd5e1;border-bottom:2px solid #cbd5e1;transform:rotate(45deg);animation:simChevron var(--cycle) linear infinite;}
.sim-select-menu{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:10;list-style:none;margin:0;padding:6px;border:1px solid var(--line);background:#0f172a;border-radius:12px;max-height:0;opacity:0;overflow:hidden;transform:translateY(-6px);animation:simMenuFlow var(--cycle) linear infinite;}
.sim-select-menu li{padding:9px 10px;border-radius:8px;color:#cbd5e1;font-size:14px;}
.sim-target{animation:simTargetPick var(--cycle) linear infinite;}
.sim-output{margin-top:12px;}
.sim-lines{background:rgba(0, 0, 0, 0.22);border-radius:12px;max-height:0;padding:0;margin:0;border:0;overflow:hidden;opacity:0;transform:translateY(8px);animation:simLinesCycle var(--cycle) linear infinite;}
.sim-lines p{margin:0 0 6px;font-size:13px;color:#e5e7eb;}
.sim-lines p:last-child{margin-bottom:0;}
.sim-devis-final{background:var(--ok-soft);border-radius:12px;max-height:0;padding:0;border:0;overflow:hidden;opacity:0;transform:translateY(10px);animation:simFinalCycle var(--cycle) linear infinite;}
.sim-final-head{font-size:12px;font-weight:800;letter-spacing:0.08em;color:#a7f3d0;margin-bottom:8px;}
.sim-row{display:grid;grid-template-columns:1fr 70px;gap:10px;align-items:center;border-top:1px solid rgba(255, 255, 255, 0.1);padding:7px 0;font-size:13px;}
.sim-row b{text-align:right;color:#ecfeff;}
.sim-total{border-top:1px solid rgba(16, 185, 129, 0.55);font-weight:700;}
@keyframes titlePhase1 {
0%,
5%{opacity:0;transform:translateY(6px);}
8%,
34%{opacity:1;transform:translateY(0);}
38%,
100%{opacity:0;transform:translateY(-6px);}
}
@keyframes titlePhase2 {
0%,
36%{opacity:0;transform:translateY(6px);}
40%,
64%{opacity:1;transform:translateY(0);}
68%,
100%{opacity:0;transform:translateY(-6px);}
}
@keyframes titlePhase3 {
0%,
66%{opacity:0;transform:translateY(6px);}
70%,
96%{opacity:1;transform:translateY(0);}
100%{opacity:0;transform:translateY(-6px);}
}
@keyframes simMenuFlow {
0%,
11%{opacity:0;max-height:0;transform:translateY(-6px);}
16%,
46%{opacity:1;max-height:180px;transform:translateY(0);}
52%,
100%{opacity:0;max-height:0;transform:translateY(-4px);}
}
@keyframes simTargetPick {
0%,
19%{background:transparent;font-weight:400;}
24%,
44%{background:rgba(16, 185, 129, 0.24);font-weight:700;color:#d1fae5;}
48%,
100%{background:transparent;font-weight:400;color:#cbd5e1;}
}
@keyframes simChevron {
0%,
11%{transform:rotate(45deg);}
16%,
46%{transform:rotate(-135deg);}
52%,
100%{transform:rotate(45deg);}
}
@keyframes simDefaultText {
0%,
60%{opacity:1;}
64%,
100%{opacity:0;}
}
@keyframes simPickedText {
0%,
62%{opacity:0;}
66%,
100%{opacity:1;}
}
@keyframes simLinesCycle {
0%,
34%{opacity:0;transform:translateY(8px);max-height:0;padding:0;border-width:0;}
38%,
62%{opacity:1;transform:translateY(0);max-height:420px;padding:12px;border:1px solid rgba(255, 255, 255, 0.14);}
66%,
100%{opacity:0;transform:translateY(-8px);max-height:0;padding:0;border-width:0;}
}
@keyframes simFinalCycle {
0%,
68%{opacity:0;transform:translateY(10px);max-height:0;padding:0;border-width:0;}
72%,
96%{opacity:1;transform:translateY(0);max-height:900px;padding:12px;border:1px solid rgba(16, 185, 129, 0.55);}
100%{opacity:0;transform:translateY(10px);max-height:0;padding:0;border-width:0;}
} @media(max-width:700px){
.sim-chatInputWrapper-demo {
padding: 14px;
min-height: 560px;
justify-items: stretch;
align-content: start;
}
.sim-chat-card {
padding: 14px;
}
.sim-h2-step {
white-space: normal;
}
.sim-main-subtitle {
font-size: 13px;
}
.sim-title-cta {
width: 100%;
justify-content: space-between;
}
.sim-lines p, .sim-row {
font-size: 12px;
}
.sim-row {
grid-template-columns: 1fr 52px;
}
.sim-lines p {
display: none !important;
}
.sim-lines p.mobile-keep {
display: block !important;
white-space: normal;
word-break: break-word;
}
.sim-devis-final .sim-row:not(.mobile-keep):not(.sim-total) {
display: none !important;
}
.sim-devis-final .sim-row.mobile-keep, .sim-devis-final .sim-row.sim-total {
display: grid !important;
}
.sim-row span {
white-space: normal;
word-break: break-word;
}
}