/* Жидкое стекло — разделы: новости, созвоны, мысли, знания, профиль, подписки, вход. Общая основа — site/glass.css и site/glass.js.
   Белые карточки — без стекла; новые :hover — внутри @media (hover: hover). */

/* вдавленное поле и подсветка строки — те же значения, что в glass-controls.css */
:root {
  --gls-well: rgba(0, 0, 0, .24); --gls-well-top: rgba(0, 0, 0, .4); --gls-well-side: rgba(255, 255, 255, .05);
  --gls-well-bot: rgba(255, 255, 255, .11); --gls-well-shade: inset 0 1px 2px rgba(0, 0, 0, .3); --gls-row: rgba(255, 255, 255, .07);
}
[data-theme="light"] {
  --gls-well: rgba(17, 24, 39, .045); --gls-well-top: rgba(17, 24, 39, .16); --gls-well-side: rgba(17, 24, 39, .07);
  --gls-well-bot: rgba(255, 255, 255, .95); --gls-well-shade: inset 0 1px 2px rgba(17, 24, 39, .08); --gls-row: rgba(17, 24, 39, .045);
}

/* ---------- кромка-блик (как в glass.css): ::after нужен position — ставим без специфичности ---------- */
:where(.rail-btn.mic, .th-progress, .th-side, .th-adv, .th-adv button, .cm-bubble, .kn-q, .rec-capsule, .sub-row) { position: relative; }
:is(.rail-btn.mic, .mic-fab, .rec-capsule, .th-adv button, .lb-x, .lb-prev, .lb-next, .lb-open)::after,
:is(.th-progress, .th-side, .th-adv, .cm-bubble, .kn-q)::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; padding: 1px;
  background: linear-gradient(135deg, var(--gl-rim-hi), transparent 30%, transparent 62%, var(--gl-rim-lo) 86%, var(--gl-rim-hi));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
/* на подложках и пузырях кромка тише, чем на кнопках; у подложек — мягче, как у групп строк в glass-controls.css */
:is(.th-side, .th-adv, .cm-bubble, .kn-q)::after { opacity: .55; }
:is(.th-side, .th-adv)::after { background: linear-gradient(160deg, var(--gl-rim-hi), transparent 24%, transparent 72%, var(--gl-rim-lo)); }

/* блик под мышкой — как у кнопок в glass.css (координаты ставит glass.js, если элемент есть в JELLY) */
:is(.rail-btn.mic, .mic-fab, .th-adv button, .lb-x, .lb-prev, .lb-next, .lb-open)::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(80px circle at var(--gl-x, 50%) var(--gl-y, 0%), var(--gl-glow), transparent 70%);
  transition: opacity .3s var(--ease-out); }
@media (hover: hover) {
  :is(.rail-btn.mic, .th-adv button, .lb-x, .lb-prev, .lb-next, .lb-open):not(:disabled):hover::before { opacity: 1; }
}

/* ---------- новости: карточки белые — исключены в glass.css; крестик внутри поля поиска — без своей кромки ---------- */
.news-search .icon-btn { box-shadow: none; }
.news-search .icon-btn::after { content: none; }

/* ---------- созвоны и мысли: выбранная строка списка — светлое стекло над лентой ---------- */
.ml-item.on, .th-row.on { box-shadow: var(--gl-inner), 0 8px 20px -12px var(--gl-drop); }

/* ---------- мысли: микрофон в меню и круглая кнопка на телефоне — оранжевое стекло ---------- */
.rail-btn.mic, .mic-fab { isolation: isolate;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, 0) 55%);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .25), inset 0 1px 1px rgba(255, 255, 255, .28), 0 8px 18px -8px var(--gl-drop); }
.mic-fab { box-shadow: 0 0 0 .5px rgba(0, 0, 0, .25), inset 0 1px 1px rgba(255, 255, 255, .28), 0 12px 28px -8px var(--gl-drop); }

/* капсула записи: кромка вместо рамки, преломление даёт glass.js */
.rec-capsule { border-color: transparent; box-shadow: 0 0 0 .5px var(--gl-edge), var(--pill-shadow); }

