/* ============================================================
   PTS — Kurumsal ERP Tasarım Sistemi (gradient + efekt katmanı)
   Renk/tipografi/radius MudTheme'den (PtsTheme.cs) gelir.
   Buraya YALNIZCA MudBlazor ile ifade edilemeyen şeyler yazılır:
   gradient'ler, hover efektleri, sol menü kimliği.
   Gradient kuralı (ölçülü): sadece sol menü, login, dashboard KPI.
   ============================================================ */

:root {
    --pts-radius-card: 16px;
    --pts-shadow-soft: 0 2px 8px rgba(15, 23, 42, .06);
    --pts-shadow-kpi: 0 6px 20px rgba(37, 99, 235, .18);
    --pts-ease: .18s ease;
}

body {
    font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ---- Üst bar: beyaz zeminde ince alt çizgi (içerikle karışmasın) ---- */
.mud-appbar.mud-appbar-fixed-top {
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

/* ============================================================
   SOL MENÜ — uygulamanın en güçlü görsel alanı (koyu lacivert ada)
   ============================================================ */
.pts-drawer .mud-drawer-content {
    background: linear-gradient(180deg, #0F172A 0%, #1E293B 100%);
    border-right: none;
}

/* Menü grupları arası ferahlık */
.pts-drawer .mud-nav-group,
.pts-drawer > .mud-navmenu > .mud-nav-link {
    margin: 2px 8px;
}

.pts-drawer .mud-navmenu {
    padding: 8px 0;
}

/* Link ve grup başlıkları: açık gri metin, yuvarlak köşe */
.pts-drawer .mud-nav-link,
.pts-drawer .mud-nav-group .mud-nav-link.mud-nav-group-header {
    color: #CBD5E1 !important;
    border-radius: 10px;
    transition: background-color var(--pts-ease), color var(--pts-ease);
}

.pts-drawer .mud-nav-link .mud-icon-root,
.pts-drawer .mud-nav-group .mud-nav-link .mud-icon-root {
    color: #94A3B8;
    transition: color var(--pts-ease);
}

/* Hover: hafif mavi tint */
.pts-drawer .mud-nav-link:hover {
    background-color: rgba(37, 99, 235, .18) !important;
    color: #FFFFFF !important;
}

.pts-drawer .mud-nav-link:hover .mud-icon-root {
    color: #FFFFFF;
}

/* Aktif menü: mavi gradient + beyaz + hafif glow */
.pts-drawer .mud-nav-link.active {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%) !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, .45);
}

.pts-drawer .mud-nav-link.active .mud-icon-root {
    color: #FFFFFF;
}

.pts-drawer .mud-nav-group .mud-nav-link.mud-nav-group-header:hover {
    background-color: rgba(148, 163, 184, .12) !important;
    color: #FFFFFF !important;
}

/* ---- Modül rayı (sol dikey ikon şeridi) + panel yerleşimi ---- */
.pts-nav {
    display: flex;
    height: 100%;
    min-height: 0;
}

.pts-nav-panel {
    flex: 1 1 auto;
    min-width: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

/* Geliştirici bilgisi — menünün en altına yaslanır (BydySoft / bydysoft.com) */
.pts-dev-credit {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 16px 12px 20px;
    text-decoration: none;
    opacity: .65;
    transition: opacity .15s ease;
}

.pts-dev-credit:hover {
    opacity: 1;
}

.pts-dev-credit-label {
    font-size: .68rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .55);
}

.pts-dev-credit-logo {
    height: 26px;
    width: auto;
    display: block;
}

/* Ray yalnızca 2+ modül varken çıkar */
.pts-rail {
    flex: 0 0 66px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 6px;
    background: rgba(0, 0, 0, .28);
    border-right: 1px solid rgba(255, 255, 255, .06);
}

.pts-rail-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 9px 2px;
    border: none;
    border-radius: 12px;
    background: transparent;
    color: #94A3B8;
    font-size: .64rem;
    font-weight: 700;
    letter-spacing: .01em;
    cursor: pointer;
    transition: background-color var(--pts-ease), color var(--pts-ease), box-shadow var(--pts-ease);
}

.pts-rail-item .mud-icon-root {
    font-size: 1.45rem;
    color: inherit;
}

.pts-rail-item:hover {
    background: rgba(37, 99, 235, .18);
    color: #FFFFFF;
}

.pts-rail-item.active {
    background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%);
    color: #FFFFFF;
    box-shadow: 0 4px 12px rgba(37, 99, 235, .45);
}

.pts-nav-sep {
    border-color: rgba(255, 255, 255, .08) !important;
    margin: 8px 12px;
}

/* ============================================================
   KPI / ÖZET KARTLARI — gradient (yalnızca dashboard)
   ============================================================ */
.pts-kpi {
    position: relative;
    border-radius: var(--pts-radius-card);
    padding: 20px;
    color: #FFFFFF;
    overflow: hidden;
    min-height: 118px;
    box-shadow: var(--pts-shadow-kpi);
    transition: transform var(--pts-ease), box-shadow var(--pts-ease);
    cursor: pointer;
    height: 100%;
}

.pts-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(37, 99, 235, .26);
}

.pts-kpi .pts-kpi-icon {
    position: absolute;
    top: 16px;
    right: 16px;
    opacity: .28;
    font-size: 3.2rem;
    line-height: 1;
}

.pts-kpi .pts-kpi-label {
    font-size: .8rem;
    font-weight: 500;
    opacity: .92;
    letter-spacing: .2px;
}

.pts-kpi .pts-kpi-value {
    font-size: 2.1rem;
    font-weight: 700;
    line-height: 1.15;
    margin-top: 4px;
}

.pts-kpi .pts-kpi-caption {
    font-size: .72rem;
    opacity: .85;
    margin-top: 2px;
}

/* Gradient varyantları (spec renkleri) */
.pts-kpi-blue   { background: linear-gradient(135deg, #2563EB 0%, #60A5FA 100%); }
.pts-kpi-green  { background: linear-gradient(135deg, #16A34A 0%, #4ADE80 100%); }
.pts-kpi-amber  { background: linear-gradient(135deg, #F59E0B 0%, #FBBF24 100%); }
.pts-kpi-red    { background: linear-gradient(135deg, #DC2626 0%, #F87171 100%); }
.pts-kpi-violet { background: linear-gradient(135deg, #7C3AED 0%, #A855F7 100%); }
.pts-kpi-cyan   { background: linear-gradient(135deg, #0891B2 0%, #06B6D4 100%); }

/* ============================================================
   SAYFA BAŞLIĞI (PageHeader) — DÜZ beyaz panel + renkli ikon avatar
   (ERP ciddiyeti için header'da gradient YOK)
   ============================================================ */
.pts-page-header {
    border-radius: var(--pts-radius-card);
    box-shadow: var(--pts-shadow-soft) !important;
}

.pts-page-header .pts-header-avatar {
    box-shadow: 0 4px 12px rgba(37, 99, 235, .28);
}

/* ============================================================
   KART HOVER — genel kalkma efekti (opt-in .pts-hover)
   ============================================================ */
.pts-hover {
    transition: transform var(--pts-ease), box-shadow var(--pts-ease);
}

.pts-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(15, 23, 42, .10);
}

/* Butonlarda hafif basınç hissi */
.mud-button-root:active {
    transform: scale(.99);
}

/* ============================================================
   LOGIN — gradient arka plan (yalnızca giriş sayfası)
   ============================================================ */
.pts-login-bg {
    min-height: 100vh;
    background: linear-gradient(135deg, #0F172A 0%, #1E3A8A 55%, #2563EB 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}