.clinic-chat { max-width: 850px; margin-inline: auto; }
.chat-announcement { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.chat-card input[type=email] { width: 100%; padding: 12px; border: 1px solid #9bbeb8; border-radius: 10px; font: inherit; }
.chat-lines { display: flex; flex-direction: column; gap: 6px; padding-block: 12px; }
.chat-line { padding: 9px 14px; border-radius: 12px; background: #f0f5f4; max-width: 90%; line-height: 1.35; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-line.user { align-self: flex-end; background: #e2efed; }
.chat-line small { display: block; margin-bottom: 2px; line-height: 1.2; }
.chat-line.processing { display: grid; grid-template-columns: 34px 1fr; grid-template-areas: "label label" "icon message"; direction: ltr; align-items: center; gap: 3px 8px; color: #425b57; }
.chat-line.processing small { grid-area: label; direction: rtl; text-align: right; }
.chat-line.processing > span:last-child { grid-area: message; direction: rtl; justify-self: end; text-align: right; }
.medical-loader { grid-area: icon; display: inline-grid; width: 34px; height: 34px; place-items: center; animation: medical-loader-spin 1.8s linear infinite; }
.medical-loader img { display: block; width: 100%; height: 100%; object-fit: contain; animation: medical-loader-pulse .9s ease-in-out infinite alternate; }
@keyframes medical-loader-spin { to { transform: rotate(360deg); } }
@keyframes medical-loader-pulse { from { transform: scale(.82); opacity: .68; } to { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .medical-loader, .medical-loader img { animation: none; } }
.chat-card { border: 1px solid #9bbeb8; border-radius: 16px; padding: 22px; background: #fff; margin-block: 18px; }
.chat-card textarea { width: 100%; min-height: 140px; white-space: pre-wrap; }
.chat-card input { max-width: 100%; }
.chat-card fieldset { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-block: 12px; padding: 12px; border: 1px solid #c6d8d4; border-radius: 10px; }
.chat-slots { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.chat-composer { display: flex; gap: 10px; align-items: end; margin-block: 18px; }
.chat-composer .field { flex: 1; min-width: 0; }
.chat-composer textarea { width: 100%; min-height: 70px; resize: vertical; }
.chat-fallback { position: static; inset: auto; display: flex; flex-direction: row; flex-wrap: wrap; gap: 16px; margin: 20px 0; padding: 0; border: 0; box-shadow: none; background: transparent; }
.chat-outcome { border-inline-start: 5px solid #376b61; padding: 20px; background: #eaf3ef; white-space: pre-wrap; }
.clinic-chat button:focus-visible, .clinic-chat a:focus-visible, .clinic-chat input:focus-visible, .clinic-chat textarea:focus-visible { outline: 3px solid #244f94; outline-offset: 3px; }
@media(max-width: 560px) { .chat-card { padding: 16px; } .chat-composer { flex-direction: column; align-items: stretch; } .chat-line { max-width: 100%; } }
