/* ============================================================
   Экспериментальная тема «Жидкое стекло».
   Класс glass-theme добавляется при выборе темы в настройках.
   ============================================================ */

html.glass-theme {
    background: #0C1629;
    color-scheme: dark;
}

html.glass-theme #splash-screen {
    background: #0C1629 !important;
    color: #F7FAFF;
}

body.glass-theme,
html.glass-theme body {
    --bg-app: rgba(10, 20, 38, 0.52);
    --bg-white: rgba(24, 37, 62, 0.72);
    --text-dark: #F7FAFF;
    --text-gray: #A8B6CE;
    --chat-center-bg: rgba(8, 15, 30, 0.18);
    --blue-accent: #66B7FF;
    --msg-me-bg: linear-gradient(135deg, rgba(24, 137, 255, 0.96), rgba(91, 82, 255, 0.92));
    --msg-me-text: #FFFFFF;
    --msg-other-bg: rgba(255, 255, 255, 0.14);
    --msg-other-text: #F7FAFF;
    --input-bg: rgba(255, 255, 255, 0.11);
    --chat-sheet-bg: rgba(10, 19, 36, 0.78);
    --chat-field-bg: rgba(255, 255, 255, 0.10);
    --online-green: #4DE38A;
    --profile-bg: rgba(10, 19, 36, 0.72);
    --profile-center-bg: rgba(7, 14, 28, 0.26);
    --profile-card-bg: rgba(255, 255, 255, 0.105);
    --profile-card-shadow: 0 16px 40px rgba(0, 0, 0, 0.24);
    --profile-info-main-text: #F7FAFF;
    --profile-info-sub-text: #C0CBDB;
    --profile-info-icon: #AFC5DE;
    --profile-btn-bg: rgba(255, 255, 255, 0.10);
    --profile-border: transparent;
    --profile-list-border: transparent;
    --border-color: rgba(255, 255, 255, 0.15);
    color-scheme: dark;
    background:
        radial-gradient(circle at 8% 4%, rgba(43, 138, 232, 0.34) 0, transparent 34%),
        radial-gradient(circle at 94% 21%, rgba(134, 83, 214, 0.27) 0, transparent 38%),
        radial-gradient(circle at 70% 90%, rgba(14, 167, 157, 0.16) 0, transparent 36%),
        linear-gradient(145deg, #0C1629 0%, #121D36 48%, #0A1425 100%);
}

body.glass-theme .screen,
body.glass-theme #app-main-container,
body.glass-theme #chats-list-screen,
body.glass-theme #chat-room-screen,
body.glass-theme #settings-screen,
body.glass-theme .chats-scroll-wrap,
body.glass-theme .settings-scroll-wrap,
body.glass-theme .settings-sections,
body.glass-theme #feed-list-container {
    background-color: transparent !important;
}

/* Стекло живёт в навигации и элементах управления, контент остаётся спокойным. */
body.glass-theme .header-large,
body.glass-theme .header-small,
body.glass-theme .bottom-nav-bar,
body.glass-theme #input-area,
body.glass-theme #settings-screen .header-large,
body.glass-theme .modal-box,
body.glass-theme #sticker-panel {
    background: rgba(15, 27, 49, 0.68) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 12px 34px rgba(0, 0, 0, 0.20) !important;
    -webkit-backdrop-filter: blur(12px) saturate(135%);
    backdrop-filter: blur(12px) saturate(135%);
}

body.glass-theme #chats-list-screen .header-large {
    background: linear-gradient(180deg, rgba(12, 22, 41, 0.96), rgba(15, 29, 52, 0.72)) !important;
    box-shadow: 0 10px 30px rgba(3, 9, 20, 0.16) !important;
}

body.glass-theme .header-app-title,
body.glass-theme .app-title {
    background: linear-gradient(120deg, #FFFFFF 10%, #9FD8FF 48%, #C7AEFF 88%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 8px 24px rgba(86, 177, 255, 0.18);
}

body.glass-theme .chat-item {
    margin: 0 4px 2px !important;
    padding: 8px 16px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}

body.glass-theme .chat-item:active {
    background: rgba(255, 255, 255, 0.09) !important;
    transform: scale(0.985);
}

body.glass-theme .chat-name {
    color: #F8FAFF;
}

body.glass-theme .chat-preview {
    color: #A9B7CD;
}

body.glass-theme .online-status-dot {
    border-color: #101D34;
}

body.glass-theme .search-result-item {
    border: none !important;
    border-radius: 13px;
}

body.glass-theme .search-result-item:active {
    background: rgba(255, 255, 255, 0.08);
}

body.glass-theme .group-search-result-item {
    border-bottom: none !important;
}

body.glass-theme .group-search-field {
    background: rgba(255, 255, 255, 0.10) !important;
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme .group-search-field #gmodal-search-input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme .chat-section-label,
body.glass-theme .story-name {
    color: #B8C6DC;
}

body.glass-theme .story-avatar-inner,
body.glass-theme .story-add-plus {
    border-color: rgba(11, 21, 39, 0.84) !important;
}

body.glass-theme .story-add-inner {
    background: rgba(255, 255, 255, 0.12) !important;
}

body.glass-theme #chat-room-screen {
    border-color: rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.26) !important;
}

body.glass-theme #messages {
    background:
        radial-gradient(circle at 12% 12%, rgba(74, 168, 255, 0.10), transparent 30%),
        radial-gradient(circle at 90% 78%, rgba(125, 88, 255, 0.10), transparent 32%);
}

body.glass-theme .chat-background-pattern {
    --pattern-color: rgba(194, 224, 255, 0.035);
    opacity: 0.28;
}

