/* Oscar Clinic AI — стили чата (в фирменном стиле сайта Oscar Clinic) */
#oc-app .oc-chat{ position: fixed; z-index: 100001; inset: 0; display: grid; align-items: end; justify-items: end; pointer-events: none; }
#oc-app .oc-chat__panel{
	pointer-events: auto;
	width: 100%; height: min(88dvh, 720px);
	display: flex; flex-direction: column;
	border-radius: 21px 21px 0 0;
	animation: oc-up .5s var(--oc-ease);
	padding-bottom: env(safe-area-inset-bottom);
	box-shadow: inset 0 1px 0 #fff, 0 -20px 60px -20px rgba(15,23,42,.35);
}
@media (max-width: 639px) {
#oc-app .oc-chat{ background: rgba(15,23,42,.3); pointer-events: auto; }
#oc-app .oc-chat__panel{ --oc-glass-bg: linear-gradient(170deg, #fff, #F7F5F0); }
}
@media (min-width: 640px) {
#oc-app .oc-chat{ padding: 24px; }
#oc-app .oc-chat__panel{ width: 420px; height: min(680px, calc(100vh - 48px)); border-radius: 21px; animation: oc-pop .45s var(--oc-spring); box-shadow: inset 0 1px 0 #fff, var(--oc-shadow-lg); }
}
#oc-app .oc-chat.is-closing .oc-chat__panel{ animation: oc-down .3s var(--oc-ease) forwards; }
#oc-app .oc-chat__head{ display: flex; align-items: center; gap: 10px; padding: 14px 12px 12px 16px; border-bottom: 1px solid var(--oc-line); }
#oc-app .oc-chat__avatar{ width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--oc-ink); flex: none; }
#oc-app .oc-chat__avatar img{ width: 22px; height: auto; }
#oc-app .oc-chat__who{ flex: 1; min-width: 0; line-height: 1.2; }
#oc-app .oc-chat__who strong{ display: block; font-size: 15px; }
#oc-app .oc-chat__who small{ color: var(--oc-muted); font-size: 12px; }
#oc-app .oc-chat__head .oc-round{ background: rgba(15,23,42,.06); width: 36px; height: 36px; }
#oc-app .oc-chat__log{ flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 16px 14px; display: flex; flex-direction: column; gap: 10px; }
#oc-app .oc-msg{ max-width: 86%; padding: 11px 14px; border-radius: 20px; font-size: 15px; line-height: 1.45; animation: oc-msg .4s var(--oc-spring); word-wrap: break-word; }
#oc-app .oc-msg p{ margin: 0 0 6px; }
#oc-app .oc-msg p:last-child{ margin: 0; }
#oc-app .oc-msg ul{ margin: 4px 0 6px; padding-left: 18px; list-style: disc; }
#oc-app .oc-msg--bot{ align-self: flex-start; background: #fff; border-bottom-left-radius: 6px; box-shadow: 0 1px 2px rgba(15,23,42,.06); }
#oc-app .oc-msg--me{ align-self: flex-end; color: #fff; background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 85%, white), var(--oc-gold-d)); border-bottom-right-radius: 6px; }
#oc-app .oc-msg--err{ background: #FFF1EC; color: #9A3412; }
#oc-app .oc-msg__cta{ margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
#oc-app .oc-msg__cta .oc-btn{ min-height: 38px; font-size: 13.5px; padding: 0 14px; }
#oc-app .oc-typing{ align-self: flex-start; display: inline-flex; gap: 4px; padding: 14px 16px; background: #fff; border-radius: 20px; border-bottom-left-radius: 6px; }
#oc-app .oc-typing i{ width: 7px; height: 7px; border-radius: 50%; background: var(--oc-muted); animation: oc-dot 1.2s infinite ease-in-out; }
#oc-app .oc-typing i:nth-child(2){ animation-delay: .15s; }
#oc-app .oc-typing i:nth-child(3){ animation-delay: .3s; }
#oc-app .oc-chat__chips{ display: flex; gap: 8px; overflow-x: auto; padding: 0 14px 10px; scrollbar-width: none; }
#oc-app .oc-chat__chips::-webkit-scrollbar{ display: none; }
#oc-app .oc-chip{ flex: none; padding: 8px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; background: rgba(255,255,255,.85); box-shadow: inset 0 0 0 1px rgba(15,23,42,.08); white-space: nowrap; transition: transform .3s var(--oc-spring); }
#oc-app .oc-chip:active{ transform: scale(.95); }
#oc-app .oc-chat__form{ display: flex; align-items: flex-end; gap: 8px; margin: 0 12px; padding: 6px 6px 6px 16px; border-radius: 26px; background: #fff; box-shadow: inset 0 0 0 1px rgba(15,23,42,.1), 0 4px 14px -6px rgba(15,23,42,.15); }
#oc-app .oc-chat__form textarea{ flex: 1; border: 0 !important; outline: 0; resize: none; font: inherit; font-size: 16px; line-height: 1.4; padding: 10px 0 !important; max-height: 120px; background: transparent !important; color: var(--oc-ink); box-shadow: none !important; min-height: 0 !important; }
#oc-app .oc-chat__send{ width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 85%, white), var(--oc-gold-d)); flex: none; transition: transform .3s var(--oc-spring), opacity .2s; }
#oc-app .oc-chat__send:disabled{ opacity: .45; }
#oc-app .oc-chat__disc{ text-align: center; font-size: 11px; color: var(--oc-muted); padding: 8px 16px 12px; }
@keyframes oc-msg{ from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes oc-dot{ 0%, 80%, 100% { transform: scale(.6); opacity: .4; } 40% { transform: scale(1); opacity: 1; } }
#oc-app .oc-chat__send, #oc-app .oc-chat__send:hover, #oc-app .oc-chat__send:focus{ color: #fff !important; }
#oc-app .oc-chat__form{ border-radius: 16px; padding: 6px 6px 6px 14px; align-items: center; }
#oc-app .oc-chat__form textarea{
	all: unset;
	box-sizing: border-box; display: block; flex: 1; min-width: 0;
	font-family: inherit; font-size: 16px; line-height: 1.4; color: var(--oc-ink);
	padding: 10px 0; max-height: 120px; overflow-y: auto; white-space: pre-wrap; word-break: break-word;
}
#oc-app .oc-chat__form textarea::placeholder{ color: var(--oc-muted); opacity: 1; }
#oc-app .oc-chat__send{ width: 40px; height: 40px; min-width: 40px; border-radius: 12px; padding: 0; display: grid; place-items: center; }
#oc-app .oc-chat__panel{ border-radius: 21px 21px 0 0; }
@media (min-width: 640px) {
#oc-app .oc-chat__panel{ border-radius: 21px; }
}
#oc-app .oc-chip{ border-radius: 10px; padding: 8px 12px; }
#oc-app .oc-chat__head .oc-round{ padding: 0; display: grid; place-items: center; }
#oc-app .oc-msg{ border-radius: 16px; }
#oc-app .oc-msg--bot{ border-bottom-left-radius: 5px; }
#oc-app .oc-msg--me{ border-bottom-right-radius: 5px; }
#oc-app .oc-online{ display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--oc-gold); margin-right: 6px; vertical-align: 1px; box-shadow: 0 0 0 3px color-mix(in srgb, var(--oc-gold) 25%, transparent); }
#oc-app .oc-chat{ grid-template-columns: minmax(0, 1fr); pointer-events: auto; background: rgba(15,23,42,.38); }
#oc-app .oc-chat__panel{ min-width: 0; max-width: 100%; overflow: hidden; }
@media (min-width: 640px) {
#oc-app .oc-chat{ grid-template-columns: minmax(0, 420px); justify-content: end; }
#oc-app .oc-chat__panel{ width: 100%; }
}
#oc-app .oc-chat__chips{ min-width: 0; max-width: 100%; flex-wrap: wrap; overflow: visible; padding-bottom: 8px; }
#oc-app .oc-chip{ white-space: normal; text-align: left; flex: 0 1 auto; }
#oc-app .oc-chat__form{ min-width: 0; max-width: calc(100% - 24px); }
#oc-app .oc-chat__head{ min-width: 0; }
#oc-app .oc-chat__who{ min-width: 0; overflow: hidden; }
#oc-app .oc-chat__who strong{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#oc-app .oc-chat__send, #oc-app .oc-chat__head .oc-round{ flex: none; }
#oc-app .oc-vk-field{ flex: 1; min-width: 0; min-height: 42px; max-height: 96px; overflow-y: auto; padding: 10px 0; font-size: 16px; line-height: 1.4; color: var(--oc-ink); white-space: pre-wrap; word-break: break-word; cursor: text; }
#oc-app .oc-vk-field i{ display: inline-block; width: 2px; height: 1.15em; margin: 0 1px -3px; background: var(--oc-gold-d); animation: oc-caret 1s steps(1) infinite; }
#oc-app .oc-vk-ph{ color: var(--oc-muted); }
#oc-app .oc-chat__form textarea.is-vk{ position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
#oc-app .oc-chat__form{ position: relative; }
#oc-app .oc-vk{ padding: 8px 4px 6px; margin-top: 8px; background: #E6E2D9; border-top: 1px solid rgba(15,23,42,.06); user-select: none; -webkit-user-select: none; touch-action: manipulation; }
#oc-app .oc-vk__row{ display: flex; gap: 5px; justify-content: center; margin-bottom: 7px; }
#oc-app .oc-vk__k{ flex: 1 1 0; min-width: 0; max-width: 44px; height: 44px; border-radius: 7px; background: #fff; color: var(--oc-ink); font-size: 19px; font-weight: 500; box-shadow: 0 1px 0 rgba(15,23,42,.25); display: grid; place-items: center; padding: 0; transition: background-color .08s; }
#oc-app .oc-vk__k.is-down{ background: color-mix(in srgb, var(--oc-gold) 30%, white); }
#oc-app .oc-vk__k--fn{ background: #CFCAC0; font-size: 15px; font-weight: 600; max-width: 56px; }
#oc-app .oc-vk__k--fn.is-on{ background: #fff; color: var(--oc-gold-d); }
#oc-app .oc-vk__k--wide{ max-width: 64px; font-size: 13.5px; }
#oc-app .oc-vk__k--space{ flex: 4 1 0; max-width: none; font-size: 14px; color: var(--oc-muted); }
#oc-app .oc-vk__k--send{ max-width: 64px; color: #fff; background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 85%, white), var(--oc-gold-d)); font-size: 20px; }
#oc-app .oc-vk__row--bottom{ margin-bottom: 0; }
#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__panel{ height: min(94dvh, 860px); }
#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__disc{ display: none; }
#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__form{ margin-bottom: 0; }
@keyframes oc-caret{ 50% { opacity: 0; } }
#oc-app .oc-chat__chips{ flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; width: 100%; min-width: 0; padding: 2px 14px 10px; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: none; flex: none; }
#oc-app .oc-chat__chips::-webkit-scrollbar{ display: none; }
#oc-app .oc-chip{ white-space: nowrap; flex: none; scroll-snap-align: start; }
#oc-app .oc-chat__chips{ padding: 2px 12px 10px; scroll-padding-inline: 12px; }
#oc-app .oc-chat__who{ overflow: visible; padding-left: 2px; }
#oc-app .oc-online{ margin-left: 3px; }

