/* ===== style.css ===== */

* {
    box-sizing: border-box;
}

:root {
    --primary: #4f46e5;
    --primary-dark: #3730a3;
    --primary-soft: #eef2ff;
    --secondary: #06b6d4;
    --accent: #f97316;
    --bg: #f6f8fc;
    --card: rgba(255,255,255,0.92);
    --text: #172033;
    --muted: #697386;
    --border: #e6eaf2;
    --success: #16a34a;
    --danger: #dc2626;
    --warning: #f59e0b;
    --purple: #7c3aed;
    --shadow: 0 18px 55px rgba(31, 41, 55, 0.10);
    --shadow-soft: 0 10px 30px rgba(31, 41, 55, 0.07);
}

*::selection {
    background: var(--primary);
    color: white;
}

body {
    margin: 0;
    font-family: Inter, Arial, Helvetica, sans-serif;
    background:
        radial-gradient(circle at top left, rgba(79,70,229,0.15), transparent 34%),
        radial-gradient(circle at top right, rgba(6,182,212,0.14), transparent 30%),
        linear-gradient(180deg, #f8fbff 0%, var(--bg) 45%, #eef3fb 100%);
    color: var(--text);
    min-height: 100vh;
}

a { color: inherit; }

.header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255,255,255,0.82);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(230,234,242,0.8);
    color: var(--text);
    padding: 16px 7%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.logo {
    font-size: 25px;
    font-weight: 900;
    text-decoration: none;
    letter-spacing: -0.8px;
    color: var(--primary-dark);
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.logo::before {
    content: "✓";
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: inline-grid;
    place-items: center;
    color: white;
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    box-shadow: 0 10px 22px rgba(79,70,229,0.28);
}

.nav {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.nav a {
    color: #334155;
    text-decoration: none;
    margin-left: 0;
    font-weight: 750;
    font-size: 14px;
    padding: 10px 12px;
    border-radius: 999px;
    transition: 0.2s ease;
}

.nav a:hover {
    background: var(--primary-soft);
    color: var(--primary-dark);
}

.hero {
    width: 86%;
    max-width: 1250px;
    margin: 34px auto 0;
    padding: 66px 56px;
    border-radius: 34px;
    background:
        linear-gradient(135deg, rgba(79,70,229,0.96), rgba(6,182,212,0.86)),
        url("data:image/svg+xml,%3Csvg width='800' height='500' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='rgba(255,255,255,0.18)' stroke-width='2'%3E%3Cpath d='M40 80h200v120H40zM310 70h170v90H310zM560 120h160v130H560zM130 290h210v120H130zM430 280h230v120H430z'/%3E%3Ccircle cx='255' cy='330' r='48'/%3E%3Cpath d='M95 130h90M340 115h100M595 170h90M170 350h110M470 340h145'/%3E%3C/g%3E%3C/svg%3E");
    background-size: cover;
    color: white;
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 34px;
    align-items: center;
    box-shadow: 0 28px 70px rgba(79,70,229,0.28);
    overflow: hidden;
    position: relative;
}

.hero::after {
    content: "";
    position: absolute;
    right: -90px;
    top: -90px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255,255,255,0.18);
}

.hero h1 {
    font-size: 48px;
    line-height: 1.08;
    margin: 0 0 18px;
    letter-spacing: -1.5px;
}

.hero p {
    font-size: 18px;
    color: rgba(255,255,255,0.86);
    line-height: 1.7;
    max-width: 660px;
}

.hero .card {
    color: var(--text);
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.48);
}

.container {
    width: 86%;
    max-width: 1250px;
    margin: 34px auto;
}

.card {
    background: var(--card);
    border: 1px solid rgba(230,234,242,0.9);
    border-radius: 24px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
}

.grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 22px;
}

.col-3 { grid-column: span 3; }
.col-4 { grid-column: span 4; }
.col-5 { grid-column: span 5; }
.col-6 { grid-column: span 6; }
.col-7 { grid-column: span 7; }
.col-8 { grid-column: span 8; }
.col-9 { grid-column: span 9; }
.col-12 { grid-column: span 12; }

h1, h2, h3 {
    letter-spacing: -0.6px;
}

h2 {
    font-size: 30px;
    margin-top: 0;
}

h3 {
    margin-top: 0;
}

label {
    display: block;
    font-weight: 800;
    margin: 13px 0 7px;
    font-size: 14px;
    color: #334155;
}

input, select, textarea {
    width: 100%;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 13px 14px;
    font-size: 15px;
    outline: none;
    background: rgba(255,255,255,0.96);
    transition: 0.2s ease;
}

input:focus, select:focus, textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(79,70,229,0.10);
}

textarea {
    min-height: 104px;
    resize: vertical;
}

.btn {
    border: 0;
    background: linear-gradient(135deg, var(--primary), var(--primary-dark));
    color: white;
    padding: 12px 18px;
    border-radius: 14px;
    cursor: pointer;
    font-weight: 800;
    margin-top: 10px;
    display: inline-block;
    text-decoration: none;
    font-size: 14px;
    box-shadow: 0 12px 22px rgba(79,70,229,0.22);
    transition: 0.2s ease;
}

.btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 30px rgba(79,70,229,0.30);
}