/* поле «Написать мысль текстом» — вдавленное стекло, как поля в glass-controls.css */
.th-compose { background-color: var(--gls-well); border-color: var(--gls-well-top) var(--gls-well-side) var(--gls-well-bot);
  box-shadow: var(--gls-well-shade); }
.th-compose:focus-within { border-color: var(--accent-text); }

/* «Решено 1 из 5» — стеклянная плашка, не кнопка: без тени снизу */
.th-progress { border-color: transparent; box-shadow: 0 0 0 .5px var(--gl-edge), var(--gl-inner); }

/* «Связано и советы» — стеклянная подложка; совет внутри — стекло потоньше, кнопка — как .btn */
.th-side, .th-adv { border-color: transparent; box-shadow: 0 0 0 .5px var(--gl-edge), var(--gl-inner); }
.th-adv button { isolation: isolate; border-color: transparent; background-color: var(--sub);
  box-shadow: 0 0 0 .5px var(--gl-edge), var(--gl-inner), 0 6px 16px -8px var(--gl-drop); }
.th-adv button[aria-pressed="true"] { background-color: var(--tab-on); }
@media (hover: hover) { .th-adv button:hover:not(:disabled) { background-color: var(--sub-hover); } }

/* ---------- знания: вопрос ассистенту — пузырь, как свой комментарий ---------- */
.kn-q { box-shadow: var(--gl-inner); }
.kn-ask-logo { box-shadow: 0 0 0 .5px var(--gl-edge), var(--gl-inner); }

/* ---------- комментарии: пузыри — тонкое стекло (поле ввода — в glass-controls.css) ---------- */
.cm-bubble { box-shadow: 0 0 0 .5px var(--gl-edge), var(--gl-inner); }

/* ---------- подписки: строка — подсветка каплей внутри строки (как .row в glass-controls.css), поля — вдавленные ---------- */
.sub-row { isolation: isolate; }
.sub-row::before { content: ""; position: absolute; inset: 4px 6px; z-index: -1; border-radius: 14px; pointer-events: none;
  background: var(--gls-row); box-shadow: var(--gl-inner); opacity: 0; transition: opacity .2s var(--ease-out); }
@media (hover: hover) {
  .sub-row:hover { background: transparent; }
  .sub-row:hover::before { opacity: 1; }
}
.sub-row:active { background: transparent; }
.sub-row:active::before { opacity: 1; background: var(--sub-hover); transition-duration: .06s; }
.sub-input { background-color: var(--gls-well); border-color: var(--gls-well-top) var(--gls-well-side) var(--gls-well-bot);
  box-shadow: var(--gls-well-shade); }
.sub-input:focus { border-color: var(--accent-text); }

/* ---------- вход: карточка одна на экране — как лист: кромка ярче, чем у панелей (её ::after — из glass.css) ---------- */
.login-card.gl-host > .gl-pane { box-shadow: 0 0 0 .5px var(--gl-edge), var(--pill-shadow); }
.login-card.gl-host > .gl-pane::after { opacity: .9; }

/* ---------- просмотр фото: фон всегда чёрный — стекло тёмное в обеих темах ---------- */
.lb-x, .lb-prev, .lb-next, .lb-open { isolation: isolate; background: rgba(255, 255, 255, .12);
  --gl-rim-hi: rgba(255, 255, 255, .5); --gl-rim-lo: rgba(255, 255, 255, .16); --gl-glow: rgba(255, 255, 255, .14);
  box-shadow: 0 0 0 .5px rgba(0, 0, 0, .5), inset 0 1px 1px rgba(255, 255, 255, .14), 0 8px 22px -8px rgba(0, 0, 0, .7);
  -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); }
@media (hover: hover) { :is(.lb-x, .lb-prev, .lb-next, .lb-open):hover { background: rgba(255, 255, 255, .18); } }

@media (prefers-reduced-transparency: reduce) {
  .lb-x, .lb-prev, .lb-next, .lb-open { -webkit-backdrop-filter: none; backdrop-filter: none; background: #2C2D32; }
}
@media (prefers-contrast: more) {
  .rail-btn.mic, .mic-fab, .th-adv button, .lb-x, .lb-prev, .lb-next, .lb-open { box-shadow: 0 0 0 1px var(--text3) !important; }
}