/* Живой менеджер в чате */
#oc-app .oc-msg--sys { align-self: center; max-width: 92%; padding: 6px 12px; border-radius: 999px; background: rgba(15,23,42,.06); color: var(--oc-muted); font-size: 12.5px; text-align: center; }
#oc-app .oc-msg--mgr { align-self: flex-start; background: color-mix(in srgb, var(--oc-gold) 14%, white); border-bottom-left-radius: 5px; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--oc-gold) 35%, transparent); }
#oc-app .oc-msg__who { display: block; font-size: 11.5px; font-weight: 700; color: var(--oc-gold-d); margin-bottom: 3px; }

/* Телефон: чат на весь экран, клавиатура вплотную к полю ввода */
@media (max-width: 639px) {
	#oc-app .oc-chat { padding: 0; align-items: stretch; }
	#oc-app .oc-chat__panel, #oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__panel { height: 100dvh; max-height: 100dvh; border-radius: 0; padding-top: env(safe-area-inset-top); }
	#oc-app .oc-chat__form { margin-bottom: 8px; }
	#oc-app .oc-vk { margin-top: 0; padding-bottom: calc(6px + env(safe-area-inset-bottom)); }
	#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__form { margin-bottom: 8px; }
}
@media (max-width: 639px) {
	#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__form { margin-bottom: 0; border-radius: 16px 16px 0 0; box-shadow: inset 0 0 0 1px rgba(15,23,42,.08); }
}

