/* GlassKit — minimal glassmorphism helpers (MIT)
   Usage: add class="glass-btn btn-icon" to buttons, class="glass-menu" to dropdowns. */

.glass {
    position: relative;
    background: linear-gradient(145deg, rgba(255,255,255,0.10), rgba(255,255,255,0.05));
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.35);
    backdrop-filter: saturate(180%) blur(3px);
    -webkit-backdrop-filter: saturate(180%) blur(3px);
    overflow: hidden;
}

/* subtle texture+sheen */
.glass::before { content: none; }

/* Buttons */
.glass-btn {
    position: relative;
    background: linear-gradient(145deg, rgba(255,255,255,0.15), rgba(255,255,255,0.10));
    border: 1px solid rgba(255,255,255,0.25);
    color: #ecf0f1;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.3), 0 8px 24px rgba(0,0,0,0.18);
    backdrop-filter: saturate(180%) blur(3px);
    -webkit-backdrop-filter: saturate(180%) blur(3px);
    transition: transform .15s ease, box-shadow .15s ease;
}
.glass-btn:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), 0 12px 30px rgba(0,0,0,0.22); }
.glass-btn:active { transform: translateY(0); box-shadow: 0 6px 16px rgba(0,0,0,0.18); }

/* Icon button sizing */
.btn-icon { padding: 10px 12px; border-radius: 8px; }

/* Dropdown panels */
.glass-menu { composes: glass; /* for IDEs; safe to ignore if not supported */ }
.glass-menu {
    background: linear-gradient(145deg, rgba(255,255,255,0.12), rgba(255,255,255,0.06));
    border: 1px solid rgba(255,255,255,0.25);
    box-shadow: 0 10px 30px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.35);
    border-radius: 14px;
    overflow: hidden; /* clip inner dividers to rounded corners */
}

/* Tuning blur intensity */
.glass,
.glass-menu {
    backdrop-filter: saturate(180%) blur(3px);
    -webkit-backdrop-filter: saturate(180%) blur(3px);
}

/* Dropdown text color defaults */
.glass-menu { color: #ffffff !important; }
.light-theme .glass-menu { color: #111827; }

/* Strengthen separators in light theme */
.light-theme .chat-header { border-bottom: 1px solid #d1d5db !important; }
.light-theme .sidebar-header { border-bottom: 1px solid #d1d5db !important; }
.light-theme .input-area { border-top: 1px solid #d1d5db !important; }

/* Light theme variants */
.light-theme .glass,
.light-theme .glass-menu {
    background: linear-gradient(145deg, rgba(255,255,255,0.50), rgba(255,255,255,0.30));
    border: 1px solid rgba(0,0,0,0.08);
    box-shadow: 0 10px 30px rgba(0,0,0,0.12), inset 0 1px 0 rgba(255,255,255,0.6);
}
.light-theme .glass::before,
.light-theme .glass-menu::before { content: none; }

.light-theme .glass-btn {
    background: linear-gradient(145deg, rgba(255,255,255,0.7), rgba(255,255,255,0.45));
    border: 1px solid rgba(0,0,0,0.08);
    color: #111827;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.6), 0 8px 24px rgba(0,0,0,0.12);
}

/* Stronger overrides for ID-based rules (from chat.css) */
#notifDropdown.glass-menu,
#settingsDropdown.glass-menu {
    background: linear-gradient(145deg, rgba(255,255,255,0.12), rgba(255,255,255,0.06)) !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    backdrop-filter: saturate(180%) blur(3px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(3px) !important;
}

/* Remove prism overlays completely */
#notifDropdown.glass-menu::after,
#settingsDropdown.glass-menu::after { content: none !important; background: none !important; }

/* Entry/exit animations */
@keyframes glassSlideIn {
    from { opacity: 0; transform: translateY(-8px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes glassSlideOut {
    from { opacity: 1; transform: translateY(0) scale(1); }
    to { opacity: 0; transform: translateY(-8px) scale(0.98); }
}

/* Hidden by default: allow smooth transitions via class toggles */
.glass-menu {
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
    transition: opacity .18s ease, transform .18s ease;
}
.glass-menu.open { opacity: 1; transform: translateY(0) scale(1); }

/* Buttons: reduce blur as well */
#notifBtn.glass-btn,
#settingsBtn.glass-btn {
    backdrop-filter: saturate(160%) blur(3px) !important;
    -webkit-backdrop-filter: saturate(160%) blur(3px) !important;
}

/* Ensure dropdown text colors */
.light-theme #notifDropdown.glass-menu,
.light-theme #settingsDropdown.glass-menu { color: #111827 !important; }

/* Notification item typography (used by JS-rendered classes) */
#notifDropdown .notif-item-title { color: #ffffff !important; }
#notifDropdown .notif-item-time { color: #cfd8e3 !important; }
#notifDropdown .notif-item-body { color: #e5e7eb !important; }
.light-theme #notifDropdown .notif-item-title { color: #111827 !important; }
.light-theme #notifDropdown .notif-item-time { color: #4b5563; }
/* Notification item body color (force override inline) */
#notifDropdown .notif-item-body { color: #000000 !important; }
.light-theme #notifDropdown .notif-item-body { color: #374151 !important; }

/* Notification download link + hint */
.download-link { color: #6ea8ff; }
.light-theme .download-link { color: #2870F6; }
.download-link:hover { text-decoration: underline; }

.download-hint { color: rgba(255,255,255,0.95); }
.light-theme .download-hint { color: #374151; }

/* Subtle item dividers; remove last to avoid visible line at rounded edge */
#notifDropdown .notif-item { border-bottom: 1px solid rgba(255,255,255,0.08); }
#notifDropdown .notif-item:last-child { border-bottom: 0; }
.light-theme #notifDropdown .notif-item { border-bottom: 1px solid #e9ecef; }
.light-theme #notifDropdown .notif-item:last-child { border-bottom: 0; }