/* ==========================================================================
   str-theme.css
   Ogrenci Test Sonuclari (/management/student-test-results) ekranindaki
   renk paleti ve tipografiyi Bootstrap tabanli calisma ekranlarina tasir.

   Kullanim: sayfanin tum markup'ini <div class="str-theme"> ... </div> ile sar.
   Sadece renk / tipografi / yuzey stilleri override edilir; yerlesim
   (grid, flex, spacing) Bootstrap'te oldugu gibi kalir.

   Bootstrap 5.3'ten SONRA yuklenmelidir.
   ========================================================================== */

.str-theme {
    /* ---------- Palet (OgrenciTestSonuclari.razor ile birebir) ---------- */
    --str-bg: #030914;
    --str-bg2: #071326;
    --str-panel: #0b1930;
    --str-panel2: #10213b;
    --str-text: #eff7ff;
    --str-muted: #9eb3c9;
    --str-cyan: #0bc6d8;
    --str-cyan2: #66edf5;
    --str-blue: #2f66ff;
    --str-purple: #7657ff;
    --str-green: #25c98b;
    --str-orange: #ffab4a;
    --str-red: #ff667d;
    --str-yellow: #ffd15c;
    --str-line: rgba(170, 205, 255, 0.15);
    --str-line-strong: rgba(170, 205, 255, 0.28);
    --str-shadow: 0 28px 80px rgba(0, 0, 0, 0.35);
    --str-surface: rgba(255, 255, 255, 0.045);
    --str-surface-2: rgba(255, 255, 255, 0.075);
    --str-input-bg: #091a31;

    /* ---------- Bootstrap degiskenlerinin yeniden eslenmesi ---------- */
    --bs-body-color: var(--str-text);
    --bs-body-color-rgb: 239, 247, 255;
    --bs-emphasis-color: #ffffff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: var(--str-muted);
    --bs-secondary-color-rgb: 158, 179, 201;
    --bs-tertiary-color: rgba(158, 179, 201, 0.75);
    --bs-heading-color: var(--str-text);
    --bs-border-color: var(--str-line);
    --bs-border-color-translucent: var(--str-line);
    --bs-link-color: var(--str-cyan2);
    --bs-link-color-rgb: 102, 237, 245;
    --bs-link-hover-color: #a5f6fb;
    --bs-link-hover-color-rgb: 165, 246, 251;
    --bs-code-color: var(--str-cyan2);
    --bs-highlight-bg: rgba(255, 209, 92, 0.25);

    /* ---------- Sayfa yuzeyi ---------- */
    font-family: Inter, "Segoe UI", Arial, sans-serif;
    color: var(--str-text);
    line-height: 1.5;
    background:
        radial-gradient(circle at 78% 0%, rgba(47, 102, 255, 0.26), transparent 34%),
        radial-gradient(circle at 15% 20%, rgba(11, 198, 216, 0.12), transparent 28%),
        linear-gradient(160deg, var(--str-bg2), var(--str-bg) 70%);
    background-attachment: local;
    border-radius: 26px;
    /* Icerik kisa kaldiginda altta acik renkli layout zemini gorunmesin */
    min-height: calc(100vh - 6.5rem);
    min-height: calc(100dvh - 6.5rem);
}

.str-theme,
.str-theme * {
    box-sizing: border-box;
}

/* ---------- Tipografi ---------- */
.str-theme h1,
.str-theme h2,
.str-theme h3,
.str-theme h4,
.str-theme h5,
.str-theme h6 {
    color: var(--str-text);
    font-weight: 800;
    line-height: 1.2;
}

.str-theme h4 {
    font-size: clamp(19px, 1.8vw, 25px);
}

.str-theme h5 {
    font-size: 17px;
}

.str-theme h6 {
    font-size: 15px;
}

.str-theme small,
.str-theme .small {
    font-size: 0.8125rem;
}

.str-theme .fw-bold,
.str-theme .fw-semibold {
    color: inherit;
}

.str-theme hr {
    border-color: var(--str-line);
    opacity: 1;
}

.str-theme a {
    text-decoration: none;
}

.str-theme a:hover {
    text-decoration: underline;
}