/* ================= 1.2: голосовые, печать текста, ссылки и карта ================= */

/* Микрофон ↔ Отправить (как в мессенджерах) */
#oc-app .oc-chat__mic{ all: unset; box-sizing: border-box; flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; cursor: pointer; color: #fff;
	background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 85%, white), var(--oc-gold-d)); transition: transform .3s var(--oc-spring); -webkit-tap-highlight-color: transparent; }
#oc-app .oc-chat__mic:active{ transform: scale(.9); }
#oc-app .oc-chat__form:not(.has-text) .oc-chat__send{ display: none; }
#oc-app .oc-chat__form.has-text .oc-chat__mic{ display: none; }
#oc-app .oc-vk__k--send{ display: none; } /* на своей клавиатуре — та же кнопка в поле */
#oc-app .oc-vk__row--bottom .oc-vk__k--space{ flex: 5 1 0; }

/* Запись голоса: клавиатура скрыта, золотая «волна» */
#oc-app .oc-rec{ display: none; }
#oc-app .oc-chat__form.is-rec > *:not(.oc-rec){ display: none !important; }
#oc-app .oc-chat__form.is-rec{ padding: 6px; }
#oc-app .oc-chat__form.is-rec .oc-rec{ display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; height: 40px; animation: oc-fade .25s var(--oc-ease); }
#oc-app .oc-rec__x, #oc-app .oc-rec__send{ all: unset; box-sizing: border-box; flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform .3s var(--oc-spring); }
#oc-app .oc-rec__x{ color: var(--oc-muted); background: rgba(15,23,42,.06); }
#oc-app .oc-rec__send{ color: #fff; background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 85%, white), var(--oc-gold-d)); box-shadow: 0 0 0 0 color-mix(in srgb, var(--oc-gold) 60%, transparent); animation: oc-rec-ring 1.6s ease-out infinite; }
#oc-app .oc-rec__x:active, #oc-app .oc-rec__send:active{ transform: scale(.9); }
#oc-app .oc-rec__dot{ flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--oc-gold); animation: oc-rec-blink 1s ease-in-out infinite; }
#oc-app .oc-rec__time{ flex: none; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--oc-ink); min-width: 36px; }
#oc-app .oc-rec__wave{ flex: 1; min-width: 0; height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 2px; overflow: hidden; }
#oc-app .oc-rec__wave i{ flex: 1 1 0; max-width: 4px; height: 100%; border-radius: 3px; transform: scaleY(.12);
	background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 70%, white), var(--oc-gold-d)); transition: transform .08s linear; }
