/*
   SkyraIrl Blackspace Refresh
   Final visual adaptation from the approved black/minimal mockups.
   Loaded after page CSS, except Simulation.
*/
:root {
    --bs-bg: #02040a;
    --bs-bg-2: #050917;
    --bs-panel: rgba(8, 13, 24, .76);
    --bs-panel-2: rgba(3, 7, 16, .82);
    --bs-line: rgba(38, 52, 78, .95);
    --bs-line-soft: rgba(38, 52, 78, .62);
    --bs-text: #edf5ff;
    --bs-muted: rgba(166, 181, 208, .72);
    --bs-dim: rgba(130, 146, 174, .52);
    --bs-cyan: #46d9ff;
    --bs-violet: #8b7cff;
    --bs-amber: #f6c65b;
    --bs-green: #43e0b0;
    --bs-rose: #ff6b8a;
    --bs-radius: 14px;
    --bs-shadow: 0 22px 70px rgba(0,0,0,.32);
}

body.skyra-body {
    background:
        radial-gradient(circle at 18% 8%, rgba(70,217,255,.11), transparent 28%),
        radial-gradient(circle at 82% 10%, rgba(139,124,255,.11), transparent 27%),
        linear-gradient(180deg, var(--bs-bg) 0%, var(--bs-bg-2) 48%, var(--bs-bg) 100%) !important;
    color: var(--bs-text) !important;
}
body.skyra-body::before {
    background-image:
        radial-gradient(1px 1px at 8% 18%, rgba(255,255,255,.45), transparent 60%),
        radial-gradient(1px 1px at 22% 74%, rgba(70,217,255,.30), transparent 60%),
        radial-gradient(1px 1px at 42% 28%, rgba(255,255,255,.28), transparent 60%),
        radial-gradient(1px 1px at 66% 18%, rgba(139,124,255,.34), transparent 60%),
        radial-gradient(1px 1px at 88% 68%, rgba(255,255,255,.35), transparent 60%);
    background-size: 260px 230px;
    opacity: .6;
}

.skyra-nav {
    height: 64px !important;
    background: rgba(2,4,10,.90) !important;
    border-bottom: 1px solid var(--bs-line) !important;
    box-shadow: none !important;
    backdrop-filter: blur(18px);
}
.skyra-brand, .footer-brand { color: var(--bs-text) !important; letter-spacing: 0 !important; }
.skyra-link, .skyra-btn-outline, .lang-btn {
    border-radius: 8px !important;
    color: var(--bs-muted) !important;
    box-shadow: none !important;
}
.skyra-link:hover, .skyra-link--active, .skyra-btn-outline--active {
    background: rgba(70,217,255,.08) !important;
    color: #e8fbff !important;
}
.skyra-link--active::after { background: linear-gradient(90deg, var(--bs-cyan), var(--bs-violet)) !important; height: 1px !important; }
.skyra-main { position: relative; z-index: 1; }
.skyra-footer { background: rgba(2,4,10,.88) !important; border-top: 1px solid var(--bs-line) !important; }

.skyra-card,
.dash-hero,
.dash-stat,
.dash-panel,
.mem-view-toggle,
.mem-search-input,
.mem-chip,
.mem-galaxy-main,
.mem-tier-panel,
.member-card,
.qz-card,
.qz-state-card,
.qz-unsolved-card,
.qz-history-card,
.qc-sidebar,
.qc-main,
.qc-catpanel,
.question-card {
    background: var(--bs-panel) !important;
    border: 1px solid var(--bs-line) !important;
    box-shadow: none !important;
}

.skyra-input,
.qc-pts-input,
.form-control,
.form-select,
textarea,
select {
    background: rgba(3,7,16,.78) !important;
    border: 1px solid var(--bs-line) !important;
    color: var(--bs-text) !important;
    border-radius: 10px !important;
}
.skyra-input:focus,
.form-control:focus,
.form-select:focus,
textarea:focus,
select:focus {
    outline: none !important;
    border-color: rgba(70,217,255,.58) !important;
    box-shadow: 0 0 0 3px rgba(70,217,255,.12) !important;
}