/* ---------- Metin renk yardimcilari ---------- */
.str-theme .text-muted,
.str-theme .text-secondary {
    color: var(--str-muted) !important;
}

.str-theme .text-dark,
.str-theme .text-black,
.str-theme .text-body,
.str-theme .text-body-emphasis {
    color: var(--str-text) !important;
}

.str-theme .text-primary {
    color: var(--str-cyan2) !important;
}

.str-theme .text-success {
    color: #54e0ad !important;
}

.str-theme .text-warning {
    color: var(--str-yellow) !important;
}

.str-theme .text-danger {
    color: #ff8798 !important;
}

.str-theme .text-info {
    color: #80eef7 !important;
}

.str-theme .text-white,
.str-theme .text-light {
    color: #ffffff !important;
}

/* ---------- Arka plan yardimcilari ---------- */
.str-theme .bg-white,
.str-theme .bg-body,
.str-theme .bg-body-tertiary,
.str-theme .bg-body-secondary,
.str-theme .bg-light {
    background-color: rgba(11, 25, 48, 0.82) !important;
    color: var(--str-text);
}

/* Filtre / arac cubugu seritleri: Bootstrap varsayilani beyaza yakin oldugu icin
   acik zemin uzerinde acik metin okunmuyordu. Panelden bir ton acik yuzey kullan. */
.str-theme .bg-light-subtle {
    background-color: rgba(102, 237, 245, 0.07) !important;
    color: var(--str-text);
}

.str-theme .bg-dark,
.str-theme .bg-dark-subtle {
    background-color: var(--str-bg) !important;
}

.str-theme .bg-primary {
    background-color: var(--str-blue) !important;
    color: #fff !important;
}

.str-theme .bg-secondary {
    background-color: #33507a !important;
    color: #fff !important;
}

.str-theme .bg-success {
    background-color: #19b980 !important;
    color: #04150e !important;
}

.str-theme .bg-danger {
    background-color: #e8536b !important;
    color: #fff !important;
}

.str-theme .bg-warning {
    background-color: var(--str-yellow) !important;
    color: #2a1c00 !important;
}

.str-theme .bg-info {
    background-color: var(--str-cyan) !important;
    color: #03181b !important;
}

.str-theme .bg-purple {
    background-color: var(--str-purple) !important;
    color: #fff !important;
}

/* subtle varyantlar -> saydam rozet zeminleri */
.str-theme .bg-primary-subtle {
    background-color: rgba(47, 102, 255, 0.16) !important;
}

.str-theme .bg-secondary-subtle {
    background-color: rgba(158, 179, 201, 0.12) !important;
}

.str-theme .bg-success-subtle {
    background-color: rgba(37, 201, 139, 0.14) !important;
}

.str-theme .bg-danger-subtle {
    background-color: rgba(255, 102, 125, 0.14) !important;
}

.str-theme .bg-warning-subtle {
    background-color: rgba(255, 209, 92, 0.14) !important;
}

.str-theme .bg-info-subtle {
    background-color: rgba(11, 198, 216, 0.14) !important;
}

.str-theme .border-primary-subtle {
    border-color: rgba(47, 102, 255, 0.32) !important;
}

.str-theme .border-secondary-subtle {
    border-color: var(--str-line) !important;
}

.str-theme .border-success-subtle {
    border-color: rgba(37, 201, 139, 0.3) !important;
}

.str-theme .border-danger-subtle {
    border-color: rgba(255, 102, 125, 0.3) !important;
}

.str-theme .border-warning-subtle {
    border-color: rgba(255, 209, 92, 0.3) !important;
}

.str-theme .border-info-subtle {
    border-color: rgba(11, 198, 216, 0.3) !important;
}

/* ---------- Kartlar ---------- */
.str-theme .card {
    --bs-card-bg: transparent;
    --bs-card-color: var(--str-text);
    --bs-card-border-color: var(--str-line);
    --bs-card-cap-bg: rgba(255, 255, 255, 0.04);
    --bs-card-cap-color: var(--str-text);
    background-image: linear-gradient(155deg, rgba(16, 33, 59, 0.94), rgba(7, 20, 40, 0.92));
    color: var(--str-text);
    /* border-0 / shadow-sm yardimcilarini ezmek icin inset cerceve kullanilir */
    box-shadow: inset 0 0 0 1px var(--str-line), 0 18px 44px rgba(0, 0, 0, 0.3) !important;
}

