/* ===================================================================
   Portly — Aurora Glass theme
   Tek ortak stil dosyası. Tüm sayfalar bu dosyayı yükler.
   Düşük donanım odaklı: animasyonsuz radial-gradient bg, fake glass.
   =================================================================== */

/* Base */
body{
    background:
        radial-gradient(ellipse 600px 500px at 8% -10%, rgba(124,92,255,.32), transparent 60%),
        radial-gradient(ellipse 700px 500px at 110% 110%, rgba(34,211,238,.22), transparent 60%),
        #070712;
    background-attachment: fixed;
    color:#e6e6f0;
    font-family:'Outfit',sans-serif;
}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.16)}

/* Glass surfaces */
.glass, .bento-card{
    background: rgba(20,20,40,.72);
    border: 1px solid rgba(255,255,255,.07);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.04),
        0 1px 2px rgba(0,0,0,.4);
    transition: border-color .2s ease, transform .2s ease;
    contain: layout paint style;
}
.glass:hover, .bento-card:hover{ border-color: rgba(255,255,255,.14) }
.glass-strong{
    background: rgba(13,13,28,.85);
    border: 1px solid rgba(255,255,255,.08);
}
@media (min-width:1024px) and (prefers-reduced-transparency: no-preference){
    @supports (backdrop-filter: blur(1px)){
        .glass, .bento-card{ background: rgba(20,20,40,.45); backdrop-filter: blur(20px) saturate(140%); -webkit-backdrop-filter: blur(20px) saturate(140%) }
        .glass-strong{ background: rgba(13,13,28,.55); backdrop-filter: blur(28px) saturate(150%); -webkit-backdrop-filter: blur(28px) saturate(150%) }
    }
}

/* Tailwind utility shims */
.bg-panel{ background-color: rgba(13,13,28,.85) !important }
.bg-void { background-color: rgba(7,7,18,.92) !important }

/* Sidebar active */
.sidebar-link.active{
    background: linear-gradient(90deg, rgba(124,92,255,.18), rgba(34,211,238,.06));
    color:#c5b8ff;
    border:1px solid rgba(124,92,255,.25);
    box-shadow: inset 2px 0 0 #7c5cff;
}

/* Lang switch */
.lang-btn{ font-size:.75rem;font-weight:700;padding:.25rem .5rem;border-radius:.35rem;transition:.15s }
.lang-btn.active{ background:linear-gradient(135deg,#7c5cff,#22d3ee); color:#fff }
.lang-btn.inactive{ color:#9aa0b4 }
.lang-btn.inactive:hover{ color:#fff; background:rgba(255,255,255,.05) }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
    *,*::before,*::after{ animation-duration:0ms!important; transition-duration:0ms!important }
}

/* Compact sidebar nav */
.nav-icon{
    display:flex;align-items:center;gap:12px;
    padding:12px;border-radius:14px;
    color:#9aa0b4;font-weight:500;font-size:14px;
    border:1px solid transparent;
    transition:.15s; position:relative;
}
@media (min-width: 768px){
    .nav-icon{ justify-content:center; padding:12px }
    .nav-icon > span{ display:none }
}
.nav-icon:hover{ background:rgba(255,255,255,.05); color:#fff }
.nav-icon.active{
    color:#c5b8ff;
    background:linear-gradient(135deg, rgba(124,92,255,.18), rgba(34,211,238,.08));
    border-color: rgba(124,92,255,.3);
    box-shadow: 0 4px 16px rgba(124,92,255,.18);
}
@media (min-width: 768px){
    .nav-icon[title]:hover::after{
        content: attr(title);
        position:absolute; left: calc(100% + 12px); top:50%; transform:translateY(-50%);
        background:#13132a; color:#fff; padding:6px 10px; border-radius:8px;
        font-size:12px; white-space:nowrap; border:1px solid rgba(255,255,255,.1);
        box-shadow:0 8px 24px rgba(0,0,0,.5); z-index:50; pointer-events:none;
    }
}

/* Gradient text */
.grad-text{
    background:linear-gradient(135deg,#fff 0%,#b39bff 100%);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
}

/* Brand button presets */
.btn-grad{
    color:#fff; font-weight:700;
    background:linear-gradient(135deg,#7c5cff,#22d3ee);
    box-shadow:0 8px 24px rgba(124,92,255,.35);
    transition: transform .15s ease;
}
.btn-grad:hover{ transform: translateY(-1px) }
.btn-grad:active{ transform: translateY(0) scale(.98) }

/* Aurora background blob — landing pages için ek görsel katman */
.aurora-blob{
    position:fixed; pointer-events:none; z-index:0;
    width:520px; height:520px; border-radius:50%;
    filter:blur(80px); opacity:.4;
}