/*
 * Site geneli Bootstrap 5 modal kabuğu — tek düzenleme noktası
 * Ayrıca başlıklı dropdown panelleri: .notification-menu-header, .topic-status-panel-heading
 *
 * Bağımlılık: main.css (--wow-section-header-*), theme-vars, --site-font-title
 *
 * Özel modallar: .modal.update-modal-premium ve sayfa sınıfları kendi
 * içerik stillerini tutar; kabuk buradan miras alır.
 */

:root {
    --site-modal-border-light: rgba(var(--primary-color-rgb), 0.3);
    --site-modal-border-dark: rgba(var(--primary-color-rgb), 0.22);
    --site-modal-shadow-light: 0 12px 36px rgba(var(--primary-color-rgb), 0.16), 0 4px 12px rgba(0, 0, 0, 0.08);
    --site-modal-shadow-dark: 0 18px 50px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.modal-content {
    border-radius: var(--site-box-radius, 4px);
    overflow: hidden;
    border-width: 1px;
    border-style: solid;
}

[data-bs-theme="light"] .modal-content {
    background-color: rgb(var(--background-color-rgb)) !important;
    border-color: var(--site-modal-border-light) !important;
    color: var(--text-color);
    box-shadow: var(--site-modal-shadow-light);
}

[data-bs-theme="dark"] .modal-content {
    background: var(--dm-card-bg) !important;
    border-color: var(--site-modal-border-dark) !important;
    color: var(--text-color);
    box-shadow: var(--site-modal-shadow-dark);
}

.modal-header {
    position: relative;
    overflow: hidden;
    padding: 0.6rem 1rem;
    border-bottom: 0 !important;
    background: var(--wow-section-header-bg) !important;
    box-shadow: none !important;
    color: var(--wow-section-header-text) !important;
    text-shadow: var(--wow-section-header-text-shadow);
    letter-spacing: 0.02em;
    font-weight: 500;
    text-transform: uppercase;
}

.modal-header::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: var(--wow-section-header-shine);
    opacity: 0.28;
}

.modal-header::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: var(--wow-section-header-divider);
}

.modal-header .modal-title,
.modal-header .modal-title i,
.modal-header .modal-title .text-warning,
.modal-header .modal-title .text-primary {
    color: inherit !important;
    text-shadow: inherit;
}

.modal-title {
    font-family: var(--site-font-title);
    font-weight: 700;
    font-size: 0.82rem;
    line-height: 1.35;
    letter-spacing: 0.09em;
    position: relative;
    z-index: 1;
    margin-bottom: 0;
}

.modal-title .forum-username,
.modal-title .modal-title-username {
    text-transform: none;
    letter-spacing: normal;
    font-family: var(--site-font-body);
    font-weight: 700;
}

.modal-header .btn-close {
    position: relative;
    z-index: 2;
}

[data-bs-theme="light"] .modal-header .btn-close {
    filter: none;
    opacity: 0.55;
}

[data-bs-theme="dark"] .modal-header .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
    opacity: 0.72;
}

/* Bilinçli Bootstrap arka planları (ör. admin ikon seçici) — tema şeridi yerine klasik kabuk */
.modal-header.bg-dark,
.modal-header.bg-light,
.modal-header.bg-white,
.modal-header.bg-body,
.modal-header.bg-body-secondary,
.modal-header.bg-primary,
.modal-header.bg-secondary {
    text-transform: none;
    letter-spacing: normal;
}

.modal-header.bg-dark::before,
.modal-header.bg-light::before,
.modal-header.bg-white::before,
.modal-header.bg-body::before,
.modal-header.bg-body-secondary::before,
.modal-header.bg-primary::before,
.modal-header.bg-secondary::before,
.modal-header.bg-dark::after,
.modal-header.bg-light::after,
.modal-header.bg-white::after,
.modal-header.bg-body::after,
.modal-header.bg-body-secondary::after,
.modal-header.bg-primary::after,
.modal-header.bg-secondary::after {
    display: none;
}

.modal-header.bg-dark,
.modal-header.bg-light,
.modal-header.bg-white,
.modal-header.bg-body,
.modal-header.bg-body-secondary,
.modal-header.bg-primary,
.modal-header.bg-secondary {
    border-bottom-width: 1px !important;
    border-bottom-style: solid !important;
}

[data-bs-theme="light"] .modal-header.bg-light,
[data-bs-theme="light"] .modal-header.bg-white,
[data-bs-theme="dark"] .modal-header.bg-light {
    background: var(--surface-card-header) !important;
    color: var(--text-color) !important;
    border-bottom-color: rgba(var(--primary-color-rgb), 0.25) !important;
}

.modal-header.bg-dark {
    background-color: var(--bs-dark) !important;
    color: #fff !important;
    border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

.modal-header.bg-dark .modal-title,
.modal-header.bg-light .modal-title {
    letter-spacing: normal;
    font-weight: 500;
    font-size: 1.05rem;
    text-transform: none;
}

[data-bs-theme="dark"] .modal-header.bg-dark .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
    opacity: 0.7;
}

[data-bs-theme="light"] .modal-header.bg-light .btn-close,
[data-bs-theme="light"] .modal-header.bg-white .btn-close {
    filter: none;
    opacity: 0.55;
}