.str-theme .card-header,
.str-theme .card-footer {
    border-color: var(--str-line);
    color: var(--str-text);
}

.str-theme .card-header.bg-success {
    background: linear-gradient(135deg, #19b980, var(--str-green)) !important;
    color: #03150e !important;
}

.str-theme .card-header.bg-primary {
    background: linear-gradient(135deg, var(--str-cyan), var(--str-blue)) !important;
    color: #fff !important;
}

/* Not: .border / .border-top gibi yardimcilar --bs-border-color degiskenini
   kullandigi icin ayrica ezilmeleri gerekmez; .str-theme uzerinde tanimli. */

/* ---------- Butonlar ---------- */
.str-theme .btn {
    --bs-btn-focus-shadow-rgb: 102, 237, 245;
    font-weight: 700;
    transition: 0.2s transform, 0.2s border-color, 0.2s background-color;
}

.str-theme .btn:hover {
    transform: translateY(-1px);
}

.str-theme .btn:disabled,
.str-theme .btn.disabled {
    transform: none;
    opacity: 0.45;
}

.str-theme .btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--str-blue);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #4176ff;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #2559e6;
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--str-blue);
    --bs-btn-disabled-border-color: transparent;
    background-image: linear-gradient(135deg, var(--str-cyan), var(--str-blue));
    box-shadow: 0 12px 28px rgba(47, 102, 255, 0.25);
}

.str-theme .btn-success {
    --bs-btn-color: #03150e;
    --bs-btn-bg: var(--str-green);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: #03150e;
    --bs-btn-hover-bg: #2fd897;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: #03150e;
    --bs-btn-active-bg: #1cb47b;
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: #03150e;
    --bs-btn-disabled-bg: var(--str-green);
    --bs-btn-disabled-border-color: transparent;
    background-image: linear-gradient(135deg, #19b980, var(--str-green));
}

.str-theme .btn-warning {
    --bs-btn-color: #2a1c00;
    --bs-btn-bg: var(--str-yellow);
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: #2a1c00;
    --bs-btn-hover-bg: #ffdb7d;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: #2a1c00;
    --bs-btn-active-bg: #efbf46;
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: #2a1c00;
    --bs-btn-disabled-bg: var(--str-yellow);
    --bs-btn-disabled-border-color: transparent;
    background-image: linear-gradient(135deg, var(--str-orange), var(--str-yellow));
}

.str-theme .btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: #e8536b;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #f36780;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #d3475e;
    --bs-btn-active-border-color: transparent;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #e8536b;
    --bs-btn-disabled-border-color: transparent;
    background-image: linear-gradient(135deg, #d94a60, var(--str-red));
}

.str-theme .btn-secondary,
.str-theme .btn-light,
.str-theme .btn-dark {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--str-panel2);
    --bs-btn-border-color: var(--str-line);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #162c4d;
    --bs-btn-hover-border-color: rgba(102, 237, 245, 0.5);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #0d1c33;
    --bs-btn-active-border-color: rgba(102, 237, 245, 0.5);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: var(--str-panel2);
    --bs-btn-disabled-border-color: var(--str-line);
}

/* Outline butonlar: seffaf zemin + palet rengi */
.str-theme .btn-outline-secondary,
.str-theme .btn-outline-dark,
.str-theme .btn-outline-light {
    --bs-btn-color: #d7e6f7;
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--str-line);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: rgba(255, 255, 255, 0.06);
    --bs-btn-hover-border-color: rgba(102, 237, 245, 0.5);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: rgba(255, 255, 255, 0.1);
    --bs-btn-active-border-color: rgba(102, 237, 245, 0.5);
    --bs-btn-disabled-color: #d7e6f7;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--str-line);
}

/* Projedeki Bootstrap 5.1 surumu --bs-btn-* degiskenlerini desteklemiyor; bu
   yuzden outline butonlarin rengi dogrudan da yazilmali. Aksi halde Bootstrap
   varsayilani (#6c757d gri) koyu zeminde okunmuyor. */
.str-theme .btn-outline-secondary,
.str-theme .btn-outline-dark {
    color: #d7e6f7;
    background-color: transparent;
    border-color: var(--str-line-strong);
}