.btn.secondary {
    background: linear-gradient(135deg, #111827, #334155);
}

.btn.success {
    background: linear-gradient(135deg, #16a34a, #059669);
    box-shadow: 0 12px 22px rgba(22,163,74,0.2);
}

.btn.danger {
    background: linear-gradient(135deg, #ef4444, #b91c1c);
    box-shadow: 0 12px 22px rgba(220,38,38,0.18);
}

.btn.light {
    background: #ffffff;
    color: var(--primary-dark);
    box-shadow: 0 10px 22px rgba(79,70,229,0.12);
    border: 1px solid var(--border);
}

.btn.purple {
    background: linear-gradient(135deg, #8b5cf6, #6d28d9);
    box-shadow: 0 12px 22px rgba(124,58,237,0.22);
}

.table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
    background: transparent;
}

.table th {
    color: var(--muted);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    padding: 10px 14px;
    text-align: left;
}

.table td {
    background: white;
    padding: 15px 14px;
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    vertical-align: top;
}

.table tr td:first-child {
    border-left: 1px solid var(--border);
    border-radius: 16px 0 0 16px;
}

.table tr td:last-child {
    border-right: 1px solid var(--border);
    border-radius: 0 16px 16px 0;
}

.badge {
    display: inline-block;
    background: var(--primary-soft);
    color: var(--primary-dark);
    font-size: 12px;
    font-weight: 800;
    padding: 6px 10px;
    border-radius: 999px;
    margin: 2px;
}

.badge.green { background: #dcfce7; color: #166534; }
.badge.orange { background: #ffedd5; color: #9a3412; }
.badge.purple { background: #ede9fe; color: #5b21b6; }
.badge.red { background: #fee2e2; color: #991b1b; }

.alert {
    padding: 15px 16px;
    border-radius: 16px;
    margin-bottom: 16px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
}

.success-alert {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #065f46;
}

.stat-number {
    font-size: 42px;
    font-weight: 950;
    color: var(--primary);
    margin: 0;
    letter-spacing: -1.4px;
}

.card .stat-number + a,
.card p + a {
    margin-top: 16px;
}

.exam-preview {
    background: white;
    border: 1px solid #111827;
    padding: 34px;
    min-height: 500px;
    color: black;
    box-shadow: 0 16px 40px rgba(15,23,42,0.12);
}

.exam-template-modern {
    border-top: 14px solid var(--primary);
    border-radius: 16px;
}

.exam-template-classic {
    font-family: "Times New Roman", serif;
}

.exam-template-boxed .exam-question {
    border: 1px solid #111827;
    padding: 12px;
    margin-bottom: 12px;
}

.exam-header {
    text-align: center;
    border-bottom: 2px solid #111827;
    padding-bottom: 14px;
    margin-bottom: 18px;
}

.exam-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 20px;
    margin: 16px 0;
    font-size: 14px;
}

.exam-question {
    margin-bottom: 18px;
    page-break-inside: avoid;
}

.options {
    margin-top: 8px;
    display: grid;
    gap: 6px;
}

.price {
    font-size: 42px;
    font-weight: 950;
    color: var(--primary);
    margin: 8px 0;
    letter-spacing: -1.5px;
}

.footer {
    text-align: center;
    color: var(--muted);
    padding: 38px;
}

.feature-line {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 12px 0;
}

.feature-line::before {
    content: "✓";
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #dcfce7;
    color: #166534;
    font-weight: 900;
}

@media print {
    body * { visibility: hidden; }
    .exam-preview, .exam-preview * { visibility: visible; }
    .exam-preview {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        border: none;
        box-shadow: none;
    }
    .no-print { display: none !important; }
}

@media (max-width: 900px) {
    .header {
        position: relative;
        padding: 16px 5%;
    }

    .hero {
        width: 92%;
        grid-template-columns: 1fr;
        padding: 42px 28px;
        border-radius: 26px;
    }

    .container {
        width: 92%;
    }

    .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-12 {
        grid-column: span 12;
    }

    .hero h1 {
        font-size: 34px;
    }

    .table {
        font-size: 13px;
        display: block;
        overflow-x: auto;
    }

    .nav a {
        font-size: 13px;
        padding: 8px 10px;
    }
}


.question-select-card {
    background: white;
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 16px;
    margin-bottom: 14px;
    box-shadow: 0 8px 22px rgba(15,23,42,0.05);
}

.question-select-card:hover {
    border-color: rgba(79,70,229,0.45);
}

.question-select-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.question-point-input {
    max-width: 120px;
}

.exam-template-minimal {
    border: none;
    border-left: 8px solid #111827;
    box-shadow: none;
}

.template-preview-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin: 10px 0 20px;
}

.template-option {
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 14px;
    background: #fff;
    cursor: pointer;
}

.template-option strong {
    display: block;
    margin-bottom: 6px;
}

.template-option input {
    width: auto;
    margin-right: 6px;
}

@media (max-width: 900px) {
    .template-preview-grid {
        grid-template-columns: 1fr;
    }
}


/* Premium Exam Builder */
.exam-studio-hero {
    position: relative;
    overflow: hidden;
    padding: 28px;
    border-radius: 28px;
    color: white;
    background:
        radial-gradient(circle at 15% 10%, rgba(255,255,255,.24), transparent 26%),
        radial-gradient(circle at 85% 20%, rgba(6,182,212,.34), transparent 28%),
        linear-gradient(135deg, #4f46e5 0%, #3730a3 52%, #0f172a 100%);
    box-shadow: 0 24px 70px rgba(79,70,229,.28);
}

.exam-studio-hero h2 {
    margin: 0 0 8px;
    font-size: 34px;
    color: white;
}

.exam-studio-hero p {
    color: rgba(255,255,255,.82);
    margin: 0;
    max-width: 740px;
}

.exam-studio-hero::after {
    content: "";
    position: absolute;
    right: -70px;
    top: -80px;
    width: 230px;
    height: 230px;
    border-radius: 50%;
    background: rgba(255,255,255,.13);
}

.exam-search-panel {
    margin-top: 20px;
    position: relative;
    z-index: 2;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    backdrop-filter: blur(14px);
    border-radius: 22px;
    padding: 18px;
}

.exam-search-panel label {
    color: white;
}

.exam-search-panel input,
.exam-search-panel select {
    background: rgba(255,255,255,.96);
    border: 0;
}

.exam-filter-row {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: 14px;
    margin-top: 14px;
}

.exam-filter-row .filter-3 { grid-column: span 3; }
.exam-filter-row .filter-4 { grid-column: span 4; }
.exam-filter-row .filter-2 { grid-column: span 2; }

.exam-studio-layout {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 22px;
    align-items: start;
    margin-top: 24px;
}

.exam-builder-side {
    position: sticky;
    top: 92px;
}

.exam-side-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
    border: 1px solid rgba(226,232,240,.92);
    border-radius: 28px;
    padding: 22px;
    box-shadow: 0 18px 50px rgba(15,23,42,.08);
}

.exam-side-card h3,
.exam-question-panel h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.exam-section-pill {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: inline-grid;
    place-items: center;
    background: #eef2ff;
    color: #3730a3;
    font-size: 17px;
}

.exam-side-card input,
.exam-side-card select {
    background: white;
}

.template-preview-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px;
}

.template-option {
    position: relative;
    min-height: 118px;
    border: 1px solid #e5e7eb !important;
    background: linear-gradient(180deg, #ffffff, #f8fafc) !important;
    transition: .2s ease;
}

.template-option:hover {
    transform: translateY(-2px);
    border-color: rgba(79,70,229,.48) !important;
    box-shadow: 0 14px 32px rgba(79,70,229,.12);
}

.template-option input {
    accent-color: #4f46e5;
}

.template-option strong {
    color: #111827;
    font-size: 15px;
}

.template-option::after {
    content: "";
    display: block;
    margin-top: 10px;
    width: 70%;
    height: 32px;
    border-radius: 8px;
    background:
        linear-gradient(#e5e7eb,#e5e7eb) 8px 8px/70% 4px no-repeat,
        linear-gradient(#c7d2fe,#c7d2fe) 8px 18px/45% 4px no-repeat,
        #f8fafc;
    border: 1px solid #e5e7eb;
}

.exam-question-panel {
    background: rgba(255,255,255,.76);
    border: 1px solid rgba(226,232,240,.92);
    border-radius: 28px;
    padding: 22px;
    box-shadow: 0 18px 50px rgba(15,23,42,.07);
}

.exam-results-toolbar {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.exam-count-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #eef2ff;
    color: #3730a3;
    border: 1px solid #c7d2fe;
    padding: 9px 12px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 14px;
}

.question-select-card {
    position: relative;
    border: 1px solid rgba(226,232,240,.95) !important;
    background:
        radial-gradient(circle at top right, rgba(79,70,229,.08), transparent 28%),
        #ffffff !important;
    border-radius: 22px !important;
    padding: 18px !important;
    margin-bottom: 16px !important;
    box-shadow: 0 12px 34px rgba(15,23,42,.06) !important;
    transition: .2s ease;
}

.question-select-card:hover {
    transform: translateY(-2px);
    border-color: rgba(79,70,229,.45) !important;
    box-shadow: 0 18px 44px rgba(79,70,229,.12) !important;
}

.question-select-card:has(input[type="checkbox"]:checked) {
    border-color: #4f46e5 !important;
    background:
        radial-gradient(circle at top right, rgba(79,70,229,.16), transparent 32%),
        linear-gradient(180deg, #ffffff, #f8faff) !important;
}

.question-select-head {
    align-items: center !important;
    border-bottom: 1px dashed #e5e7eb;
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.question-select-card p {
    font-size: 16px;
    line-height: 1.55;
}

.question-select-card .options {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 12px;
}

.select-question-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    padding: 9px 12px;
    border-radius: 999px;
    font-weight: 800;
    color: #334155;
    cursor: pointer;
}

.select-question-toggle input {
    accent-color: #4f46e5;
}

.question-point-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.question-point-input {
    max-width: 130px !important;
    background: #fff !important;
    border: 1px solid #c7d2fe !important;
    font-weight: 800;
    color: #3730a3;
}

.exam-action-bar {
    margin-top: 18px;
    padding: 16px;
    border-radius: 20px;
    background: linear-gradient(135deg, #eef2ff, #ecfeff);
    border: 1px solid #c7d2fe;
}

.exam-primary-submit {
    width: 100%;
    justify-content: center;
    text-align: center;
    font-size: 15px;
    padding: 14px 18px !important;
}

.exam-empty-state {
    text-align: center;
    padding: 38px 20px;
    border-radius: 22px;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    color: #64748b;
}

.exam-empty-state strong {
    display: block;
    color: #0f172a;
    font-size: 18px;
    margin-bottom: 6px;
}

@media (max-width: 1050px) {
    .exam-studio-layout {
        grid-template-columns: 1fr;
    }

    .exam-builder-side {
        position: relative;
        top: 0;
    }

    .exam-filter-row .filter-3,
    .exam-filter-row .filter-4,
    .exam-filter-row .filter-2 {
        grid-column: span 12;
    }
}


/* ===== admin.css ===== */

*{box-sizing:border-box}:root{--bg:#f3f6fb;--side:#0f172a;--card:#fff;--line:#e5e7eb;--text:#0f172a;--muted:#64748b;--pri:#4f46e5;--dark:#3730a3;--green:#16a34a;--red:#dc2626;--orange:#f97316;--purple:#7c3aed}body.admin-body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}.admin-layout{min-height:100vh;display:grid;grid-template-columns:280px 1fr}.admin-sidebar{background:radial-gradient(circle at top left,rgba(79,70,229,.35),transparent 38%),linear-gradient(180deg,#111827,#0f172a);color:white;padding:24px 18px;position:sticky;top:0;height:100vh;overflow:auto}.admin-brand{display:flex;align-items:center;gap:12px;font-size:25px;font-weight:900;margin-bottom:26px}.admin-brand-icon{width:42px;height:42px;border-radius:15px;background:linear-gradient(135deg,#6366f1,#06b6d4);display:grid;place-items:center}.admin-profile{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:16px;margin-bottom:22px}.admin-profile span{display:block;color:rgba(255,255,255,.68);font-size:13px;margin-top:4px}.admin-menu-title{color:rgba(255,255,255,.45);font-size:12px;text-transform:uppercase;font-weight:800;letter-spacing:.9px;margin:22px 12px 8px}.admin-menu{display:grid;gap:6px}.admin-menu a{color:rgba(255,255,255,.78);text-decoration:none;padding:12px 13px;border-radius:14px;display:flex;gap:10px;font-weight:750}.admin-menu a:hover,.admin-menu a.active{background:rgba(255,255,255,.12);color:white}.admin-main{min-width:0}.admin-topbar{height:74px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 34px;position:sticky;top:0;z-index:30}.admin-topbar h1{font-size:24px;margin:0}.admin-content{padding:30px 34px 48px}.admin-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:22px}.admin-col-3{grid-column:span 3}.admin-col-4{grid-column:span 4}.admin-col-5{grid-column:span 5}.admin-col-6{grid-column:span 6}.admin-col-7{grid-column:span 7}.admin-col-8{grid-column:span 8}.admin-col-9{grid-column:span 9}.admin-col-12{grid-column:span 12}.admin-card{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:22px;box-shadow:0 14px 36px rgba(15,23,42,.07)}.admin-stat{position:relative;overflow:hidden}.admin-stat:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-36px;top:-36px;background:rgba(79,70,229,.1)}.admin-stat-label{color:var(--muted);font-size:14px;font-weight:800;margin-bottom:8px}.admin-stat-value{font-size:38px;font-weight:950;margin:0}.admin-stat-note{color:var(--muted);font-size:13px;margin-top:8px}.admin-btn{border:0;background:linear-gradient(135deg,var(--pri),var(--dark));color:white;padding:11px 15px;border-radius:13px;cursor:pointer;font-weight:800;display:inline-block;text-decoration:none;font-size:14px}.admin-btn.light{background:#eef2ff;color:var(--dark)}.admin-btn.green{background:linear-gradient(135deg,#16a34a,#059669)}.admin-btn.red{background:linear-gradient(135deg,#ef4444,#b91c1c)}.admin-btn.dark{background:linear-gradient(135deg,#111827,#334155)}.admin-table-wrap{overflow-x:auto}.admin-table{width:100%;border-collapse:separate;border-spacing:0 10px}.admin-table th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.4px;text-align:left;padding:8px 12px}.admin-table td{background:white;padding:14px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);vertical-align:middle}.admin-table tr td:first-child{border-left:1px solid var(--line);border-radius:14px 0 0 14px}.admin-table tr td:last-child{border-right:1px solid var(--line);border-radius:0 14px 14px 0}.admin-badge{display:inline-block;border-radius:999px;padding:6px 10px;background:#eef2ff;color:#3730a3;font-weight:800;font-size:12px}.admin-badge.green{background:#dcfce7;color:#166534}.admin-badge.red{background:#fee2e2;color:#991b1b}.admin-badge.orange{background:#ffedd5;color:#9a3412}.admin-badge.purple{background:#ede9fe;color:#5b21b6}.admin-form label{display:block;font-weight:800;margin:12px 0 6px;color:#334155;font-size:14px}.admin-form input,.admin-form select,.admin-form textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px 13px;font-size:15px;background:white}.admin-alert{padding:15px 16px;border-radius:16px;margin-bottom:16px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}.admin-alert.success{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46}.admin-quick-actions{display:grid;gap:12px}.admin-action-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px;border:1px solid var(--line);border-radius:18px;text-decoration:none;color:var(--text);background:linear-gradient(180deg,#fff,#f8fafc)}.admin-action-card strong{display:block;margin-bottom:4px}.admin-action-card span{color:var(--muted);font-size:13px}.admin-iconbox{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;background:#eef2ff;color:var(--dark);font-size:22px}@media(max-width:1000px){.admin-layout{grid-template-columns:1fr}.admin-sidebar{position:relative;height:auto}.admin-col-3,.admin-col-4,.admin-col-5,.admin-col-6,.admin-col-7,.admin-col-8,.admin-col-9,.admin-col-12{grid-column:span 12}.admin-topbar{position:relative;padding:16px;height:auto;align-items:flex-start;gap:12px;flex-direction:column}.admin-content{padding:20px 16px}}

/* ===== exam-paper.css ===== */

* {
            box-sizing: border-box;
        }

        @page {
            size: A4;
            margin: 10mm 9mm;
        }

        html,
        body {
            margin: 0;
            padding: 0;
        }

        body {
            background: #e9eef5;
            font-family: Arial, Helvetica, sans-serif;
            color: #000;
        }

        .toolbar {
            width: 210mm;
            max-width: calc(100% - 32px);
            margin: 20px auto 12px;
            display: flex;
            justify-content: space-between;
            gap: 10px;
            flex-wrap: wrap;
        }

        .toolbar a,
        .toolbar button {
            border: 0;
            background: #2563eb;
            color: white;
            padding: 10px 14px;
            border-radius: 10px;
            text-decoration: none;
            font-weight: 700;
            cursor: pointer;
            font-size: 14px;
        }

        .toolbar a.light {
            background: #fff;
            color: #111;
            border: 1px solid #bbb;
        }

        .toolbar a.dark {
            background: #111827;
        }

        .paper {
            width: 210mm;
            min-height: 297mm;
            max-width: 210mm;
            margin: 0 auto 30px;
            background: #fff;
            padding: 10mm 9mm;
            box-shadow: 0 14px 42px rgba(15, 23, 42, .14);
        }

        .answer-page {
            page-break-before: always;
            break-before: page;
        }

        /* ÜST BAŞLIK: TABLO YOK, HEPSİ AYNI BOY VE AYNI KALINLIK */
        .exam-header {
            width: 100%;
            text-align: center;
            margin: 0 0 8px;
            padding-bottom: 7px;
            border-bottom: 1.5px solid #000;
        }

        .header-line {
            width: 100%;
            display: block;
            font-size: 12pt;
            font-weight: 700;
            line-height: 1.22;
            text-transform: uppercase;
            letter-spacing: .15px;
            margin: 1px 0;
            overflow-wrap: anywhere;
        }

        .header-combined {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 4px;
            flex-wrap: wrap;
        }

        .student-inline {
            display: flex;
            width: 100%;
            gap: 18px;
            margin: 6px 0 10px;
            align-items: center;
            font-size: 10pt;
            line-height: 1.1;
        }

        .student-col {
            display: flex;
            align-items: center;
            flex: 2.3;
            gap: 6px;
            min-width: 0;
            white-space: nowrap;
        }

        .student-col.small {
            flex: 1.15;
        }

        .student-col strong {
            font-weight: 700;
            white-space: nowrap;
        }

        .student-col span {
            flex: 1;
            min-width: 35px;
            height: 14px;
            border-bottom: 1px dotted #000;
        }

        /* AKILLI SORU DÜZENİ */
        .questions-smart {
            width: 100%;
            margin-top: 6px;
        }

        .mc-section {
            width: 100%;
            column-count: 2;
            column-gap: 9mm;
            column-rule: 1px solid #000;
        }

        .written-section {
            width: 100%;
            margin-top: 8px;
        }

        .question {
            break-inside: avoid;
            page-break-inside: avoid;
            width: 100%;
            margin: 0 0 7px;
            font-size: 9.6pt;
            line-height: 1.25;
        }

        .mc-question {
            display: inline-block;
            width: 100%;
        }

        .written-question {
            display: block;
            width: 100%;
            padding: 0;
            margin-bottom: 9px;
            border: 0 !important;
        }

        .question-title {
            font-weight: 400;
            margin-bottom: 3px;
        }

        .question-number {
            font-weight: 700;
            margin-right: 4px;
        }

        .question-point {
            font-weight: 700;
            white-space: nowrap;
        }

        .options {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 2px 8px;
            margin-top: 3px;
            font-size: 9.3pt;
            line-height: 1.2;
        }

        .written-space {
            height: 42px;
            border-bottom: 1px dotted #000;
            margin-top: 5px;
        }

        .written-space.long {
            height: 74px;
        }

        .optical-wrap {
            margin-top: 12px;
            page-break-inside: avoid;
        }

        .optical-title {
            font-size: 9.5pt;
            margin: 0 0 4px;
            font-weight: 700;
        }

        .optical-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            border: 1.2px solid #000;
            font-size: 9.5pt;
        }

        .optical-half {
            display: grid;
            grid-template-columns: 28px repeat(4, 1fr);
            border-right: 1.2px solid #000;
        }

        .optical-half:last-child {
            border-right: 0;
        }

        .optical-head,
        .optical-no,
        .bubble-cell {
            height: 23px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-bottom: 1px solid #777;
        }

        .optical-head {
            background: #000;
            color: #fff;
            font-weight: 700;
            border-right: 1px solid #333;
        }

        .optical-no {
            background: #777;
            color: #fff;
            font-weight: 700;
            border-right: 1px solid #666;
        }

        .bubble-cell {
            background: #d9d9d9;
            border-right: 1px solid #aaa;
        }

        .bubble {
            width: 16px;
            height: 16px;
            border: 1.3px solid #000;
            border-radius: 50%;
            background: #fff;
        }

        .footer-info {
            margin-top: 8px;
            font-size: 9.2pt;
            line-height: 1.35;
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 18px;
            width: 100%;
        }

        .barem-info {
            flex: 1 1 auto;
            text-align: left;
        }

        .duration-teacher-info {
            flex: 0 0 280px;
            text-align: left;
        }

        .duration-teacher-info div + div {
            margin-top: 3px;
        }

        /* CEVAP KAĞIDI */
        .answer-title {
            font-size: 11pt;
            font-weight: 700;
            margin: 10px 0 6px;
            border-bottom: 1px solid #000;
            padding-bottom: 4px;
        }

        .answer-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 9.5pt;
            margin-top: 8px;
        }

        .answer-table th,
        .answer-table td {
            border: 1px solid #000;
            padding: 5px 6px;
            text-align: left;
            vertical-align: top;
        }

        .answer-table th {
            font-weight: 700;
            background: #efefef;
        }

        .paper.boxed .question,
        .paper.boxed .written-question,
        .paper.classic .question,
        .paper.modern .question {
            border: 0 !important;
        }

        @media print {
            html,
            body {
                width: 210mm;
                background: #fff !important;
            }

            .toolbar {
                display: none !important;
            }

            .paper {
                width: 192mm !important;
                max-width: 192mm !important;
                min-height: auto !important;
                margin: 0 auto !important;
                padding: 0 !important;
                box-shadow: none !important;
            }

            .student-inline {
                display: flex !important;
                width: 100% !important;
                gap: 16px !important;
                margin: 5px 0 9px !important;
                font-size: 10pt !important;
                page-break-inside: avoid !important;
            }

            .student-col {
                display: flex !important;
                flex: 2.3 !important;
                white-space: nowrap !important;
                min-width: 0 !important;
            }

            .student-col.small {
                flex: 1.15 !important;
            }

            .mc-section {
                column-count: 2 !important;
                column-gap: 9mm !important;
                column-rule: 1px solid #000 !important;
            }

            .written-section {
                width: 100% !important;
                margin-top: 8px !important;
            }

            .written-question {
                display: block !important;
                width: 100% !important;
            }

            .question {
                break-inside: avoid !important;
                page-break-inside: avoid !important;
                border: 0 !important;
            }

            .footer-info {
                display: flex !important;
                justify-content: space-between !important;
                gap: 18px !important;
                width: 100% !important;
            }

            .barem-info {
                flex: 1 1 auto !important;
                text-align: left !important;
            }

            .duration-teacher-info {
                flex: 0 0 280px !important;
                text-align: left !important;
            }
        }

        @media screen and (max-width: 760px) {
            .paper {
                width: auto;
                max-width: calc(100% - 22px);
                padding: 18px 14px;
            }

            .mc-section {
                column-count: 1;
                column-rule: 0;
            }

            .student-inline,
            .footer-info {
                flex-direction: column;
                align-items: stretch;
                gap: 8px;
            }

            .optical-grid {
                grid-template-columns: 1fr;
            }

            .optical-half {
                border-right: 0;
                border-bottom: 1px solid #000;
            }
        }


/* ===== inline CSS from answer-key.php #1 ===== */

* {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: #eef2f7;
            font-family: "Segoe UI", Arial, sans-serif;
            color: #111827;
        }

        .toolbar {
            width: 820px;
            max-width: calc(100% - 32px);
            margin: 24px auto 12px;
            display: flex;
            justify-content: space-between;
            gap: 12px;
            flex-wrap: wrap;
        }

        .toolbar a,
        .toolbar button {
            border: 0;
            background: #2563eb;
            color: white;
            padding: 11px 16px;
            border-radius: 12px;
            text-decoration: none;
            font-weight: 700;
            cursor: pointer;
            font-size: 14px;
        }

        .toolbar a.light {
            background: white;
            color: #1f2937;
            border: 1px solid #d1d5db;
        }

        .paper {
            width: 820px;
            max-width: calc(100% - 32px);
            margin: 0 auto 36px;
            background: white;
            padding: 34px 42px;
            box-shadow: 0 18px 50px rgba(15, 23, 42, 0.12);
            border-radius: 14px;
        }

        .title {
            text-align: center;
            border-bottom: 3px solid #111827;
            padding-bottom: 16px;
            margin-bottom: 22px;
        }

        .title h1 {
            margin: 0;
            font-size: 22px;
            text-transform: uppercase;
        }

        .title p {
            margin: 8px 0 0;
            line-height: 1.5;
            color: #374151;
            font-weight: 600;
        }

        .summary {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 10px;
            margin-bottom: 22px;
        }

        .summary div {
            background: #f8fafc;
            border: 1px solid #e5e7eb;
            border-radius: 8px;
            padding: 10px;
            font-size: 13px;
        }

        table {
            width: 100%;
            border-collapse: collapse;
            font-size: 15px;
        }

        th {
            background: #111827;
            color: white;
            text-align: left;
            padding: 12px;
        }

        td {
            border: 1px solid #d1d5db;
            padding: 11px 12px;
            vertical-align: top;
        }

        tr:nth-child(even) td {
            background: #f8fafc;
        }

        .answer {
            font-weight: 800;
            color: #111827;
        }

        @media print {
            body {
                background: white;
            }

            .toolbar {
                display: none;
            }

            .paper {
                width: 100%;
                max-width: 100%;
                margin: 0;
                padding: 18mm 16mm;
                box-shadow: none;
                border-radius: 0;
            }
        }

        @media (max-width: 720px) {
            .summary {
                grid-template-columns: 1fr;
            }

            .paper {
                padding: 24px 18px;
            }
        }


/* ===== Modern Home Page ===== */
.home-page {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.home-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.1fr .9fr;
    gap: 34px;
    align-items: center;
    padding: 58px;
    border-radius: 34px;
    background:
        radial-gradient(circle at 12% 12%, rgba(255,255,255,.20), transparent 28%),
        radial-gradient(circle at 86% 18%, rgba(6,182,212,.26), transparent 30%),
        linear-gradient(135deg, #111827 0%, #312e81 48%, #2563eb 100%);
    color: #fff;
    box-shadow: 0 30px 80px rgba(37, 99, 235, .22);
}

.home-hero::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -90px;
    width: 260px;
    height: 260px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
}

.home-hero-content {
    position: relative;
    z-index: 1;
}

.home-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(79, 70, 229, .10);
    color: #4338ca;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .2px;
    margin-bottom: 14px;
}

.home-hero .home-kicker {
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
}

.home-hero h1 {
    margin: 0;
    font-size: clamp(38px, 5vw, 62px);
    line-height: 1.02;
    letter-spacing: -2.2px;
    font-weight: 950;
}

.home-hero p {
    max-width: 680px;
    margin: 20px 0 0;
    color: rgba(255,255,255,.82);
    font-size: 18px;
    line-height: 1.75;
}

.home-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 28px;
}

.home-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 18px;
    border-radius: 15px;
    text-decoration: none;
    font-weight: 850;
    transition: .2s ease;
}

.home-btn.primary {
    background: #fff;
    color: #1e1b4b;
    box-shadow: 0 18px 34px rgba(0,0,0,.18);
}

.home-btn.secondary {
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.22);
}

.home-btn:hover {
    transform: translateY(-2px);
}

.home-preview-card {
    position: relative;
    z-index: 1;
    background: rgba(255,255,255,.92);
    color: #111827;
    border: 1px solid rgba(255,255,255,.45);
    border-radius: 26px;
    padding: 22px;
    box-shadow: 0 22px 60px rgba(15,23,42,.22);
    backdrop-filter: blur(16px);
}

.preview-top {
    display: flex;
    gap: 6px;
    margin-bottom: 18px;
}

.preview-top span {
    width: 11px;
    height: 11px;
    border-radius: 999px;
    background: #cbd5e1;
}

.preview-title {
    font-size: 20px;
    font-weight: 950;
    margin-bottom: 12px;
}

.preview-line {
    height: 10px;
    width: 72%;
    background: #e5e7eb;
    border-radius: 999px;
    margin-bottom: 9px;
}

.preview-line.wide {
    width: 100%;
}

.preview-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin: 16px 0;
}

.preview-grid div {
    height: 34px;
    border-radius: 12px;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
}

.preview-question {
    height: 62px;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    margin-bottom: 10px;
}

.preview-question.short {
    height: 42px;
    width: 82%;
}

.preview-footer {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.preview-footer span {
    flex: 1;
    text-align: center;
    padding: 9px;
    border-radius: 12px;
    background: #111827;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.home-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 22px;
}

.home-stat {
    background: rgba(255,255,255,.92);
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: 22px;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
}

.home-stat strong {
    display: block;
    font-size: 34px;
    line-height: 1;
    letter-spacing: -1.2px;
    color: #312e81;
    font-weight: 950;
}

.home-stat span {
    display: block;
    margin-top: 8px;
    color: #64748b;
    font-weight: 750;
}

.home-section {
    margin-top: 54px;
}

.home-section-head {
    max-width: 720px;
}

.home-section h2,
.home-cta h2 {
    margin: 0;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.1;
    letter-spacing: -1.4px;
    color: #0f172a;
    font-weight: 950;
}

.home-section p,
.home-cta p {
    color: #64748b;
    font-size: 17px;
    line-height: 1.7;
}

.home-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 22px;
}

.home-feature-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 26px;
    padding: 24px;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
}

.feature-icon {
    width: 44px;
    height: 44px;
    border-radius: 15px;
    display: grid;
    place-items: center;
    background: #eef2ff;
    color: #3730a3;
    font-weight: 950;
    margin-bottom: 18px;
}

.home-feature-card h3 {
    margin: 0 0 8px;
    font-size: 20px;
    color: #0f172a;
}

.home-feature-card p {
    margin: 0;
    font-size: 15px;
}

.home-split {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    gap: 28px;
    align-items: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 30px;
    padding: 34px;
    box-shadow: 0 16px 44px rgba(15,23,42,.06);
}

.home-check-list {
    display: grid;
    gap: 12px;
}

.home-check-list div {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 15px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    color: #334155;
    font-weight: 750;
}

.home-check-list span {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #dcfce7;
    color: #166534;
    font-weight: 950;
    flex: 0 0 auto;
}

.home-cta {
    margin-top: 54px;
    text-align: center;
    padding: 42px;
    border-radius: 30px;
    background: linear-gradient(135deg, #eef2ff, #ecfeff);
    border: 1px solid #c7d2fe;
}

.home-cta .home-btn.primary {
    margin-top: 8px;
    background: #312e81;
    color: #fff;
    box-shadow: 0 16px 32px rgba(49,46,129,.18);
}

@media (max-width: 920px) {
    .home-hero,
    .home-split {
        grid-template-columns: 1fr;
        padding: 30px;
    }

    .home-stats,
    .home-feature-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 620px) {
    .home-page {
        width: min(100% - 24px, 1180px);
        padding-top: 20px;
    }

    .home-hero {
        padding: 26px 20px;
        border-radius: 24px;
    }

    .home-stats,
    .home-feature-grid {
        grid-template-columns: 1fr;
    }

    .home-hero h1 {
        letter-spacing: -1.2px;
    }
}


/* ===== Modern Question Bank ===== */
.qb-page {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.qb-hero {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 24px;
    align-items: stretch;
    padding: 34px;
    border-radius: 30px;
    background: linear-gradient(135deg, #111827, #312e81 52%, #2563eb);
    color: #fff;
    box-shadow: 0 24px 70px rgba(37,99,235,.22);
}

.qb-kicker {
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 14px;
}

.qb-hero h1 {
    margin: 0;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: -1.6px;
    font-weight: 950;
}

.qb-hero p {
    max-width: 760px;
    color: rgba(255,255,255,.82);
    font-size: 17px;
    line-height: 1.7;
    margin: 16px 0 0;
}

.qb-cart-card {
    background: rgba(255,255,255,.94);
    color: #111827;
    border-radius: 24px;
    padding: 20px;
    display: grid;
    align-content: center;
    text-align: center;
    box-shadow: 0 18px 48px rgba(15,23,42,.22);
}

.qb-cart-card span {
    color: #64748b;
    font-weight: 800;
}

.qb-cart-card strong {
    display: block;
    font-size: 48px;
    letter-spacing: -1px;
    line-height: 1;
    color: #312e81;
    margin: 8px 0 14px;
}

.qb-mini-link {
    display: inline-block;
    margin-top: 10px;
    color: #64748b;
    font-size: 13px;
    text-decoration: none;
    font-weight: 800;
}

.qb-alert {
    margin-top: 18px;
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
    padding: 14px 16px;
    border-radius: 18px;
    font-weight: 750;
}

.qb-filter-card {
    margin-top: 22px;
    padding: 24px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 28px;
    box-shadow: 0 14px 42px rgba(15,23,42,.07);
}

.qb-search-row {
    display: grid;
    grid-template-columns: 1fr 160px;
    gap: 14px;
    align-items: end;
}

.qb-filter-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 14px;
    margin-top: 16px;
}

.qb-filter-card label {
    display: grid;
    gap: 7px;
    margin: 0;
}

.qb-filter-card label span {
    font-size: 13px;
    font-weight: 850;
    color: #334155;
}

.qb-filter-card input,
.qb-filter-card select {
    min-height: 44px;
    border-radius: 14px;
    border: 1px solid #dbe3ef;
    background: #f8fafc;
    padding: 10px 12px;
}

.qb-filter-actions {
    display: flex;
    align-items: end;
}

.qb-btn {
    min-height: 42px;
    padding: 0 14px;
    border: 0;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 850;
    cursor: pointer;
    transition: .2s ease;
}

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

.qb-btn.primary {
    background: #312e81;
    color: #fff;
    box-shadow: 0 12px 24px rgba(49,46,129,.18);
}

.qb-btn.light {
    background: #f8fafc;
    color: #334155;
    border: 1px solid #dbe3ef;
}

.qb-btn.warning {
    background: #fff7ed;
    color: #9a3412;
    border: 1px solid #fed7aa;
}

.qb-btn.danger {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.qb-results-head {
    margin-top: 26px;
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
}

.qb-results-head h2 {
    margin: 0;
    font-size: 28px;
    letter-spacing: -1px;
    color: #0f172a;
}

.qb-results-head p {
    margin: 6px 0 0;
    color: #64748b;
}

.qb-question-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 18px;
}

.qb-question-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: 18px;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
    transition: .2s ease;
}

.qb-question-card.selected {
    border-color: #4f46e5;
    background: linear-gradient(180deg, #fff, #f8faff);
}

.qb-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 14px;
}

.qb-meta span {
    background: #f1f5f9;
    color: #334155;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 6px 9px;
    font-size: 12px;
    font-weight: 800;
}

.qb-question-body h3 {
    margin: 0 0 6px;
    font-size: 14px;
    color: #312e81;
}

.qb-question-body p {
    margin: 0;
    color: #0f172a;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 650;
}

.qb-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 12px;
    margin-top: 12px;
    padding: 12px;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
}

.qb-answer {
    display: none;
    margin-top: 12px;
    padding: 12px;
    border-radius: 16px;
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    color: #065f46;
}

.qb-answer.show {
    display: block;
}

.qb-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.qb-empty {
    padding: 32px;
    border-radius: 24px;
    background: #fff;
    border: 1px dashed #cbd5e1;
    text-align: center;
    color: #64748b;
}

.qb-empty strong {
    display: block;
    color: #0f172a;
    font-size: 18px;
    margin-bottom: 6px;
}

@media (max-width: 920px) {
    .qb-hero,
    .qb-search-row {
        grid-template-columns: 1fr;
    }

    .qb-filter-grid {
        grid-template-columns: 1fr 1fr;
    }

    .qb-results-head {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 620px) {
    .qb-page {
        width: min(100% - 24px, 1180px);
        padding-top: 20px;
    }

    .qb-hero,
    .qb-filter-card {
        padding: 22px;
        border-radius: 24px;
    }

    .qb-filter-grid,
    .qb-options {
        grid-template-columns: 1fr;
    }

    .qb-card-actions .qb-btn {
        width: 100%;
    }
}


/* ===== Add Question Catalog Page ===== */
.aq-page {
    width: min(1100px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.aq-hero {
    display: grid;
    grid-template-columns: 1fr 260px;
    gap: 24px;
    align-items: stretch;
    padding: 34px;
    border-radius: 30px;
    background: linear-gradient(135deg, #111827, #312e81 52%, #2563eb);
    color: #fff;
    box-shadow: 0 24px 70px rgba(37,99,235,.22);
}

.aq-kicker {
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 14px;
}

.aq-hero h1 {
    margin: 0;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: -1.5px;
    font-weight: 950;
}

.aq-hero p {
    max-width: 760px;
    color: rgba(255,255,255,.82);
    font-size: 17px;
    line-height: 1.7;
    margin: 16px 0 0;
}

.aq-help-card {
    background: rgba(255,255,255,.94);
    color: #111827;
    border-radius: 24px;
    padding: 22px;
    display: grid;
    align-content: center;
    box-shadow: 0 18px 48px rgba(15,23,42,.22);
}

.aq-help-card strong {
    color: #312e81;
    font-size: 20px;
    margin-bottom: 8px;
}

.aq-help-card span {
    color: #64748b;
    line-height: 1.55;
    font-weight: 700;
}

.aq-form-card {
    margin-top: 22px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 28px;
    padding: 26px;
    box-shadow: 0 14px 42px rgba(15,23,42,.07);
}

.aq-section-title {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 4px 0 18px;
}

.aq-section-title span {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #eef2ff;
    color: #3730a3;
    font-weight: 950;
    flex: 0 0 auto;
}

.aq-section-title h2 {
    margin: 0;
    font-size: 22px;
    letter-spacing: -.5px;
    color: #0f172a;
}

.aq-section-title p {
    margin: 4px 0 0;
    color: #64748b;
}

.aq-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-bottom: 26px;
}

.aq-form-card label {
    display: grid;
    gap: 7px;
    margin: 0;
}

.aq-form-card label span {
    font-size: 13px;
    font-weight: 850;
    color: #334155;
}

.aq-form-card input,
.aq-form-card select,
.aq-form-card textarea {
    border: 1px solid #dbe3ef;
    background: #f8fafc;
    border-radius: 14px;
    padding: 11px 12px;
    min-height: 44px;
    font-size: 15px;
    width: 100%;
}

.aq-form-card textarea {
    resize: vertical;
    line-height: 1.6;
}

.aq-full {
    margin-bottom: 16px !important;
}

.aq-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 18px;
    flex-wrap: wrap;
}

@media (max-width: 900px) {
    .aq-hero,
    .aq-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .aq-page {
        width: min(100% - 24px, 1100px);
        padding-top: 20px;
    }

    .aq-hero,
    .aq-form-card {
        padding: 22px;
        border-radius: 24px;
    }

    .aq-actions .qb-btn {
        width: 100%;
    }
}


/* ===== Question Edit/Delete + Report Modal ===== */
.report-modal {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .55);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 20px;
}

.report-modal.show {
    display: flex;
}

.report-modal-card {
    width: min(560px, 100%);
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    box-shadow: 0 30px 90px rgba(15,23,42,.30);
    position: relative;
}

.report-modal-card h2 {
    margin: 0 0 6px;
    color: #0f172a;
    letter-spacing: -.6px;
}

.report-modal-card p {
    margin: 0 0 16px;
    color: #64748b;
}

.report-modal-card label {
    display: grid;
    gap: 7px;
    margin-bottom: 14px;
}

.report-modal-card label span {
    font-size: 13px;
    font-weight: 850;
    color: #334155;
}

.report-modal-card textarea {
    width: 100%;
    border: 1px solid #dbe3ef;
    background: #f8fafc;
    border-radius: 14px;
    padding: 11px 12px;
    resize: vertical;
    min-height: 100px;
}

.report-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 12px;
    background: #f1f5f9;
    color: #0f172a;
    font-size: 22px;
    cursor: pointer;
}

.report-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}


/* ===== Multiline Classic Answer Support ===== */
.aq-form-card textarea[name="correct_answer"] {
    min-height: 130px;
    line-height: 1.55;
    white-space: pre-wrap;
}

.qb-answer {
    white-space: normal;
    line-height: 1.55;
}

.answer-table td {
    white-space: pre-line;
}


/* ===== Question Bank Multi Select + Sticky Button ===== */
.qb-filter-card small {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin-top: 2px;
}

.qb-multiselect {
    min-height: 118px !important;
    padding: 8px !important;
}

.qb-multiselect option {
    padding: 8px 9px;
    border-radius: 8px;
    margin-bottom: 3px;
}

.qb-sticky-exam {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 999;
    width: min(420px, calc(100% - 32px));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    background: rgba(255,255,255,.96);
    border: 1px solid #dbe3ef;
    border-radius: 22px;
    padding: 14px;
    box-shadow: 0 24px 70px rgba(15,23,42,.20);
    backdrop-filter: blur(16px);
}

.qb-sticky-exam strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
}