@keyframes oc-rec-blink{ 50%{ opacity: .25; transform: scale(.75); } }
@keyframes oc-rec-ring{ 0%{ box-shadow: 0 0 0 0 color-mix(in srgb, var(--oc-gold) 55%, transparent); } 100%{ box-shadow: 0 0 0 12px color-mix(in srgb, var(--oc-gold) 0%, transparent); } }

/* «Расшифровка…» */
#oc-app .oc-msg--tr p{ background: linear-gradient(90deg, rgba(255,255,255,.65) 0%, #fff 40%, rgba(255,255,255,.65) 80%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: oc-shimmer 1.4s linear infinite; font-style: italic; }
@keyframes oc-shimmer{ to { background-position: -200% 0; } }
#oc-app .oc-msg.is-in p{ animation: oc-fade .35s var(--oc-ease); }

/* Ответ печатается */
#oc-app .oc-msg.is-typing{ animation: oc-msg .3s var(--oc-spring); }
#oc-app .oc-msg__caret{ display: inline-block; width: 7px; height: 7px; margin-left: 4px; border-radius: 50%; background: var(--oc-gold); vertical-align: 1px; animation: oc-rec-blink .9s ease-in-out infinite; }
#oc-app .oc-msg ul + .oc-msg__caret, #oc-app .oc-msg p + .oc-msg__caret{ margin-left: 0; }

/* Ссылки и карта 2ГИС */
#oc-app .oc-msg__a{ display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; margin: 2px 0; border-radius: 999px; font-weight: 600; font-size: 14px; color: var(--oc-gold-d) !important; background: color-mix(in srgb, var(--oc-gold) 13%, white); text-decoration: none !important; }
#oc-app .oc-mapcard{ display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; padding: 10px; border-radius: 14px; text-decoration: none !important; color: var(--oc-ink) !important;
	background: linear-gradient(135deg, color-mix(in srgb, var(--oc-gold) 10%, white), #fff); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--oc-gold) 30%, transparent); }
#oc-app .oc-mapcard__pin{ flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; color: #fff; background: linear-gradient(180deg, color-mix(in srgb, var(--oc-gold) 85%, white), var(--oc-gold-d)); }
#oc-app .oc-mapcard__txt{ flex: 1; min-width: 0; display: grid; line-height: 1.3; }
#oc-app .oc-mapcard__txt b{ font-size: 13.5px; }
#oc-app .oc-mapcard__txt small{ font-size: 12.5px; color: var(--oc-muted); }
#oc-app .oc-mapcard__btn{ flex: 1 0 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 38px; border-radius: 11px; font-size: 14px; font-weight: 600; color: #fff; background: var(--oc-ink); }
#oc-app .oc-mapcard:active{ transform: scale(.98); }

/* Поле ввода над своей клавиатурой — во всю ширину, без отступов по бокам (скругление сверху остаётся) */
@media (max-width: 639px) {
	#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-chat__form{ margin: 0; max-width: 100%; border-radius: 16px 16px 0 0; box-shadow: inset 0 1px 0 rgba(15,23,42,.08); background: #fff; padding-left: 16px; }
	#oc-app .oc-chat:has(.oc-vk:not([hidden])) .oc-vk{ border-top: 0; }
}

/* 1.3: при наплыве голосовые выключены — вместо микрофона кнопка «Отправить» */
#oc-app .oc-chat__form.no-voice .oc-chat__mic{ display: none !important; }
#oc-app .oc-chat__form.no-voice:not(.has-text) .oc-chat__send{ display: grid; }