/* =====================================================================
   Akademik Proje Yönetim - Modern Minimal & Sade Tema
   app.css'in ÜZERİNE biner; kaldırmak isterseniz layout'taki link'i silin.
   ===================================================================== */

:root {
    --modern-font: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
    --modern-radius: 14px;
    --modern-radius-sm: 10px;
    --modern-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 4px 12px rgba(16, 24, 40, .06);
    --modern-shadow-hover: 0 4px 10px rgba(16, 24, 40, .08), 0 12px 28px rgba(16, 24, 40, .10);
    --modern-border: rgba(16, 24, 40, .08);
}

/* ---------- Tipografi ---------- */
body {
    font-family: var(--modern-font);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    letter-spacing: .005em;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    letter-spacing: -.01em;
    font-weight: 650;
}

/* ---------- Ana arka plan ---------- */
[data-bs-theme="light"] body { background: #f7f8fa; }

/* ---------- Layout ---------- */
.layout-main {
    transition: margin-left .25s ease;
}

.topbar {
    background: rgba(255, 255, 255, .85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--modern-border);
}
[data-bs-theme="dark"] .topbar { background: rgba(18, 18, 22, .8); }

.content { padding: 1.75rem; }
.content-footer { border-top: 1px solid var(--modern-border); }

/* ---------- Sidebar ---------- */
.sidebar {
    border-right: 1px solid var(--modern-border);
}
.sidebar-nav .nav-link {
    border-radius: var(--modern-radius-sm);
    font-weight: 450;
}
.sidebar-nav .nav-link.active {
    /* Aktif menu kutusu rengi gorunum ayarlarindan gelir (theme_sidebar_active_bg);
       ayarlanmamissa --brand-primary degerini devralir. */
    background: linear-gradient(135deg, var(--sidebar-active-bg), var(--sidebar-active-bg-dark));
    box-shadow: 0 4px 12px rgba(var(--sidebar-active-bg-rgb), .35);
}
.nav-section { font-weight: 600; }

/* ========== Daraltilabilir Ikon Sidebar (Ultra Minimal) ========== */
.sidebar {
    transition: width .28s cubic-bezier(.4, 0, .2, 1), transform .28s ease;
    overflow: hidden;
}
.sidebar.collapsed { width: 76px; }

.sidebar.collapsed .sidebar-brand {
    padding: 0 .5rem;
    justify-content: center;
    gap: 0;
}
.sidebar.collapsed .sidebar-brand span,
.sidebar.collapsed .sidebar-logo-img { display: none; }
.sidebar.collapsed .sidebar-brand i { font-size: 1.45rem; }

.sidebar.collapsed .nav-section { display: none; }

.sidebar.collapsed .sidebar-nav .nav-link {
    justify-content: center;
    padding: .65rem 0;
    margin: .2rem .55rem;
    font-size: 1.05rem;
}
.sidebar.collapsed .sidebar-nav .nav-link span { display: none; }
.sidebar.collapsed .sidebar-nav .nav-link i { font-size: 1.15rem; }

/* Dar modda aktif + hover tooltip */
.sidebar.collapsed .sidebar-nav .nav-link {
    position: relative;
}
.sidebar.collapsed .sidebar-nav .nav-link::after {
    content: attr(title);
    position: absolute;
    left: calc(100% + 12px);
    top: 50%;
    transform: translateY(-50%);
    background: #111827;
    color: #fff;
    font-size: .75rem;
    font-weight: 500;
    padding: .3rem .6rem;
    border-radius: .4rem;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
    z-index: 1050;
    box-shadow: 0 4px 12px rgba(0,0,0,.25);
}
.sidebar.collapsed .sidebar-nav .nav-link:hover::after { opacity: 1; }
[data-bs-theme="dark"] .sidebar.collapsed .sidebar-nav .nav-link::after { background: #1f2937; }

/* Dar modda icerik alani */
.sidebar.collapsed + .layout-main { margin-left: 76px; }

/* Genis ekranda varsayilan genis sidebar, mobilde normal davranis */
@media (min-width: 992px) {
    .sidebar.collapsed { width: 76px; }
}
@media (max-width: 991.98px) {
    .sidebar.collapsed { width: var(--sidebar-width); transform: translateX(-100%); }
    .sidebar.collapsed + .layout-main { margin-left: 0; }
}

/* ---------- Kartlar ---------- */
.card {
    border: 1px solid var(--modern-border);
    border-radius: var(--modern-radius);
    box-shadow: var(--modern-shadow);
    transition: box-shadow .2s ease, transform .2s ease;
}
.card:hover {
    box-shadow: var(--modern-shadow-hover);
}
.card-header {
    background: transparent;
    border-bottom: 1px solid var(--modern-border);
    font-weight: 600;
}
.card-body { padding: 1.5rem; }

/* ---------- İstatistik kartları ---------- */
.stat-card { border-radius: var(--modern-radius); overflow: hidden; position: relative; }
.stat-card::after {
    content: '';
    position: absolute;
    top: 0; right: 0;
    width: 90px; height: 90px;
    background: radial-gradient(circle at top right, rgba(var(--brand-primary-rgb), .10), transparent 70%);
    pointer-events: none;
}
.stat-card:hover { transform: translateY(-3px); }
.stat-icon {
    width: 48px; height: 48px;
    border-radius: var(--modern-radius-sm);
    font-size: 1.25rem;
}

/* ---------- Tablolar ---------- */
.table thead th {
    font-weight: 600;
    text-transform: uppercase;
    font-size: .72rem;
    letter-spacing: .06em;
    color: var(--bs-secondary-color);
}
.table tbody tr {
    transition: background .12s ease;
}
.table-hover tbody tr:hover { background: rgba(var(--brand-primary-rgb), .035); }
.table td { vertical-align: middle; }

.dataTables_filter input {
    border-radius: var(--modern-radius-sm);
    border: 1px solid var(--modern-border);
    padding: .4rem .75rem;
}
/* "show entries" secim kutusu: ok icin sag bosluk korunur (ust uste binmez) */
.dataTables_length select {
    border-radius: var(--modern-radius-sm);
    border: 1px solid var(--modern-border);
    padding: .4rem 2.25rem .4rem .6rem;
    background-position: right .75rem center;
}

/* ---------- Butonlar ---------- */
.btn {
    border-radius: var(--modern-radius-sm);
    font-weight: 500;
    letter-spacing: .01em;
}
.btn-primary {
    box-shadow: 0 2px 8px rgba(var(--brand-primary-rgb), .25);
}
.btn-primary:hover { box-shadow: 0 4px 14px rgba(var(--brand-primary-rgb), .35); }
.btn-icon { border-radius: var(--modern-radius-sm); }

/* ---------- Formlar ---------- */
.form-control, .form-select {
    border-radius: var(--modern-radius-sm);
    border: 1px solid var(--modern-border);
    padding: .5rem .85rem;
}
.form-label { font-weight: 550; font-size: .875rem; }

.input-group .input-group-text {
    border-radius: var(--modern-radius-sm) 0 0 var(--modern-radius-sm);
    background: var(--bs-tertiary-bg);
}

/* ---------- Rozetler ---------- */
.badge { font-weight: 500; letter-spacing: .02em; padding: .4em .7em; }

/* ---------- Dropzone ---------- */
.dropzone {
    border-radius: var(--modern-radius);
    background: var(--bs-tertiary-bg);
}

/* ---------- Auth (Giriş) sayfası — modern kabuk ---------- */
body.auth-body {
    display: block;               /* app.css'teki ortalanmis tek kart duzenini devral */
    padding: 0;
    /* Sayfa zemini koyu video tonunda: video gizlenirse (hareket azaltma) ya da
       yuklenemezse tum sayfa bu rengi gosterir; metin ve kart kontrasti korunur. */
    background-color: #04070f;
}
.auth-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    position: relative;   /* sayfa videosunun (.auth-page-video) uzerinde boyanir */
    z-index: 1;
}

/* --- Sol: marka / tanitim paneli — SAYFA ARKA PLANI = YEREL VIDEO (TAM EKRAN).
   Kullanici istekleri (2026-09-24, kronolojik): panele once bir iStock videosu
   eklendi; sonra yazi/logo arkasindaki karartma ve golgeler, ardindan panelin
   tum arka plani (video + dekor + zemin) kaldirildi; en son hareketli ambiyans
   katmani geri alindi; ardindan verilen yerel video panele eklendi. Son istek:
   "videoyu tam ekran yap" -> secilen yorum: tum giris sayfasi videoyla kaplanir,
   sol metin ve sag giris karti videonun UZERINDE durur.
   Bu yuzden video PANELDEN CIKARILIP sayfa duzeyine tasindi (.auth-page-video,
   position: fixed) ve iki kolonun zeminleri seffafdir; karartma (veil), metin
   perdesi, nokta/bokeh sahneleri, gradyan taban ve ambiyans pseudo katmanlari
   geri getirilmez. Metin ve logo GOLGESIZDIR (kullanici istegi); okunabilirlik
   videonun koyu tonundan gelir. Koyu taban (body.auth-body) video gizlenir ya
   da yuklenemezse kontrasti saglar (WCAG kontrasti testte HESAPLANIR).
   Geri sizmayi engelleyen testler: AuthViewTest icindeki
   testHeroVideoBackdropIsLocalDecorativeAndMotionSafe,
   testHeroPanelBackgroundIsOnlyTheVideo, testHeroEntranceMotionIsReducedMotionSafe,
   testHeroTextColorsSupportContrastOnDarkVideoSurface,
   testHeroTextAndLogoHaveNoBackdropOrShadow. */
.auth-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
    padding: clamp(1.75rem, 3.5vw, 3rem);
    color: #eef4ff;
    background-color: transparent;   /* arkayi sayfa videosu (.auth-page-video) verir */
}