.qb-sticky-exam span {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin-top: 2px;
}

.qb-sticky-exam .qb-btn {
    white-space: nowrap;
}

@media (max-width: 620px) {
    .qb-sticky-exam {
        left: 12px;
        right: 12px;
        bottom: 12px;
        width: auto;
        flex-direction: column;
        align-items: stretch;
    }

    .qb-sticky-exam .qb-btn {
        width: 100%;
    }
}


/* ===== Checkbox Dropdown Filter Fix ===== */
.qb-field {
    display: grid;
    gap: 7px;
    margin: 0;
}

.qb-field > span {
    font-size: 13px;
    font-weight: 850;
    color: #334155;
}

.qb-checkdrop {
    position: relative;
    width: 100%;
}

.qb-checkdrop-btn {
    width: 100%;
    min-height: 44px;
    border-radius: 14px;
    border: 1px solid #dbe3ef;
    background: #f8fafc;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    color: #0f172a;
    font-weight: 750;
    text-align: left;
}

.qb-checkdrop-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qb-checkdrop-menu {
    display: none;
    position: absolute;
    z-index: 2000;
    top: calc(100% + 8px);
    left: 0;
    width: min(360px, 100%);
    max-height: 280px;
    overflow: auto;
    background: #fff;
    border: 1px solid #dbe3ef;
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(15,23,42,.18);
    padding: 10px;
}

.qb-checkdrop.open .qb-checkdrop-menu {
    display: block;
}

.qb-check-option {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 9px !important;
    padding: 9px 10px;
    border-radius: 12px;
    cursor: pointer;
    color: #334155;
    font-size: 14px;
    font-weight: 750;
}

.qb-check-option:hover {
    background: #f8fafc;
}

.qb-check-option input {
    width: 16px !important;
    min-height: auto !important;
    height: 16px !important;
    padding: 0 !important;
    accent-color: #312e81;
}

.qb-check-all {
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 6px !important;
    color: #312e81;
}

.qb-check-empty {
    padding: 10px;
    color: #64748b;
    font-size: 13px;
}

.qb-sticky-exam {
    position: fixed !important;
    right: 24px !important;
    bottom: 24px !important;
    z-index: 99999 !important;
}


/* ===== Question Bank 3-Column Card Layout + Inline Sticky Action ===== */
.qb-results-sticky {
    position: sticky;
    top: 84px;
    z-index: 80;
    background: rgba(248, 250, 252, .88);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(226, 232, 240, .85);
    border-radius: 22px;
    padding: 14px;
    box-shadow: 0 14px 38px rgba(15,23,42,.07);
}

.qb-sticky-inline {
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border: 1px solid #dbe3ef;
    border-radius: 18px;
    padding: 10px;
    box-shadow: 0 12px 30px rgba(15,23,42,.08);
}

.qb-sticky-inline strong {
    display: block;
    color: #0f172a;
    font-size: 14px;
    line-height: 1.1;
}

.qb-sticky-inline span {
    display: block;
    color: #64748b;
    font-size: 11px;
    margin-top: 3px;
    max-width: 190px;
}

.qb-sticky-inline .qb-btn {
    min-height: 38px;
    white-space: nowrap;
    font-size: 13px;
    padding: 0 12px;
}

.qb-sticky-exam {
    display: none !important;
}

.qb-question-list {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: stretch;
}

.qb-question-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 14px !important;
    border-radius: 20px !important;
}

.qb-meta {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 6px !important;
    margin-bottom: 12px !important;
    padding: 10px;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
}

.qb-meta span {
    margin: 0 !important;
    padding: 5px 7px !important;
    border-radius: 10px !important;
    font-size: 10.5px !important;
    line-height: 1.15;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.qb-question-body {
    flex: 1;
}

.qb-question-body h3 {
    font-size: 12px !important;
    margin-bottom: 5px !important;
    letter-spacing: .2px;
    text-transform: uppercase;
}

.qb-question-body p {
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    color: #111827;
}

.qb-options {
    grid-template-columns: 1fr !important;
    gap: 5px !important;
    padding: 9px !important;
    border-radius: 14px !important;
    font-size: 12.5px;
    line-height: 1.35;
}

.qb-answer {
    font-size: 12.5px;
    line-height: 1.45;
    padding: 9px !important;
    border-radius: 14px !important;
}

.qb-card-actions {
    margin-top: 12px !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 8px !important;
}

.qb-card-actions .qb-btn {
    width: 100%;
    min-height: 36px;
    font-size: 12px;
    border-radius: 12px;
    padding: 0 8px;
    text-align: center;
}

@media (max-width: 1100px) {
    .qb-question-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .qb-results-sticky {
        top: 70px;
    }
}

@media (max-width: 720px) {
    .qb-question-list {
        grid-template-columns: 1fr !important;
    }

    .qb-results-sticky {
        position: static;
    }

    .qb-sticky-inline {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .qb-sticky-inline .qb-btn {
        width: 100%;
    }

    .qb-meta {
        grid-template-columns: 1fr !important;
    }

    .qb-card-actions {
        grid-template-columns: 1fr !important;
    }
}


/* ===== SinavHazirla Style Question Cards ===== */
.qb-page {
    width: min(1320px, calc(100% - 24px));
}

.qb-question-list {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: stretch;
}

.qb-question-card {
    position: relative;
    min-height: 470px;
    display: flex;
    flex-direction: column;
    padding: 14px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(0, 214, 255, .45) !important;
    background:
        linear-gradient(180deg, rgba(126, 35, 82, .95) 0%, rgba(34, 18, 54, .95) 38%, rgba(5, 24, 49, .98) 100%) !important;
    box-shadow:
        0 0 0 1px rgba(255,255,255,.04) inset,
        0 18px 44px rgba(0,0,0,.20) !important;
    overflow: hidden;
    color: #fff;
}

.qb-question-card:nth-child(3n+2) {
    background:
        linear-gradient(180deg, rgba(39, 60, 84, .95) 0%, rgba(35, 53, 75, .95) 42%, rgba(7, 28, 58, .98) 100%) !important;
}

.qb-question-card.selected {
    border-color: #22c55e !important;
    box-shadow:
        0 0 0 1px rgba(34,197,94,.5) inset,
        0 18px 44px rgba(0,0,0,.26) !important;
}

.qb-meta {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px 16px !important;
    margin: 0 0 16px !important;
    padding: 14px !important;
    border-radius: 4px !important;
    background: rgba(255,255,255,.94) !important;
    border: 0 !important;
    color: #4b5563;
}

.qb-meta span {
    display: inline !important;
    width: auto !important;
    max-width: 100%;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #6b7280 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    font-weight: 500 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
}

.qb-meta span::first-letter {
    font-weight: 800;
}

.qb-question-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.qb-question-body h3 {
    margin: 0 0 10px !important;
    font-size: 18px !important;
    line-height: 1.2;
    color: #fff !important;
    font-weight: 800 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.qb-question-body p {
    margin: 0 0 22px !important;
    color: #fff !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
}

.qb-question-body h3:nth-of-type(2),
.qb-question-body .qb-answer strong {
    color: #fff !important;
}

.qb-options {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    margin-top: 6px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff;
    font-size: 14px !important;
}

.qb-options div {
    border-bottom: 1px solid rgba(255,255,255,.70);
    padding: 3px 0 5px;
}

.qb-answer {
    display: block !important;
    margin-top: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    white-space: normal;
}

.qb-answer:not(.show) {
    display: none !important;
}

.qb-answer strong {
    display: block;
    margin-bottom: 8px;
    font-size: 15px;
}

.qb-answer br + * {
    color: #fff;
}

.qb-card-actions {
    margin-top: 18px !important;
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 8px !important;
    flex-wrap: wrap;
}

.qb-card-actions .qb-btn {
    width: auto !important;
    min-height: 34px !important;
    padding: 0 10px !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.qb-card-actions .qb-btn.primary {
    background: transparent !important;
    color: #22c55e !important;
    border: 1px solid #16a34a !important;
}

.qb-card-actions .qb-btn.light {
    background: #0d6efd !important;
    color: #fff !important;
    border: 1px solid #0d6efd !important;
}

.qb-card-actions .qb-btn.warning {
    background: transparent !important;
    color: #ffd43b !important;
    border: 1px solid #ffd43b !important;
}

.qb-card-actions .qb-btn.danger {
    background: transparent !important;
    color: #ff6b6b !important;
    border: 1px solid #ff6b6b !important;
}

.qb-card-actions .qb-btn:hover {
    transform: none !important;
    opacity: .88;
}

@media (max-width: 1180px) {
    .qb-question-list {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .qb-question-list {
        grid-template-columns: 1fr !important;
    }

    .qb-question-card {
        min-height: 420px;
    }
}


/* ===== Soru Bankası Anchor + Create Exam Clean Mode ===== */
.qb-question-card {
    scroll-margin-top: 120px;
}

.qb-question-card:target {
    outline: 2px solid rgba(34,197,94,.85);
    outline-offset: 3px;
}

.from-question-bank .exam-studio-layout {
    margin-top: 18px;
}

.from-question-bank .exam-question-panel {
    min-height: 520px;
}

.from-question-bank .exam-results-toolbar {
    position: sticky;
    top: 80px;
    z-index: 20;
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(12px);
    padding: 12px;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
}


/* ===== Export / Print Stability Fix ===== */
.student-inline {
    margin-bottom: 18px !important;
}

.question {
    margin-bottom: 10px !important;
}

.answer-page .footer-info {
    page-break-inside: avoid;
}

.answer-table {
    page-break-inside: auto;
}

.answer-table tr {
    page-break-inside: avoid;
}


/* ===== Create Exam - 2'li Soru Kartı Düzeni ===== */
.exam-question-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: stretch;
}

.exam-question-grid-panel {
    overflow: visible;
}

.exam-question-card-grid .exam-question-card {
    margin-bottom: 0 !important;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 18px !important;
    padding: 14px !important;
    background: #ffffff !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .07) !important;
    transition: .2s ease;
}

.exam-question-card-grid .exam-question-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, .12) !important;
}

.exam-question-card-grid .question-select-head {
    align-items: flex-start !important;
    gap: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.exam-question-card-grid .question-select-head > div:first-child {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.exam-question-card-grid .badge {
    font-size: 10.5px !important;
    padding: 5px 7px !important;
    border-radius: 999px !important;
    line-height: 1.1;
}

.exam-question-card-grid .select-question-toggle {
    white-space: nowrap;
    padding: 7px 9px !important;
    font-size: 12px !important;
    border-radius: 999px !important;
}

.exam-question-card-grid .exam-question-card p {
    font-size: 13.5px !important;
    line-height: 1.48 !important;
    color: #111827;
    margin: 0 0 10px !important;
}

.exam-question-card-grid .exam-question-card .options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
    padding: 10px !important;
    border-radius: 14px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    font-size: 12.5px;
    line-height: 1.35;
}

.exam-question-card-grid .question-point-row {
    margin-top: auto !important;
    padding-top: 10px;
}

.exam-question-card-grid .question-point-input {
    max-width: 115px !important;
    min-height: 38px;
    font-size: 13px;
}

@media (max-width: 1100px) {
    .exam-question-card-grid {
        grid-template-columns: 1fr;
    }
}


/* ===== CREATE EXAM GRID FORCE FIX ===== */
/* Sol panel + sağ panel oranı: sağ soru alanına daha fazla genişlik */
.exam-studio-layout {
    display: grid !important;
    grid-template-columns: minmax(300px, 0.8fr) minmax(680px, 1.7fr) !important;
    gap: 26px !important;
    align-items: flex-start !important;
}

/* Soru havuzu içinde 2 kart yan yana zorunlu */
.exam-question-card-grid-fixed,
.exam-question-card-grid {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
    align-items: stretch !important;
}

/* Eski blok davranışlarını kır */
.exam-question-card-grid-fixed > .question-select-card,
.exam-question-card-grid > .question-select-card,
.exam-question-card-grid-fixed > .exam-question-card,
.exam-question-card-grid > .exam-question-card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Kart görünümü */
.exam-question-card-grid-fixed .question-select-card,
.exam-question-card-grid .question-select-card {
    border: 1px solid #dbe3ef !important;
    border-radius: 20px !important;
    padding: 18px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .07) !important;
}

/* İçerik daha kompakt */
.exam-question-card-grid-fixed .question-select-head,
.exam-question-card-grid .question-select-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

.exam-question-card-grid-fixed .question-select-head > div:first-child,
.exam-question-card-grid .question-select-head > div:first-child {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.exam-question-card-grid-fixed .badge,
.exam-question-card-grid .badge {
    font-size: 11px !important;
    padding: 6px 8px !important;
    border-radius: 999px !important;
    line-height: 1.1 !important;
}

.exam-question-card-grid-fixed p,
.exam-question-card-grid p {
    font-size: 14px !important;
    line-height: 1.55 !important;
    margin-top: 12px !important;
}

/* Puan alanı kartın altında kalsın */
.exam-question-card-grid-fixed .question-point-row,
.exam-question-card-grid .question-point-row {
    margin-top: auto !important;
    padding-top: 14px !important;
}

/* Orta ekranlarda tek sütun */
@media (max-width: 1200px) {
    .exam-studio-layout {
        grid-template-columns: 1fr !important;
    }

    .exam-question-card-grid-fixed,
    .exam-question-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Dar ekranlarda tek kart */
@media (max-width: 820px) {
    .exam-question-card-grid-fixed,
    .exam-question-card-grid {
        grid-template-columns: 1fr !important;
    }
}


/* ===== CREATE EXAM COMPACT / ÇITI PITI TASARIM ===== */
.exam-studio-hero {
    padding: 24px 28px !important;
    border-radius: 24px !important;
    margin-bottom: 20px !important;
}

.exam-studio-hero h1,
.exam-studio-hero .hero-title,
.exam-studio-hero-title {
    font-size: 28px !important;
    line-height: 1.12 !important;
    letter-spacing: -0.8px !important;
    margin-bottom: 8px !important;
}

.exam-studio-hero p {
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin-bottom: 14px !important;
}

.exam-studio-hero .filter-grid,
.exam-filter-grid,
.exam-search-grid {
    gap: 12px !important;
}

.exam-studio-hero input,
.exam-studio-hero select,
.exam-filter-panel input,
.exam-filter-panel select {
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
}

.exam-studio-hero button,
.exam-filter-panel button {
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
    font-size: 13px !important;
    padding: 0 16px !important;
}

.exam-studio-layout {
    grid-template-columns: minmax(260px, 0.62fr) minmax(720px, 1.9fr) !important;
    gap: 22px !important;
}

.exam-info-panel,
.exam-side-panel,
.exam-form-panel,
.exam-left-panel {
    padding: 20px !important;
    border-radius: 24px !important;
}

.exam-info-panel h2,
.exam-side-panel h2,
.exam-form-panel h2,
.exam-left-panel h2 {
    font-size: 20px !important;
    margin-bottom: 16px !important;
}

.exam-section-pill {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    font-size: 14px !important;
    border-radius: 12px !important;
}

.exam-info-panel label,
.exam-side-panel label,
.exam-form-panel label,
.exam-left-panel label {
    font-size: 13px !important;
    margin-bottom: 6px !important;
    font-weight: 800 !important;
}

.exam-info-panel input,
.exam-info-panel select,
.exam-side-panel input,
.exam-side-panel select,
.exam-form-panel input,
.exam-form-panel select,
.exam-left-panel input,
.exam-left-panel select {
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
}

.exam-info-panel .form-group,
.exam-side-panel .form-group,
.exam-form-panel .form-group,
.exam-left-panel .form-group {
    margin-bottom: 12px !important;
}

.exam-template-grid,
.template-grid,
.exam-template-options {
    gap: 10px !important;
}

.exam-template-card,
.template-card {
    padding: 12px !important;
    border-radius: 16px !important;
    min-height: auto !important;
}

.exam-template-card strong,
.template-card strong {
    font-size: 13px !important;
}

.exam-template-card span,
.template-card span {
    font-size: 11px !important;
}

.exam-question-panel {
    padding: 20px !important;
    border-radius: 24px !important;
}

.exam-results-toolbar {
    margin-bottom: 14px !important;
    padding-bottom: 12px !important;
}

.exam-results-toolbar h3 {
    font-size: 20px !important;
    gap: 10px !important;
}

.exam-count-badge {
    font-size: 12px !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
}

.exam-question-card-grid-fixed,
.exam-question-card-grid {
    gap: 14px !important;
}

.exam-question-card-grid-fixed .question-select-card,
.exam-question-card-grid .question-select-card {
    padding: 14px !important;
    border-radius: 18px !important;
}

.exam-question-card-grid-fixed .badge,
.exam-question-card-grid .badge {
    font-size: 10px !important;
    padding: 5px 7px !important;
}

.exam-question-card-grid-fixed p,
.exam-question-card-grid p {
    font-size: 13px !important;
    line-height: 1.45 !important;
    margin-top: 10px !important;
}

.exam-question-card-grid-fixed .select-question-toggle,
.exam-question-card-grid .select-question-toggle {
    min-height: 34px !important;
    font-size: 11.5px !important;
    padding: 6px 9px !important;
}

.exam-question-card-grid-fixed .question-point-row,
.exam-question-card-grid .question-point-row {
    padding-top: 10px !important;
}

.exam-question-card-grid-fixed .question-point-input,
.exam-question-card-grid .question-point-input {
    min-height: 36px !important;
    height: 36px !important;
    max-width: 96px !important;
    font-size: 12px !important;
    border-radius: 12px !important;
}

.exam-question-card-grid-fixed .options,
.exam-question-card-grid .options {
    padding: 8px !important;
    font-size: 12px !important;
    border-radius: 12px !important;
}

.exam-submit-area,
.create-exam-actions {
    margin-top: 14px !important;
}

.exam-submit-area button,
.create-exam-actions button,
.exam-main-submit {
    min-height: 44px !important;
    border-radius: 14px !important;
    font-size: 14px !important;
    padding: 0 18px !important;
}

/* Soru Bankası'ndan gelince üst alan zaten gizli; sol panel daha kompakt */
.from-question-bank .exam-studio-layout {
    margin-top: 12px !important;
}

.from-question-bank .exam-info-panel,
.from-question-bank .exam-side-panel,
.from-question-bank .exam-form-panel,
.from-question-bank .exam-left-panel {
    position: sticky;
    top: 86px;
}

/* Orta ekranlarda bozulmasın */
@media (max-width: 1200px) {
    .exam-studio-layout {
        grid-template-columns: 1fr !important;
    }

    .from-question-bank .exam-info-panel,
    .from-question-bank .exam-side-panel,
    .from-question-bank .exam-form-panel,
    .from-question-bank .exam-left-panel {
        position: static;
    }
}


/* ===== FILTER ALIGN FIX ===== */

/* Süz buton hizalama */
.exam-studio-hero .filter-grid,
.exam-filter-grid {
    align-items: center !important;
}

.exam-studio-hero button,
.exam-filter-panel button {
    margin-top: 0 !important;
}

/* Filtreleri temizle ortalama */
.exam-studio-hero .clear-filters,
.exam-filter-panel .clear-filters,
.filter-clear-btn {
    display: block !important;
    margin: 16px auto 0 auto !important;
    text-align: center !important;
}


/* ===== QUESTIONS META TEXT FIX ===== */

/* Başlıklar kalın, içerik normal */
.qb-meta span {
    font-weight: 400 !important;
    color: #6b7280 !important;
}

/* Başlık kısmını kalın yap */
.qb-meta span b,
.qb-meta span strong {
    font-weight: 800 !important;
    color: #111827 !important;
}

/* Eğer başlıklar düz metinse (örn: Sınıf: 9) */
.qb-meta span::first-letter {
    font-weight: inherit !important;
}

/* Alternatif: başlıkları ayırmak için */
.qb-meta span {
    display: inline-block;
}



/* ===== META PREMIUM STYLE ===== */

.qb-meta {
    gap: 10px 18px !important;
}

.qb-meta span {
    font-size: 13px !important;
    color: #475569 !important;
}

.qb-meta strong {
    font-weight: 800 !important;
    color: #1e293b !important;
    margin-right: 4px;
}

/* Başlık rengi hafif mavi */
.qb-meta strong {
    color: #2563eb !important;
}

/* Değer daha koyu */
.qb-meta span {
    color: #334155 !important;
}

/* satırlar arası boşluk */
.qb-meta {
    line-height: 1.6;
}

/* FINAL META FIX */
.qb-meta {
    display:flex;
    flex-wrap:wrap;
    gap:10px 18px;
    line-height:1.6;
}

.qb-meta span {
    font-size:13px;
    color:#334155;
}

.qb-meta strong {
    font-weight:800;
    color:#2563eb;
    margin-right:4px;
}

.qb-meta span::first-letter {
    font-weight:normal !important;
}


/* ===== QB META COMPLETE REBUILD FINAL ===== */
.qb-question-card .qb-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px 18px !important;
    line-height: 1.55 !important;
    padding: 14px 16px !important;
    background: rgba(255,255,255,.94) !important;
    border-radius: 6px !important;
    border: 0 !important;
}

.qb-question-card .qb-meta span {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 4px !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #334155 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
}

.qb-question-card .qb-meta span strong {
    display: inline !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
}

/* Eski ilk harf kalınlaştırma efektini kesin kapat */
.qb-question-card .qb-meta span::first-letter {
    font-weight: 400 !important;
    color: inherit !important;
}

/* Başlık dışındaki değerler kesinlikle normal */
.qb-question-card .qb-meta span:not(strong) {
    font-weight: 400 !important;
}


/* ===== File Sharing Page ===== */
.files-page {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.files-hero {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: 24px;
    align-items: center;
    padding: 36px;
    border-radius: 30px;
    color: #fff;
    background: linear-gradient(135deg, #111827, #312e81 52%, #2563eb);
    box-shadow: 0 24px 70px rgba(37,99,235,.22);
}

.files-kicker {
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 14px;
}

.files-hero h1 {
    margin: 0;
    font-size: clamp(32px, 4vw, 50px);
    line-height: 1.05;
    letter-spacing: -1.6px;
}

.files-hero p {
    margin: 14px 0 0;
    color: rgba(255,255,255,.82);
    line-height: 1.7;
}

.files-search {
    display: flex;
    gap: 10px;
    padding: 10px;
    border-radius: 18px;
    background: rgba(255,255,255,.95);
}

.files-search input {
    flex: 1;
    border: 0;
    background: #f8fafc;
    border-radius: 12px;
    padding: 12px;
}

.files-search button {
    border: 0;
    border-radius: 12px;
    background: #312e81;
    color: #fff;
    font-weight: 850;
    padding: 0 18px;
}

.files-layout {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 22px;
    margin-top: 24px;
}

.files-categories,
.files-list {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 26px;
    padding: 20px;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
}

.files-categories h2,
.files-list h2 {
    margin: 0 0 14px;
    color: #0f172a;
}

.file-category {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 13px;
    border-radius: 16px;
    color: #334155;
    text-decoration: none;
    font-weight: 800;
    border: 1px solid transparent;
}

.file-category:hover,
.file-category.active {
    background: #eef2ff;
    border-color: #c7d2fe;
    color: #312e81;
}

.file-category b {
    background: #fff;
    border-radius: 999px;
    padding: 2px 8px;
}

.files-list-head {
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.files-list-head p {
    margin: 4px 0 0;
    color: #64748b;
}

.file-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.file-card {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 14px;
    padding: 16px;
    border: 1px solid #e5e7eb;
    border-radius: 22px;
    background: #f8fafc;
}

.file-ext {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    background: #312e81;
    color: #fff;
    display: grid;
    place-items: center;
    font-weight: 950;
    font-size: 13px;
}

.file-body h3 {
    margin: 0 0 6px;
    color: #0f172a;
    font-size: 17px;
}

.file-body p {
    margin: 0 0 10px;
    color: #64748b;
    line-height: 1.55;
}

.file-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    font-size: 12.5px;
    color: #475569;
}

.file-download-btn {
    grid-column: 1 / -1;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 42px;
    border-radius: 14px;
    background: #2563eb;
    color: #fff;
    text-decoration: none;
    font-weight: 850;
}

.files-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 34px;
    border: 1px dashed #cbd5e1;
    border-radius: 22px;
    color: #64748b;
}

.files-empty strong {
    display: block;
    color: #0f172a;
    margin-bottom: 6px;
}

@media (max-width: 900px) {
    .files-hero,
    .files-layout {
        grid-template-columns: 1fr;
    }

    .file-card-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .files-page {
        width: min(100% - 24px, 1180px);
    }

    .files-hero {
        padding: 24px;
        border-radius: 24px;
    }

    .files-search {
        flex-direction: column;
    }

    .file-card {
        grid-template-columns: 1fr;
    }
}


/* ===== Index Payment Warning Buttons ===== */
.home-payment-links {
    margin-top: 54px;
}

.payment-link-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 22px;
}

.payment-link-card {
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 26px;
    padding: 24px;
    text-align: left;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
    cursor: pointer;
    transition: .2s ease;
    display: grid;
    gap: 8px;
}

.payment-link-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 20px 48px rgba(15,23,42,.11);
    border-color: #c7d2fe;
}

.payment-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: #eef2ff;
    font-size: 22px;
    margin-bottom: 8px;
}

.payment-link-card strong {
    color: #0f172a;
    font-size: 20px;
    font-weight: 950;
}

.payment-link-card small {
    color: #64748b;
    font-size: 14px;
    line-height: 1.5;
}

.payment-modal {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.58);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.payment-modal.show {
    display: flex;
}

.payment-modal-card {
    width: min(520px, 100%);
    background: #fff;
    border-radius: 28px;
    padding: 30px;
    position: relative;
    text-align: center;
    box-shadow: 0 30px 90px rgba(15,23,42,.30);
}

.payment-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 12px;
    background: #f1f5f9;
    color: #0f172a;
    font-size: 24px;
    cursor: pointer;
}