.str-theme .btn-outline-secondary:hover,
.str-theme .btn-outline-dark:hover,
.str-theme .btn-outline-secondary:focus,
.str-theme .btn-outline-dark:focus {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(102, 237, 245, 0.5);
}

.str-theme .btn-outline-secondary:active,
.str-theme .btn-outline-dark:active,
.str-theme .btn-outline-secondary.active,
.str-theme .btn-outline-dark.active {
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.12);
    border-color: rgba(102, 237, 245, 0.5);
}

.str-theme .btn-outline-secondary:disabled,
.str-theme .btn-outline-dark:disabled,
.str-theme .btn-outline-secondary.disabled,
.str-theme .btn-outline-dark.disabled {
    color: var(--str-muted);
    background-color: transparent;
    border-color: var(--str-line);
}

.str-theme .btn-outline-primary {
    --bs-btn-color: var(--str-cyan2);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: rgba(102, 237, 245, 0.42);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: rgba(11, 198, 216, 0.16);
    --bs-btn-hover-border-color: var(--str-cyan2);
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: rgba(11, 198, 216, 0.24);
    --bs-btn-active-border-color: var(--str-cyan2);
    --bs-btn-disabled-color: var(--str-cyan2);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: rgba(102, 237, 245, 0.42);
}

.str-theme .btn-outline-success {
    --bs-btn-color: #54e0ad;
    --bs-btn-bg: transparent;
    --bs-btn-border-color: rgba(37, 201, 139, 0.42);
    --bs-btn-hover-color: #03150e;
    --bs-btn-hover-bg: var(--str-green);
    --bs-btn-hover-border-color: var(--str-green);
    --bs-btn-active-color: #03150e;
    --bs-btn-active-bg: #1cb47b;
    --bs-btn-active-border-color: #1cb47b;
    --bs-btn-disabled-color: #54e0ad;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: rgba(37, 201, 139, 0.42);
}

.str-theme .btn-outline-warning {
    --bs-btn-color: var(--str-yellow);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: rgba(255, 209, 92, 0.42);
    --bs-btn-hover-color: #2a1c00;
    --bs-btn-hover-bg: var(--str-yellow);
    --bs-btn-hover-border-color: var(--str-yellow);
    --bs-btn-active-color: #2a1c00;
    --bs-btn-active-bg: #efbf46;
    --bs-btn-active-border-color: #efbf46;
    --bs-btn-disabled-color: var(--str-yellow);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: rgba(255, 209, 92, 0.42);
}

.str-theme .btn-outline-danger {
    --bs-btn-color: #ff8798;
    --bs-btn-bg: transparent;
    --bs-btn-border-color: rgba(255, 102, 125, 0.42);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-hover-bg: #e8536b;
    --bs-btn-hover-border-color: #e8536b;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: #d3475e;
    --bs-btn-active-border-color: #d3475e;
    --bs-btn-disabled-color: #ff8798;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: rgba(255, 102, 125, 0.42);
}

.str-theme .btn-close {
    filter: invert(1) grayscale(1) brightness(2.2);
    opacity: 0.7;
}

.str-theme .btn-close:hover {
    opacity: 1;
}

.str-theme .btn-group > .btn {
    transform: none;
}

/* ---------- Form elemanlari ---------- */
.str-theme .form-control,
.str-theme .form-select {
    background-color: var(--str-input-bg);
    border-color: var(--str-line);
    color: var(--str-text);
}

.str-theme .form-control:focus,
.str-theme .form-select:focus {
    background-color: var(--str-input-bg);
    border-color: rgba(102, 237, 245, 0.45);
    color: var(--str-text);
    box-shadow: 0 0 0 0.2rem rgba(11, 198, 216, 0.15);
}

.str-theme .form-control::placeholder {
    color: #6d84a0;
    opacity: 1;
}

.str-theme .form-control:disabled,
.str-theme .form-select:disabled,
.str-theme .form-control[readonly] {
    background-color: rgba(9, 26, 49, 0.55);
    color: var(--str-muted);
}

.str-theme .form-select {
    /* varsayilan koyu ok ikonu koyu zeminde gorunmez; acik renkli ile degistirilir */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%239eb3c9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}