/* ── Standart birincil buton: mor→camgöbeği gradyan (her iki tema) ── */
.btn-skyra-primary,
.dash-btn--primary,
.qz-start-btn,
.qz-home-btn,
.home-btn-primary,
.qco-act--primary,
.mem-view-btn--active,
.mem-tier-list-all,
.qc-submit-btn {
    background: linear-gradient(135deg, #7b5cff, #2aa8d8) !important;
    border: 1px solid rgba(123,92,255,.5) !important;
    color: #ffffff !important;
    box-shadow: 0 12px 32px rgba(123,92,255,.22) !important;
}
.btn-skyra-ghost,
.dash-btn--ghost,
.skyra-btn-outline,
.qc-add-q-btn {
    background: rgba(8,13,24,.58) !important;
    border: 1px solid var(--bs-line) !important;
    color: rgba(218,226,244,.82) !important;
}

/* Dashboard */
.dash-hero {
    margin: 24px clamp(16px, 2.6vw, 42px) 16px !important;
    padding: clamp(26px, 3.4vw, 48px) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 78% 50%, rgba(70,217,255,.14), transparent 31%),
        linear-gradient(135deg, rgba(8,13,24,.92), rgba(3,7,16,.76)) !important;
}
.dash-hero-grid { grid-template-columns: minmax(340px,.9fr) minmax(420px,1.1fr) !important; gap: clamp(24px, 4vw, 56px) !important; }
.dash-hero-badge { color: #bff3ff !important; background: rgba(70,217,255,.08) !important; border-color: rgba(70,217,255,.25) !important; }
.dash-hero-title { color: var(--bs-text) !important; font-size: clamp(2.2rem, 5vw, 4.4rem) !important; letter-spacing: 0 !important; }
.dash-hero-sub { color: var(--bs-muted) !important; max-width: 48ch !important; }
.dash-section { margin: 0 clamp(16px, 2.6vw, 42px) 16px !important; }
.dash-stats { gap: 12px !important; }
.dash-stat { padding: 16px !important; border-radius: 14px !important; }
.dash-stat-value { color: var(--bs-text) !important; }
.dash-stat-label, .dash-panel-empty { color: var(--bs-muted) !important; }
.dash-panels { grid-template-columns: 1.05fr 1fr 1fr !important; gap: 14px !important; }
.dash-panel { border-radius: 14px !important; padding: 18px !important; }
.dash-panel-title, .dash-live-label, .dash-task-label, .dash-leader-nick { color: var(--bs-text) !important; }
.dash-task, .dash-live-row { background: rgba(3,7,16,.44) !important; border-color: var(--bs-line-soft) !important; }
.dash-task-pts, .dash-leader-pts, .dash-rank-pts, .qz-res-score, .qz-pts-badge, .text-gold { color: var(--bs-amber) !important; text-shadow: none !important; }
.dash-ranks { display: grid !important; grid-template-columns: repeat(5, minmax(0,1fr)) !important; gap: 12px !important; margin: 0 clamp(16px, 2.6vw, 42px) 34px !important; }
.dash-rank-card { background: rgba(8,13,24,.68) !important; border: 1px solid var(--bs-line) !important; border-radius: 14px !important; padding: 16px !important; min-height: 104px !important; position: relative; overflow: hidden; }
.dash-rank-card::after { content:''; position:absolute; right:-34px; bottom:-52px; width:132px; height:132px; border-radius:50%; border:1px solid color-mix(in srgb, var(--rank-color) 48%, transparent); opacity:.72; }
.dash-rank-name { color: var(--bs-text) !important; font-weight: 800 !important; }
.dash-rank-desc { color: var(--bs-muted) !important; font-size: .8rem !important; }

/* Members */
.mem-page { padding: 28px clamp(16px, 2.6vw, 42px) 36px !important; gap: 16px !important; }
.mem-title { color: var(--bs-text) !important; }
.mem-subtitle { color: var(--bs-muted) !important; }
.mem-title-icon { color: var(--bs-cyan) !important; filter: drop-shadow(0 0 10px rgba(70,217,255,.24)) !important; }
.mem-view-btn, .mem-chip { color: var(--bs-muted) !important; }
.mem-chip--active { color: #c9f6ff !important; background: rgba(70,217,255,.08) !important; border-color: rgba(70,217,255,.48) !important; }
.mem-galaxy { grid-template-columns: minmax(0,1.55fr) minmax(320px,.75fr) !important; }
.mem-galaxy-main, .mem-tier-panel { border-radius: 18px !important; padding: 22px !important; }
.mem-cosmos { min-height: 420px !important; background: radial-gradient(circle at 50% 50%, rgba(70,217,255,.10), rgba(3,7,16,.16) 44%, rgba(3,7,16,.62)) !important; }
.mem-cosmos::before, .mem-cosmos::after { content:''; position:absolute; inset:10% 12%; pointer-events:none; background-image: radial-gradient(2px 2px at 20% 30%, rgba(70,217,255,.62), transparent 60%), radial-gradient(2px 2px at 38% 62%, rgba(255,255,255,.38), transparent 60%), radial-gradient(2px 2px at 62% 38%, rgba(139,124,255,.54), transparent 60%), radial-gradient(2px 2px at 76% 70%, rgba(246,198,91,.48), transparent 60%); }
.mem-cosmos::after { inset: 20% 22%; transform: rotate(28deg); opacity: .5; }
.mem-tier-name, .mem-tier-panel-name, .mem-tier-top-nick, .member-nick { color: var(--bs-text) !important; }
.mem-tier-meta, .mem-tier-panel-sub, .member-streak, .mem-foot, .mem-foot-total, .mem-foot-meta { color: var(--bs-muted) !important; }
.member-card { border-radius: 14px !important; min-height: 190px !important; }
.member-link, .mem-tier-top-pts { color: var(--bs-cyan) !important; }

/* Quiz */
.qz-page { width: min(1120px, calc(100% - 32px)) !important; margin: 0 auto !important; padding: 34px 0 70px !important; align-items: stretch !important; }
.qz-daily-counter { align-self:center; display:inline-flex; gap:8px; align-items:center; padding:7px 14px; border:1px solid var(--bs-line); border-radius:999px; background:var(--bs-panel); color:var(--bs-muted); }
.qz-card, .qz-state-card { max-width: 760px !important; border-radius: 18px !important; background: radial-gradient(circle at 82% 28%, rgba(70,217,255,.10), transparent 26%), linear-gradient(135deg, rgba(8,13,24,.90), rgba(3,7,16,.82)) !important; }
.qz-card::before { content:''; position:absolute; right:34px; top:28px; width:150px; height:150px; border-radius:50%; border:1px solid rgba(70,217,255,.16); box-shadow: inset 0 0 0 44px rgba(70,217,255,.015); pointer-events:none; }
.qz-intro-badge, .qz-meta-pill, .qz-res-percentile { background: rgba(3,7,16,.54) !important; border:1px solid var(--bs-line) !important; color:var(--bs-muted) !important; }
.qz-intro-title, .qz-question-text, .qz-history-title, .qz-unsolved-title { color: var(--bs-text) !important; }
.qz-intro-desc, .qz-state-card p, .qz-res-ratio { color: var(--bs-muted) !important; }
.qz-progress-bar { background: linear-gradient(90deg, var(--bs-cyan), var(--bs-violet)) !important; }
.qz-dot.active { background: var(--bs-cyan) !important; border-color: var(--bs-cyan) !important; box-shadow:0 0 10px rgba(70,217,255,.48) !important; }
.qz-dot.done { background: var(--bs-green) !important; border-color: var(--bs-green) !important; }
.qz-opt, .qz-unsolved-card, .qz-res-row { background: rgba(3,7,16,.50) !important; border-color: var(--bs-line) !important; color: #dce8f8 !important; }
.qz-opt:hover:not(.disabled), .qz-opt.selected { border-color: rgba(70,217,255,.45) !important; background: rgba(70,217,255,.08) !important; transform: translateX(3px) !important; }
.qz-opt-letter { color:#9defff !important; background: rgba(70,217,255,.08) !important; border-color: rgba(70,217,255,.20) !important; }
.qz-unsolved-grid { display:grid !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 10px !important; }
.qz-unsolved-card { display:block !important; border-radius: 12px !important; padding:14px 16px !important; text-decoration:none !important; }
.qz-unsolved-meta { display:flex; gap:12px; margin-top:8px; color:var(--bs-muted); font-size:.82rem; }

/* Quiz create */
.qc-page-wrap { padding: 24px clamp(12px, 2.4vw, 34px) 56px !important; }
.qc-row { padding: 0 !important; align-items: flex-start !important; }
.qc-sidebar, .qc-main, .qc-catpanel { border-radius: 16px !important; background: var(--bs-panel) !important; border:1px solid var(--bs-line) !important; }
.qc-sidebar-inner { padding: 22px 20px !important; }
.qc-sidebar-title, .qc-num, .qc-catpanel-title { color: var(--bs-text) !important; }
.qc-sidebar-sub, .qc-catpanel-sub, .qc-type-label, .qc-kw-title, .qc-kw-hint { color: var(--bs-muted) !important; }
.qc-main::before { content:'Soru Editörü'; display:block; margin-bottom:14px; color:var(--bs-muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; font-weight:800; }
.question-card { background: rgba(3,7,16,.45) !important; border-radius: 14px !important; }
.qc-add-q-btn, .tag-chip, .qc-type-btn, .qc-add-ans-btn, .media-dz, .img-ans-dz, .media-filled { background: rgba(3,7,16,.48) !important; border-color:var(--bs-line) !important; color:rgba(205,222,245,.78) !important; }
.qc-add-q-btn:hover, .tag-chip:hover, .qc-type-btn.active, .tag-chip--active { border-color:rgba(70,217,255,.45) !important; background:rgba(70,217,255,.08) !important; color:#dff8ff !important; }
.qc-del, .img-ans-remove { color: var(--bs-rose) !important; }
.qc-kw-section { border-top: 1px solid var(--bs-line) !important; margin-top:18px !important; padding-top:16px !important; }

/* Auth */
.auth-wrapper {
    min-height: calc(100vh - 128px) !important;
    padding: clamp(28px, 6vw, 72px) 16px !important;
}
.auth-glow {
    width: min(720px, 92vw) !important;
    height: 440px !important;
    background:
        radial-gradient(circle at 50% 24%, rgba(70,217,255,.18), transparent 34%),
        radial-gradient(circle at 68% 64%, rgba(139,124,255,.13), transparent 36%) !important;
}
.auth-card {
    max-width: 460px !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 86% 8%, rgba(70,217,255,.12), transparent 28%),
        linear-gradient(150deg, rgba(8,13,24,.96), rgba(3,7,16,.88)) !important;
    border: 1px solid var(--bs-line) !important;
    box-shadow: var(--bs-shadow) !important;
}
.auth-logo {
    width: 56px;
    height: 56px;
    margin: 0 auto 14px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(70,217,255,.08);
    border: 1px solid rgba(70,217,255,.24);
    font-size: 1.7rem !important;
}
.auth-title { color: var(--bs-text) !important; font-size: 1.55rem !important; }
.auth-sub, .auth-footer, .field-error { color: var(--bs-muted) !important; }
.auth-link { color: var(--bs-cyan) !important; }
.auth-checkbox { accent-color: var(--bs-cyan); }

/* Admin and moderator */
.admin-page,
.page-container--sm,
#profile-container {
    padding-top: 28px !important;
    padding-bottom: 42px !important;
}
.admin-sidebar {
    background: rgba(2,4,10,.94) !important;
    border-right: 1px solid var(--bs-line) !important;
    box-shadow: none !important;
}
.as-header {
    border-bottom: 1px solid var(--bs-line) !important;
}
.as-title,
.skyra-title,
.page-title,
.pending-title {
    color: var(--bs-text) !important;
    letter-spacing: 0 !important;
}
.as-group-label {
    color: var(--bs-dim) !important;
    letter-spacing: .08em !important;
}
.as-link {
    color: var(--bs-muted) !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
}
.as-link:hover,
.as-link.active {
    background: rgba(70,217,255,.08) !important;
    border-color: rgba(70,217,255,.24) !important;
    color: #e8fbff !important;
}
.as-toggle,
.admin-sidebar-open {
    background: rgba(8,13,24,.82) !important;
    border: 1px solid var(--bs-line) !important;
    color: var(--bs-muted) !important;
    border-radius: 10px !important;
}
.stat-box,
.pending-card,
.notif-card,
.info-acc-item,
.qz-item-card,
.qz-recent-row,
.badge-item,
.av-dropzone,
.pf-subtab,
.platform-item,
.poll-active-box,
.poll-start-form,
.stat-mini,
.an-card,
.cat-row {
    background: rgba(8,13,24,.66) !important;
    border: 1px solid var(--bs-line) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
}
.stat-box:hover,
.pending-card:hover,
.notif-card:hover,
.info-acc-item:hover,
.qz-item-card:hover {
    border-color: rgba(70,217,255,.35) !important;
}
.stat-value,
.an-val,
.stat-mini-val,
.profile-nick,
.profile-levelup-text,
.profile-maxlvl-text,
.qz-item-title,
.qz-recent-title,
.cat-name {
    color: var(--bs-text) !important;
}
.stat-label,
.skyra-subtitle,
.pending-meta,
.pending-desc,
.notif-msg,
.notif-time,
.empty-state,
.profile-rank,
.profile-bio,
.profile-joined,
.qz-item-meta,
.qz-recent-frac,
.qz-recent-date,
.cat-id,
.cat-empty {
    color: var(--bs-muted) !important;
}
.section-head,
.pf-subhead,
.profile-astro-head,
.notif-title {
    color: #c9f6ff !important;
}
.skyra-table th {
    color: var(--bs-muted) !important;
    border-bottom: 1px solid var(--bs-line) !important;
}
.skyra-table td {
    color: rgba(220,232,248,.86) !important;
    border-bottom: 1px solid rgba(38,52,78,.48) !important;
}
.skyra-table tr:hover td {
    background: rgba(70,217,255,.045) !important;
}
.sim-add-btn,
.skyra-btn-small,
.cat-kw-save-btn,
.cat-del-btn,
.notif-mark-btn {
    background: rgba(8,13,24,.58) !important;
    border: 1px solid var(--bs-line) !important;
    color: var(--bs-muted) !important;
    border-radius: 9px !important;
}
.sim-add-btn:hover,
.skyra-btn-small:hover,
.cat-kw-save-btn:hover,
.notif-mark-btn:hover {
    border-color: rgba(70,217,255,.45) !important;
    color: #dff8ff !important;
    background: rgba(70,217,255,.08) !important;
}
.del-btn,
.skyra-btn-reject,
.cat-del-btn {
    border-color: rgba(255,107,138,.35) !important;
    color: #ff9eb1 !important;
}
.skyra-btn-approve {
    background: rgba(67,224,176,.10) !important;
    border-color: rgba(67,224,176,.36) !important;
    color: #8cf5d2 !important;
}
.notif-unread {
    background:
        linear-gradient(90deg, rgba(70,217,255,.11), rgba(8,13,24,.68) 46%) !important;
    border-color: rgba(70,217,255,.34) !important;
}
.notif-read { opacity: .76; }
.notif-top { gap: 16px; }
.notif-link { color: var(--bs-cyan) !important; }

/* Profile */
.profile-theme-toggle {
    background: rgba(8,13,24,.66) !important;
    border: 1px solid var(--bs-line) !important;
    color: var(--bs-muted) !important;
}
.profile-avatar-img {
    border-color: rgba(70,217,255,.35) !important;
    box-shadow: 0 0 24px rgba(70,217,255,.18) !important;
}
.profile-avatar {
    filter: drop-shadow(0 0 18px rgba(70,217,255,.22));
}
.pf-tabs {
    gap: 8px !important;
    padding: 6px !important;
    background: rgba(8,13,24,.46);
    border: 1px solid var(--bs-line) !important;
    border-radius: 14px !important;
}
.pf-tab {
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    color: var(--bs-muted) !important;
    padding: 9px 14px !important;
}
.pf-tab:hover,
.pf-tab.active,
.pf-subtab:hover,
.pf-subtab.active {
    background: rgba(70,217,255,.08) !important;
    border-color: rgba(70,217,255,.34) !important;
    color: #e8fbff !important;
}
.pf-tab.active { font-weight: 700 !important; }
.pf-subtab { color: var(--bs-muted) !important; }
.progress-bar-bg,
.pts-brk-bar,
.badge-item .badge-progress {
    background: rgba(3,7,16,.80) !important;
    border: 1px solid rgba(38,52,78,.64);
}
.progress-bar-fill {
    background: linear-gradient(90deg, var(--bs-cyan), var(--bs-violet)) !important;
}
.badge-item.earned {
    background: rgba(246,198,91,.08) !important;
    border-color: rgba(246,198,91,.28) !important;
}
.badge-item.locked {
    opacity: .45 !important;
}
.astro-modal-overlay {
    background: rgba(2,4,10,.86) !important;
}
.astro-modal-card {
    background: linear-gradient(150deg, rgba(8,13,24,.98), rgba(3,7,16,.94)) !important;
    border: 1px solid rgba(70,217,255,.34) !important;
    border-radius: 18px !important;
}
.astro-modal-title,
.astro-modal-grid strong {
    color: var(--bs-text) !important;
}
.astro-modal-type,
.astro-lbl,
.astro-modal-traits {
    color: var(--bs-muted) !important;
}
.astro-modal-meaning,
.astro-modal-grid > div {
    background: rgba(70,217,255,.06) !important;
    border-color: rgba(70,217,255,.22) !important;
}

/* Info */
.info-hero {
    min-height: calc(100vh - 64px) !important;
    background:
        radial-gradient(circle at 50% 52%, rgba(70,217,255,.14), transparent 30%),
        linear-gradient(180deg, #02040a, #050917) !important;
}
.info-hero__title {
    color: var(--bs-text) !important;
    letter-spacing: 0 !important;
    text-shadow: 0 0 34px rgba(70,217,255,.26) !important;
}
.info-hero__subtitle {
    color: var(--bs-muted) !important;
}
.info-scroll-cta {
    border-color: rgba(70,217,255,.42) !important;
    color: var(--bs-cyan) !important;
}
.info-timeline-section,
.info-faq-section {
    background: transparent !important;
}
.info-timeline::before {
    background: linear-gradient(to bottom, transparent, rgba(70,217,255,.42) 10%, rgba(139,124,255,.34) 90%, transparent) !important;
}
.info-tl-card {
    background: rgba(8,13,24,.72) !important;
    border-color: var(--bs-line) !important;
    border-radius: 16px !important;
}
.info-tl-icon {
    background: #050917 !important;
    border-color: rgba(70,217,255,.40) !important;
    box-shadow: 0 0 24px rgba(70,217,255,.18) !important;
}
.info-tl-tag {
    background: rgba(8,13,24,.86) !important;
    border-color: rgba(70,217,255,.25) !important;
    color: var(--bs-cyan) !important;
    border-radius: 8px !important;
}
.info-tl-title,
.info-acc-btn {
    color: var(--bs-text) !important;
}
.info-tl-desc,
.info-tl-detail,
.info-acc-body p {
    color: var(--bs-muted) !important;
}
.info-tl-tip,
.info-acc-chevron {
    color: var(--bs-cyan) !important;
}
.info-acc-btn:hover,
.info-acc-btn[aria-expanded="true"] {
    background: rgba(70,217,255,.07) !important;
    color: #e8fbff !important;
}

@media (max-width: 992px) {
    .dash-hero-grid, .dash-panels, .mem-galaxy { grid-template-columns: 1fr !important; }
    .dash-ranks { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
    .mem-cosmos { min-height: 300px !important; }
    .admin-page { padding-left: 16px !important; padding-right: 16px !important; }
    .pf-tabs { flex-wrap: wrap; }
}
@media (max-width: 640px) {
    .dash-ranks, .dash-stats, .qz-unsolved-grid { grid-template-columns: 1fr !important; }
    .qz-card::before { display:none !important; }
    .qc-page-wrap { padding: 12px 10px 40px !important; }
    .auth-card { padding: 28px 22px !important; }
    .notif-top { align-items: flex-start; flex-direction: column; gap: 2px; }
    .info-tl-card { padding: 1.15rem !important; }
}