.payment-modal-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin: 0 auto 14px;
    border-radius: 20px;
    background: #eef2ff;
    font-size: 28px;
}

.payment-modal-card h2 {
    margin: 0;
    color: #0f172a;
    font-size: 28px;
    letter-spacing: -1px;
}

.payment-modal-card p {
    color: #64748b;
    line-height: 1.7;
    margin: 14px 0 22px;
}

.payment-modal-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.home-btn.dark-text {
    color: #334155 !important;
    background: #f8fafc !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: none !important;
}

@media (max-width: 820px) {
    .payment-link-grid {
        grid-template-columns: 1fr;
    }

    .payment-modal-actions .home-btn {
        width: 100%;
    }
}


/* ===== Header Payment Buttons ===== */
.top-payment-links {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: 12px;
    margin-right: 12px;
    flex-wrap: wrap;
}

.top-payment-btn {
    min-height: 36px;
    border: 1px solid #c7d2fe;
    background: #eef2ff;
    color: #312e81;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 850;
    cursor: pointer;
    transition: .2s ease;
    white-space: nowrap;
}

.top-payment-btn:hover {
    background: #e0e7ff;
    transform: translateY(-1px);
}

.payment-modal {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,.58);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
}

.payment-modal.show {
    display: flex;
}

.payment-modal-card {
    width: min(520px, 100%);
    background: #fff;
    border-radius: 28px;
    padding: 30px;
    position: relative;
    text-align: center;
    box-shadow: 0 30px 90px rgba(15,23,42,.30);
}

.payment-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 12px;
    background: #f1f5f9;
    color: #0f172a;
    font-size: 24px;
    cursor: pointer;
}

.payment-modal-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin: 0 auto 14px;
    border-radius: 20px;
    background: #eef2ff;
    font-size: 28px;
}

.payment-modal-card h2 {
    margin: 0;
    color: #0f172a;
    font-size: 28px;
    letter-spacing: -1px;
}

.payment-modal-card p {
    color: #64748b;
    line-height: 1.7;
    margin: 14px 0 22px;
}

.payment-modal-actions {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap;
}

.home-btn.dark-text {
    color: #334155 !important;
    background: #f8fafc !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: none !important;
}

@media (max-width: 860px) {
    .top-payment-links {
        width: 100%;
        order: 5;
        justify-content: center;
        margin: 10px 0 0;
    }

    .top-payment-btn {
        flex: 1 1 auto;
    }
}


/* ===== Packages Page ===== */
.packages-page {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.packages-hero {
    text-align: center;
    padding: 46px 28px;
    border-radius: 30px;
    color: #fff;
    background: linear-gradient(135deg, #111827, #312e81 52%, #2563eb);
    box-shadow: 0 24px 70px rgba(37,99,235,.22);
}

.packages-kicker {
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 14px;
}

.packages-hero h1 {
    margin: 0;
    font-size: clamp(32px, 4vw, 50px);
    line-height: 1.05;
    letter-spacing: -1.5px;
}

.packages-hero p {
    max-width: 720px;
    margin: 16px auto 0;
    color: rgba(255,255,255,.82);
    line-height: 1.7;
}

.packages-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin-top: 24px;
}

.package-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 26px;
    padding: 24px;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
}

.package-card.featured {
    border-color: #818cf8;
    box-shadow: 0 22px 56px rgba(79,70,229,.16);
    transform: translateY(-6px);
}

.package-label {
    display: inline-flex;
    padding: 6px 10px;
    border-radius: 999px;
    background: #eef2ff;
    color: #312e81;
    font-weight: 850;
    font-size: 12px;
}

.package-card h2 {
    margin: 16px 0 8px;
    color: #0f172a;
    font-size: 24px;
}

.package-card p {
    color: #64748b;
    line-height: 1.6;
}

.package-price {
    display: block;
    margin: 18px 0;
    font-size: 22px;
    color: #312e81;
}

.package-card ul {
    margin: 0 0 22px;
    padding-left: 18px;
    color: #334155;
    line-height: 1.8;
}

.package-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    width: 100%;
    border-radius: 14px;
    background: #312e81;
    color: #fff;
    text-decoration: none;
    font-weight: 850;
}

.package-btn.light {
    background: #eef2ff;
    color: #312e81;
}

@media (max-width: 900px) {
    .packages-grid {
        grid-template-columns: 1fr;
    }

    .package-card.featured {
        transform: none;
    }
}

/* WhatsApp Floating Button */
.whatsapp-float {
    position: fixed;
    right: 20px;
    bottom: 20px;
    width: 56px;
    height: 56px;
    background: #25D366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    text-decoration: none;
    box-shadow: 0 10px 30px rgba(0,0,0,.2);
    z-index: 9999;
    transition: .2s;
}

.whatsapp-float:hover {
    transform: scale(1.1);
    background: #1ebe5d;
}


/* ===== Admin Questions Stats ===== */
.admin-question-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin: 0 0 14px;
}

.admin-stat-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 20px;
    padding: 18px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .06);
}

.admin-stat-card.primary {
    background: linear-gradient(135deg, #312e81, #2563eb);
    color: #fff;
}

.admin-stat-card span {
    display: block;
    font-size: 13px;
    color: #64748b;
    font-weight: 800;
    margin-bottom: 8px;
}

.admin-stat-card.primary span {
    color: rgba(255,255,255,.82);
}

.admin-stat-card strong {
    display: block;
    font-size: 32px;
    line-height: 1;
    color: #0f172a;
    font-weight: 950;
}

.admin-stat-card.primary strong {
    color: #fff;
}

.admin-question-mini-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 18px;
}

.admin-question-mini-stats span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 8px 11px;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    color: #334155;
    font-size: 13px;
    font-weight: 750;
}

.admin-question-mini-stats b {
    color: #312e81;
    font-weight: 950;
}

@media (max-width: 900px) {
    .admin-question-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .admin-question-stats {
        grid-template-columns: 1fr;
    }
}


/* ===== Requested Fixes: Filter, Exams, Online Exam ===== */
.qb-filter-actions {
    align-self: end !important;
    display: flex !important;
    align-items: end !important;
    justify-content: center !important;
}

.qb-clear-under-search {
    background: #312e81 !important;
    color: #fff !important;
    border-color: #312e81 !important;
    width: 100%;
}

.exams-page .btn,
.exam-card .btn,
.exams-table .btn,
.exam-small-btn {
    min-height: 32px !important;
    padding: 6px 10px !important;
    font-size: 12px !important;
    border-radius: 10px !important;
}

.btn.danger,
.exam-small-btn.danger {
    background: #fee2e2 !important;
    color: #991b1b !important;
    border: 1px solid #fecaca !important;
}

.online-exam-page {
    width: min(980px, calc(100% - 32px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.online-exam-hero,
.online-result-card,
.online-question-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    padding: 22px;
    box-shadow: 0 14px 38px rgba(15,23,42,.06);
    margin-bottom: 16px;
}

.online-exam-hero h1 {
    margin: 0 0 8px;
    color: #0f172a;
}

.online-exam-hero p {
    color: #64748b;
    margin: 0;
}

.online-question-head {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.online-question-head span {
    background: #eef2ff;
    color: #312e81;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 850;
}

.online-question-card label {
    display: block;
    padding: 10px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    margin-top: 8px;
}

.online-question-card textarea {
    width: 100%;
    border: 1px solid #dbe3ef;
    border-radius: 14px;
    padding: 12px;
    background: #f8fafc;
}

.online-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    border: 0;
    border-radius: 14px;
    background: #312e81;
    color: #fff;
    font-weight: 850;
    text-decoration: none;
    padding: 0 18px;
}

.online-score {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 12px 0 20px;
}

.online-score strong {
    font-size: 54px;
    color: #312e81;
}

.online-result-list {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}

.online-result-item {
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    padding: 14px;
    background: #f8fafc;
    display: grid;
    gap: 6px;
}

.online-result-item.correct {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.online-result-item.wrong {
    border-color: #fecaca;
    background: #fff7f7;
}


/* ===== FINAL UI + DELETE FIXES ===== */

/* questions.php Ara/Filtrele ve Temizle aynı uzunluk */
.qb-search-row .qb-filter-equal-btn,
.qb-filter-actions .qb-filter-equal-btn,
.qb-filter-equal-btn {
    width: 160px !important;
    min-width: 160px !important;
    max-width: 160px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #312e81 !important;
    color: #fff !important;
    border: 1px solid #312e81 !important;
    font-weight: 850 !important;
}

.qb-filter-actions {
    align-self: end !important;
    justify-content: center !important;
}

/* create-exam.php Süz ve Filtreleri Temizle aynı renk / ortalı */
.create-filter-btn,
.exam-filter-panel .create-filter-btn,
.exam-studio-hero .create-filter-btn,
.create-clear-btn {
    background: #312e81 !important;
    color: #fff !important;
    border: 1px solid #312e81 !important;
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
    padding: 0 16px !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

.create-clear-btn,
a.create-clear-btn {
    margin: 14px auto 0 auto !important;
    width: 190px !important;
    text-align: center !important;
}

.exam-filter-panel .clear-filters,
.exam-studio-hero .clear-filters,
.filter-clear-btn {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* exams.php butonları küçük ve silme formu doğru hizalı */
.exam-delete-form {
    display: inline-flex !important;
    margin: 0 !important;
}

.exams-page .btn,
.exam-card .btn,
.exams-table .btn,
.exam-small-btn,
.exam-delete-form button {
    min-height: 30px !important;
    padding: 5px 9px !important;
    font-size: 11.5px !important;
    border-radius: 9px !important;
    line-height: 1.1 !important;
}

.btn.danger,
.exam-small-btn.danger,
.exam-delete-form button {
    background: #fee2e2 !important;
    color: #991b1b !important;
    border: 1px solid #fecaca !important;
}

.flash_message_exam_final {
    width: min(1180px, calc(100% - 36px));
    margin: 16px auto !important;
}


/* ===== QUESTIONS PAGE REQUESTED UI FIX ===== */
.qb-mini-link {
    display: none !important;
}

.qb-search-row {
    grid-template-columns: minmax(0, 1fr) 180px !important;
    gap: 22px !important;
    align-items: end !important;
}

.qb-search-square-btn {
    width: 180px !important;
    height: 54px !important;
    min-height: 54px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .24) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    letter-spacing: .2px;
}

.qb-search-square-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 18px 40px rgba(49, 46, 129, .32) !important;
}

.qb-filter-actions-empty {
    display: none !important;
}

.qb-filter-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important;
    gap: 14px !important;
}

.qb-field,
.qb-filter-card label {
    min-width: 0 !important;
}

.qb-checkdrop-btn,
.qb-filter-card select,
.qb-filter-card input {
    min-height: 48px !important;
    border-radius: 15px !important;
}

.qb-results-sticky {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 390px !important;
    gap: 22px !important;
    align-items: center !important;
    padding: 16px !important;
}

.qb-sticky-inline {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 12px !important;
    border-radius: 18px !important;
}

.qb-sticky-inline strong {
    font-size: 14px !important;
    font-weight: 950 !important;
}

.qb-sticky-inline span {
    font-size: 12px !important;
    max-width: 180px !important;
}

.qb-sticky-inline .qb-btn {
    min-height: 48px !important;
    height: 48px !important;
    border-radius: 16px !important;
    padding: 0 18px !important;
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 12px 28px rgba(49, 46, 129, .22) !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    white-space: nowrap !important;
}

.qb-cart-card {
    padding: 24px !important;
}

.qb-cart-card span {
    font-size: 14px !important;
    font-weight: 950 !important;
    color: #111827 !important;
}

.qb-cart-card strong {
    font-size: 52px !important;
    margin: 8px 0 18px !important;
}

.qb-cart-card .qb-btn {
    min-height: 44px !important;
    border-radius: 14px !important;
}

@media (max-width: 980px) {
    .qb-search-row {
        grid-template-columns: 1fr !important;
    }

    .qb-search-square-btn {
        width: 100% !important;
    }

    .qb-filter-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    .qb-results-sticky {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 620px) {
    .qb-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .qb-sticky-inline {
        grid-template-columns: 1fr !important;
    }

    .qb-sticky-inline .qb-btn {
        width: 100% !important;
    }
}


/* ===== QUESTIONS UI SECOND REQUEST FIX ===== */

/* Üst kart: toplam soru kartı */
.qb-cart-card {
    justify-items: center !important;
}

.qb-cart-card span {
    text-align: center !important;
    line-height: 1.35 !important;
}

/* Sticky alanda Sınav Hazırla + Temizle dikey */
.qb-sticky-action-col {
    display: grid !important;
    gap: 7px !important;
    justify-items: center !important;
}

.qb-sticky-action-col .qb-btn {
    width: 100% !important;
}

.qb-sticky-clear-link {
    color: #312e81 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    padding: 2px 6px !important;
    border-radius: 999px !important;
}

.qb-sticky-clear-link:hover {
    background: #eef2ff !important;
}

/* Modüller / Soru Türleri modern dropdown */
.qb-checkdrop-btn {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #111827 !important;
    background: #f8fafc !important;
    border: 1px solid #dbe3ef !important;
    border-radius: 16px !important;
    min-height: 48px !important;
    padding: 10px 14px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.7) !important;
}

.qb-checkdrop-btn:hover {
    border-color: #c7d2fe !important;
    background: #fff !important;
}

.qb-checkdrop.open .qb-checkdrop-btn {
    border-color: #312e81 !important;
    box-shadow: 0 0 0 4px rgba(49,46,129,.10) !important;
    background: #fff !important;
}

.qb-checkdrop-text {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #111827 !important;
}

.qb-checkdrop-btn b {
    width: 26px !important;
    height: 26px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 9px !important;
    background: #eef2ff !important;
    color: #312e81 !important;
    font-size: 16px !important;
}

.qb-checkdrop-menu {
    border-radius: 18px !important;
    border: 1px solid #dbe3ef !important;
    padding: 10px !important;
    box-shadow: 0 24px 70px rgba(15,23,42,.18) !important;
}

.qb-check-option {
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #111827 !important;
    border-radius: 12px !important;
    padding: 9px 10px !important;
}

.qb-check-option span {
    font-family: inherit !important;
    font-weight: 500 !important;
}

.qb-check-option input {
    accent-color: #312e81 !important;
}

.qb-check-all {
    font-weight: 800 !important;
    color: #312e81 !important;
}

/* Sticky grid buton alanına yeni sütun */
.qb-sticky-inline {
    grid-template-columns: minmax(0, 1fr) 190px !important;
}


/* ===== Modern Lesson Autocomplete ===== */
.lesson-autocomplete-wrap {
    position: relative !important;
}

.lesson-autocomplete-box {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 8px);
    z-index: 9999;
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 18px;
    padding: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
    max-height: 270px;
    overflow-y: auto;
}

.lesson-autocomplete-box.show {
    display: grid;
    gap: 6px;
}

.lesson-autocomplete-item {
    width: 100%;
    border: 0;
    background: transparent;
    color: #111827;
    padding: 11px 12px;
    border-radius: 13px;
    text-align: left;
    font-size: 14px;
    font-weight: 750;
    cursor: pointer;
    transition: .15s ease;
}

.lesson-autocomplete-item:hover {
    background: #eef2ff;
    color: #312e81;
}

#lessonSearchInput {
    padding-right: 42px !important;
}


/* ===== Questions Button Relayout ===== */

/* Üst satır: arama + aramayı temizle */
.qb-search-row {
    grid-template-columns: minmax(0, 1fr) 190px !important;
    gap: 22px !important;
    align-items: end !important;
}

.qb-search-clear-btn {
    width: 190px !important;
    height: 54px !important;
    min-height: 54px !important;
    border-radius: 18px !important;
    background: #eef2ff !important;
    color: #312e81 !important;
    border: 1px solid #c7d2fe !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

.qb-search-clear-btn:hover {
    background: #e0e7ff !important;
}

/* Alt filtre satırı: 5 filtre + sağda ara/filtrele */
.qb-filter-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) 180px !important;
    gap: 14px !important;
    align-items: end !important;
}

.qb-filter-submit-side {
    display: flex !important;
    align-items: end !important;
    justify-content: center !important;
    height: 100% !important;
}