.str-theme .form-select option {
    background-color: var(--str-panel);
    color: var(--str-text);
}

.str-theme .form-label,
.str-theme .col-form-label {
    color: #cfe0f2;
    font-weight: 600;
}

.str-theme .form-text {
    color: var(--str-muted);
}

.str-theme .input-group-text {
    background-color: rgba(255, 255, 255, 0.05);
    border-color: var(--str-line);
    color: var(--str-muted);
}

.str-theme .input-group-text.bg-white {
    background-color: var(--str-input-bg) !important;
}

.str-theme .form-check-input {
    background-color: var(--str-input-bg);
    border-color: var(--str-line-strong);
}

.str-theme .form-check-input:checked {
    background-color: var(--str-cyan);
    border-color: var(--str-cyan);
}

.str-theme .form-check-input:focus {
    border-color: rgba(102, 237, 245, 0.45);
    box-shadow: 0 0 0 0.2rem rgba(11, 198, 216, 0.15);
}

.str-theme .form-check-label {
    color: #cfe0f2;
}

.str-theme .form-switch .form-check-input:not(:checked) {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%239eb3c9'/%3e%3c/svg%3e");
}

.str-theme .form-range::-webkit-slider-runnable-track {
    background-color: #1a3152;
}

.str-theme .form-range::-moz-range-track {
    background-color: #1a3152;
}

.str-theme .form-range::-webkit-slider-thumb {
    background-color: var(--str-cyan);
}

.str-theme .form-range::-moz-range-thumb {
    background-color: var(--str-cyan);
}

.str-theme .invalid-feedback {
    color: #ff8798;
}

.str-theme .form-control.is-invalid,
.str-theme .form-select.is-invalid,
.str-theme .is-invalid {
    border-color: rgba(255, 102, 125, 0.55);
}

/* ---------- Rozetler ---------- */
.str-theme .badge {
    font-weight: 800;
    letter-spacing: 0.01em;
}

.str-theme .badge.bg-light,
.str-theme .badge.bg-white {
    background-color: rgba(255, 255, 255, 0.06) !important;
    color: #c3d5e8 !important;
    border-color: var(--str-line) !important;
}

.str-theme .badge.bg-light.text-dark,
.str-theme .badge.bg-white.text-dark {
    color: #c3d5e8 !important;
}

.str-theme .badge.bg-success-subtle {
    color: #54e0ad !important;
}

.str-theme .badge.bg-primary-subtle {
    color: #80eef7 !important;
}

.str-theme .badge.bg-warning-subtle {
    color: var(--str-yellow) !important;
}

.str-theme .badge.bg-danger-subtle {
    color: #ff8798 !important;
}

.str-theme .badge.bg-info-subtle {
    color: #80eef7 !important;
}

.str-theme .badge.bg-secondary-subtle {
    color: #c3d5e8 !important;
}

.str-theme .text-bg-success {
    background-color: #19b980 !important;
    color: #03150e !important;
}

.str-theme .text-bg-danger {
    background-color: #e8536b !important;
    color: #fff !important;
}

.str-theme .text-bg-warning {
    background-color: var(--str-yellow) !important;
    color: #2a1c00 !important;
}

/* ---------- Uyarilar ---------- */
.str-theme .alert {
    --bs-alert-color: var(--str-text);
    border-width: 1px;
}

.str-theme .alert-success {
    --bs-alert-color: #54e0ad;
    --bs-alert-bg: rgba(37, 201, 139, 0.12);
    --bs-alert-border-color: rgba(37, 201, 139, 0.25);
}

.str-theme .alert-danger {
    --bs-alert-color: #ff8798;
    --bs-alert-bg: rgba(255, 102, 125, 0.12);
    --bs-alert-border-color: rgba(255, 102, 125, 0.25);
}

.str-theme .alert-warning {
    --bs-alert-color: var(--str-yellow);
    --bs-alert-bg: rgba(255, 209, 92, 0.12);
    --bs-alert-border-color: rgba(255, 209, 92, 0.25);
}

.str-theme .alert-info {
    --bs-alert-color: #cfe3f4;
    --bs-alert-bg: rgba(11, 198, 216, 0.08);
    --bs-alert-border-color: rgba(11, 198, 216, 0.22);
}