/* SAYFA ARKA PLAN VIDOESI = TUM EKRAN: yerel, filigransiz, sessiz, dongusel.
   Kaynak 1920x1080 (12280043_1920_1080_30fps.mp4) yeniden kodlandi; tam ekranda
   tipik masaustu genisliginde (1440-1920px) olcek ~0,75-1,0 kalir -> yazilimsal
   buyutme yok, goruntu net. object-fit: cover ile ekran orani ne olursa olsun
   kirpma yapilir, bozulma olmaz; position: fixed sayesinde sayfa kaydirilsa da
   ekrani kaplar. Dekordur: olaylari yakalamaz (pointer-events: none), ekran
   okuyuculardan gizlidir (aria-hidden). Hareket azaltma tercihinde GIZLENIR;
   o zaman govdenin koyu tabani (body.auth-body) gorunur. */
.auth-page-video {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    pointer-events: none;
    z-index: 0;
    background-color: #04070f;
}

.auth-hero-brand { position: relative; display: flex; align-items: center; gap: .75rem; }
.auth-hero-logo { max-height: 52px; max-width: 240px; object-fit: contain; }
.auth-hero-name { font-size: 1.05rem; font-weight: 600; letter-spacing: .01em; color: #f2f7ff; }

.auth-mark {
    width: 48px; height: 48px;
    flex: 0 0 auto;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 14px;
    font-size: 1.35rem;
    color: #fff;
    background: linear-gradient(135deg, var(--auth-logo-bg-a), var(--auth-logo-bg-b));
}
.auth-hero-copy { position: relative; max-width: min(30rem, 64%); }
.auth-hero-title {
    font-size: clamp(1.55rem, 2.5vw, 2.3rem);
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 .85rem;
    color: #ffffff;
}
.auth-hero-desc { color: #d3e2f7; margin: 0 0 1.85rem; }
.auth-features { list-style: none; margin: 0; padding: 0; display: grid; gap: .95rem; }
.auth-features li { display: flex; align-items: center; gap: .8rem; font-size: .95rem; font-weight: 500; color: #e6eefb; }
.auth-features li i {
    width: 34px; height: 34px; flex: 0 0 auto;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 10px;
    background: rgba(255, 255, 255, .10);
    border: 1px solid rgba(255, 255, 255, .18);
    color: #d9ecff;
}
.auth-features li span { font-weight: 600; }
.auth-hero-foot { position: relative; color: #c9d9ee; font-size: .85rem; }
/* --- Sag: giris karti --- */
.auth-main {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    padding: clamp(1.5rem, 4vw, 3.25rem);
    background: transparent;   /* giris karti kendi yuzeyini tasir (bkz. .auth-card) */
}
.auth-card {
    width: 100%;
    max-width: 460px;
    border: 1px solid var(--bs-border-color);
    border-radius: 22px;
    background: var(--bs-body-bg);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .14);
}
.auth-card-body { padding: clamp(1.4rem, 3vw, 2.25rem); }
.auth-head { margin-bottom: 1.5rem; text-align: center; }
.auth-title { font-size: 1.45rem; font-weight: 650; margin: 0 0 .35rem; }
.auth-subtitle { color: var(--bs-secondary-color); font-size: .92rem; margin: 0 auto; max-width: 22rem; }
.auth-alert {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    border-radius: 14px;
    font-size: .92rem;
}

/* --- Form alanlari --- */
.auth-field { margin-bottom: 1.05rem; }
.auth-input { position: relative; display: flex; align-items: center; }
.auth-input > i {
    position: absolute;
    left: 1rem;
    color: var(--bs-secondary-color);
    pointer-events: none;
}
.auth-input .form-control { height: 48px; padding-left: 2.7rem; border-radius: 12px; }
.auth-input:focus-within > i { color: var(--brand-primary); }
.auth-input-pw .form-control { padding-right: 3rem; }
.auth-eye {
    position: absolute;
    right: .45rem;
    width: 36px; height: 36px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--bs-secondary-color);
}
.auth-eye:hover { background: var(--bs-tertiary-bg); color: var(--bs-body-color); }
.auth-caps { color: var(--bs-warning-text-emphasis); font-size: .8rem; margin: .45rem 0 0; }
.auth-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.35rem; }
.auth-submit {
    min-width: 150px;
    height: 46px;
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    border-radius: 12px;
    font-weight: 600;
}
.auth-divider {
    display: flex; align-items: center; gap: .75rem;
    margin: 1.5rem 0 1rem;
    color: var(--bs-secondary-color);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .09em;
}
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--bs-border-color); }
.auth-sso {
    width: 100%;
    height: 46px;
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    border: 1px solid var(--bs-border-color);
    border-radius: 12px;
    font-weight: 500;
}
.auth-note { text-align: center; color: var(--bs-secondary-color); font-size: .85rem; margin: .85rem 0 0; }
/* Sag kolondaki telif satiri TAM EKRAN videonun uzerindedir (kart disinda):
   koyu tema tokeni kullanilamaz, sol kolonla ayni acik ton (#c9d9ee) gerekir. */