.qb-filter-side-btn {
    width: 180px !important;
    height: 58px !important;
    min-height: 58px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .24) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.qb-filter-side-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 18px 40px rgba(49, 46, 129, .32) !important;
}

@media (max-width: 1200px) {
    .qb-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .qb-filter-submit-side {
        justify-content: stretch !important;
    }

    .qb-filter-side-btn {
        width: 100% !important;
    }
}

@media (max-width: 760px) {
    .qb-search-row,
    .qb-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .qb-search-clear-btn,
    .qb-filter-side-btn {
        width: 100% !important;
    }
}


/* ===== QUESTIONS BUTTON ALIGNMENT FINAL FIX ===== */

/* Üstteki Aramayı Temizle butonu mor zemin */
.qb-search-clear-btn {
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .22) !important;
}

/* Filtre gridini tek satır hizasına zorla */
.qb-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) 180px !important;
    gap: 14px !important;
    align-items: end !important;
}

/* Soru türleri ve buton aynı taban çizgisinde */
.qb-filter-submit-side {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    height: auto !important;
    align-self: end !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Ara / Filtrele butonu Soru Türleri kutusu yüksekliğinde */
.qb-filter-side-btn {
    width: 180px !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    transform: none !important;
    position: static !important;
    align-self: end !important;
}

/* Filtre kartında eski aşağı iten kuralları sıfırla */
.qb-filter-card .qb-filter-submit-side,
.qb-filter-card .qb-filter-side-btn {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Dropdown kutularıyla görsel uyum */
.qb-checkdrop-btn,
.qb-filter-card select {
    height: 60px !important;
    min-height: 60px !important;
}

/* Responsive */
@media (max-width: 1200px) {
    .qb-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .qb-filter-side-btn {
        width: 100% !important;
    }
}

@media (max-width: 760px) {
    .qb-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .qb-filter-side-btn,
    .qb-search-clear-btn {
        width: 100% !important;
    }
}


/* ===== QUESTIONS FILTER BUTTON RIGHT-SLOT FINAL ===== */

/* Üst arama satırındaki temizle butonu: normal + hover tamamen mor */
.qb-search-clear-btn,
.qb-search-clear-btn:hover,
.qb-search-clear-btn:focus,
.qb-search-clear-btn:active {
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .24) !important;
    transform: none !important;
}

/* Filtreleri tek satırda 6 hücre yap: Sınıf, Dal, Ders, Modül, Tür, Buton */
.qb-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: end !important;
}

/* Tüm filtre kutuları aynı yükseklik */
.qb-filter-card select,
.qb-filter-card input,
.qb-checkdrop-btn {
    height: 60px !important;
    min-height: 60px !important;
    box-sizing: border-box !important;
}

/* Ara/Filtrele butonu sağdaki 6. hücrede, altına değil */
.qb-filter-submit-side {
    grid-column: auto !important;
    align-self: end !important;
    justify-self: stretch !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: stretch !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Buton kutularla birebir aynı hizada ve aynı yükseklikte */
.qb-filter-side-btn,
.qb-filter-side-btn:hover,
.qb-filter-side-btn:focus,
.qb-filter-side-btn:active {
    width: 100% !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border-radius: 18px !important;
    position: static !important;
    transform: none !important;
    align-self: auto !important;
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .24) !important;
}

/* Önceki kuralların butonu aşağı düşürmesini engelle */
.qb-filter-card .qb-filter-submit-side,
.qb-filter-card .qb-filter-side-btn,
.qb-filter-submit-side .qb-filter-side-btn {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    top: auto !important;
    bottom: auto !important;
}

/* Responsive */
@media (max-width: 1300px) {
    .qb-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .qb-filter-grid,
    .qb-search-row {
        grid-template-columns: 1fr !important;
    }

    .qb-filter-side-btn,
    .qb-search-clear-btn {
        width: 100% !important;
    }
}


/* ===== FINAL REAL HTML REPOSITION FOR QUESTIONS FILTER ===== */
.qb-filter-card form#questionBankFilter {
    display: block !important;
}

/* Üst arama satırı */
.qb-search-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 240px !important;
    gap: 28px !important;
    align-items: end !important;
}

/* Üst temizle butonu diğer mor butonlarla aynı */
.qb-search-clear-btn,
.qb-search-clear-btn:hover,
.qb-search-clear-btn:focus,
.qb-search-clear-btn:active {
    width: 240px !important;
    height: 60px !important;
    min-height: 60px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .24) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    transform: none !important;
}

/* Filtre satırı: 6 eşit hücre. Buton artık HTML olarak son hücrede. */
.qb-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: end !important;
}

/* Soru türleri dahil tüm alanlar aynı tabanda */
.qb-filter-grid > label,
.qb-filter-grid > .qb-field,
.qb-filter-grid > .qb-filter-submit-side {
    align-self: end !important;
    min-width: 0 !important;
}

/* Kutular aynı yükseklik */
.qb-filter-card select,
.qb-filter-card input,
.qb-checkdrop-btn {
    height: 60px !important;
    min-height: 60px !important;
    box-sizing: border-box !important;
}

/* Ara / Filtrele sağdaki boşlukta ve aynı hizada */
.qb-filter-submit-side {
    display: flex !important;
    width: 100% !important;
    height: auto !important;
    align-items: flex-end !important;
    justify-content: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-column: auto !important;
    grid-row: auto !important;
}