.str-theme .alert-light,
.str-theme .alert-secondary {
    --bs-alert-color: #c3d5e8;
    --bs-alert-bg: rgba(255, 255, 255, 0.045);
    --bs-alert-border-color: var(--str-line);
}

/* border-0 alert'lerde de ince cerceve korunur */
.str-theme .alert.border-0 {
    box-shadow: inset 0 0 0 1px var(--bs-alert-border-color) !important;
}

/* ---------- Tablolar ---------- */
.str-theme .table {
    --bs-table-color: var(--str-text);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--str-line);
    --bs-table-striped-color: var(--str-text);
    --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
    --bs-table-hover-color: var(--str-text);
    --bs-table-hover-bg: rgba(255, 255, 255, 0.05);
    --bs-table-active-color: var(--str-text);
    --bs-table-active-bg: rgba(11, 198, 216, 0.12);
    color: var(--str-text);
    border-color: var(--str-line);
}

.str-theme .table > thead {
    color: var(--str-cyan2);
}

.str-theme .table > thead th {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 900;
    color: var(--str-cyan2);
    border-bottom-color: var(--str-line);
    background-color: rgba(255, 255, 255, 0.03);
}

.str-theme .table > thead.table-light th,
.str-theme .table .table-light > th,
.str-theme .table .table-light > td {
    --bs-table-bg: rgba(255, 255, 255, 0.04);
    --bs-table-color: var(--str-cyan2);
    background-color: rgba(255, 255, 255, 0.04);
    color: var(--str-cyan2);
    border-color: var(--str-line);
}

.str-theme .table > :not(caption) > * > * {
    border-bottom-color: var(--str-line);
}

/* ---------- Liste gruplari ---------- */
.str-theme .list-group {
    --bs-list-group-color: var(--str-text);
    --bs-list-group-bg: transparent;
    --bs-list-group-border-color: var(--str-line);
    --bs-list-group-action-color: var(--str-text);
    --bs-list-group-action-hover-color: #ffffff;
    --bs-list-group-action-hover-bg: rgba(255, 255, 255, 0.05);
    --bs-list-group-action-active-color: #ffffff;
    --bs-list-group-action-active-bg: rgba(255, 255, 255, 0.08);
    --bs-list-group-active-color: #ffffff;
    --bs-list-group-active-bg: rgba(11, 198, 216, 0.16);
    --bs-list-group-active-border-color: rgba(102, 237, 245, 0.28);
    --bs-list-group-disabled-color: var(--str-muted);
    --bs-list-group-disabled-bg: transparent;
}

.str-theme .list-group-item.active {
    background-image: linear-gradient(135deg, rgba(11, 198, 216, 0.13), rgba(47, 102, 255, 0.12));
}

/* ---------- Sekmeler ---------- */
.str-theme .nav-pills {
    --bs-nav-pills-link-active-color: #ffffff;
    --bs-nav-pills-link-active-bg: var(--str-blue);
    --bs-nav-link-color: var(--str-muted);
    --bs-nav-link-hover-color: var(--str-cyan2);
}

.str-theme .nav-pills .nav-link {
    border: 1px solid transparent;
    font-weight: 800;
    font-size: 12.5px;
}

.str-theme .nav-pills .nav-link:not(.active):hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.str-theme .nav-pills .nav-link.active {
    background-image: linear-gradient(135deg, var(--str-cyan), var(--str-blue));
    border-color: transparent;
}

.str-theme .nav-tabs {
    --bs-nav-tabs-border-color: var(--str-line);
    --bs-nav-tabs-link-active-color: var(--str-text);
    --bs-nav-tabs-link-active-bg: var(--str-panel2);
    --bs-nav-tabs-link-active-border-color: var(--str-line);
    --bs-nav-tabs-link-hover-border-color: var(--str-line);
    --bs-nav-link-color: var(--str-muted);
    --bs-nav-link-hover-color: var(--str-cyan2);
}

/* ---------- Modallar ---------- */
.str-theme .modal {
    --bs-modal-color: var(--str-text);
    --bs-modal-bg: var(--str-panel);
    --bs-modal-border-color: var(--str-line);
    --bs-modal-header-border-color: var(--str-line);
    --bs-modal-footer-border-color: var(--str-line);
    --bs-modal-border-radius: 22px;
}