.auth-foot { color: #c9d9ee; font-size: .82rem; margin: 0; }

/* --- Hareket (reduced-motion'a saygili) --- */
.auth-card, .auth-hero-copy { animation: authRise .45s ease both; }
.auth-hero-copy { animation-delay: .06s; }
@keyframes authRise {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    /* Hareket azaltma: giris animasyonu (authRise) kapanir ve panel arka plan
       videosu gizlenir. Panel koyu taban rengini gosterir; metin kontrasti
       korunur (testle dogrulanir). */
    .auth-card, .auth-hero-copy { animation: none; }
    .auth-page-video { display: none; }
}

/* --- Mobil / tablet: tanitim paneli ince band olur --- */
@media (max-width: 991.98px) {
    .auth-shell { grid-template-columns: 1fr; }
    .auth-hero { padding: 1.15rem 1.35rem; gap: .75rem; }
    .auth-hero-copy, .auth-hero-foot { display: none; }
    .auth-main { justify-content: flex-start; padding: 1.35rem 1.1rem 2rem; }
}

/* ---------- Bildirim (topbar) rozeti ---------- */
#notifBadge { font-size: .62rem; }

/* ---------- Pagination ---------- */
.page-link {
    border-radius: var(--modern-radius-sm);
    margin: 0 2px;
    border: 1px solid var(--modern-border);
}
.page-item.active .page-link { box-shadow: 0 2px 8px rgba(var(--brand-primary-rgb), .35); }

/* ---------- Grafikler: eşit yükseklik & hizalama ---------- */
.chart-body {
    position: relative;
    height: 300px;
}
.chart-body canvas {
    max-height: 100%;
}
.chart-card .card-header {
    min-height: 56px;
    display: flex;
    align-items: center;
}

/* ---------- Patent detay grafikleri ----------
   Chart.js `responsive:true` + `maintainAspectRatio:false` kullanildiginda
   canvas ebeveyn konteynerin boyutunu alir. Ebeveynin yuksekligi sabit
   degilse canvas buyur -> sayfa buyur -> yeniden boyutlandirma tetiklenir ve
   sayfa sonsuz buyuyerek kayar. Bu nedenle konteyner yuksekligi sabittir. */
.patent-chart {
    position: relative;
    height: 280px;
}
.patent-chart canvas {
    max-height: 100%;
}

/* ---------- Kısa ekranlar için boşluk dengeleme ---------- */
@media (max-width: 767.98px) {
    .content { padding: 1rem; }
    .card-body { padding: 1.1rem; }
}