.modal-body {
    color: inherit;
}

.modal-footer {
    background: var(--surface-card-footer) !important;
    border-top-width: 1px;
    border-top-style: solid;
    gap: 0.5rem;
}

[data-bs-theme="light"] .modal-footer {
    border-top-color: rgba(var(--primary-color-rgb), 0.2) !important;
}

[data-bs-theme="dark"] .modal-footer {
    border-top-color: rgba(var(--primary-color-rgb), 0.15) !important;
}

.modal-header .btn-close:focus {
    box-shadow: 0 0 0 0.2rem rgba(var(--primary-color-rgb), 0.25);
}

/* Arka plan perdesi — tema ile hafif ayar */
.modal-backdrop {
    --bs-backdrop-opacity: 0.55;
}

[data-bs-theme="light"] .modal-backdrop {
    --bs-backdrop-opacity: 0.48;
}

/* Mobil: taşma ve dokunma alanı */
@media (max-width: 768px) {
    .modal-dialog {
        margin: 0.5rem;
        max-width: calc(100% - 1rem);
    }

    .modal-header,
    .modal-body,
    .modal-footer {
        padding: 1rem;
    }

    .modal-title {
        font-size: 0.85rem;
        letter-spacing: 0.08em;
    }
}

@media (max-width: 575.98px) {
    .modal-dialog {
        margin: 0.4rem auto;
    }
}

/* =============================================================================
   Navbar bildirimler / ana sayfa çevrim içi / konu durumu & grup yönetimi dropdown:
   başlık satırı = .modal-header ile aynı WoW bölüm şeridi (kategori paneli başlığı)
   ============================================================================= */

.notification-menu-header,
.topic-status-panel .topic-status-panel-heading {
    position: relative;
    overflow: hidden;
    border-bottom: 0 !important;
    background: var(--wow-section-header-bg) !important;
    box-shadow: none !important;
    color: var(--wow-section-header-text) !important;
    text-shadow: var(--wow-section-header-text-shadow);
    letter-spacing: 0.02em;
    font-weight: 500;
    text-transform: uppercase;
    padding: 0.6rem 1rem !important;
}

.notification-menu-header::before,
.topic-status-panel .topic-status-panel-heading::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--wow-section-header-shine);
    opacity: 0.28;
}

.notification-menu-header::after,
.topic-status-panel .topic-status-panel-heading::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    z-index: 1;
    pointer-events: none;
    background: var(--wow-section-header-divider);
}

.notification-menu-header > * {
    position: relative;
    z-index: 2;
}

.topic-status-panel .topic-status-panel-heading .topic-status-panel-heading__title {
    position: relative;
    z-index: 2;
    font-family: var(--site-font-title);
    font-weight: 700 !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.09em !important;
    line-height: 1.35 !important;
    text-transform: uppercase !important;
    color: inherit !important;
    opacity: 1 !important;
    white-space: nowrap;
}

/* main.css’teki sayfa kapsamlı seçiciler (0.7rem / opacity) modal başlığı tipografisini ezer */
.topic-page-card .topic-status-dropdown .dropdown-menu.topic-status-panel .topic-status-panel-heading .topic-status-panel-heading__title,
.group-page-header-row .group-manage-dropdown .dropdown-menu.topic-status-panel .topic-status-panel-heading .topic-status-panel-heading__title,
.group-info-sidebar-card.group-page-card .group-manage-dropdown .dropdown-menu.topic-status-panel .topic-status-panel-heading .topic-status-panel-heading__title,
.group-chat-card .group-chat-msg__actions-dropdown .dropdown-menu.topic-status-panel .topic-status-panel-heading .topic-status-panel-heading__title {
    font-family: var(--site-font-title) !important;
    font-weight: 700 !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.09em !important;
    line-height: 1.35 !important;
    text-transform: uppercase !important;
    color: inherit !important;
    opacity: 1 !important;
    white-space: nowrap;
}

#mainNavbar .notification-dropdown .notification-menu-header .notification-menu-title,
.home-page .last-members-box .notification-menu-header .notification-menu-title {
    font-family: var(--site-font-title) !important;
    font-weight: 700 !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.09em !important;
    line-height: 1.35 !important;
    color: inherit !important;
    text-transform: uppercase !important;
}

/* Başlıktaki kapat: şeritte okunaklı çerçeve */
#mainNavbar .notification-dropdown .notification-menu-header .notification-menu-close,
.home-page .last-members-box .notification-menu-header .notification-menu-close {
    border-color: rgba(255, 255, 255, 0.22) !important;
    background: rgba(0, 0, 0, 0.15) !important;
    color: inherit !important;
}

[data-bs-theme="light"] #mainNavbar .notification-dropdown .notification-menu-header .notification-menu-close,
[data-bs-theme="light"] .home-page .last-members-box .notification-menu-header .notification-menu-close {
    border-color: rgba(0, 0, 0, 0.14) !important;
    background: rgba(255, 255, 255, 0.2) !important;
}

.topic-status-panel.topic-status-panel--compact .topic-status-panel-heading {
    padding: 0.45rem 0.65rem !important;
}