.qb-filter-side-btn,
.qb-filter-side-btn:hover,
.qb-filter-side-btn:focus,
.qb-filter-side-btn:active {
    width: 100% !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border-radius: 18px !important;
    background: linear-gradient(135deg, #312e81, #4338ca) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 14px 32px rgba(49, 46, 129, .24) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    position: static !important;
    transform: none !important;
    top: auto !important;
    bottom: auto !important;
}

/* Önceki bozan kuralları iptal */
.qb-filter-actions,
.qb-filter-actions-empty {
    display: none !important;
}

/* 6 kolon sığmazsa 3+3 */
@media (max-width: 1300px) {
    .qb-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* Mobil */
@media (max-width: 760px) {
    .qb-search-row,
    .qb-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .qb-search-clear-btn,
    .qb-filter-side-btn {
        width: 100% !important;
    }
}

/* =========================================================
   SınavLab exam-paper.php PDF / Yazdırma Düzeltmesi
   Bu blok, eski genel print kuralını sadece sınav kağıdı sayfasında ezer.
   ========================================================= */
@media print {
    body.exam-paper-body,
    body.exam-paper-body * {
        visibility: visible !important;
    }

    body.exam-paper-body {
        width: 210mm !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
        color: #000 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body.exam-paper-body .toolbar,
    body.exam-paper-body header,
    body.exam-paper-body nav,
    body.exam-paper-body footer,
    body.exam-paper-body .site-header,
    body.exam-paper-body .site-footer,
    body.exam-paper-body .header,
    body.exam-paper-body .footer {
        display: none !important;
        visibility: hidden !important;
    }

    body.exam-paper-body .paper {
        display: block !important;
        position: relative !important;
        width: 192mm !important;
        max-width: 192mm !important;
        min-height: auto !important;
        height: auto !important;
        margin: 0 auto !important;
        padding: 0 !important;
        background: #fff !important;
        color: #000 !important;
        box-shadow: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        overflow: visible !important;
        transform: none !important;
    }

    body.exam-paper-body .paper.exam-page {
        page-break-after: always !important;
        break-after: page !important;
    }

    body.exam-paper-body .paper.answer-page {
        page-break-before: always !important;
        break-before: page !important;
        margin-top: 0 !important;
    }

    body.exam-paper-body .question {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        border-bottom: 1px dashed #777 !important;
        margin-bottom: 12px !important;
        padding-bottom: 8px !important;
    }
}

/* create-exam.php filtre aksiyonları: panelin tam ortasında */
.exam-search-panel .exam-filter-actions-centered {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 18px auto 0 !important;
    padding-top: 2px !important;
    text-align: center !important;
}

.exam-search-panel .exam-filter-actions-centered .create-filter-btn,
.exam-search-panel .exam-filter-actions-centered .create-clear-btn {
    width: 190px !important;
    min-width: 190px !important;
    max-width: 190px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

@media (max-width: 700px) {
    .exam-search-panel .exam-filter-actions-centered {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .exam-search-panel .exam-filter-actions-centered .create-filter-btn,
    .exam-search-panel .exam-filter-actions-centered .create-clear-btn {
        width: 100% !important;
        max-width: 320px !important;
    }
}


/* ===== Create Exam professional typography + darker meta polish ===== */
.exam-builder-side .template-preview-grid,
.exam-builder-side .template-option,
.exam-builder-side .template-option *,
.template-option,
.template-option * {
    font-family: Inter, Arial, Helvetica, sans-serif !important;
    letter-spacing: 0 !important;
}

.exam-builder-side .template-option,
.template-option {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    min-height: 158px !important;
    padding: 18px 16px !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, #ffffff, #f8fafc) !important;
    color: #334155 !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
}

.exam-builder-side .template-option strong,
.template-option strong {
    display: block !important;
    margin: 8px 0 0 !important;
    color: #111827 !important;
    font-size: 16px !important;
    line-height: 1.18 !important;
    font-weight: 800 !important;
    letter-spacing: -0.2px !important;
}

.exam-builder-side .template-option input,
.template-option input {
    width: auto !important;
    margin: 0 0 8px 0 !important;
    accent-color: #4f46e5 !important;
}

.question-select-head .question-meta-box {
    background: linear-gradient(135deg, #e8edff 0%, #dbeafe 55%, #eef2ff 100%) !important;
    border: 1px solid #b8c7ee !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.78), 0 8px 22px rgba(49,46,129,.08) !important;
}

.question-select-head .question-meta-box .badge {
    border: 1px solid rgba(99,102,241,.10) !important;
    box-shadow: 0 1px 2px rgba(15,23,42,.04) !important;
}


/* Final template select professional fix */




/* Şablon Seç alanı - profesyonel kompakt görünüm */
.exam-builder-side .template-section-title,
.exam-builder-side .template-section-title *,
.exam-builder-side .template-preview-grid,
.exam-builder-side .template-preview-grid *,
.exam-builder-side .template-option,
.exam-builder-side .template-option * {
    font-family: Inter, Arial, Helvetica, sans-serif !important;
    letter-spacing: 0 !important;
}

.exam-builder-side .template-preview-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 10px 0 12px !important;
}

.exam-builder-side .template-option {
    position: relative !important;
    display: block !important;
    min-height: 112px !important;
    padding: 14px 14px 13px 14px !important;
    border-radius: 18px !important;
    border: 1px solid #dbe3ef !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    color: #475569 !important;
    font-size: 13px !important;
    line-height: 1.34 !important;
    font-weight: 650 !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.045) !important;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease !important;
    overflow: hidden !important;
}

.exam-builder-side .template-option:hover {
    transform: translateY(-1px) !important;
    border-color: #b8c7ee !important;
    box-shadow: 0 12px 28px rgba(49, 46, 129, 0.09) !important;
}

.exam-builder-side .template-option:has(input:checked) {
    border-color: #4f46e5 !important;
    background: linear-gradient(180deg, #ffffff 0%, #eef2ff 100%) !important;
    box-shadow: 0 14px 32px rgba(79, 70, 229, 0.14) !important;
}

.exam-builder-side .template-option input[type="radio"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    padding: 0 !important;
    margin: 0 0 12px 0 !important;
    border-radius: 999px !important;
    border: 2px solid #94a3b8 !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 4px #ffffff !important;
    display: inline-block !important;
    vertical-align: top !important;
}

.exam-builder-side .template-option input[type="radio"]:checked {
    border-color: #4f46e5 !important;
    background: #4f46e5 !important;
}

.exam-builder-side .template-option strong {
    display: block !important;
    margin: 0 0 5px 0 !important;
    color: #0f172a !important;
    font-size: 15px !important;
    line-height: 1.16 !important;
    font-weight: 850 !important;
    letter-spacing: -0.18px !important;
}

.exam-builder-side .template-option::after {
    display: none !important;
}

/* Soru havuzu bilgi kutusu - daha tok ama göz yormayan renk */
.question-select-head .question-meta-box {
    background: linear-gradient(135deg, #dfe7ff 0%, #e6edff 48%, #edf4ff 100%) !important;
    border: 1px solid #b5c5f4 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 8px 20px rgba(49,46,129,.07) !important;
}

.question-select-head .question-meta-box .badge {
    box-shadow: 0 1px 3px rgba(15,23,42,.05) !important;
}



/* ===== Create Exam Studio: compact professional redesign ===== */
.container:not(.from-question-bank) .exam-studio-hero {
    position: relative !important;
    overflow: hidden !important;
    padding: 22px !important;
    border-radius: 26px !important;
    color: #0f172a !important;
    background:
        radial-gradient(circle at 96% 0%, rgba(79,70,229,.12), transparent 32%),
        linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96)) !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: 0 18px 46px rgba(15,23,42,.075) !important;
}

.container:not(.from-question-bank) .exam-studio-hero::after {
    display: none !important;
}

.container:not(.from-question-bank) .exam-studio-hero h2 {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: 28px !important;
    line-height: 1.14 !important;
    font-weight: 900 !important;
    letter-spacing: -0.7px !important;
}

.container:not(.from-question-bank) .exam-studio-hero h2::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 28px;
    margin-right: 11px;
    border-radius: 999px;
    vertical-align: -5px;
    background: linear-gradient(180deg, #4f46e5, #06b6d4);
}

.container:not(.from-question-bank) .exam-studio-hero p {
    max-width: 740px !important;
    margin: 9px 0 0 !important;
    color: #64748b !important;
    font-size: 14.5px !important;
    line-height: 1.6 !important;
    font-weight: 600 !important;
}

.container:not(.from-question-bank) .exam-search-panel {
    margin-top: 18px !important;
    padding: 18px !important;
    border-radius: 22px !important;
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.85) !important;
    backdrop-filter: none !important;
}

.container:not(.from-question-bank) .exam-search-panel > label {
    display: block !important;
    margin: 0 0 7px !important;
    color: #334155 !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
}

.container:not(.from-question-bank) .exam-search-panel input,
.container:not(.from-question-bank) .exam-search-panel select {
    min-height: 44px !important;
    padding: 10px 13px !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    border: 1px solid #dbe3ef !important;
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    box-shadow: 0 1px 0 rgba(255,255,255,.85) !important;
}

.container:not(.from-question-bank) .exam-search-panel input:focus,
.container:not(.from-question-bank) .exam-search-panel select:focus {
    border-color: #8b9cf4 !important;
    box-shadow: 0 0 0 4px rgba(79,70,229,.10) !important;
}

.container:not(.from-question-bank) .exam-filter-row {
    margin-top: 13px !important;
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.container:not(.from-question-bank) .exam-filter-row .filter-4 {
    grid-column: span 4 !important;
}

.container:not(.from-question-bank) .exam-filter-row .filter-3 {
    grid-column: span 3 !important;
}

.container:not(.from-question-bank) .exam-filter-row label {
    margin: 0 0 6px !important;
    color: #475569 !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
}

.container:not(.from-question-bank) .exam-filter-actions-centered {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 15px !important;
    padding-top: 14px !important;
    border-top: 1px solid #e2e8f0 !important;
}

.container:not(.from-question-bank) .create-filter-btn,
.container:not(.from-question-bank) .create-suz-btn,
.container:not(.from-question-bank) .create-clear-btn {
    min-width: 148px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 18px !important;
    border-radius: 14px !important;
    font-size: 13.5px !important;
    font-weight: 850 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.container:not(.from-question-bank) .create-suz-btn {
    background: linear-gradient(135deg, #4f46e5, #3730a3) !important;
    color: #ffffff !important;
    border: 1px solid transparent !important;
    box-shadow: 0 12px 24px rgba(79,70,229,.18) !important;
}

.container:not(.from-question-bank) .create-clear-btn {
    background: #ffffff !important;
    color: #3730a3 !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: 0 8px 18px rgba(15,23,42,.045) !important;
}

.container:not(.from-question-bank) .create-suz-btn:hover,
.container:not(.from-question-bank) .create-clear-btn:hover {
    transform: translateY(-1px) !important;
}

/* Make the left builder feel calmer after the hero redesign */
.exam-builder-side .exam-side-card {
    border-radius: 26px !important;
    border-color: #dbe3ef !important;
}

.exam-builder-side .template-preview-grid {
    gap: 10px !important;
}

.exam-builder-side .template-option {
    min-height: 92px !important;
    padding: 12px !important;
    border-radius: 16px !important;
    font-size: 12.5px !important;
    line-height: 1.32 !important;
}

.exam-builder-side .template-option input[type="radio"] {
    width: 15px !important;
    height: 15px !important;
    min-height: 15px !important;
    margin-bottom: 9px !important;
    border-width: 1.5px !important;
}

.exam-builder-side .template-option strong {
    font-size: 14px !important;
    line-height: 1.18 !important;
    margin-bottom: 4px !important;
}

@media (max-width: 1050px) {
    .container:not(.from-question-bank) .exam-filter-row .filter-4,
    .container:not(.from-question-bank) .exam-filter-row .filter-3 {
        grid-column: span 6 !important;
    }
}

@media (max-width: 760px) {
    .container:not(.from-question-bank) .exam-studio-hero {
        padding: 18px !important;
        border-radius: 22px !important;
    }

    .container:not(.from-question-bank) .exam-studio-hero h2 {
        font-size: 23px !important;
    }

    .container:not(.from-question-bank) .exam-filter-row .filter-4,
    .container:not(.from-question-bank) .exam-filter-row .filter-3 {
        grid-column: span 12 !important;
    }

    .container:not(.from-question-bank) .exam-filter-actions-centered {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .container:not(.from-question-bank) .create-filter-btn,
    .container:not(.from-question-bank) .create-suz-btn,
    .container:not(.from-question-bank) .create-clear-btn {
        width: 100% !important;
        min-width: 0 !important;
    }
}


/* ===== Create Exam: seçili soru kartını belirginleştirme ===== */
.exam-question-card-grid-fixed .question-select-card.is-selected,
.exam-question-card-grid .question-select-card.is-selected,
.exam-question-card-grid-fixed .question-select-card:has(input[name="question_ids[]"]:checked),
.exam-question-card-grid .question-select-card:has(input[name="question_ids[]"]:checked) {
    border: 2px solid #3730a3 !important;
    background:
        linear-gradient(135deg, rgba(79,70,229,0.16), rgba(6,182,212,0.10)),
        #ffffff !important;
    box-shadow: 0 18px 42px rgba(55,48,163,0.22) !important;
    transform: translateY(-1px) !important;
}

.exam-question-card-grid-fixed .question-select-card.is-selected::before,
.exam-question-card-grid .question-select-card.is-selected::before,
.exam-question-card-grid-fixed .question-select-card:has(input[name="question_ids[]"]:checked)::before,
.exam-question-card-grid .question-select-card:has(input[name="question_ids[]"]:checked)::before {
    content: "✓ Sınava eklendi";
    position: absolute;
    top: -11px;
    right: 18px;
    z-index: 3;
    padding: 6px 11px;
    border-radius: 999px;
    background: linear-gradient(135deg, #3730a3, #4f46e5);
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0;
    box-shadow: 0 10px 22px rgba(55,48,163,0.28);
}

.exam-question-card-grid-fixed .question-select-card.is-selected .question-meta-box,
.exam-question-card-grid .question-select-card.is-selected .question-meta-box,
.exam-question-card-grid-fixed .question-select-card:has(input[name="question_ids[]"]:checked) .question-meta-box,
.exam-question-card-grid .question-select-card:has(input[name="question_ids[]"]:checked) .question-meta-box {
    background: linear-gradient(135deg, #dbeafe, #e0e7ff) !important;
    border-color: #a5b4fc !important;
}

.exam-question-card-grid-fixed .question-select-card.is-selected .select-question-toggle,
.exam-question-card-grid .question-select-card.is-selected .select-question-toggle,
.exam-question-card-grid-fixed .question-select-card:has(input[name="question_ids[]"]:checked) .select-question-toggle,
.exam-question-card-grid .question-select-card:has(input[name="question_ids[]"]:checked) .select-question-toggle {
    background: linear-gradient(135deg, #3730a3, #4f46e5) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(55,48,163,0.22) !important;
}

.exam-question-card-grid-fixed .question-select-card.is-selected .select-question-toggle input,
.exam-question-card-grid .question-select-card.is-selected .select-question-toggle input,
.exam-question-card-grid-fixed .question-select-card:has(input[name="question_ids[]"]:checked) .select-question-toggle input,
.exam-question-card-grid .question-select-card:has(input[name="question_ids[]"]:checked) .select-question-toggle input {
    accent-color: #ffffff !important;
}


/* FINAL TEMPLATE TYPOGRAPHY FIX - fallback if inline styles are removed */
.exam-builder-side .template-preview-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important;margin:10px 0 14px!important}.exam-builder-side .template-option,.exam-builder-side .template-option *{font-family:Inter,Arial,Helvetica,sans-serif!important;letter-spacing:0!important}.exam-builder-side .template-option{min-height:112px!important;padding:14px!important;margin:0!important;border-radius:18px!important;border:1px solid #dbe3ef!important;background:linear-gradient(180deg,#fff 0%,#f8fafc 100%)!important;color:#475569!important;font-size:13.5px!important;font-weight:500!important;line-height:1.42!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start!important;gap:0!important;box-shadow:0 10px 24px rgba(15,23,42,.045)!important;cursor:pointer!important;overflow:hidden!important}.exam-builder-side .template-option:hover{transform:translateY(-1px)!important;border-color:#a5b4fc!important;box-shadow:0 14px 30px rgba(79,70,229,.10)!important}.exam-builder-side .template-option:has(input[type=radio]:checked){border:1.5px solid #4f46e5!important;background:linear-gradient(180deg,#fff 0%,#f3f5ff 100%)!important;box-shadow:0 14px 34px rgba(79,70,229,.13)!important}.exam-builder-side .template-option input[type=radio]{appearance:none!important;-webkit-appearance:none!important;width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;padding:0!important;margin:0 0 12px 0!important;border-radius:999px!important;border:2px solid #94a3b8!important;background:#fff!important;box-shadow:none!important;transform:none!important;flex:0 0 auto!important}.exam-builder-side .template-option input[type=radio]:checked{border-color:#4f46e5!important;background:radial-gradient(circle,#4f46e5 0 38%,#fff 42% 100%)!important}.exam-builder-side .template-option strong{display:block!important;margin:0 0 4px 0!important;color:#111827!important;font-size:15px!important;font-weight:700!important;line-height:1.22!important;letter-spacing:-.1px!important}.exam-builder-side .template-option:has(input[type=radio]:checked) strong{color:#312e81!important}.exam-builder-side .template-option::after{display:none!important;content:none!important}@media(max-width:1050px){.exam-builder-side .template-preview-grid{grid-template-columns:1fr 1fr!important}}@media(max-width:520px){.exam-builder-side .template-preview-grid{grid-template-columns:1fr!important}}


/* === Create Exam Studio Professional Redesign === */

/* Sınav Hazırlama Stüdyosu: kompakt profesyonel tasarım */
.exam-studio-pro {
    position: relative !important;
    overflow: visible !important;
    padding: 24px !important;
    border-radius: 28px !important;
    color: #0f172a !important;
    background:
        radial-gradient(circle at top left, rgba(79,70,229,.12), transparent 32%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    border: 1px solid rgba(203,213,225,.9) !important;
    box-shadow: 0 18px 50px rgba(15,23,42,.08) !important;
}

.exam-studio-pro::after {
    display: none !important;
}

.studio-topline {
    position: relative !important;
    z-index: 3 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    gap: 18px !important;
    margin-bottom: 18px !important;
}

.studio-kicker {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 7px 11px !important;
    border-radius: 999px !important;
    background: #eef2ff !important;
    color: #3730a3 !important;
    border: 1px solid #c7d2fe !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    margin-bottom: 10px !important;
}

.exam-studio-pro h2 {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: clamp(27px, 3vw, 38px) !important;
    line-height: 1.08 !important;
    font-weight: 900 !important;
    letter-spacing: -1.2px !important;
}

.exam-studio-pro p {
    margin: 9px 0 0 !important;
    max-width: 720px !important;
    color: #64748b !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    font-weight: 500 !important;
}

.studio-summary-chip {
    min-width: 130px !important;
    padding: 13px 16px !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 12px 28px rgba(15,23,42,.06) !important;
    text-align: center !important;
}

.studio-summary-chip strong {
    display: block !important;
    color: #312e81 !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.studio-summary-chip span {
    display: block !important;
    margin-top: 5px !important;
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

.studio-alert {
    margin-top: 0 !important;
    margin-bottom: 14px !important;
}

.studio-filter-panel {
    position: relative !important;
    z-index: 20 !important;
    margin-top: 0 !important;
    padding: 18px !important;
    border-radius: 24px !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 14px 36px rgba(15,23,42,.06) !important;
    backdrop-filter: blur(12px) !important;
}

.studio-search-field {
    position: relative !important;
    display: grid !important;
    gap: 8px !important;
    margin: 0 0 15px !important;
}

.studio-filter-panel label,
.studio-search-field label,
.studio-filter-item label {
    color: #334155 !important;
    font-size: 12.5px !important;
    font-weight: 850 !important;
    margin: 0 !important;
    letter-spacing: 0 !important;
}

.studio-search-input-shell {
    position: relative !important;
}

.studio-search-icon {
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 2 !important;
    color: #64748b !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

.studio-search-input-shell input {
    min-height: 52px !important;
    padding-left: 42px !important;
    border-radius: 17px !important;
    border: 1px solid #dbe3ef !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-size: 15px !important;
    font-weight: 550 !important;
    box-shadow: none !important;
}

.studio-search-input-shell input:focus {
    background: #ffffff !important;
    border-color: #818cf8 !important;
    box-shadow: 0 0 0 4px rgba(79,70,229,.10) !important;
}

.studio-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 13px !important;
    margin-top: 0 !important;
    align-items: end !important;
}

.studio-filter-item {
    display: grid !important;
    gap: 8px !important;
}

.studio-filter-item select {
    min-height: 48px !important;
    border-radius: 16px !important;
    border: 1px solid #dbe3ef !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-size: 14.5px !important;
    font-weight: 550 !important;
    padding: 0 13px !important;
    box-shadow: none !important;
}

.studio-filter-item select:focus {
    background: #ffffff !important;
    border-color: #818cf8 !important;
    box-shadow: 0 0 0 4px rgba(79,70,229,.10) !important;
}

.studio-filter-actions {
    grid-column: span 5 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    padding-top: 4px !important;
}

.studio-primary-filter,
.studio-clear-filter {
    min-height: 48px !important;
    min-width: 150px !important;
    margin-top: 0 !important;
    border-radius: 15px !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    box-shadow: none !important;
}

.studio-primary-filter {
    background: linear-gradient(135deg, #4f46e5, #312e81) !important;
    color: #fff !important;
    border: 1px solid transparent !important;
}

.studio-clear-filter {
    background: #ffffff !important;
    color: #334155 !important;
    border: 1px solid #dbe3ef !important;
}

.studio-primary-filter:hover,
.studio-clear-filter:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 24px rgba(79,70,229,.16) !important;
}

/* Önceki inline kuralların yanlış hizalamasını iptal et */
.exam-filter-row .filter-3:last-child {
    display: grid !important;
    align-items: initial !important;
    justify-content: initial !important;
}

/* Ders öneri kutusu */
.create-lesson-autocomplete-wrap {
    position: relative !important;
}

.create-lesson-autocomplete-box,
.lesson-autocomplete-box.create-lesson-autocomplete-box {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 99999 !important;
    display: none !important;
    max-height: 260px !important;
    overflow-y: auto !important;
    padding: 7px !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: 0 22px 50px rgba(15,23,42,.16) !important;
}

.create-lesson-autocomplete-box.show,
.lesson-autocomplete-box.create-lesson-autocomplete-box.show {
    display: block !important;
}

.create-lesson-autocomplete-box .lesson-autocomplete-item {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    text-align: left !important;
    border: 0 !important;
    background: transparent !important;
    color: #0f172a !important;
    padding: 11px 12px !important;
    border-radius: 13px !important;
    font-family: Inter, Arial, Helvetica, sans-serif !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    cursor: pointer !important;
}

.create-lesson-autocomplete-box .lesson-autocomplete-item:hover {
    background: #eef2ff !important;
    color: #312e81 !important;
}

@media (max-width: 1050px) {
    .studio-topline {
        flex-direction: column !important;
    }

    .studio-summary-chip {
        width: 100% !important;
        text-align: left !important;
    }

    .studio-filter-grid,
    .exam-filter-row.studio-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .studio-filter-grid .filter-3,
    .studio-filter-grid .filter-4,
    .studio-filter-actions {
        grid-column: 1 / -1 !important;
    }

    .studio-filter-actions {
        justify-content: stretch !important;
        flex-direction: column !important;
    }

    .studio-primary-filter,
    .studio-clear-filter {
        width: 100% !important;
    }
}

@media (max-width: 620px) {
    .exam-studio-pro {
        padding: 18px !important;
        border-radius: 22px !important;
    }

    .studio-filter-panel {
        padding: 14px !important;
        border-radius: 20px !important;
    }
}


/* ===== Create Exam Studio Balanced UI Fix ===== */
.exam-studio-pro {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08) !important;
    border-radius: 30px !important;
    padding: 26px 28px 28px !important;
}

.exam-studio-pro::before,
.exam-studio-pro::after {
    opacity: .45 !important;
}

.studio-topline {
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 22px !important;
    align-items: start !important;
    margin-bottom: 22px !important;
}

.studio-kicker {
    background: #eef2ff !important;
    color: #3730a3 !important;
    border: 1px solid #c7d2fe !important;
    box-shadow: none !important;
    font-size: 12.5px !important;
    padding: 7px 13px !important;
}

.studio-title-row {
    margin-top: 12px !important;
    gap: 12px !important;
}

.studio-title-mark {
    width: 8px !important;
    height: 34px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #4f46e5, #06b6d4) !important;
    box-shadow: 0 8px 18px rgba(79, 70, 229, .22) !important;
}

.exam-studio-pro h2 {
    color: #0f172a !important;
    font-size: clamp(28px, 3vw, 38px) !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    letter-spacing: -1.15px !important;
}

.exam-studio-pro p {
    color: #64748b !important;
    margin-top: 10px !important;
    font-size: 15.5px !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;
}

.studio-summary-chip {
    min-width: 148px !important;
    padding: 17px 18px !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #ffffff, #f8fafc) !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 16px 34px rgba(49, 46, 129, .10) !important;
    color: #64748b !important;
}

.studio-summary-chip strong {
    color: #312e81 !important;
    font-size: 34px !important;
    line-height: .95 !important;
    letter-spacing: -1px !important;
}

.studio-filter-panel {
    background: #ffffff !important;
    border: 1px solid #dbe3ef !important;
    border-radius: 24px !important;
    padding: 22px 24px 24px !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.055) !important;
}

.studio-search-field {
    margin-bottom: 18px !important;
}

.studio-filter-panel label,
.studio-search-field label,
.studio-filter-item label {
    color: #1f2937 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
}

.studio-search-input-shell input {
    min-height: 54px !important;
    padding-left: 50px !important;
    padding-right: 16px !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    border: 1px solid #cfd8e6 !important;
    color: #0f172a !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}

.studio-search-icon {
    left: 18px !important;
    width: 18px !important;
    height: 18px !important;
    display: grid !important;
    place-items: center !important;
    color: #64748b !important;
    font-size: 16px !important;
}

.studio-filter-grid,
.exam-filter-row.studio-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: end !important;
}

.studio-filter-grid .filter-4 {
    grid-column: span 4 !important;
}

.studio-filter-grid .filter-3 {
    grid-column: span 3 !important;
}

.studio-filter-grid .studio-filter-actions {
    grid-column: span 3 !important;
}

.studio-filter-item {
    gap: 9px !important;
}

.studio-filter-item select {
    min-height: 54px !important;
    height: 54px !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    border: 1px solid #cfd8e6 !important;
    color: #0f172a !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 16px !important;
}

.studio-search-input-shell input:hover,
.studio-filter-item select:hover {
    border-color: #aebde0 !important;
}

.studio-search-input-shell input:focus,
.studio-filter-item select:focus {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, .10) !important;
}

.studio-filter-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    align-items: end !important;
    justify-content: stretch !important;
    padding-top: 0 !important;
}

.studio-primary-filter,
.studio-clear-filter {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 54px !important;
    margin: 0 !important;
    border-radius: 18px !important;
    padding: 0 14px !important;
    font-size: 14.5px !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
}

.studio-primary-filter {
    background: linear-gradient(135deg, #4f46e5, #312e81) !important;
    border: 1px solid #4338ca !important;
    color: #ffffff !important;
    box-shadow: 0 14px 26px rgba(79, 70, 229, .22) !important;
}

.studio-clear-filter {
    background: #ffffff !important;
    border: 1px solid #cfd8e6 !important;
    color: #3730a3 !important;
    box-shadow: 0 10px 22px rgba(15, 23, 42, .04) !important;
}

.studio-primary-filter:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 18px 32px rgba(79, 70, 229, .28) !important;
}

.studio-clear-filter:hover {
    transform: translateY(-1px) !important;
    background: #f8fafc !important;
    border-color: #aebde0 !important;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .08) !important;
}

.create-lesson-autocomplete-box,
.lesson-autocomplete-box.create-lesson-autocomplete-box {
    border-radius: 16px !important;
    border: 1px solid #dbe3ef !important;
    box-shadow: 0 22px 44px rgba(15, 23, 42, .14) !important;
}

@media (max-width: 1100px) {
    .studio-filter-grid .filter-4,
    .studio-filter-grid .filter-3,
    .studio-filter-grid .studio-filter-actions {
        grid-column: span 6 !important;
    }
}

@media (max-width: 760px) {
    .studio-topline {
        grid-template-columns: 1fr !important;
    }

    .studio-summary-chip {
        width: 100% !important;
    }

    .studio-filter-grid .filter-4,
    .studio-filter-grid .filter-3,
    .studio-filter-grid .studio-filter-actions {
        grid-column: 1 / -1 !important;
    }

    .studio-filter-actions {
        grid-template-columns: 1fr !important;
    }
}



/* ===== Questions.php Answer Readability Fix ===== */


/* Doğru cevap alanı: tüm yazılar kesin görünür */
.qb-question-card .qb-answer,
.qb-question-card .qb-answer.show,
.qb-answer,
.qb-answer.show {
    display: none;
    margin-top: 12px !important;
    padding: 14px 16px !important;
    border-radius: 16px !important;
    background: #f0fdf4 !important;
    border: 1px solid #86efac !important;
    color: #064e3b !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    font-weight: 800 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.75) !important;
}

.qb-question-card .qb-answer.show,
.qb-answer.show {
    display: block !important;
}

.qb-question-card .qb-answer strong,
.qb-question-card .qb-answer.show strong,
.qb-answer strong,
.qb-answer.show strong {
    display: block !important;
    margin-bottom: 8px !important;
    color: #065f46 !important;
    font-weight: 950 !important;
    opacity: 1 !important;
}

.qb-question-card .qb-answer *,
.qb-question-card .qb-answer.show *,
.qb-answer *,
.qb-answer.show * {
    color: #064e3b !important;
    opacity: 1 !important;
}

/* Seçili kart içindeyken de cevap ve soru yazıları koyu kalsın */
.qb-question-card.selected .qb-answer,
.qb-question-card.is-selected .qb-answer,
.qb-question-card.selected .qb-answer.show,
.qb-question-card.is-selected .qb-answer.show {
    background: #f0fdf4 !important;
    color: #064e3b !important;
    border-color: #86efac !important;
}

.qb-question-card.selected .qb-answer *,
.qb-question-card.is-selected .qb-answer *,
.qb-question-card.selected .qb-answer.show *,
.qb-question-card.is-selected .qb-answer.show * {
    color: #064e3b !important;
    opacity: 1 !important;
}

.qb-question-card.selected .qb-question-body h3,
.qb-question-card.is-selected .qb-question-body h3,
.qb-question-card.selected .qb-question-body p,
.qb-question-card.is-selected .qb-question-body p {
    color: #111827 !important;
    opacity: 1 !important;
}


/* ===== Questions Real Data Filter Fix ===== */
#classLevelSelect option { font-weight: 700; }



/* Panel boşluğunu azalt */
.container:not(.from-question-bank) .exam-search-panel.studio-filter-panel {
    padding: 18px 22px !important;
    border-radius: 24px !important;
    overflow: visible !important;
}

.container:not(.from-question-bank) .studio-search-field {
    margin-bottom: 14px !important;
}

.container:not(.from-question-bank) .studio-search-input-shell input {
    height: 52px !important;
    min-height: 52px !important;
}

/* Eski grid kurallarını tamamen ez: kutular yan yana akar */
.container:not(.from-question-bank) .exam-filter-row.studio-filter-grid,
.container:not(.from-question-bank) .studio-filter-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: 14px 16px !important;
    grid-template-columns: none !important;
}

/* Her filtre kutusu kısa ve sabit */
.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item,
.container:not(.from-question-bank) .studio-filter-grid > .filter-3,
.container:not(.from-question-bank) .studio-filter-grid > .filter-4 {
    width: 220px !important;
    max-width: 220px !important;
    flex: 0 0 220px !important;
    min-width: 0 !important;
    grid-column: auto !important;
}

/* Select boyutları */
.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item select,
.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item input {
    width: 220px !important;
    max-width: 220px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border-radius: 15px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* Okul türü kalın görünmesin */
#studioSchoolSelect,
#studioSchoolSelect option {
    font-weight: 500 !important;
}

/* Butonlar Soru Türü kutusunun yanına gelsin */
.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-actions,
.container:not(.from-question-bank) .studio-filter-actions {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
    grid-column: auto !important;
    display: flex !important;
    grid-template-columns: none !important;
    gap: 10px !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    align-self: flex-end !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Butonları küçült */
.container:not(.from-question-bank) .studio-filter-actions .studio-primary-filter,
.container:not(.from-question-bank) .studio-filter-actions .studio-clear-filter,
.container:not(.from-question-bank) .studio-filter-actions .btn,
.studio-primary-filter,
.studio-clear-filter {
    width: auto !important;
    min-width: 120px !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 18px !important;
    margin: 0 !important;
    border-radius: 15px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Mobilde düzgün alta insin */
@media (max-width: 760px) {
    .container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item,
    .container:not(.from-question-bank) .studio-filter-grid > .filter-3,
    .container:not(.from-question-bank) .studio-filter-grid > .filter-4 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 1 1 100% !important;
    }

    .container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item select,
    .container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item input {
        width: 100% !important;
        max-width: 100% !important;
    }

    .container:not(.from-question-bank) .studio-filter-actions {
        width: 100% !important;
        flex: 1 1 100% !important;
    }

    .container:not(.from-question-bank) .studio-filter-actions .btn,
    .container:not(.from-question-bank) .studio-filter-actions .studio-primary-filter,
    .container:not(.from-question-bank) .studio-filter-actions .studio-clear-filter {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }
}



/* Tüm kutular eşit genişlesin */
.container:not(.from-question-bank) .studio-filter-item {
    width: 100% !important;
    max-width: none !important;
    grid-column: auto !important;
}

/* Select kutuları genişlesin */
.container:not(.from-question-bank) .studio-filter-item select,
.container:not(.from-question-bank) .studio-filter-item input {
    width: 100% !important;
    max-width: none !important;
    height: 48px !important;
    min-height: 48px !important;
}

/* Butonlar alt satırda sağa yaslansın */
.container:not(.from-question-bank) .studio-filter-actions {
    grid-column: 4 / 5 !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Buton boyutu */
.container:not(.from-question-bank) .studio-filter-actions .btn,
.container:not(.from-question-bank) .studio-primary-filter,
.container:not(.from-question-bank) .studio-clear-filter {
    height: 48px !important;
    min-width: 140px !important;
    padding: 0 18px !important;
    margin: 0 !important;
    border-radius: 16px !important;
}

/* Arama ikon düzeltme */
.container:not(.from-question-bank) .studio-search-input-shell {
    position: relative !important;
}

.container:not(.from-question-bank) .studio-search-input-shell input {
    padding-left: 58px !important;
}

.container:not(.from-question-bank) .studio-search-input-shell svg,
.container:not(.from-question-bank) .studio-search-input-shell i,
.container:not(.from-question-bank) .studio-search-input-shell .search-icon {
    position: absolute !important;
    left: 18px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}


/* ===== CREATE-EXAM TEMİZ FİLTRE DÜZENİ ===== */
/* Üst satır: Okul Türü | Sınıf | Dal / Alan | Ders
   Alt satır: Modül | Zorluk | Soru Türü | Süz + Filtreleri Temizle */

.container:not(.from-question-bank) .exam-search-panel.studio-filter-panel {
    padding: 18px 22px !important;
    border-radius: 24px !important;
    overflow: visible !important;
}

.container:not(.from-question-bank) .studio-search-field {
    margin-bottom: 16px !important;
}

.container:not(.from-question-bank) .studio-search-input-shell {
    position: relative !important;
}

.container:not(.from-question-bank) .studio-search-input-shell input {
    height: 52px !important;
    min-height: 52px !important;
    padding-left: 58px !important;
}

.container:not(.from-question-bank) .studio-search-input-shell svg,
.container:not(.from-question-bank) .studio-search-input-shell i,
.container:not(.from-question-bank) .studio-search-input-shell .search-icon {
    position: absolute !important;
    left: 20px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 2 !important;
    width: 20px !important;
    height: 20px !important;
}

.container:not(.from-question-bank) .exam-filter-row.studio-filter-grid,
.container:not(.from-question-bank) .studio-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    column-gap: 20px !important;
    row-gap: 14px !important;
    align-items: end !important;
    width: 100% !important;
    margin-top: 0 !important;
}

.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item,
.container:not(.from-question-bank) .studio-filter-grid > .filter-3,
.container:not(.from-question-bank) .studio-filter-grid > .filter-4 {
    grid-column: auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: initial !important;
}

.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item select,
.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-item input {
    width: 100% !important;
    max-width: none !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 16px !important;
    border-radius: 16px !important;
    font-size: 14px !important;
}

#studioSchoolSelect,
#studioSchoolSelect option {
    font-weight: 500 !important;
}

.container:not(.from-question-bank) .studio-filter-grid > .studio-filter-actions,
.container:not(.from-question-bank) .studio-filter-actions {
    grid-column: auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: end !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: initial !important;
}

.container:not(.from-question-bank) .studio-filter-actions .btn,
.container:not(.from-question-bank) .studio-filter-actions .studio-primary-filter,
.container:not(.from-question-bank) .studio-filter-actions .studio-clear-filter,
.container:not(.from-question-bank) .studio-primary-filter,
.container:not(.from-question-bank) .studio-clear-filter {
    height: 48px !important;
    min-height: 48px !important;
    width: auto !important;
    min-width: 136px !important;
    padding: 0 18px !important;
    margin: 0 !important;
    border-radius: 16px !important;
    font-size: 14px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media (max-width: 1100px) {
    .container:not(.from-question-bank) .exam-filter-row.studio-filter-grid,
    .container:not(.from-question-bank) .studio-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .container:not(.from-question-bank) .studio-filter-actions {
        justify-content: flex-start !important;
    }
}

@media (max-width: 760px) {
    .container:not(.from-question-bank) .exam-filter-row.studio-filter-grid,
    .container:not(.from-question-bank) .studio-filter-grid {
        grid-template-columns: 1fr !important;
    }

    .container:not(.from-question-bank) .studio-filter-actions {
        justify-content: stretch !important;
    }

    .container:not(.from-question-bank) .studio-filter-actions .btn,
    .container:not(.from-question-bank) .studio-primary-filter,
    .container:not(.from-question-bank) .studio-clear-filter {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }
}



/* ===== Exams page modern oval action links + centered delete modal ===== */
.exams-page-wrap {
    margin-top: 30px !important;
}

.exam-page-alert {
    width: 100%;
    margin: 0 0 22px !important;
    padding: 15px 18px !important;
    border-radius: 18px !important;
    background: #ecfdf5 !important;
    border: 1px solid #86efac !important;
    color: #065f46 !important;
    font-weight: 850 !important;
    box-shadow: 0 12px 28px rgba(22, 163, 74, .08) !important;
}

.exams-card-modern {
    padding: 26px 30px 32px !important;
    border-radius: 28px !important;
}

.exams-card-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px !important;
    margin-bottom: 24px !important;
}

.exams-card-head h2 {
    margin: 0 !important;
    font-size: 34px !important;
    line-height: 1.1 !important;
    font-weight: 950 !important;
    letter-spacing: -1px !important;
    color: #0f172a !important;
}

.exams-card-head p {
    margin: 10px 0 0 !important;
    color: #64748b !important;
    font-size: 15.5px !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;
}

.exam-count-pill,
.exam-soft-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    border: 1px solid #c7d2fe !important;
    background: #eef2ff !important;
    color: #312e81 !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
}

.exam-count-pill {
    padding: 9px 16px !important;
    font-size: 14px !important;
}

.exam-soft-pill {
    padding: 7px 12px !important;
    font-size: 12.5px !important;
}

.exam-soft-pill.muted {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #334155 !important;
}

.exams-table-wrap {
    overflow-x: auto !important;
}

.exams-table-modern {
    border-spacing: 0 12px !important;
}

.exams-table-modern thead th {
    background: #0f172a !important;
    color: #94a3b8 !important;
    padding: 16px 18px !important;
    font-size: 12.5px !important;
    letter-spacing: .6px !important;
}

.exams-table-modern thead th:first-child {
    border-radius: 18px 0 0 18px !important;
}

.exams-table-modern thead th:last-child {
    border-radius: 0 18px 18px 0 !important;
}

.exams-table-modern td {
    padding: 18px !important;
    background: #ffffff !important;
    border-top: 1px solid #e2e8f0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
    vertical-align: middle !important;
}

.exams-table-modern tr td:first-child {
    border-left: 1px solid #e2e8f0 !important;
    border-radius: 20px 0 0 20px !important;
}

.exams-table-modern tr td:last-child {
    border-right: 1px solid #e2e8f0 !important;
    border-radius: 0 20px 20px 0 !important;
}

.exam-actions-inline {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    flex-wrap: wrap !important;
}

.exam-delete-form {
    display: inline-flex !important;
    margin: 0 !important;
    padding: 0 !important;
}

.exam-action-link {
    min-height: 38px !important;
    padding: 0 15px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    color: #334155 !important;
    font-family: Inter, Arial, Helvetica, sans-serif !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .04) !important;
    transition: .2s ease !important;
    white-space: nowrap !important;
}

.exam-action-link:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .08) !important;
}

.exam-action-link.purple { border-color: #c4b5fd !important; color: #3730a3 !important; }
.exam-action-link.blue { border-color: #bae6fd !important; color: #075985 !important; }
.exam-action-link.dark { border-color: #cbd5e1 !important; color: #0f172a !important; }
.exam-action-link.green { border-color: #86efac !important; color: #15803d !important; }
.exam-action-link.red { border-color: #fecaca !important; color: #b91c1c !important; }

.exam-action-link.purple:hover { background: #eef2ff !important; }
.exam-action-link.blue:hover { background: #f0f9ff !important; }
.exam-action-link.dark:hover { background: #f8fafc !important; }
.exam-action-link.green:hover { background: #f0fdf4 !important; }
.exam-action-link.red:hover { background: #fef2f2 !important; }

.exam-empty-row {
    text-align: center !important;
    color: #64748b !important;
    font-weight: 800 !important;
    padding: 28px !important;
}

.exam-delete-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 99999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    background: rgba(15, 23, 42, .58) !important;
    backdrop-filter: blur(4px) !important;
}

.exam-delete-modal.show {
    display: flex !important;
}

.exam-delete-modal-box {
    width: min(420px, 100%) !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 26px !important;
    padding: 26px !important;
    text-align: center !important;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .32) !important;
    animation: examModalPop .18s ease-out !important;
}

@keyframes examModalPop {
    from { transform: scale(.96) translateY(8px); opacity: 0; }
    to { transform: scale(1) translateY(0); opacity: 1; }
}

.exam-delete-modal-icon {
    width: 48px !important;
    height: 48px !important;
    margin: 0 auto 14px !important;
    border-radius: 18px !important;
    display: grid !important;
    place-items: center !important;
    background: #fef2f2 !important;
    color: #b91c1c !important;
    font-size: 24px !important;
    font-weight: 950 !important;
}

.exam-delete-modal-box h3 {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: 22px !important;
    font-weight: 950 !important;
    letter-spacing: -.4px !important;
}

.exam-delete-modal-box p {
    margin: 10px auto 0 !important;
    max-width: 320px !important;
    color: #64748b !important;
    font-size: 14.5px !important;
    line-height: 1.55 !important;
    font-weight: 650 !important;
}

.exam-delete-modal-actions {
    display: flex !important;
    justify-content: center !important;
    gap: 10px !important;
    margin-top: 20px !important;
    flex-wrap: wrap !important;
}

.exam-modal-btn {
    min-height: 42px !important;
    min-width: 118px !important;
    border-radius: 999px !important;
    border: 1px solid transparent !important;
    padding: 0 18px !important;
    font-family: Inter, Arial, Helvetica, sans-serif !important;
    font-weight: 900 !important;
    cursor: pointer !important;
    transition: .2s ease !important;
}

.exam-modal-btn:hover {
    transform: translateY(-1px) !important;
}

.exam-modal-btn.red {
    background: #dc2626 !important;
    color: #ffffff !important;
    box-shadow: 0 12px 24px rgba(220, 38, 38, .2) !important;
}

.exam-modal-btn.light {
    background: #f8fafc !important;
    color: #334155 !important;
    border-color: #dbe3ef !important;
}

@media (max-width: 760px) {
    .exams-card-head {
        flex-direction: column !important;
    }

    .exam-actions-inline {
        gap: 7px !important;
    }

    .exam-action-link {
        min-height: 36px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
    }
}

/* TEMIZ QUESTIONS BUTTON FIX */
.qb-question-card .qb-card-actions-clean {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    margin-top: 14px !important;
    padding-top: 12px !important;
    border-top: 1px dashed #e5e7eb !important;
}

.qb-question-card .qb-card-actions-clean .qb-action-row {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

.qb-question-card .qb-card-actions-clean .qb-btn {
    width: auto !important;
    min-width: 74px !important;
    max-width: none !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 9px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    font-size: 11.5px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    gap: 0 !important;
}

.qb-question-card .qb-card-actions-clean .qb-btn::before,
.qb-question-card .qb-card-actions-clean .qb-btn::after {
    content: none !important;
    display: none !important;
}

.qb-question-card .qb-card-actions-clean .qb-btn-answer { min-width: 132px !important; }
.qb-question-card .qb-card-actions-clean .qb-btn-cart { min-width: 92px !important; }
.qb-question-card .qb-card-actions-clean .qb-btn-report { min-width: 86px !important; }
.qb-question-card .qb-card-actions-clean .qb-btn-edit { min-width: 78px !important; }
.qb-question-card .qb-card-actions-clean .qb-btn-delete { min-width: 58px !important; }

@media (max-width: 520px) {
    .qb-question-card .qb-card-actions-clean .qb-action-row {
        flex-wrap: wrap !important;
    }
}




/* FINAL ORDER 2: questions.php kart buton sırası */
.qb-card-actions-clean {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}

.qb-card-actions-clean .qb-action-row {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    width: 100% !important;
}

.qb-card-actions-clean .qb-action-row-top {
    flex-wrap: nowrap !important;
}

.qb-card-actions-clean .qb-btn {
    width: 110px !important;
    max-width: 110px !important;
    min-width: 110px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 7px !important;
    margin: 0 !important;
    border-radius: 10px !important;
    font-size: 11.2px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

.qb-card-actions-clean .qb-btn-answer {
    width: 128px !important;
    min-width: 128px !important;
    max-width: 128px !important;
}

.qb-card-actions-clean .qb-btn-delete,
.qb-card-actions-clean .qb-btn-edit {
    width: 82px !important;
    min-width: 82px !important;
    max-width: 82px !important;
    height: 30px !important;
    min-height: 30px !important;
    font-size: 11px !important;
}

@media (max-width: 1180px) {
    .qb-card-actions-clean .qb-action-row-top {
        flex-wrap: wrap !important;
    }
}

@media (max-width: 520px) {
    .qb-card-actions-clean .qb-action-row {
        flex-wrap: wrap !important;
    }
}

/* AJAX hata bildir toast */
.qb-ajax-toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 10000;
    min-width: 240px;
    max-width: 420px;
    padding: 13px 16px;
    border-radius: 14px;
    font-weight: 800;
    font-size: 14px;
    box-shadow: 0 18px 44px rgba(15,23,42,.18);
    transform: translateY(18px);
    opacity: 0;
    pointer-events: none;
    transition: .2s ease;
}
.qb-ajax-toast.show {
    transform: translateY(0);
    opacity: 1;
}
.qb-ajax-toast.success {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}
.qb-ajax-toast.error {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}



/* =========================================================
   questions.php filtre hizalama düzeltmesi
   Ara / Filtrele butonu Modüller ve Soru Türleri ile aynı satıra alındı.
   ========================================================= */
.qb-filter-card .qb-filter-grid.qb-filter-grid-school {
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    gap: 12px !important;
    align-items: end !important;
}

.qb-filter-card .qb-filter-grid.qb-filter-grid-school > label,
.qb-filter-card .qb-filter-grid.qb-filter-grid-school > .qb-field,
.qb-filter-card .qb-filter-grid.qb-filter-grid-school > .qb-filter-submit-side {
    grid-column: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    align-self: end !important;
}

.qb-filter-card .qb-field-module,
.qb-filter-card .qb-field-type {
    max-width: 100% !important;
}

.qb-filter-card .qb-checkdrop,
.qb-filter-card .qb-checkdrop-btn,
.qb-filter-card select {
    width: 100% !important;
}

.qb-filter-card .qb-checkdrop-btn,
.qb-filter-card select {
    height: 56px !important;
    min-height: 56px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

.qb-filter-card .qb-filter-submit-inline,
.qb-filter-card .qb-filter-submit-side {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: stretch !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
}

.qb-filter-card .qb-filter-side-btn {
    width: 100% !important;
    height: 56px !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media (max-width: 1300px) {
    .qb-filter-card .qb-filter-grid.qb-filter-grid-school {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    .qb-filter-card .qb-filter-grid.qb-filter-grid-school {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 640px) {
    .qb-filter-card .qb-filter-grid.qb-filter-grid-school {
        grid-template-columns: 1fr !important;
    }
}

/* ===== Premium Dashboard ===== */
.dashboard-page {
    width: min(1250px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 54px;
}

.dashboard-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.1fr 340px;
    gap: 24px;
    align-items: stretch;
    padding: 34px;
    border-radius: 34px;
    background:
        radial-gradient(circle at 16% 14%, rgba(255,255,255,.24), transparent 28%),
        radial-gradient(circle at 86% 18%, rgba(6,182,212,.28), transparent 32%),
        linear-gradient(135deg, #111827 0%, #312e81 48%, #2563eb 100%);
    color: #fff;
    box-shadow: 0 28px 78px rgba(37,99,235,.23);
}

.dashboard-hero::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    right: -105px;
    bottom: -125px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
}

.dashboard-hero-content,
.membership-card {
    position: relative;
    z-index: 1;
}

.dashboard-kicker,
.panel-mini-title,
.membership-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .25px;
}

.dashboard-kicker {
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    margin-bottom: 16px;
}

.dashboard-hero h1 {
    margin: 0;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.05;
    letter-spacing: -1.7px;
    font-weight: 950;
    color: #fff;
}

.dashboard-hero p {
    max-width: 670px;
    margin: 18px 0 0;
    color: rgba(255,255,255,.82);
    font-size: 17px;
    line-height: 1.7;
}

.dashboard-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.dash-btn {
    min-height: 46px;
    padding: 0 17px;
    border-radius: 15px;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 900;
    transition: .2s ease;
    cursor: pointer;
    background: linear-gradient(135deg, #4f46e5, #3730a3);
    color: #fff;
    box-shadow: 0 15px 30px rgba(49,46,129,.20);
}

.dash-btn:hover {
    transform: translateY(-2px);
}

.dash-btn.white {
    background: #fff;
    color: #1e1b4b;
    box-shadow: 0 18px 34px rgba(0,0,0,.18);
}

.dash-btn.light {
    background: linear-gradient(135deg, #8b5cf6, #4f46e5);
    color: #fff;
}

.dash-btn.ghost {
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.24);
    box-shadow: none;
}

.dash-btn.compact {
    min-height: 40px;
    padding: 0 14px;
    font-size: 14px;
}

.membership-card {
    background: rgba(255,255,255,.94);
    color: #0f172a;
    border: 1px solid rgba(255,255,255,.42);
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 22px 62px rgba(15,23,42,.20);
    backdrop-filter: blur(16px);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.membership-label {
    color: #64748b;
    margin-bottom: 12px;
}

.membership-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 10px 14px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 950;
    margin-bottom: 12px;
}

.membership-badge.premium {
    background: linear-gradient(135deg, #fef3c7, #ede9fe);
    color: #5b21b6;
    border: 1px solid #ddd6fe;
    box-shadow: 0 12px 26px rgba(124,58,237,.13);
}

.membership-badge.standard {
    background: #eef2ff;
    color: #3730a3;
    border: 1px solid #c7d2fe;
}

.membership-card p {
    margin: 4px 0 18px;
    color: #64748b;
    line-height: 1.6;
    font-size: 15px;
}

.membership-link {
    color: #312e81;
    font-weight: 900;
    text-decoration: none;
}

.dashboard-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    margin-top: 22px;
}

.dash-stat-card {
    position: relative;
    overflow: hidden;
    min-height: 190px;
    background: rgba(255,255,255,.94);
    border: 1px solid #e5e7eb;
    border-radius: 28px;
    padding: 22px;
    box-shadow: 0 16px 44px rgba(15,23,42,.07);
    transition: .2s ease;
}

.dash-stat-card:hover,
.quick-action-card:hover,
.recent-question-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 58px rgba(15,23,42,.11);
}

.dash-stat-card::after {
    content: "";
    position: absolute;
    width: 118px;
    height: 118px;
    right: -42px;
    top: -42px;
    border-radius: 999px;
    background: rgba(79,70,229,.09);
}

.dash-stat-card.accent::after {
    background: rgba(6,182,212,.13);
}

.dash-stat-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: #eef2ff;
    font-size: 22px;
    margin-bottom: 15px;
}

.dash-stat-card span {
    display: block;
    color: #64748b;
    font-size: 14px;
    font-weight: 850;
}

.dash-stat-card strong {
    display: block;
    margin: 7px 0 12px;
    font-size: 42px;
    line-height: 1;
    letter-spacing: -1.4px;
    color: #312e81;
    font-weight: 950;
}

.dash-stat-card a {
    position: relative;
    z-index: 1;
    color: #334155;
    font-weight: 850;
    text-decoration: none;
    font-size: 14px;
}

.dashboard-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 22px;
    margin-top: 22px;
}

.dash-panel {
    background: rgba(255,255,255,.94);
    border: 1px solid #e5e7eb;
    border-radius: 30px;
    padding: 24px;
    box-shadow: 0 16px 44px rgba(15,23,42,.07);
}

.dash-panel-head {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.dash-panel-head h2 {
    margin: 4px 0 0;
    font-size: 25px;
    letter-spacing: -1px;
}

.panel-mini-title {
    color: #64748b;
    text-transform: uppercase;
    font-size: 12px;
}

.panel-link {
    color: #312e81;
    font-weight: 900;
    text-decoration: none;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    padding: 9px 12px;
    border-radius: 999px;
    font-size: 13px;
}

.dash-list {
    display: grid;
    gap: 12px;
}

.dash-list-row {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 14px;
    border-radius: 20px;
    background: linear-gradient(180deg, #fff, #f8fafc);
    border: 1px solid #e5e7eb;
}

.dash-list-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: #eef2ff;
    flex: 0 0 auto;
}

.dash-list-content {
    min-width: 0;
    flex: 1;
}

.dash-list-content strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
}

.dash-list-content span {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 13px;
    font-weight: 750;
}

.small-action {
    flex: 0 0 auto;
    text-decoration: none;
    background: #111827;
    color: #fff;
    padding: 9px 12px;
    border-radius: 13px;
    font-size: 13px;
    font-weight: 900;
}

.dash-empty-state {
    text-align: center;
    padding: 30px 20px;
    border-radius: 24px;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
    border: 1px dashed #c7d2fe;
    color: #64748b;
}

.dash-empty-state div {
    font-size: 38px;
    margin-bottom: 8px;
}

.dash-empty-state strong {
    display: block;
    color: #0f172a;
    font-size: 18px;
}

.dash-empty-state p {
    margin: 8px auto 16px;
    max-width: 520px;
}

.quick-actions-grid {
    display: grid;
    gap: 12px;
}

.quick-action-card {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 12px;
    align-items: center;
    text-decoration: none;
    color: #0f172a;
    padding: 15px;
    border-radius: 20px;
    background: linear-gradient(180deg, #fff, #f8fafc);
    border: 1px solid #e5e7eb;
    transition: .2s ease;
}

.quick-action-card span {
    grid-row: span 2;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: #eef2ff;
    font-size: 22px;
}

.quick-action-card strong {
    align-self: end;
    font-size: 15px;
}

.quick-action-card small {
    align-self: start;
    color: #64748b;
    font-weight: 750;
}

.questions-panel {
    margin-top: 22px;
}

.recent-question-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 14px;
}

.recent-question-card {
    min-height: 132px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: space-between;
    padding: 16px;
    border-radius: 22px;
    background:
        radial-gradient(circle at top right, rgba(79,70,229,.10), transparent 34%),
        #fff;
    border: 1px solid #e5e7eb;
    text-decoration: none;
    color: #0f172a;
    transition: .2s ease;
}

.recent-question-card span {
    color: #64748b;
    font-size: 12px;
    font-weight: 850;
}

.recent-question-card strong {
    font-size: 14px;
    line-height: 1.45;
}

.dash-empty-line {
    padding: 18px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    color: #64748b;
    font-weight: 750;
}

@media (max-width: 1100px) {
    .dashboard-hero,
    .dashboard-main-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-stats,
    .recent-question-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 680px) {
    .dashboard-page {
        width: min(100% - 24px, 1250px);
        padding-top: 22px;
    }

    .dashboard-hero {
        padding: 24px;
        border-radius: 26px;
    }

    .dashboard-stats,
    .recent-question-grid {
        grid-template-columns: 1fr;
    }

    .dash-panel-head {
        flex-direction: column;
    }
}

/* ===== Premium Package Cards Update ===== */
.packages-page-premium {
    width: min(1540px, calc(100% - 44px));
}

.packages-hero-premium {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 18% 12%, rgba(34, 197, 94, .16), transparent 26%),
        radial-gradient(circle at 84% 18%, rgba(168, 85, 247, .18), transparent 30%),
        linear-gradient(135deg, #07111f 0%, #0f172a 45%, #172554 100%);
}

.packages-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 26px;
    align-items: stretch;
}

.package-tier {
    position: relative;
    overflow: hidden;
    min-height: 620px;
    padding: 28px;
    border-radius: 24px;
    background:
        linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(30, 41, 59, .82)),
        radial-gradient(circle at top, rgba(96, 165, 250, .22), transparent 35%);
    color: #eef2ff;
    border: 2px solid rgba(96, 165, 250, .42);
    box-shadow: 0 22px 60px rgba(15, 23, 42, .18);
    display: flex;
    flex-direction: column;
}

.package-tier::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 50% -10%, rgba(255,255,255,.12), transparent 32%);
    pointer-events: none;
}

.package-tier > * {
    position: relative;
    z-index: 1;
}

.package-tier.tier-free { border-color: #4ade80; }
.package-tier.tier-basic { border-color: #2563eb; }
.package-tier.tier-pro { border-color: #fb7185; }
.package-tier.tier-premium { border-color: #a855f7; }

.package-tier.featured {
    transform: none;
    box-shadow: 0 26px 72px rgba(248, 113, 113, .22);
}

.package-tier h2 {
    margin: 16px 0 10px;
    color: #f8fafc;
    text-align: center;
    font-size: clamp(25px, 2.4vw, 36px);
    letter-spacing: -1px;
    font-weight: 950;
}

.package-label.green { background: #4ade80; color: #fff; }
.package-label.blue { background: #1d4ed8; color: #fff; }
.package-label.red { background: #fb7185; color: #fff; }
.package-label.purple { background: #9333ea; color: #fff; }

.package-price {
    text-align: center;
    margin: 24px 0 26px;
    font-size: clamp(34px, 3.8vw, 50px);
    letter-spacing: -1.7px;
    font-weight: 950;
}

.package-price span {
    font-size: .52em;
    letter-spacing: -0.7px;
}

.green-price { color: #4ade80; }
.orange-price { color: #f97316; }
.red-price { color: #fb7185; }
.purple-price { color: #a855f7; }

.package-btn-green { background: #45b84f !important; color: #fff !important; }
.package-btn-orange { background: linear-gradient(135deg, #f97316, #fb4b14) !important; color: #fff !important; border: 0; cursor: pointer; }
.package-btn-red { background: linear-gradient(135deg, #fb7185, #ef4444) !important; color: #fff !important; border: 0; cursor: pointer; }
.package-btn-blue { background: #2563eb !important; color: #fff !important; border: 0; cursor: not-allowed; opacity: .82; }

.package-feature-list {
    list-style: none;
    padding: 0 !important;
    margin: 28px 0 0 !important;
    display: grid;
    gap: 16px;
    line-height: 1.35 !important;
    color: #e5e7eb !important;
    font-weight: 800;
}

.package-feature-list li {
    position: relative;
    padding-left: 36px;
    font-size: 16px;
}

.package-feature-list li::before {
    position: absolute;
    left: 0;
    top: -2px;
    font-size: 24px;
    line-height: 1;
    font-weight: 950;
}

.package-feature-list li.yes::before {
    content: "✓";
    color: #22c55e;
}

.package-feature-list li.no::before {
    content: "×";
    color: #f43f5e;
}

.package-soon {
    position: absolute;
    right: 20px;
    top: 22px;
    z-index: 2;
    padding: 7px 10px;
    border-radius: 8px;
    background: rgba(148, 163, 184, .82);
    color: #fff;
    font-size: 12px;
    font-weight: 950;
}

.disabled-tier {
    opacity: .92;
}

.package-payment-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(15, 23, 42, 0.72);
    backdrop-filter: blur(8px);
}

.package-payment-modal.show { display: flex; }

.package-payment-card {
    width: min(920px, 100%);
    max-height: calc(100vh - 44px);
    overflow: auto;
    background: #ffffff;
    color: #111827;
    border-radius: 22px;
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.35);
    position: relative;
    animation: packageModalIn .18s ease-out;
}

@keyframes packageModalIn {
    from { transform: translateY(12px) scale(.98); opacity: 0; }
    to { transform: translateY(0) scale(1); opacity: 1; }
}

.package-payment-close {
    position: absolute;
    right: 18px;
    top: 14px;
    border: 0;
    background: transparent;
    font-size: 36px;
    line-height: 1;
    color: #6b7280;
    cursor: pointer;
}

.package-payment-close:hover { color: #111827; }

.package-payment-head {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 24px 28px;
    border-bottom: 1px solid #e5e7eb;
    background: linear-gradient(135deg, #f8fafc, #eef2ff);
}

.package-payment-icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #4f46e5, #06b6d4);
    color: white;
    box-shadow: 0 14px 30px rgba(79, 70, 229, .22);
    font-size: 24px;
    flex: 0 0 auto;
}

.package-payment-head h2 {
    margin: 0;
    font-size: 25px;
    letter-spacing: -0.6px;
}

.package-payment-head p {
    margin: 5px 0 0;
    color: #64748b;
    font-weight: 700;
}

.package-payment-body {
    padding: 26px 28px 22px;
    font-size: 17px;
    line-height: 1.72;
}

.package-payment-body p { margin: 0 0 14px; }

.package-payment-info-box {
    margin-top: 18px;
    padding: 22px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    display: grid;
    gap: 12px;
    font-size: 17px;
}

.package-payment-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    padding: 18px 28px 22px;
    border-top: 1px solid #e5e7eb;
    background: #ffffff;
}

.package-modal-btn {
    min-height: 44px;
    border: 0;
    border-radius: 12px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 850;
    cursor: pointer;
    font-size: 15px;
}

.package-modal-btn.primary { background: linear-gradient(135deg, #16a34a, #059669); color: #fff; }
.package-modal-btn.success { background: linear-gradient(135deg, #4f46e5, #3730a3); color: #fff; }
.package-modal-btn.muted { background: #6b7280; color: #fff; }

@media (max-width: 1200px) {
    .packages-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
    .packages-grid-4 { grid-template-columns: 1fr; }
    .package-payment-head,
    .package-payment-body,
    .package-payment-actions {
        padding-left: 18px;
        padding-right: 18px;
    }
    .package-payment-head { align-items: flex-start; }
    .package-payment-actions { justify-content: stretch; }
    .package-modal-btn { width: 100%; }
}

/* ===== Dynamic Package Permission Cards ===== */
.packages-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 26px;
    align-items: stretch;
}

@media (max-width: 1100px) {
    .packages-grid-3 {
        grid-template-columns: 1fr;
    }
}


/* Packages page balanced sizing - previous design preserved */
.packages-page {
    width: min(1120px, calc(100% - 36px));
    margin: 0 auto;
    padding-top: 24px;
    padding-bottom: 46px;
}

.packages-hero {
    padding: 30px 34px !important;
    margin-bottom: 22px !important;
    border-radius: 28px !important;
}

.packages-hero h1 {
    font-size: clamp(28px, 3.3vw, 42px) !important;
    line-height: 1.08 !important;
    margin-bottom: 10px !important;
}

.packages-hero p {
    font-size: 15.5px !important;
    line-height: 1.55 !important;
    max-width: 740px;
}

.packages-grid {
    gap: 18px !important;
}

.package-card {
    padding: 22px 20px !important;
    border-radius: 22px !important;
    min-height: auto !important;
}

.package-card h2 {
    font-size: 24px !important;
    margin-bottom: 7px !important;
}

.package-card p {
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin-bottom: 12px !important;
}

.package-price {
    font-size: 28px !important;
    margin: 10px 0 14px !important;
}

.package-card ul {
    gap: 7px !important;
    margin-top: 14px !important;
    margin-bottom: 18px !important;
}

.package-card li {
    font-size: 13.5px !important;
    line-height: 1.35 !important;
    padding: 7px 8px !important;
}

.package-label {
    font-size: 12px !important;
    padding: 6px 10px !important;
}

.package-btn {
    min-height: 42px !important;
    padding: 10px 14px !important;
    font-size: 13.5px !important;
}

@media (max-width: 900px) {
    .packages-page {
        width: min(100% - 24px, 1120px);
    }

    .packages-hero {
        padding: 24px 20px !important;
    }
}


/* FINAL package icon spacing fix */
.package-card ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.package-card ul li {
    position: relative !important;
    padding-left: 38px !important;
    margin-bottom: 14px !important;
    line-height: 1.45 !important;
    display: block !important;
}

.package-card ul li::before {
    position: absolute !important;
    left: 0 !important;
    top: 1px !important;
    width: 24px !important;
    text-align: center !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.package-card ul li.yes::before {
    content: "✓" !important;
    color: #22c55e !important;
}

.package-card ul li.no::before {
    content: "×" !important;
    color: #ff4d67 !important;
}


/* Modern Login Page */
.login-page {
    width: min(1120px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

.login-shell {
    display: grid;
    grid-template-columns: .95fr .85fr;
    gap: 26px;
    align-items: stretch;
}

.login-info {
    position: relative;
    overflow: hidden;
    padding: 42px;
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 18% 16%, rgba(255,255,255,.20), transparent 27%),
        radial-gradient(circle at 86% 18%, rgba(6,182,212,.28), transparent 32%),
        linear-gradient(135deg, #111827 0%, #312e81 52%, #2563eb 100%);
    box-shadow: 0 26px 70px rgba(37,99,235,.22);
}

.login-info::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -90px;
    width: 240px;
    height: 240px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
}

.login-kicker {
    position: relative;
    z-index: 1;
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 18px;
}

.login-info h1 {
    position: relative;
    z-index: 1;
    margin: 0;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.05;
    letter-spacing: -1.7px;
    font-weight: 950;
}

.login-info p {
    position: relative;
    z-index: 1;
    color: rgba(255,255,255,.82);
    font-size: 17px;
    line-height: 1.7;
    margin: 18px 0 0;
}

.login-benefits {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
    margin-top: 28px;
}

.login-benefits div {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 14px 15px;
    border-radius: 18px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.16);
    font-weight: 800;
}

.login-benefits span {
    width: 24px;
    height: 24px;
    border-radius: 8px;
    display: inline-grid;
    place-items: center;
    background: #dcfce7;
    color: #166534;
    font-weight: 950;
    flex: 0 0 auto;
}

.login-card {
    background: rgba(255,255,255,.94);
    border: 2px solid rgba(99, 102, 241, 0.22);
    border-radius: 32px;
    padding: 30px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
}

.login-card-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

.login-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: #eef2ff;
    color: #3730a3;
    font-size: 22px;
    flex: 0 0 auto;
}

.login-card-head h2 {
    margin: 0 0 5px;
    font-size: 30px;
}

.login-card-head p {
    margin: 0;
    color: #64748b;
    line-height: 1.45;
}

.login-demo-box {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    padding: 13px 14px;
    margin-bottom: 16px;
    border-radius: 16px;
    background: linear-gradient(135deg, #eef2ff, #ecfeff);
    border: 1px solid #c7d2fe;
    color: #334155;
}

.login-demo-box strong {
    color: #3730a3;
}

.login-demo-box span {
    font-size: 13.5px;
    font-weight: 800;
}

.login-form {
    display: grid;
    gap: 12px;
}

.login-form label,
.login-password-label label {
    margin: 0 0 7px;
}

.login-form input {
    min-height: 48px;
    border: 1.8px solid #cbd5e1 !important;
    background: rgba(255,255,255,.96) !important;
}

.login-form input:hover {
    border-color: #94a3b8 !important;
}

.login-form input:focus {
    border-color: #4f46e5 !important;
    box-shadow: 0 0 0 4px rgba(79, 70, 229, .12) !important;
}

.login-password-label {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-top: 2px;
}

.login-password-label a {
    color: #3730a3;
    text-decoration: none;
    font-size: 13px;
    font-weight: 850;
}

.login-password-label a:hover {
    text-decoration: underline;
}

.login-password-wrap {
    position: relative;
}

.login-password-wrap input {
    padding-right: 82px;
}

.login-password-wrap button {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    border-radius: 10px;
    padding: 8px 10px;
    background: #eef2ff;
    color: #3730a3;
    font-weight: 850;
    cursor: pointer;
}

.login-submit {
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 6px;
    min-height: 46px;
}

.login-register-note {
    text-align: center;
    margin: 18px 0 0;
    color: #64748b;
    font-size: 14px;
}

.login-register-note a {
    color: #3730a3;
    font-weight: 900;
    text-decoration: none;
}

.login-register-note a:hover {
    text-decoration: underline;
}

@media (max-width: 920px) {
    .login-shell {
        grid-template-columns: 1fr;
    }

    .login-info,
    .login-card {
        padding: 24px 20px;
        border-radius: 26px;
    }
}

@media (max-width: 560px) {
    .login-page {
        width: min(100% - 24px, 1120px);
        padding-top: 22px;
    }

    .login-card-head {
        align-items: flex-start;
    }

    .login-demo-box {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* =========================================================
   STABLE AUTH PAGES - scoped only to register/login pages
   This section does not affect other site pages.
   ========================================================= */

/* ---------- Register Page Scoped Layout ---------- */
body .register-page {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

body .register-page .register-shell {
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 26px;
    align-items: stretch;
}

body .register-page .register-info {
    position: relative;
    overflow: hidden;
    padding: 38px;
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 18% 16%, rgba(255,255,255,.20), transparent 27%),
        radial-gradient(circle at 86% 18%, rgba(6,182,212,.28), transparent 32%),
        linear-gradient(135deg, #111827 0%, #312e81 52%, #2563eb 100%);
    box-shadow: 0 26px 70px rgba(37,99,235,.22);
    border: 1.5px solid rgba(255,255,255,.14);
}

body .register-page .register-info::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -90px;
    width: 240px;
    height: 240px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
}

body .register-page .register-kicker {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 18px;
}

body .register-page .register-info h1 {
    position: relative;
    z-index: 1;
    margin: 0;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.05;
    letter-spacing: -1.7px;
    font-weight: 950;
}

body .register-page .register-info p {
    position: relative;
    z-index: 1;
    color: rgba(255,255,255,.82);
    font-size: 17px;
    line-height: 1.7;
    margin: 18px 0 0;
}

body .register-page .register-benefits {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
    margin-top: 28px;
}

body .register-page .register-benefits div {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 14px 15px;
    border-radius: 18px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.16);
    font-weight: 800;
}

body .register-page .register-benefits span {
    width: 24px;
    height: 24px;
    border-radius: 8px;
    display: inline-grid;
    place-items: center;
    background: #dcfce7;
    color: #166534;
    font-weight: 950;
    flex: 0 0 auto;
}

body .register-page .register-card {
    background: rgba(255,255,255,.94);
    border: 2px solid rgba(99, 102, 241, 0.22);
    border-radius: 32px;
    padding: 30px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
}

body .register-page .register-card-head {
    margin-bottom: 18px;
}

body .register-page .register-card-head h2 {
    margin: 0 0 6px;
    font-size: 30px;
}

body .register-page .register-card-head p {
    margin: 0;
    color: #64748b;
}

body .register-page .register-form {
    display: grid;
    gap: 13px;
}

body .register-page .form-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

body .register-page .register-form label {
    margin: 0 0 7px;
}

body .register-page .register-form input,
body .register-page .register-form select {
    min-height: 46px;
    border: 1.8px solid #cbd5e1;
    background: rgba(255,255,255,.96);
}

body .register-page .register-form input:hover,
body .register-page .register-form select:hover {
    border-color: #94a3b8;
}

body .register-page .register-form input:focus,
body .register-page .register-form select:focus {
    border-color: #4f46e5;
    box-shadow: 0 0 0 4px rgba(79, 70, 229, .12);
    background: #fff;
}

body .register-page .agreement-row {
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    margin-top: 4px !important;
    font-weight: 750;
    color: #334155;
}

body .register-page .agreement-row input {
    width: auto;
    min-height: auto;
    margin-top: 3px;
    accent-color: var(--primary);
    flex: 0 0 auto;
}

body .register-page .agreement-open-btn {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--primary-dark);
    font: inherit;
    font-weight: 900;
    text-decoration: underline;
    cursor: pointer;
}

body .register-page .register-submit {
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 4px;
}

body .register-page .register-login-note {
    text-align: center;
    margin: 4px 0 0;
    color: #64748b;
    font-size: 14px;
}

body .register-page .register-login-note a {
    color: var(--primary-dark);
    font-weight: 900;
}

/* Password strength - scoped */
body .register-page .password-strength {
    width: 100%;
    height: 9px;
    margin-top: 8px;
    border-radius: 999px;
    background: rgba(148, 163, 184, .28);
    overflow: hidden;
}

body .register-page .password-strength-bar {
    width: 0%;
    height: 100%;
    border-radius: 999px;
    transition: width .22s ease, background .22s ease;
}

body .register-page .password-strength-bar.weak { background: #ef4444; }
body .register-page .password-strength-bar.medium { background: #f59e0b; }
body .register-page .password-strength-bar.strong { background: #16a34a; }

body .register-page .password-rules {
    display: grid;
    gap: 8px;
    margin-top: 10px;
    font-size: 13.5px;
    font-weight: 750;
}

body .register-page .password-rules div,
body .register-page .password-match {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #64748b;
}

body .register-page .password-rules span,
body .register-page .password-match span {
    width: 18px;
    min-width: 18px;
    display: inline-grid;
    place-items: center;
    font-size: 18px;
    font-weight: 950;
    line-height: 1;
}

body .register-page .password-rules div.valid,
body .register-page .password-match.valid,
body .register-page .password-rules div.valid span,
body .register-page .password-match.valid span {
    color: #16a34a;
}

body .register-page .password-rules div.invalid,
body .register-page .password-match.invalid,
body .register-page .password-rules div.invalid span,
body .register-page .password-match.invalid span {
    color: #ef4444;
}

body .register-page .password-match {
    margin-top: 10px;
    font-size: 13.5px;
    font-weight: 750;
}

/* Agreement modal remains scoped by unique class */
body .agreement-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(15, 23, 42, .72);
    backdrop-filter: blur(4px);
}

body .agreement-modal.show {
    display: flex;
}

body .agreement-modal-card {
    width: min(860px, calc(100vw - 34px));
    max-height: min(86vh, 760px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 28px 90px rgba(15, 23, 42, .35);
    overflow: hidden;
}

body .agreement-modal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid #e5e7eb;
}

body .agreement-modal-head h2 {
    margin: 0;
    font-size: 22px;
    color: #1f2937;
}

body .agreement-modal-close {
    border: 0;
    background: transparent;
    color: #777;
    font-size: 34px;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
}

body .agreement-modal-body {
    padding: 18px 20px;
    overflow-y: auto;
    color: #3f3f46;
    line-height: 1.6;
    font-size: 15px;
}

body .agreement-modal-footer {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    border-top: 1px solid #e5e7eb;
    background: #fff;
}

body .agreement-accept-btn {
    border: 0;
    border-radius: 8px;
    padding: 11px 18px;
    background: #ff4b13;
    color: #fff;
    font-weight: 850;
    cursor: pointer;
}

body.modal-open {
    overflow: hidden;
}

/* ---------- Login Page Scoped Layout ---------- */
body .login-page {
    width: min(1120px, calc(100% - 36px));
    margin: 0 auto;
    padding: 34px 0 56px;
}

body .login-page .login-shell {
    display: grid;
    grid-template-columns: .95fr .85fr;
    gap: 26px;
    align-items: stretch;
}

body .login-page .login-info {
    position: relative;
    overflow: hidden;
    padding: 42px;
    border-radius: 32px;
    color: #fff;
    background:
        radial-gradient(circle at 18% 16%, rgba(255,255,255,.20), transparent 27%),
        radial-gradient(circle at 86% 18%, rgba(6,182,212,.28), transparent 32%),
        linear-gradient(135deg, #111827 0%, #312e81 52%, #2563eb 100%);
    box-shadow: 0 26px 70px rgba(37,99,235,.22);
}

body .login-page .login-info::after {
    content: "";
    position: absolute;
    right: -90px;
    bottom: -90px;
    width: 240px;
    height: 240px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
}

body .login-page .login-kicker {
    position: relative;
    z-index: 1;
    display: inline-flex;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.14);
    color: rgba(255,255,255,.92);
    border: 1px solid rgba(255,255,255,.18);
    font-size: 13px;
    font-weight: 850;
    margin-bottom: 18px;
}

body .login-page .login-info h1 {
    position: relative;
    z-index: 1;
    margin: 0;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.05;
    letter-spacing: -1.7px;
    font-weight: 950;
}

body .login-page .login-info p {
    position: relative;
    z-index: 1;
    color: rgba(255,255,255,.82);
    font-size: 17px;
    line-height: 1.7;
    margin: 18px 0 0;
}

body .login-page .login-benefits {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
    margin-top: 28px;
}

body .login-page .login-benefits div {
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 14px 15px;
    border-radius: 18px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.16);
    font-weight: 800;
}

body .login-page .login-benefits span {
    width: 24px;
    height: 24px;
    border-radius: 8px;
    display: inline-grid;
    place-items: center;
    background: #dcfce7;
    color: #166534;
    font-weight: 950;
    flex: 0 0 auto;
}

body .login-page .login-card {
    background: rgba(255,255,255,.94);
    border: 2px solid rgba(99, 102, 241, 0.22);
    border-radius: 32px;
    padding: 30px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .12);
}

body .login-page .login-card-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

body .login-page .login-icon {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: inline-grid;
    place-items: center;
    background: #eef2ff;
    color: #3730a3;
    font-size: 22px;
    flex: 0 0 auto;
}

body .login-page .login-card-head h2 {
    margin: 0 0 5px;
    font-size: 30px;
}

body .login-page .login-card-head p {
    margin: 0;
    color: #64748b;
    line-height: 1.45;
}

body .login-page .login-demo-box {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    padding: 13px 14px;
    margin-bottom: 16px;
    border-radius: 16px;
    background: linear-gradient(135deg, #eef2ff, #ecfeff);
    border: 1px solid #c7d2fe;
    color: #334155;
}

body .login-page .login-demo-box strong {
    color: #3730a3;
}

body .login-page .login-demo-box span {
    font-size: 13.5px;
    font-weight: 800;
}

body .login-page .login-form {
    display: grid;
    gap: 12px;
}

body .login-page .login-form label,
body .login-page .login-password-label label {
    margin: 0 0 7px;
}

body .login-page .login-form input {
    min-height: 48px;
    border: 1.8px solid #cbd5e1;
    background: rgba(255,255,255,.96);
}

body .login-page .login-form input:hover {
    border-color: #94a3b8;
}

body .login-page .login-form input:focus {
    border-color: #4f46e5;
    box-shadow: 0 0 0 4px rgba(79, 70, 229, .12);
}

body .login-page .login-password-label {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-top: 2px;
}

body .login-page .login-password-label a {
    color: #3730a3;
    text-decoration: none;
    font-size: 13px;
    font-weight: 850;
}

body .login-page .login-password-wrap {
    position: relative;
}

body .login-page .login-password-wrap input {
    padding-right: 82px;
}

body .login-page .login-password-wrap button {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    border-radius: 10px;
    padding: 8px 10px;
    background: #eef2ff;
    color: #3730a3;
    font-weight: 850;
    cursor: pointer;
}

body .login-page .login-submit {
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 6px;
    min-height: 46px;
}

body .login-page .login-register-note {
    text-align: center;
    margin: 18px 0 0;
    color: #64748b;
    font-size: 14px;
}

body .login-page .login-register-note a {
    color: #3730a3;
    font-weight: 900;
    text-decoration: none;
}

@media (max-width: 920px) {
    body .register-page .register-shell,
    body .login-page .login-shell {
        grid-template-columns: 1fr;
    }

    body .register-page .register-info,
    body .register-page .register-card,
    body .login-page .login-info,
    body .login-page .login-card {
        padding: 24px 20px;
        border-radius: 26px;
    }

    body .register-page .form-grid-2 {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    body .agreement-modal {
        padding: 12px;
    }

    body .agreement-modal-card {
        width: 100%;
        max-height: 90vh;
    }

    body .agreement-modal-head h2 {
        font-size: 18px;
    }
}


/* Password Reset Pages */
.auth-reset-page {
    width: min(640px, calc(100% - 32px));
    margin: 0 auto;
    padding: 46px 0 64px;
}

.auth-reset-card {
    background: rgba(255,255,255,.95);
    border: 2px solid rgba(99, 102, 241, 0.20);
    border-radius: 30px;
    padding: 32px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .11);
    text-align: center;
}

.auth-reset-icon {
    width: 62px;
    height: 62px;
    display: inline-grid;
    place-items: center;
    border-radius: 22px;
    background: #eef2ff;
    color: #3730a3;
    font-size: 28px;
    margin-bottom: 14px;
}

.auth-reset-card h1 {
    margin: 0 0 10px;
    font-size: 34px;
    color: #0f172a;
    letter-spacing: -1px;
}

.auth-reset-card p {
    margin: 0 0 18px;
    color: #64748b;
    line-height: 1.6;
}

.auth-reset-form {
    text-align: left;
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.auth-reset-form input {
    min-height: 48px;
    border: 1.8px solid #cbd5e1;
    background: #fff;
}

.auth-reset-form input:focus {
    border-color: #4f46e5;
    box-shadow: 0 0 0 4px rgba(79,70,229,.12);
}

.auth-reset-btn {
    width: 100%;
    text-align: center;
    justify-content: center;
    margin-top: 8px;
}

.auth-reset-back {
    display: inline-block;
    margin-top: 18px;
    color: #3730a3;
    font-weight: 850;
    text-decoration: none;
}

.auth-reset-alert {
    text-align: left;
    margin-top: 16px;
}