/* VoxPass — Metronic 8 üzerine tema: köşe yumuşatma + derinlik */

:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-border-radius: 0.75rem;
    --bs-border-radius-sm: 0.6rem;
    --bs-border-radius-lg: 1rem;
    --bs-border-radius-xl: 1.25rem;
    --bs-border-radius-2xl: 1.5rem;
    --pc-shadow: 0 4px 18px rgba(23, 32, 66, .06), 0 1.5px 4px rgba(23, 32, 66, .05);
    --pc-shadow-hover: 0 16px 36px rgba(23, 32, 66, .13), 0 4px 10px rgba(23, 32, 66, .07);
    /* ==== VoxPass marka rengi (Voxnup logo yeşili) — Bootstrap/Metronic primary override ==== */
    --bs-primary: #05A75E;
    --bs-primary-rgb: 5, 167, 94;
    --bs-primary-active: #048A4D;
    --bs-primary-light: #E4F7EE;
    --bs-primary-clarity: rgba(5, 167, 94, .2);
    --bs-primary-inverse: #ffffff;
    --bs-text-primary: #05A75E;
    --bs-link-color: #05A75E;
    --bs-link-color-rgb: 5, 167, 94;
    --bs-link-hover-color: #048A4D;
    --bs-component-active-bg: #05A75E;
}
/* Metronic bazı primary bileşenlerinde sabit renk kullanır; en görünür olanları yeşile sabitliyoruz */
.btn.btn-primary { --bs-btn-bg: #05A75E; --bs-btn-border-color: #05A75E; --bs-btn-hover-bg: #048A4D; --bs-btn-hover-border-color: #048A4D; --bs-btn-active-bg: #048A4D; --bs-btn-active-border-color: #048A4D; }
.btn.btn-light-primary { --bs-btn-color: #05A75E; --bs-btn-bg: #E4F7EE; --bs-btn-hover-bg: #05A75E; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #05A75E; --bs-btn-active-color: #fff; }
.text-primary { color: #05A75E !important; }
.bg-primary { background-color: #05A75E !important; }
.bg-light-primary { background-color: #E4F7EE !important; }
.badge.badge-primary { background-color: #05A75E; }
.badge.badge-light-primary { color: #05A75E; background-color: #E4F7EE; }
.symbol-label.bg-light-primary { background-color: #E4F7EE !important; }

/* ============ Eksik utility: flex öğelerinin küçülüp text-truncate yapabilmesi ============ */
/* Bu Metronic derlemesinde .min-w-0 yok (min-width:auto kalıyor) -> uzun başlık/e-posta
   kartlarda buton kümesini dışarı taşırıyordu. Utility'yi geri ekliyoruz. */
.min-w-0 { min-width: 0 !important; }
.mw-0 { min-width: 0 !important; }

/* ============ Topbar global arama — koyu header ile uyumlu ============ */
#kt_header .pc-search-input {
    background-color: rgba(255, 255, 255, .10);
    border: 1px solid rgba(255, 255, 255, .15);
    color: #fff;
    transition: background-color .15s ease, border-color .15s ease;
}
#kt_header .pc-search-input::placeholder { color: rgba(255, 255, 255, .55); }
#kt_header .pc-search-input:focus {
    background-color: rgba(255, 255, 255, .16);
    border-color: rgba(255, 255, 255, .30);
    color: #fff; box-shadow: none;
}
#kt_header .pc-search-icon { color: rgba(255, 255, 255, .65) !important; }
#kt_header .pc-search-kbd {
    background: rgba(255, 255, 255, .13);
    color: rgba(255, 255, 255, .7);
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: .4rem; font-size: .72rem; line-height: 1;
    padding: .2rem .42rem; pointer-events: none;
}
/* Öneri satırları */
#kt_global_search_menu .pc-sugg { transition: background-color .12s ease; }
#kt_global_search_menu .pc-sugg:hover { background: var(--bs-gray-100); }

/* ============ Köşe yumuşatma ============ */
.btn { border-radius: 0.7rem; }
.btn.btn-sm { border-radius: 0.6rem; }
.btn.btn-lg { border-radius: 0.9rem; }
.btn.btn-icon { border-radius: 0.65rem; }
.btn.btn-icon.btn-sm { border-radius: 0.55rem; }

.card { border-radius: 1rem; }
.card > .card-header { border-top-left-radius: 1rem; border-top-right-radius: 1rem; }
.card > .card-footer { border-bottom-left-radius: 1rem; border-bottom-right-radius: 1rem; }

.form-control { border-radius: 0.7rem; }
.form-select { border-radius: 0.7rem; }
.form-control.form-control-sm, .form-select.form-select-sm { border-radius: 0.6rem; }
.form-control.form-control-lg, .form-select.form-select-lg { border-radius: 0.85rem; }

.input-group > :first-child:not(.input-group-text) { border-top-left-radius: 0.7rem; border-bottom-left-radius: 0.7rem; }
.input-group > :last-child:not(.input-group-text) { border-top-right-radius: 0.7rem; border-bottom-right-radius: 0.7rem; }
.input-group-sm > :first-child { border-top-left-radius: 0.6rem; border-bottom-left-radius: 0.6rem; }
.input-group-sm > :last-child { border-top-right-radius: 0.6rem; border-bottom-right-radius: 0.6rem; }

.modal-content { border-radius: 1.25rem; }
.dropdown-menu, .menu.menu-sub-dropdown { border-radius: 0.9rem; }
.symbol > .symbol-label { border-radius: 0.75rem; }
.symbol.symbol-circle > .symbol-label { border-radius: 50%; }
.badge { border-radius: 0.55rem; }
.alert { border-radius: 0.9rem; }
.swal2-popup { border-radius: 1.25rem; }
.menu-item .menu-link { border-radius: 0.65rem; }
/* Aktif sol menü — kırmızı yerine VoxPass mavisi */
#kt_aside .menu-item .menu-link.active,
#kt_aside .menu-item.here > .menu-link,
#kt_aside .menu-item.show > .menu-link { background-color: #05A75E !important; }
#kt_aside .menu-item .menu-link.active .menu-title,
#kt_aside .menu-item .menu-link.active .menu-icon i { color: #fff !important; }

/* ============ Derinlik / katmanlı görünüm ============ */

/* Zemin: kartların "yüzmesi" için hafif ton */
.app-wrapper, .app-main, #kt_app_content { background-color: #f3f5f9; }

/* Kartlar: katmanlı gölge + hover yükselme */
.card {
    box-shadow: var(--pc-shadow);
    border: 1px solid rgba(23, 32, 66, .04);
    transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover {
    transform: translateY(-3px);
    box-shadow: var(--pc-shadow-hover);
}
/* Modal içi ve statik kartlarda hover yükselmesini kapat (yalnız içerik kartları yükselsin) */
.modal .card:hover { transform: none; box-shadow: var(--pc-shadow); }

/* Butonlarda renkli derinlik */
.btn.btn-primary { box-shadow: 0 6px 16px rgba(var(--bs-primary-rgb), .28); }
.btn.btn-primary:hover { box-shadow: 0 9px 22px rgba(var(--bs-primary-rgb), .38); }
.btn.btn-danger { box-shadow: 0 6px 16px rgba(var(--bs-danger-rgb), .24); }
.btn.btn-success { box-shadow: 0 6px 16px rgba(var(--bs-success-rgb), .24); }

/* Avatar / symbol: gradient + iç-dış gölge ile hacim */
.symbol > .symbol-label {
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .22), rgba(0, 0, 0, .05));
    box-shadow: 0 3px 8px rgba(23, 32, 66, .10), inset 0 1px 1px rgba(255, 255, 255, .35);
}

/* Modal: belirgin yükseklik */
.modal-content { box-shadow: 0 30px 70px rgba(15, 20, 40, .28); border: 0; }

/* Solid input alanlarında hafif iç gölge (girinti hissi) */
.form-control.form-control-solid, .form-select.form-select-solid {
    box-shadow: inset 0 1px 2px rgba(23, 32, 66, .05);
}

/* Badge ve alert ince derinlik */
.badge { box-shadow: 0 1px 2px rgba(23, 32, 66, .07); }
.alert { box-shadow: 0 2px 10px rgba(23, 32, 66, .05); }

/* Klasör chip'leri */
.pc-chip {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .5rem .95rem; border-radius: 2rem;
    background: var(--bs-gray-100); color: var(--bs-gray-700);
    font-size: .85rem; font-weight: 600; cursor: pointer;
    border: 1px solid var(--bs-gray-200); transition: all .15s ease; user-select: none;
}
.pc-chip:hover { background: var(--bs-gray-200); color: var(--bs-gray-800); }
.pc-chip.active { background: var(--bs-primary); color: #fff; border-color: var(--bs-primary); box-shadow: 0 4px 12px rgba(var(--bs-primary-rgb), .3); }
.pc-chip.active .opacity-75 { opacity: .85 !important; }
.pc-chip-fav.active { background: #f6b100; border-color: #f6b100; box-shadow: 0 4px 12px rgba(246,177,0,.35); }

/* Favori yıldızı — gri değil: boş soft mavi, hover sarı, dolu parıltılı sarı */
.btn-star i { transition: all .18s ease; color: var(--bs-primary); opacity: .30; }
.btn-star:hover i { opacity: 1; color: #f6b100; transform: scale(1.25); }
.btn-star.is-fav i { color: #f6b100; opacity: 1; filter: drop-shadow(0 2px 5px rgba(246,177,0,.55)); }

/* Kart tıklanabilir */
.pc-card { cursor: pointer; }
.pc-card:hover { border-color: rgba(var(--bs-primary-rgb), .35); }

/* Şifre detay paneli — karttan büyüyerek açılır (FLIP) */
.pc-detail-backdrop {
    position: fixed; inset: 0; z-index: 1090;
    background: rgba(15, 20, 40, 0); transition: background .35s ease;
}
.pc-detail-backdrop.show { background: rgba(15, 20, 40, .55); backdrop-filter: blur(2px); }
/* SweetAlert onay kutusu, detay panelinin (z-index:1090) ve modalların ÜSTÜNDE kalmalı. */
.swal2-container { z-index: 100000 !important; }
/* Layout FLIP: kart konum/boyutundan gerçek boyuta — transform yok, dolayısıyla dikey ezme yok */
.pc-detail-panel {
    position: fixed; overflow: hidden;
    display: flex; flex-direction: column;
    background: var(--bs-body-bg); border-radius: 1.5rem;
    box-shadow: 0 40px 90px rgba(0, 0, 0, .45);
    will-change: top, left, width, height;
    transition: top .44s cubic-bezier(.2,.9,.25,1), left .44s cubic-bezier(.2,.9,.25,1),
                width .44s cubic-bezier(.2,.9,.25,1), height .44s cubic-bezier(.2,.9,.25,1),
                border-radius .44s ease;
}
/* Gövde, header'dan sonra kalan tüm yüksekliği doldurur; içerik alanı büyür,
   düzenle/sil footer'ı içerik kısa olsa bile hep en altta kalır. */
.pc-detail-panel .pcd-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; }
.pc-detail-panel .pcd-body > :first-child { flex: 1 1 auto; }   /* içerik alanı büyür, footer hep altta kalır */
.pc-detail-panel .pcd-header { flex-shrink: 0; border-top-left-radius: 1.5rem; border-top-right-radius: 1.5rem; }
.pc-detail-panel .pcd-loading { flex: 1 1 auto; }
/* İçerik: panel büyürken gizli, animasyon bitince belirir (yalnız logo/başlık görünür kalır) */
.pc-detail-panel .pcd-body { opacity: 0; transform: translateY(12px); transition: opacity .32s ease, transform .32s ease; }
.pc-detail-panel.content-in .pcd-body { opacity: 1; transform: none; }
[data-bs-theme="dark"] .pc-detail-panel { box-shadow: 0 40px 90px rgba(0, 0, 0, .7); }

/* Detay paneli içi "Paylaş" sayfası (sheet) — alttan kayarak belirir */
.pcd-share-sheet {
    position: absolute; inset: 0; z-index: 5;
    background: var(--bs-body-bg);
    display: flex; flex-direction: column;
    opacity: 0; transform: translateY(18px);
    transition: opacity .28s ease, transform .28s cubic-bezier(.2,.9,.25,1);
}
.pcd-share-sheet.in { opacity: 1; transform: none; }
.pcd-share-sheet .pcs-head, .pcd-share-sheet .pcs-unlock, .pcd-share-sheet .pcs-bar { flex-shrink: 0; }
.pcd-share-sheet .pcs-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; }
.pcd-share-sheet .pcs-grp { transition: border-color .15s ease, background-color .15s ease; }
.pcd-share-sheet .pcs-grp:not(.opacity-50):hover { border-color: rgba(var(--bs-primary-rgb), .5) !important; }
.pcd-share-sheet .pcs-grp.border-primary { border-style: solid !important; }

/* Parola danışmanı — skor halkası */
.score-ring {
    width: 170px; height: 170px; border-radius: 50%;
    background: conic-gradient(var(--c) calc(var(--p) * 3.6deg), var(--bs-gray-200) 0deg);
    display: flex; align-items: center; justify-content: center;
}
.score-inner {
    width: 138px; height: 138px; border-radius: 50%;
    background: var(--bs-body-bg);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.adv-cat { transition: transform .15s ease; }
.adv-cat:hover { transform: translateY(-3px); }

/* Detay loading logosu — nabız */
.pcd-pulse { animation: pcdPulse 1.6s ease-in-out infinite; }
@keyframes pcdPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.06); } }

/* ============ Dark mode uyumu ============ */
[data-bs-theme="dark"] .app-wrapper,
[data-bs-theme="dark"] .app-main,
[data-bs-theme="dark"] #kt_app_content { background-color: #0f1117; }

[data-bs-theme="dark"] {
    --pc-shadow: 0 4px 18px rgba(0, 0, 0, .35), 0 1.5px 4px rgba(0, 0, 0, .30);
    --pc-shadow-hover: 0 16px 36px rgba(0, 0, 0, .50), 0 4px 10px rgba(0, 0, 0, .40);
}
[data-bs-theme="dark"] .card { border-color: rgba(255, 255, 255, .05); }
[data-bs-theme="dark"] .modal-content { box-shadow: 0 30px 70px rgba(0, 0, 0, .6); }
[data-bs-theme="dark"] .symbol > .symbol-label {
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .06), rgba(0, 0, 0, .18));
    box-shadow: 0 3px 8px rgba(0, 0, 0, .35), inset 0 1px 1px rgba(255, 255, 255, .06);
}