body.glass-theme .msg {
    border: none;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.13);
    z-index: 1;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

body.glass-theme .msg.me {
    box-shadow: 0 7px 20px rgba(27, 91, 218, 0.22);
}

body.glass-theme .msg.other {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.09)) !important;
}

body.glass-theme .msg.msg-photo {
    border: none;
}

body.glass-theme #input-area {
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme #chat-room-screen .header-small {
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme #msg-form,
body.glass-theme input.auth-input,
body.glass-theme .feed-create-input,
body.glass-theme textarea,
body.glass-theme input[type="text"],
body.glass-theme input[type="email"],
body.glass-theme input[type="password"],
body.glass-theme input[type="url"] {
    background: rgba(255, 255, 255, 0.105) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

body.glass-theme #msg-input {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme .bottom-nav-bar {
    background: linear-gradient(180deg, rgba(18, 31, 55, 0.72), rgba(12, 22, 41, 0.90)) !important;
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme .nav-item {
    filter: none;
}

/* Аудио- и видеозвонки */
body.glass-theme #call-screen {
    background:
        radial-gradient(circle at 18% 12%, rgba(43, 138, 232, 0.34), transparent 36%),
        radial-gradient(circle at 88% 28%, rgba(134, 83, 214, 0.26), transparent 40%),
        radial-gradient(circle at 65% 92%, rgba(14, 167, 157, 0.16), transparent 38%),
        linear-gradient(145deg, #0C1629 0%, #121D36 52%, #0A1425 100%) !important;
}

body.glass-theme #call-video-wrap {
    background: #07101F !important;
}

body.glass-theme #call-video-overlay {
    background: linear-gradient(transparent, rgba(7, 16, 31, 0.90)) !important;
    border: none !important;
    box-shadow: none !important;
    -webkit-backdrop-filter: blur(10px) saturate(130%);
    backdrop-filter: blur(10px) saturate(130%);
}

body.glass-theme .call-avatar {
    background: rgba(255, 255, 255, 0.11) !important;
    border: none !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.26) !important;
}

body.glass-theme .call-name {
    color: #F7FAFF;
}

body.glass-theme .call-status,
body.glass-theme #call-type-label,
body.glass-theme .call-btn-label span {
    color: #A8B6CE !important;
}

body.glass-theme .call-btn-sm {
    background: rgba(255, 255, 255, 0.12) !important;
    border: none !important;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22) !important;
    -webkit-backdrop-filter: blur(10px) saturate(130%);
    backdrop-filter: blur(10px) saturate(130%);
}

body.glass-theme .call-btn-sm.call-btn-active {
    background: rgba(247, 250, 255, 0.92) !important;
}

body.glass-theme #settings-screen .header-large {
    background: rgba(12, 23, 43, 0.72) !important;
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme .profile-info-center,
body.glass-theme .settings-list-card,
body.glass-theme .profile-action-cell,
body.glass-theme .profile-single-btn,
body.glass-theme .profile-pair-btn {
    background: rgba(255, 255, 255, 0.085) !important;
    border: none !important;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.13) !important;
}

body.glass-theme .settings-list-card {
    margin: 0 12px;
    border-radius: 18px;
    overflow: hidden;
    border: none !important;
}

body.glass-theme .settings-list-row,
body.glass-theme .settings-list-row + .settings-list-row {
    border: none !important;
}

body.glass-theme .settings-list-row:active {
    background: rgba(255, 255, 255, 0.075) !important;
}

body.glass-theme .admin-glass-theme-row,
body.glass-theme .admin-glass-theme-row:active {
    background: transparent !important;
    transition: none !important;
}

body.glass-theme .admin-glass-theme-row * {
    transition: none !important;
}

body.glass-theme .admin-glass-theme-icon,
.admin-glass-theme-icon {
    background: linear-gradient(135deg, rgba(78, 187, 255, 0.28), rgba(155, 89, 255, 0.28)) !important;
}

.admin-glass-theme-icon svg {
    fill: #67C7FF;
    filter: drop-shadow(0 2px 6px rgba(91, 179, 255, 0.5));
}

body.glass-theme .feed-create-card,
body.glass-theme .feed-post-card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

body.glass-theme #custom-modal,
body.glass-theme [id$="-modal"] {
    background-color: rgba(2, 7, 16, 0.62) !important;
}

body.glass-theme #custom-modal .modal-box,
body.glass-theme [id$="-modal"] > div[style*="background:var(--bg-white"],
body.glass-theme [id$="-modal"] > div[style*="background:var(--bg-white,"] {
    background: rgba(18, 31, 55, 0.80) !important;
    border: 1px solid rgba(255, 255, 255, 0.17) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.13), 0 26px 70px rgba(0, 0, 0, 0.40) !important;
    -webkit-backdrop-filter: blur(16px) saturate(135%);
    backdrop-filter: blur(16px) saturate(135%);
}

body.glass-theme #loading-overlay {
    background: rgba(5, 12, 24, 0.60);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

@media (min-width: 900px) {
    body.glass-theme #chats-list-screen,
    body.glass-theme #chat-room-screen,
    body.glass-theme #settings-screen {
        background: rgba(10, 20, 38, 0.48) !important;
        border-color: rgba(255, 255, 255, 0.14) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 24px 60px rgba(0, 0, 0, 0.25) !important;
        -webkit-backdrop-filter: blur(14px) saturate(130%);
        backdrop-filter: blur(14px) saturate(130%);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.glass-theme,
    body.glass-theme * {
        transition-duration: 0.01ms !important;
    }
}