.str-theme .modal-content {
    background-image: linear-gradient(155deg, rgba(16, 33, 59, 0.97), rgba(7, 20, 40, 0.97));
    box-shadow: var(--str-shadow) !important;
    color: var(--str-text);
}

.str-theme .modal-header,
.str-theme .modal-footer {
    border-color: var(--str-line);
}

.str-theme .modal-title {
    color: var(--str-text);
    font-weight: 800;
}

.str-theme .modal-header.bg-primary,
.str-theme .modal-header.bg-success,
.str-theme .modal-header.bg-danger {
    color: #fff !important;
}

/* ---------- Diger bilesenler ---------- */
.str-theme .spinner-border {
    border-color: rgba(102, 237, 245, 0.2);
    border-right-color: var(--str-cyan2);
}

.str-theme .spinner-border.text-primary {
    border-color: rgba(102, 237, 245, 0.2);
    border-right-color: var(--str-cyan2);
}

.str-theme .progress {
    --bs-progress-bg: #1a3152;
    --bs-progress-bar-bg: var(--str-cyan);
}

.str-theme .progress-bar {
    background-image: linear-gradient(90deg, var(--str-cyan), var(--str-blue));
}

.str-theme .toast {
    --bs-toast-bg: var(--str-panel2);
    --bs-toast-color: var(--str-text);
    --bs-toast-border-color: var(--str-line);
    --bs-toast-header-bg: rgba(255, 255, 255, 0.04);
    --bs-toast-header-color: var(--str-text);
}

.str-theme .dropdown-menu {
    --bs-dropdown-bg: var(--str-panel2);
    --bs-dropdown-color: var(--str-text);
    --bs-dropdown-border-color: var(--str-line);
    --bs-dropdown-link-color: var(--str-text);
    --bs-dropdown-link-hover-color: #ffffff;
    --bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.06);
    --bs-dropdown-link-active-bg: rgba(11, 198, 216, 0.18);
    --bs-dropdown-divider-bg: var(--str-line);
}

.str-theme .accordion {
    --bs-accordion-bg: transparent;
    --bs-accordion-color: var(--str-text);
    --bs-accordion-border-color: var(--str-line);
    --bs-accordion-btn-bg: rgba(255, 255, 255, 0.04);
    --bs-accordion-btn-color: var(--str-text);
    --bs-accordion-active-bg: rgba(11, 198, 216, 0.12);
    --bs-accordion-active-color: var(--str-cyan2);
}

.str-theme .pagination {
    --bs-pagination-bg: transparent;
    --bs-pagination-color: var(--str-text);
    --bs-pagination-border-color: var(--str-line);
    --bs-pagination-hover-bg: rgba(255, 255, 255, 0.06);
    --bs-pagination-hover-color: #ffffff;
    --bs-pagination-active-bg: var(--str-blue);
    --bs-pagination-active-border-color: transparent;
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-color: var(--str-muted);
}

/* Bootstrap disi yardimci ogeler */
/* Sticky basliklarin altindan icerik gorunmemesi icin opak zemin sart */
.str-theme .sticky-top {
    background-color: #071326;
}

.str-theme .sticky-top.bg-light,
.str-theme .sticky-top.bg-white,
.str-theme .sticky-top.bg-body,
.str-theme .sticky-top.bg-body-secondary,
.str-theme .sticky-top.bg-body-tertiary {
    background-color: #0c1c33 !important;
    color: var(--str-cyan2);
}

.str-theme .mdi {
    color: inherit;
}

/* ---------- Kaydirma cubuklari ---------- */
.str-theme * {
    scrollbar-width: thin;
    scrollbar-color: rgba(102, 237, 245, 0.35) transparent;
}

.str-theme ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.str-theme ::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
    border-radius: 999px;
}

.str-theme ::-webkit-scrollbar-thumb {
    background: rgba(102, 237, 245, 0.32);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.str-theme ::-webkit-scrollbar-thumb:hover {
    background: rgba(102, 237, 245, 0.5);
    background-clip: padding-box;
}

@media (max-width: 860px) {
    .str-theme {
        border-radius: 18px;
    }
}