/* _content/TestsUI/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-7ohe5vihza] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-7ohe5vihza] {
    flex: 1;
}

.sidebar[b-7ohe5vihza] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-7ohe5vihza] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-7ohe5vihza]  a, .top-row[b-7ohe5vihza]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-7ohe5vihza]  a:hover, .top-row[b-7ohe5vihza]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-7ohe5vihza]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-7ohe5vihza] {
        justify-content: space-between;
    }

    .top-row[b-7ohe5vihza]  a, .top-row[b-7ohe5vihza]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-7ohe5vihza] {
        flex-direction: row;
    }

    .sidebar[b-7ohe5vihza] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-7ohe5vihza] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-7ohe5vihza]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-7ohe5vihza], article[b-7ohe5vihza] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-7ohe5vihza] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-7ohe5vihza] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/TestsUI/Components/Layout/MainLayoutOriginal.razor.rz.scp.css */
.page[b-itcpgb7077] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-itcpgb7077] {
    flex: 1;
}

.sidebar[b-itcpgb7077] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-itcpgb7077] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-itcpgb7077]  a, .top-row[b-itcpgb7077]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-itcpgb7077]  a:hover, .top-row[b-itcpgb7077]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-itcpgb7077]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-itcpgb7077] {
        justify-content: space-between;
    }

    .top-row[b-itcpgb7077]  a, .top-row[b-itcpgb7077]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-itcpgb7077] {
        flex-direction: row;
    }

    .sidebar[b-itcpgb7077] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-itcpgb7077] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-itcpgb7077]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-itcpgb7077], article[b-itcpgb7077] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-itcpgb7077] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-itcpgb7077] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/TestsUI/Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-bmcl539eze] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-bmcl539eze] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-bmcl539eze] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-bmcl539eze] {
    font-size: 1.1rem;
}

.bi[b-bmcl539eze] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-bmcl539eze] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-bmcl539eze] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-bmcl539eze] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-bmcl539eze] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-bmcl539eze] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-bmcl539eze] {
        padding-bottom: 1rem;
    }

    .nav-item[b-bmcl539eze]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-bmcl539eze]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-bmcl539eze]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-bmcl539eze] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-bmcl539eze] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-bmcl539eze] {
        display: none;
    }

    .nav-scrollable[b-bmcl539eze] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* _content/TestsUI/Components/Pages/CreateExam/BuildExam.razor.rz.scp.css */
.btn1[b-rcu4vkrrjw] {
    border: none;
    background-color: transparent;
    color: #007bff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    font-size: 1rem;
}

.fa-plus[b-rcu4vkrrjw] {
    margin-right: 5px;
}

.radio-table[b-rcu4vkrrjw] {
    border-collapse: collapse;
}

.radio-table td[b-rcu4vkrrjw], 
.radio-table th[b-rcu4vkrrjw] {
    border: none;
    padding: 5px;
}

/* Container for the whole page */
:host[b-rcu4vkrrjw] {
    display: block;
    padding: 32px 0 0 0;
    background: #fafbfc;
    min-height: 100vh;
}

/* Main content area: left-aligned, responsive width */
.build-exam-container[b-rcu4vkrrjw] {
    width: 100%;
    max-width: none;
    margin: 32px 0 0 0; /* Only top margin, no centering */
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(60,72,88,0.08);
    padding: 32px 4vw 24px 4vw;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
}

/* Headings */
h3[b-rcu4vkrrjw] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: #222;
}

h2[b-rcu4vkrrjw] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 1.5rem 0 1rem 0;
    color: #333;
}

/* Add New button */
.btn1[b-rcu4vkrrjw] {
    background: none;
    color: #2563eb;
    border: none;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s;
}
.btn1:hover[b-rcu4vkrrjw] {
    color: #1d4ed8;
    text-decoration: underline;
}

/* Form controls */
label[b-rcu4vkrrjw] {
    font-weight: 600;
    color: #444;
    margin-bottom: 0.25rem;
}

.mb-3[b-rcu4vkrrjw] {
    margin-bottom: 1.2rem !important;
}

select[b-rcu4vkrrjw], .form-select[b-rcu4vkrrjw], .form-control[b-rcu4vkrrjw], input[type="text"][b-rcu4vkrrjw], input[type="number"][b-rcu4vkrrjw] {
    width: 100%;
    padding: 8px 12px;
    border-radius: 6px;
    border: 1.5px solid #d1d5db;
    font-size: 1rem;
    background: #f8fafc;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
    transition: border-color 0.2s;
}
select:focus[b-rcu4vkrrjw], .form-select:focus[b-rcu4vkrrjw], .form-control:focus[b-rcu4vkrrjw], input:focus[b-rcu4vkrrjw] {
    border-color: #2563eb;
    outline: none;
}

/* Primary button */
.btn.btn-primary[b-rcu4vkrrjw] {
    background: #2563eb;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 10px 22px;
    font-size: 1.08rem;
    font-weight: 600;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    transition: background 0.2s;
}
.btn.btn-primary:disabled[b-rcu4vkrrjw] {
    background: #bcd0f7;
    color: #fff;
    cursor: not-allowed;
}
.btn.btn-primary:hover:not(:disabled)[b-rcu4vkrrjw] {
    background: #1e40af;
}

/* Radio group styling */
input[type="radio"][b-rcu4vkrrjw] {
    accent-color: #2563eb;
    margin-right: 6px;
}
.radio-table[b-rcu4vkrrjw] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
    background: #f8fafc;
    border-radius: 8px;
    overflow: hidden;
}
.radio-table th[b-rcu4vkrrjw], .radio-table td[b-rcu4vkrrjw] {
    padding: 10px 8px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    font-size: 1rem;
}
.radio-table th[b-rcu4vkrrjw] {
    background: #f1f5f9;
    font-weight: 600;
    color: #333;
}
.radio-table tr:last-child td[b-rcu4vkrrjw] {
    border-bottom: none;
}

/* Alert styling */
.alert-info[b-rcu4vkrrjw] {
    background: #e0f7fa;
    color: #0277bd;
    border: 1.5px solid #b2ebf2;
    border-radius: 8px;
    padding: 16px 18px;
    font-size: 1.08rem;
    margin-top: 1.5rem;
}

/* Instructional note styling */
.instruction-note[b-rcu4vkrrjw] {
    display: flex;
    align-items: center;
    background: #f1f5fa;
    color: #2563eb;
    border-left: 4px solid #2563eb;
    border-radius: 6px;
    padding: 10px 16px;
    font-size: 1.08rem;
    font-weight: 500;
    margin-bottom: 1rem;
    gap: 8px;
}

.instruction-note .fa-info-circle[b-rcu4vkrrjw] {
    font-size: 1.2em;
    margin-right: 8px;
}

/* Table improvements */
.table-responsive[b-rcu4vkrrjw] {
    width: 100%;
    overflow-x: auto;
}

.modern-table[b-rcu4vkrrjw] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #f8fafc;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(60,72,88,0.04);
    margin-bottom: 1.5rem;
}

.modern-table th[b-rcu4vkrrjw], .modern-table td[b-rcu4vkrrjw] {
    padding: 14px 12px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    font-size: 1rem;
}

.modern-table th[b-rcu4vkrrjw] {
    background: #f1f5f9;
    font-weight: 600;
    color: #333;
}

.modern-table tr:last-child td[b-rcu4vkrrjw] {
    border-bottom: none;
}

.modern-table tr:hover[b-rcu4vkrrjw] {
    background: #e8f0fe;
    transition: background 0.2s;
}

/* Remove extra whitespace after Get Templates */
.mb-3[b-rcu4vkrrjw], .table-responsive[b-rcu4vkrrjw], .modern-table[b-rcu4vkrrjw] {
    margin-bottom: 0.8rem !important;
}

/* New table styles */
.table-card[b-rcu4vkrrjw] {
    width: 100%;
    display: block;
    margin: 0.5rem 0 1.5rem 0;
}

.modern-table-responsive[b-rcu4vkrrjw] {
    max-width: 520px;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    overflow-x: auto;
}

.compact-table[b-rcu4vkrrjw] {
    width: 100%;
    min-width: 320px;
    max-width: 520px;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(60,72,88,0.08);
    overflow: hidden;
    margin: 0;
    table-layout: auto;
}

.compact-table th[b-rcu4vkrrjw], .compact-table td[b-rcu4vkrrjw] {
    padding: 12px 14px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    font-size: 1rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 180px;
}

.compact-table th[b-rcu4vkrrjw] {
    background: #f1f5f9;
    font-weight: 600;
    color: #333;
    border-bottom: 2px solid #e5e7eb;
}

.compact-table tr:last-child td[b-rcu4vkrrjw] {
    border-bottom: none;
}

.compact-table tr:hover[b-rcu4vkrrjw] {
    background: #f0f6ff;
    transition: background 0.2s;
}

.compact-table td:first-child[b-rcu4vkrrjw],
.compact-table th:first-child[b-rcu4vkrrjw] {
    width: 36px;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
}

.compact-table td[b-rcu4vkrrjw] {
    vertical-align: middle;
}

/* Responsive design */
@media (max-width: 900px) {
    .build-exam-container[b-rcu4vkrrjw] {
        max-width: 98vw;
        padding: 16px 2vw 16px 2vw;
    }
    h3[b-rcu4vkrrjw] {
        font-size: 1.4rem;
    }
    h2[b-rcu4vkrrjw] {
        font-size: 1.1rem;
    }
    .radio-table th[b-rcu4vkrrjw], .radio-table td[b-rcu4vkrrjw] {
        padding: 7px 4px;
        font-size: 0.98rem;
    }
    .modern-table th[b-rcu4vkrrjw], .modern-table td[b-rcu4vkrrjw] {
        padding: 8px 6px;
        font-size: 0.98rem;
    }
    .instruction-note[b-rcu4vkrrjw] {
        font-size: 0.98rem;
        padding: 8px 8px;
    }
    .compact-table th[b-rcu4vkrrjw], .compact-table td[b-rcu4vkrrjw] {
        padding: 8px 6px;
        font-size: 0.98rem;
        max-width: 90vw;
    }
}

@media (max-width: 600px) {
    .modern-table-responsive[b-rcu4vkrrjw], .compact-table[b-rcu4vkrrjw] {
        max-width: 98vw;
        min-width: 0;
    }
}
/* _content/TestsUI/Components/Pages/CreateExam/CreateExamSequence.razor.rz.scp.css */
/* CSS for CreateExamSequence component */

/* Style for the "Create Exam" heading */
h3[b-p6t51kcch9] {
    font-size: 2.5rem; /* Larger font size for better visibility */
    font-weight: 700; /* Make the text bold */
    color: #1f2937; /* Neutral dark color */
    margin-bottom: 2rem; /* Add more space below the heading */
    padding: 0.5rem 1rem; /* Add padding for better spacing */
    background-color: #f3f4f6; /* Light gray background for subtle emphasis */
    border-radius: 8px; /* Rounded corners for a modern look */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Add a subtle shadow */
}

/* Highlight the current Radzen step text in green */
[b-p6t51kcch9] .rz-steps .rz-state-highlight .rz-steps-title {
    color: #198754 
    !important; /* Green text for active step */
    font-weight: 600; /* Slightly bold text */
}


[b-p6t51kcch9]  .rz-steps .rz-state-highlight .rz-steps-number {
    background: #198754;
    color: var(--rz-steps-number-selected-color);
}


/* Add spacing between steps */
/*:deep(.rz-steps .rz-widget-content) {
    overflow-x: visible !important;
    overflow-y: visible !important;
    margin-top: 1rem;*/ /* Add space above the steps */
/*}*/

/* Add any other specific styles for this component here */
/* _content/TestsUI/Components/Pages/CreateExam/ExamDetails.razor.rz.scp.css */
/* CSS for ExamDetails component */

h3[b-7jzy1egpsx] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: #1e293b;
    letter-spacing: -0.5px;
    border-left: 5px solid #2563eb;
    padding-left: 12px;
    background: linear-gradient(90deg, #f1f5fa 60%, transparent 100%);
    border-radius: 4px;
}

.btn-space[b-7jzy1egpsx] {
    margin-right: 20px;
}

.flex-container[b-7jzy1egpsx] {
    display: flex;
    justify-content: flex-end;
    gap: 20px; /* Adds gap between flex items */
}

.btn-margin-right[b-7jzy1egpsx] {
    margin-right: 10px;
}

/* Container for the whole form */
.exam-details-container[b-7jzy1egpsx] {
    width: 100%;
    max-width: 100vw; /* Allow more width, adjust as needed */
    margin: 32px 0 0 0; /* Remove auto-centering, only top margin */
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(60,72,88,0.08);
    padding: 32px 4vw 24px 4vw; /* Responsive side padding */
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* Headings */
h3[b-7jzy1egpsx] {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
    color: #222;
}

/* Form fields */
label[b-7jzy1egpsx] {
    font-weight: 600;
    color: #444;
    margin-bottom: 0.25rem;
    display: block;
}

input[type="text"][b-7jzy1egpsx], input[type="number"][b-7jzy1egpsx], input[type="date"][b-7jzy1egpsx], select[b-7jzy1egpsx], .form-control[b-7jzy1egpsx], .form-select[b-7jzy1egpsx] {
    width: 100%;
    padding: 8px 12px;
    border-radius: 6px;
    border: 1.5px solid #d1d5db;
    font-size: 1rem;
    background: #f8fafc;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
    transition: border-color 0.2s;
}
input:focus[b-7jzy1egpsx], select:focus[b-7jzy1egpsx] {
    border-color: #2563eb;
    outline: none;
}

/* Validation message */
.validation-message[b-7jzy1egpsx] {
    color: #e53935;
    font-size: 0.95rem;
    margin-top: 0.1rem;
}

/* Button styles */
button.btn[b-7jzy1egpsx], .btn[b-7jzy1egpsx] {
    background: #2563eb;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 10px 22px;
    font-size: 1.08rem;
    font-weight: 600;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    transition: background 0.2s;
    cursor: pointer;
}
button.btn-success[b-7jzy1egpsx] {
    background: #22c55e;
}
button.btn:hover[b-7jzy1egpsx], .btn:hover[b-7jzy1egpsx] {
    background: #1e40af;
}
button.btn-success:hover[b-7jzy1egpsx] {
    background: #16a34a;
}

/* Flex container for top buttons */
.flex-container[b-7jzy1egpsx] {
    display: flex;
    justify-content: flex-end;
    gap: 20px;
    margin-bottom: 1.2rem;
}

/* Table styling */
.exam-table-wrapper[b-7jzy1egpsx] {
    width: 100%;
    max-width: 900px;
    margin: 0 0 1.5rem 0;
    overflow-x: auto;
}

.exam-table[b-7jzy1egpsx] {
    width: 100%;
    min-width: 420px;
    max-width: 900px;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    background: #f8fafc;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(60,72,88,0.04);
}
.exam-table th[b-7jzy1egpsx], .exam-table td[b-7jzy1egpsx] {
    padding: 12px 10px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    font-size: 1rem;
    white-space: nowrap;
}
.exam-table th[b-7jzy1egpsx] {
    background: #f1f5f9;
    font-weight: 600;
    color: #333;
}
.exam-table tr:last-child td[b-7jzy1egpsx] {
    border-bottom: none;
}
.exam-table tr:hover[b-7jzy1egpsx] {
    background: #f0f6ff;
    transition: background 0.2s;
}

/* Instructional note styling */
.exam-instruction[b-7jzy1egpsx] {
    display: flex;
    align-items: center;
    background: #f1f5fa;
    color: #2563eb;
    border-left: 4px solid #2563eb;
    border-radius: 6px;
    padding: 10px 18px;
    font-size: 1.08rem;
    font-weight: 500;
    margin-bottom: 1.2rem;
    gap: 8px;
}

/* Exam totals row styling */
.exam-totals-row[b-7jzy1egpsx] {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: center;
    margin-top: 1.2rem;
    margin-bottom: 1.2rem;
}

.exam-totals-row label[b-7jzy1egpsx] {
    font-weight: 600;
    margin-right: 8px;
    color: #444;
}

.exam-totals-row input[b-7jzy1egpsx],
.exam-totals-row select[b-7jzy1egpsx] {
    min-width: 80px;
    max-width: 120px;
    margin-right: 16px;
}

/* Responsive design */
@media (max-width: 700px) {
    .exam-details-container[b-7jzy1egpsx] {
        max-width: 98vw;
        padding: 16px 2vw 16px 2vw;
    }
    .exam-table th[b-7jzy1egpsx], .exam-table td[b-7jzy1egpsx] {
        padding: 8px 6px;
        font-size: 0.98rem;
    }
}

.datetime-wrapper[b-7jzy1egpsx] {
    max-width: 420px; /* adjust as needed */
}

.datetime-input[b-7jzy1egpsx] {
    width: 100%;
    box-sizing: border-box;
}
/* _content/TestsUI/Components/Pages/CreateExam/ExamReview.razor.rz.scp.css */
.hidden-row[b-43dro8ia8h] {
    display: none;
}

.visible-row[b-43dro8ia8h] {
    display: table-row;
}

.hidden-content[b-43dro8ia8h] {
    display: none;
}

.visible-content[b-43dro8ia8h] {
    display: block;
}

.answers-list[b-43dro8ia8h] {
    list-style-type: none;
    padding-left: 0;
}

.answer-item[b-43dro8ia8h] {
    display: flex;
    align-items: center;
    margin-bottom: 0.5em;
}

.tick-icon[b-43dro8ia8h] {
    color: green;
    display: inline-block;
    width: 1.5em;
}

.tick-placeholder[b-43dro8ia8h] {
    display: inline-block;
    width: 1.5em;
}

.answer-label[b-43dro8ia8h] {
    margin-left: 10px;
    min-width: 50px;
}

.answer-display[b-43dro8ia8h] {
    margin-left: 20px;
}

/* for the topics table */
.clickable[b-43dro8ia8h] {
    color: blue;
    cursor: pointer;
    text-decoration: underline;
}

.clickable:hover[b-43dro8ia8h] {
    color: darkblue;
}

.container[b-43dro8ia8h] {
    display: flex;
    gap: 20px;
    justify-content: flex-start; /* Ensures children align left */
    align-items: flex-start;      /* Aligns tables to the top */
    margin-left: 0;              /* Remove any centering margin */
}

.table-container[b-43dro8ia8h] {
    display: block;
    width: 100%;
    /*min-height: 200px;
    max-height: 80vh;*/ /* Grows until 80% of viewport height, then scrolls */
    overflow-y: auto;
    overflow-y: visible; /* Let the table grow vertically */
    padding: 1rem;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    margin-bottom: 2rem;
}

.table1[b-43dro8ia8h] {
    width: 100%; /* Ensures the table takes up the full width of the container */
    border-collapse: collapse;
}

.centered[b-43dro8ia8h] {
    text-align: center;
    vertical-align: middle; /* Ensure vertical centering */
}

.table[b-43dro8ia8h] {
    border-collapse: collapse;
}

.label-cell[b-43dro8ia8h] {
    font-weight: bold;
    text-align: right;
    background-color: #f1f1f1;
    padding: 10px;
}

td[b-43dro8ia8h] {
    padding: 10px;
    border: 1px solid #ddd;
}

th[b-43dro8ia8h], td[b-43dro8ia8h] {
    padding: 10px;
    border: 1px solid #ddd;
}

th[b-43dro8ia8h] {
    background-color: #f1f1f1;
}

:root[b-43dro8ia8h] {
    --primary: #4f46e5;
    --primary-hover: #3730a3;
    --bg: #f8f9fb;
    --card-bg: #fff;
    --border: #e5e7eb;
    --text: #22223b;
    --muted: #6b7280;
    --radius: 12px;
    --shadow: 0 2px 12px rgba(0,0,0,0.06);
}

.examreview-header[b-43dro8ia8h] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2rem;
    gap: 1rem;
}

.examreview-title[b-43dro8ia8h] {
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: -1px;
}

.submit-exam-btn[b-43dro8ia8h] {
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: var(--radius);
    padding: 0.75em 2em;
    font-size: 1rem;
    font-weight: 600;
    box-shadow: var(--shadow);
    cursor: pointer;
    transition: background 0.2s;
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.submit-exam-btn:hover[b-43dro8ia8h] {
    background: var(--primary-hover);
}

.step-section[b-43dro8ia8h] {
    background: var(--card-bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 1.5rem 2rem;
    margin-bottom: 2rem;
    border: 1px solid var(--border);
}

input[type="text"][b-43dro8ia8h],
input[type="number"][b-43dro8ia8h],
input[type="datetime-local"][b-43dro8ia8h] {
    width: 100%;
    padding: 0.5em 0.75em;
    border: none;
    border-radius: 6px;
    font-size: 1em;
    background: #f5f6fa; /* subtle light background */
    transition: box-shadow 0.2s, background 0.2s;
    box-shadow: 0 1px 2px rgba(80,80,80,0.04);
    outline: none;
}

input[type="text"]:focus[b-43dro8ia8h],
input[type="number"]:focus[b-43dro8ia8h],
input[type="datetime-local"]:focus[b-43dro8ia8h] {
    background: #fff;
    box-shadow: 0 0 0 2px #4f46e5;
}

.stats-table[b-43dro8ia8h] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg, #fff);
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.stats-table td[b-43dro8ia8h] {
    padding: 1.1em 1.5em;
    text-align: center;
    border-bottom: 1px solid #f0f1f3;
    font-size: 1.08em;
}

.stats-table tr:last-child td[b-43dro8ia8h] {
    border-bottom: none;
}

.stats-table td:last-child[b-43dro8ia8h] {
    font-weight: 600;
    color: var(--primary, #4f46e5);
    background: #f8f9fb;
    border-left: 1px solid #f0f1f3;
}

.stats-table td:first-child[b-43dro8ia8h] {
    color: #22223b;
    background: transparent;
}

/* Make ID, ORDER columns narrow */
.col-id[b-43dro8ia8h], .col-order[b-43dro8ia8h] {
    width: 48px;
    min-width: 36px;
    max-width: 60px;
    text-align: center;
    white-space: nowrap;
    font-size: 0.98em;
    color: #555;
}

.col-order[b-43dro8ia8h] {
    width: 100px; /* wider than ID */
    min-width: 80px;
    max-width: 140px;
    text-align: center;
    white-space: nowrap;
    font-size: 1em;
    color: #555;
}

/* Make VALUE column very narrow */
.col-value[b-43dro8ia8h] {
    width: 70px;
    min-width: 60px;
    max-width: 90px;
    text-align: center;
    font-weight: 600;
    color: #555;
    /*background: transparent !important; *//* No grey background for body cells */
    padding-left: 0;
    padding-right: 0;
}

/* Ensure only the header is grey */
th.col-value[b-43dro8ia8h] {
    background: #f1f1f1; /* Match your other headers */
}

/* QU DISPLAY: icon always on the right */
.col-display[b-43dro8ia8h] {
    width: auto;
    min-width: 180px;
    word-break: break-word;
    white-space: normal;
    position: relative;
    padding-right: 2.2em; /* space for icon */
}

/* Flex layout for display cell */
.display-flex[b-43dro8ia8h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    width: 100%;
}

/* Group icon and value to look like a dropdown */
.icon-value-group[b-43dro8ia8h] {
    display: flex;
    align-items: center;
    background: #f5f6fa;
    border-radius: 6px;
    box-shadow: 0 1px 2px rgba(80,80,80,0.04);
    padding: 0.2em 0.8em 0.2em 0.5em;
    margin-left: 1em;
    min-width: 48px;
    gap: 0.5em;
}

.dropdown-icon[b-43dro8ia8h] {
    color: #888;
    font-size: 1.2em;
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-right: 0;
    /* No background, no border */
}

.question-value[b-43dro8ia8h] {
    font-weight: 600;
    color: var(--primary, #4f46e5);
    font-size: 1em;
    margin-left: 0.2em;
}

/* Responsive: stack or shrink columns on small screens */
@media (max-width: 900px) {
    .step-section[b-43dro8ia8h] {
        padding: 1rem;
    }
    .examreview-header[b-43dro8ia8h] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    .submit-exam-btn[b-43dro8ia8h] {
        width: 100%;
        justify-content: center;
        margin-left: 0;
    }
    .container[b-43dro8ia8h] {
        flex-direction: column;
        gap: 1rem;
    }
    .col-id[b-43dro8ia8h], .col-value[b-43dro8ia8h] {
        width: 36px;
        min-width: 28px;
        font-size: 0.92em;
    }
    .col-order[b-43dro8ia8h] {
        width: 60px;
        min-width: 48px;
        font-size: 0.95em;
    }
    .col-display[b-43dro8ia8h] {
        font-size: 0.98em;
        padding-right: 2em;
    }
}

@media (max-width: 600px) {
    .stats-table td[b-43dro8ia8h] {
        padding: 0.7em 0.5em;
        font-size: 1em;
    }
    .display-flex[b-43dro8ia8h] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.3em;
    }
    .dropdown-icon[b-43dro8ia8h] {
        margin-left: 0;
        margin-top: 0.3em;
    }
}

th[b-43dro8ia8h], th.col-value[b-43dro8ia8h] {
    background-color: #f1f1f1;
    color: #22223b;
    font-weight: 700;
    text-align: center;
}
/* _content/TestsUI/Components/Pages/CreateExam/ReviewQus.razor.rz.scp.css */


.answers-list[b-qjtl2r1al6] {
    list-style-type: none;
    padding-left: 0;
}

.answer-item[b-qjtl2r1al6] {
    display: flex;
    align-items: center;
    margin-bottom: 0.5em;
}

.tick-icon[b-qjtl2r1al6] {
    color: green;
    display: inline-block;
    width: 1.5em;
}

.tick-placeholder[b-qjtl2r1al6] {
    display: inline-block;
    width: 1.5em;
}

.answer-label[b-qjtl2r1al6] {
    margin-left: 10px;
    min-width: 50px;
}

.answer-display[b-qjtl2r1al6] {
    margin-left: 20px;
}

/* Default color for any data-balance attribute */
[data-balance][b-qjtl2r1al6] {
    color: black; /* Applied to all elements with a data-balance attribute */
}

/* Color for negative balance */
[data-balance*="-"][b-qjtl2r1al6] {
    color: red; /* Applied to elements with data-balance attribute containing a "-" */
}


.centered[b-qjtl2r1al6] {
    text-align: center;
    vertical-align: middle; /* Ensure vertical centering */
    padding: 20px 20px; /* Adjust padding for more space between columns */
}

/* Question value default (only when not the null placeholder) */
.question-value:not(.question-value-null)[b-qjtl2r1al6] {
    color: #0b61d8; /* blue */
}

.question-value-null[b-qjtl2r1al6] {
    background-color: #fff3cd; /* light yellow */
    color: #856404; /* dark yellow text */
    font-style: italic;
    border: 2px dashed orange;
    border-radius: 4px;
    text-align: center;
    min-width: 60px;
    min-height: 1.8em;
    display: inline-block;
    padding: 0.2em 0.5em;
    box-sizing: border-box;
}



/* from the radzen team */



.table-cell-edited[b-qjtl2r1al6] {
    position: relative;
}

    .table-cell-edited[b-qjtl2r1al6]::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        width: 0;
        height: 0;
        border-top: 10px solid red;
        border-left: 10px solid transparent;
    }

.save-row[b-qjtl2r1al6] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1rem;
}

.wrap[b-qjtl2r1al6],
.wrap *[b-qjtl2r1al6] {
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 0 !important;
    display: block;
    text-align: left !important;
}


/* Editable input highlight for RadzenNumeric inside grid edit template */
.editable-input[b-qjtl2r1al6],
.editable-input > input[b-qjtl2r1al6],
.editable-input .rz-input[b-qjtl2r1al6],
.editable-input .rz-numeric[b-qjtl2r1al6] {
    background-color: #fff9db; /* light yellow */
    border: 1px solid #f0c419;
    color: #222;
}

    /* Stronger focus ring when user edits */
    .editable-input:focus[b-qjtl2r1al6],
    .editable-input > input:focus[b-qjtl2r1al6],
    .editable-input .rz-input:focus[b-qjtl2r1al6] {
        outline: none;
        box-shadow: 0 0 0 4px rgba(240,196,25,0.15);
    }

/* Optional: highlight cells that were edited (your existing IsEdited returns "table-cell-edited") */
.table-cell-edited[b-qjtl2r1al6] {
    background-color: #eaf6ff;
    transition: background-color 0.25s ease;
}
/* _content/TestsUI/Components/Pages/CreateExam/SelectQus.razor.rz.scp.css */
/* Override Radzen DataGrid table styles */
.rz-grid-table[b-zgjvv896nv],
.rz-grid-table-fixed[b-zgjvv896nv],
.rz-grid-table-striped[b-zgjvv896nv] {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #fff !important;
    font-size: 1rem !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

    .rz-grid-table th[b-zgjvv896nv],
    .rz-grid-table-fixed th[b-zgjvv896nv],
    .rz-grid-table-striped th[b-zgjvv896nv],
    .rz-grid-table td[b-zgjvv896nv],
    .rz-grid-table-fixed td[b-zgjvv896nv],
    .rz-grid-table-striped td[b-zgjvv896nv] {
        padding: 0.75rem 1rem !important;
        text-align: left !important;
        border-bottom: 1px solid #e0e0e0 !important;
    }

    .rz-grid-table th[b-zgjvv896nv],
    .rz-grid-table-fixed th[b-zgjvv896nv],
    .rz-grid-table-striped th[b-zgjvv896nv] {
        background: #f5f7fa !important;
        font-weight: 600 !important;
        color: #2d3a4a !important;
        letter-spacing: 0.03em !important;
        border-bottom: 2px solid #b0bec5 !important;
    }

    .rz-grid-table tr:last-child td[b-zgjvv896nv],
    .rz-grid-table-fixed tr:last-child td[b-zgjvv896nv],
    .rz-grid-table-striped tr:last-child td[b-zgjvv896nv] {
        border-bottom: none !important;
    }

    .rz-grid-table tr:hover[b-zgjvv896nv],
    .rz-grid-table-fixed tr:hover[b-zgjvv896nv],
    .rz-grid-table-striped tr:hover[b-zgjvv896nv] {
        background: #f0f4f8 !important;
        transition: background 0.2s !important;
    }

/* Main container for the page */
.selectqus-container[b-zgjvv896nv] {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    padding: 40px 3vw 32px 3vw;
}

/* Headings */
h3[b-zgjvv896nv] {
    font-size: 2rem;
    font-weight: 700;
    margin-bottom: 1rem;
    color: #1e293b;
    letter-spacing: -0.5px;
    border-left: 5px solid #2563eb;
    padding-left: 12px;
    background: linear-gradient(90deg, #f1f5fa 60%, transparent 100%);
    border-radius: 4px;
}

/* Table wrapper for responsive tables */
.table-wrapper[b-zgjvv896nv] {
    width: 100%;
    max-width: 800px;
    margin: 0 0 2rem 0;
    padding: 1.5rem;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 4px 16px rgba(60,72,88,0.10);
}

/* Flexbox for table and info panel */
.table-flex[b-zgjvv896nv] {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 20px;
    width: 100%;
}

/* Custom table styles */
.selectqus-table[b-zgjvv896nv] {
    flex: 1;
    min-width: 0;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}

.selectqus-table th[b-zgjvv896nv], .selectqus-table td[b-zgjvv896nv] {
    padding: 8px 6px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    font-size: 1rem;
  /*  white-space: nowrap;*/
}

.selectqus-table th[b-zgjvv896nv] {
    background: #f1f5f9;
    font-weight: 600;
    color: #333;
}

.selectqus-table tr:last-child td[b-zgjvv896nv] {
    border-bottom: none;
}

.selectqus-table tr:hover[b-zgjvv896nv] {
    background: #f0f6ff;
    transition: background 0.2s;
}

/* Make quantity field smaller */
/*.selectqus-table input[type="number"],
.selectqus-table input[type="text"],
.selectqus-table .form-control {
    width: 24px !important;
    min-width: 24px;
    max-width: 24px;
    padding: 2px;
    font-size: 0.9rem;
    text-align: center;
    border-radius: 3px;
    border: 1px solid #cbd5e1;
}*/

/* Info panel on the right */
.info-panel[b-zgjvv896nv] {
    font-size: 0.95rem;
    color: #222;
    background: #f8fafc;
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 2px 8px rgba(60,72,88,0.08);
    width: 280px;
    max-width: 100%;
    min-width: 180px;
    font-weight: 500;
}

.info-panel label[b-zgjvv896nv] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    margin-bottom: 8px;
}

/* Filter and button row */
.filter-row[b-zgjvv896nv] {
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    align-items: center;
    margin-bottom: 1.2rem;
}

.filter-row label[b-zgjvv896nv] {
    font-weight: 600;
    color: #444;
    margin-right: 6px;
}

.filter-row select[b-zgjvv896nv], .filter-row input[b-zgjvv896nv], .filter-row .form-control[b-zgjvv896nv] {
    padding: 6px 10px;
    border-radius: 6px;
    border: 1.5px solid #d1d5db;
    font-size: 1rem;
    background: #f8fafc;
    margin-right: 8px;
    transition: border-color 0.2s;
}

select[b-zgjvv896nv] {
    padding: 6px 10px;
    border-radius: 6px;
    border: 1.5px solid #d1d5db;
    font-size: 1rem;
    background: #f8fafc;
    margin-right: 8px;
    transition: border-color 0.2s;
}

/* Button styles */
button[b-zgjvv896nv], .rz-button[b-zgjvv896nv], .btn[b-zgjvv896nv] {
    background: #2563eb;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 8px 18px;
    font-size: 1.08rem;
    font-weight: 600;
    transition: background 0.2s;
    cursor: pointer;
    margin: 0;
}

button:hover[b-zgjvv896nv], .rz-button:hover[b-zgjvv896nv], .btn:hover[b-zgjvv896nv] {
    background: #1e40af;
}

/* Secondary button styles */
.secondary-btn[b-zgjvv896nv] {
    background: #f3f4f6;
    color: #222;
    border: 1.5px solid #d1d5db;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 1rem;
    font-weight: 500;
    transition: background 0.2s, color 0.2s;
    cursor: pointer;
}

.secondary-btn:hover[b-zgjvv896nv] {
    background: #e5e7eb;
    color: #2563eb;
    border-color: #2563eb;
}

/* Save button row */
.save-row[b-zgjvv896nv] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1.2rem;
}

/* Force wrap in the Question column of Radzen DataGrid */
/*.rz-grid-table td.question-cell,
.rz-grid-table-fixed td.question-cell,
.rz-grid-table-striped td.question-cell {
    white-space: normal !important;
    word-break: break-word !important;
    max-width: 400px !important;*/ /* Adjust as needed */
    /*overflow: visible !important;
}*/

/* Make the ID column smaller */
/*.rz-grid-table td.id-cell,
.rz-grid-table-fixed td.id-cell,
.rz-grid-table-striped td.id-cell {
    width: 60px !important;
    max-width: 60px !important;
    min-width: 40px !important;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
}*/

/* Responsive adjustments */
@media (max-width: 1100px) {
    .table-wrapper[b-zgjvv896nv] {
        max-width: 98vw;
        padding: 1.2rem 1vw;
    }
    .table-flex[b-zgjvv896nv] {
        gap: 18px;
    }
    .info-panel[b-zgjvv896nv] {
        width: 100%;
        min-width: 0;
        padding: 16px 10px;
    }
}

@media (max-width: 900px) {
    .selectqus-container[b-zgjvv896nv] {
        max-width: 98vw;
        padding: 16px 2vw;
    }
    h3[b-zgjvv896nv] {
        font-size: 1.3rem;
    }
    .table-flex[b-zgjvv896nv] {
        flex-direction: column;
        gap: 12px;
    }
    .info-panel[b-zgjvv896nv] {
        width: 100%;
        max-width: 100%;
        margin-top: 12px;
    }
    .table-wrapper[b-zgjvv896nv] {
        padding: 1rem;
    }
    .selectqus-table th[b-zgjvv896nv], .selectqus-table td[b-zgjvv896nv] {
        padding: 8px 6px;
        font-size: 0.98rem;
    }
    .filter-row[b-zgjvv896nv] {
        gap: 8px;
    }
}

@media (max-width: 700px) {
    .table-wrapper[b-zgjvv896nv] {
        padding: 0.8rem;
    }
    .selectqus-table th[b-zgjvv896nv], .selectqus-table td[b-zgjvv896nv] {
        padding: 8px 4px;
        font-size: 0.95rem;
    }
}

.wrap[b-zgjvv896nv],
.wrap *[b-zgjvv896nv] {
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    width: 100% !important;
    max-width: none !important;
    flex: 1 1 0 !important;
    display: block;
}
/*
::deep(.qty-input) {
    width: 48px !important;
    min-width: 24px !important;
    max-width: 64px !important;
    padding: 2px 4px !important;
    font-size: 1rem !important;
    text-align: center !important;
    border-radius: 3px !important;
    border: 1px solid #cbd5e1 !important;
    box-sizing: border-box !important;
}*/
/* _content/TestsUI/Components/Pages/CreateQus/AddAnswers.razor.rz.scp.css */
/* --- Multiple Choice Section Card --- */
#mc-options-wrap[b-e1gciiiqph] {
    display: none;
    margin-top: 18px;
    background: transparent;
}
#mc-options-wrap:has(#mc-options-container tbody tr)[b-e1gciiiqph] {
    display: block;
}

/* --- Info Alert --- */
#mc-options-wrap .alert-info[b-e1gciiiqph] {
    border: 1.5px solid #bae6fd;
    background: #f8fafc;
    color: #0369a1;
    border-radius: 8px;
    font-size: 1.05rem;
    margin-bottom: 12px;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    gap: 0.7em;
}
#mc-options-wrap .alert-info i[b-e1gciiiqph] {
    color: #0ea5e9;
    font-size: 1.2em;
}

/* --- Table Card --- */
[b-e1gciiiqph] #mc-options-container table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(60,72,88,0.07);
    overflow: hidden;
    margin-bottom: 0;
}
[b-e1gciiiqph] #mc-options-container th, #mc-options-container td[b-e1gciiiqph] {
    padding: 14px 10px;
    text-align: center;
    border-bottom: 1px solid #e5e7eb;
    font-size: 1rem;
}
[b-e1gciiiqph] #mc-options-container th {
    background: #f8fafc;
    font-weight: 700;
    color: #22223b;
    border-bottom: 2px solid #e5e7eb;
}

[b-e1gciiiqph] #mc-options-container td {
    color: #22223b;
    vertical-align: middle;
    word-break: break-word; /* Add this line */
}

/* --- Action Buttons --- */
[b-e1gciiiqph] #mc-options-container .mc-actions-header,
[b-e1gciiiqph] #mc-options-container td.mc-actions {
    background: transparent !important;
    border: none !important;
}
[b-e1gciiiqph] #mc-options-container .btn {
    font-size: 0.95rem;
    padding: 0.35em 0.9em;
    border-radius: 6px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}
[b-e1gciiiqph] #mc-options-container .btn-primary {
    background: #2563eb;
    border-color: #2563eb;
}
    [b-e1gciiiqph] #mc-options-container .btn-primary:hover {
        background: #1d4ed8;
        border-color: #1d4ed8;
    }
[b-e1gciiiqph]#mc-options-container .btn-danger {
    background: #ef4444;
    border-color: #ef4444;
}
    [b-e1gciiiqph] #mc-options-container .btn-danger:hover {
        background: #b91c1c;
        border-color: #b91c1c;
    }

/* --- Checkbox --- */
#mc-options-container input[type="checkbox"][b-e1gciiiqph] {
    width: 1.1em;
    height: 1.1em;
    accent-color: #2563eb;
    cursor: pointer;
}

/* Label and Correct columns: use min/max width for flexibility */
[b-e1gciiiqph] #mc-options-container th.mc-label,
[b-e1gciiiqph] #mc-options-container td.mc-label {
    min-width: 2.5em;
    max-width: 4em;
    width: 5%;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
}

[b-e1gciiiqph] #mc-options-container th.mc-correct,
[b-e1gciiiqph] #mc-options-container td.mc-correct {
    min-width: 2.5em;
    max-width: 4em;
    width: 10%;
    text-align: center;
    padding-left: 0.5em;
    padding-right: 0.5em;
}
[b-e1gciiiqph] #mc-options-container th.mc-option-text,
[b-e1gciiiqph] #mc-options-container td.mc-option-text {
    min-width: 10em;
/*    max-width: 4em;*/
    width: 60%;
    text-align: center;
    padding-left: 0.5em;
    padding-right: 0.5em;
}



/* Responsive: remove fixed widths on small screens */
@media (max-width: 900px) {
    [b-e1gciiiqph] #mc-options-container th.mc-label,
    [b-e1gciiiqph] #mc-options-container td.mc-label,
    [b-e1gciiiqph] #mc-options-container th.mc-correct,
    [b-e1gciiiqph] #mc-options-container td.mc-correct {
        min-width: 0;
        max-width: 100%;
        width: auto;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
}
/* _content/TestsUI/Components/Pages/CreateQus/AddNewQuestion.razor.rz.scp.css */
/* Modernize form container and sections */
.form-container[b-gcymswfyx3] {
    display: flex;
    flex-direction: row;
    gap: 32px;
    align-items: flex-start;
    background: #fafbfc;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(60,72,88,0.07);
    padding: 24px 24px 12px 24px;
    margin-bottom: 24px;
}

.form-section[b-gcymswfyx3] {
    margin: 0;
    background: transparent;
}

.dropdown-container[b-gcymswfyx3] {
    display: flex;
    gap: 18px;
    align-items: flex-end;
}

.dropdown-container label[b-gcymswfyx3] {
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
    display: block;
}

.dropdown-container select[b-gcymswfyx3] {
    padding: 6px 12px;
    border-radius: 6px;
    border: 1px solid #d1d5db;
    background: #fff;
    font-size: 1rem;
    transition: border-color 0.2s;
}

.dropdown-container select:focus[b-gcymswfyx3] {
    border-color: #4f8cff;
    outline: none;
}

.picklist-section[b-gcymswfyx3] {
    width: 60%;
    margin: 0 0 0 24px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 4px rgba(60,72,88,0.04);
    padding: 16px;
}

/* Main Container */
.add-question-container[b-gcymswfyx3] {
    --primary-color: #2563eb;
    --primary-light: #dbeafe;
    --primary-dark: #1d4ed8;
    --success-color: #10b981;
    --warning-color: #f59e0b;
    --danger-color: #ef4444;
    --border-color: #e2e8f0;
    --text-color: #1e293b;
    --text-light: #64748b;
    --card-bg: #ffffff;
    --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); /* Reduced shadow */
    --input-bg: #f8fafc;
    --hover-bg: #f1f5f9;
    
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 98%; /* Expanded from 1200px to use more space */
    margin: 0 auto;
    padding: 1rem;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}



/* Header Styles */
.question-header[b-gcymswfyx3] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-bottom: 1rem;
}

.question-header h2[b-gcymswfyx3] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--text-color);
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.question-header .bi[b-gcymswfyx3] {
    color: var(--primary-color);
}

/* Progress Indicator */
.progress-indicator[b-gcymswfyx3] {
    display: flex;
    align-items: center;
    margin: 1rem 0;
}

.step[b-gcymswfyx3] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--text-light);
}

.step.active[b-gcymswfyx3] {
    color: var(--primary-color);
}

.step-number[b-gcymswfyx3] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background-color: var(--input-bg);
    font-weight: 600;
    transition: all 0.2s ease;
}

.step.active .step-number[b-gcymswfyx3] {
    background-color: var(--primary-color);
    color: white;
}

.step-label[b-gcymswfyx3] {
    font-weight: 500;
    font-size: 0.9rem;
}

.step-divider[b-gcymswfyx3] {
    flex-grow: 0;
    height: 2px;
    width: 2.5rem;
    background-color: var(--border-color);
    margin: 0 0.5rem;
}

/* Cards */
.form-card[b-gcymswfyx3] {
    background-color: var(--card-bg);
    border-radius: 0.5rem;
    box-shadow: var(--card-shadow);
    border: 1px solid var(--border-color);
    overflow: hidden;
}

.card-header[b-gcymswfyx3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background-color: #f8fafc;
    border-bottom: 1px solid var(--border-color);
}

.card-header h3[b-gcymswfyx3] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-color);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-header .bi[b-gcymswfyx3] {
    color: var(--primary-color);
}

.card-body[b-gcymswfyx3] {
    padding: 1.5rem;
}

/* Form Elements */
.form-grid[b-gcymswfyx3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* Slightly smaller to fit more columns */
    gap: 1.25rem;
}

.form-group[b-gcymswfyx3] {
    margin-bottom: 1.25rem;
}

.form-label[b-gcymswfyx3] {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: var(--text-color);
}

.form-select[b-gcymswfyx3] {
    width: 100%;
    padding: 0.625rem 1rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--text-color);
    background-color: var(--input-bg);
    background-clip: padding-box;
    border: 1px solid var(--border-color);
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.form-select:focus[b-gcymswfyx3] {
    border-color: var(--primary-color);
    box-shadow: none; /* Removed shadow on focus */
    outline: none;
}

.select-wrapper[b-gcymswfyx3] {
    position: relative;
}

.select-icon[b-gcymswfyx3] {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-light);
    pointer-events: none;
}

.select-placeholder[b-gcymswfyx3] {
    color: var(--text-light);
}



/* PickList Styling */
.levels-card[b-gcymswfyx3] {
    margin-top: 1rem;
}

[b-gcymswfyx3] .modern-picklist {
    border-radius: 0.375rem !important;
    border: 1px solid var(--border-color) !important;
    overflow: hidden !important;
}

[b-gcymswfyx3] .modern-picklist .rz-state-default {
    background-color: var(--input-bg) !important;
    border-color: var(--border-color) !important;
}

[b-gcymswfyx3] .modern-picklist .rz-state-hover {
    background-color: var(--hover-bg) !important;
}

[b-gcymswfyx3] .modern-picklist .rz-state-highlight {
    background-color: var(--primary-light) !important;
    color: var(--primary-dark) !important;
}

.pick-header[b-gcymswfyx3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
}

.education-level-item[b-gcymswfyx3] {
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0;
}

.level-name[b-gcymswfyx3] {
    font-weight: 500;
}

.level-term[b-gcymswfyx3] {
    font-size: 0.875rem;
    color: var(--text-light);
}

/* Editor Styling */
.editor-container[b-gcymswfyx3] {
    display: flex;
    flex-direction: column;
}

.content-editor[b-gcymswfyx3] {
    height: 300px;
    min-height: 200px;
    border: 1px solid var(--border-color);
    border-radius: 0.375rem;
    overflow: hidden;
}

.character-counter[b-gcymswfyx3] {
    align-self: flex-end;
    margin-top: 0.5rem;
    font-size: 0.875rem;
    color: var(--text-light);
}

/* Action Buttons */
.action-buttons[b-gcymswfyx3] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 1.5rem;
}

.btn[b-gcymswfyx3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.25rem;
    font-weight: 500;
    font-size: 0.9375rem;
    line-height: 1.5;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 0.375rem;
    transition: all 0.15s ease-in-out;
}

.btn-primary[b-gcymswfyx3] {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-primary:hover[b-gcymswfyx3] {
    background-color: var(--primary-dark);
}

.btn-secondary[b-gcymswfyx3] {
    color: var(--text-color);
    background-color: #f1f5f9;
    border-color: #e2e8f0;
}

.btn-secondary:hover[b-gcymswfyx3] {
    background-color: #e2e8f0;
}

/* Validation Message */
.validation-message[b-gcymswfyx3] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--danger-color);
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* Toolbar improvements */
.ql-toolbar[b-gcymswfyx3] {
    border-radius: 8px 8px 0 0 !important;
    background: #f4f6fa !important;
    border: 1.5px solid #d1d5db !important;
    border-bottom: none !important;
}

[b-gcymswfyx3] .ql-toolbar {
    background-color: #f8fafc !important;
    border-color: var(--border-color) !important;
    border-top-left-radius: 0.375rem !important;
    border-top-right-radius: 0.375rem !important;
}

[b-gcymswfyx3] .ql-container {
    font-size: 1rem !important;
    border-color: var(--border-color) !important;
    border-bottom-left-radius: 0.375rem !important;
    border-bottom-right-radius: 0.375rem !important;
}

/* Formula Editor Enhancements */
[b-gcymswfyx3] .ql-tooltip[data-mode="formula"] {
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 9999 !important;
    width: auto !important;
    min-width: 320px !important;
    max-width: 90vw !important;
    max-height: 90vh !important;
    overflow-y: visible !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important; /* Reduced shadow */
    background-color: white !important;
    padding: 1rem !important;
    border-radius: 0.5rem !important;
    border: 1px solid var(--border-color) !important;
}

/* Responsive adjustments */
@media (max-width: 900px) {
    .form-container[b-gcymswfyx3] {
        flex-direction: column;
        gap: 16px;
        padding: 12px;
    }
    .picklist-section[b-gcymswfyx3] {
        width: 100%;
        margin-left: 0;
        padding: 8px;
    }
}

/* Wider container on larger screens */
@media (min-width: 1600px) {
    .add-question-container[b-gcymswfyx3] {
        max-width: 99%; /* Use even more space on large screens */
    }
}

@media (max-width: 768px) {
    .form-grid[b-gcymswfyx3] {
        grid-template-columns: 1fr;
    }
    
    .action-buttons[b-gcymswfyx3] {
        flex-direction: column-reverse;
        gap: 0.75rem;
    }
    
    .btn[b-gcymswfyx3] {
        width: 100%;
        justify-content: center;
    }
    
    .card-header[b-gcymswfyx3] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .add-question-container[b-gcymswfyx3] {
        padding: 0.75rem;
    }
}

/* Make sure any CKEditor content is properly styled */
[b-gcymswfyx3] .ck-editor__editable {
    min-height: 300px;
}

[b-gcymswfyx3] .ck-toolbar {
    border-top-left-radius: 0.375rem !important;
    border-top-right-radius: 0.375rem !important;
}

/* For debugging purposes - to be removed in production */
.debug-border[b-gcymswfyx3] {
    border: 2px dashed red !important;
    background-color: rgba(255, 0, 0, 0.1) !important;
    padding: 0.5rem !important;
    border-radius: 0.375rem !important;
    position: relative;
}

.debug-border[b-gcymswfyx3]::after {
    content: "DEBUG MODE" !important;
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background-color: rgba(255, 0, 0, 0.8) !important;
    color: white !important;
    padding: 0.25rem 0.5rem !important;
    border-radius: 0.375rem !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.05rem !important;
    text-transform: uppercase !important;
    z-index: 9999 !important;
}

/* Custom scrollbar for Webkit browsers */
[b-gcymswfyx3]::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[b-gcymswfyx3]::-webkit-scrollbar-track {
    background: var(--input-bg);
    border-radius: 0.375rem;
}

[b-gcymswfyx3]::-webkit-scrollbar-thumb {
    background-color: var(--primary-color);
    border-radius: 0.375rem;
}

[b-gcymswfyx3]::-webkit-scrollbar-thumb:hover {
    background-color: var(--primary-dark);
}

/* Stronger override for Radzen/Bootstrap select shadow */
.add-question-container .form-select[b-gcymswfyx3],
.add-question-container select[b-gcymswfyx3],
.add-question-container .select-wrapper[b-gcymswfyx3] {
    box-shadow: none !important;
    background: #f9fafb !important;
    border: 1px solid #e3e6ea !important;
    border-radius: 0.375rem !important; /* Restore rounded corners */
}
/* _content/TestsUI/Components/Pages/CreateQus/AddSolution.razor.rz.scp.css */
.editing[b-mubqraffde] {
    background-color: #fff3cd;
}
/* for the editor */
/* Override styles for active toolbar buttons */
.ql-toolbar .ql-active[b-mubqraffde] {
    background-color: green !important;
    color: red !important;
}

/*need to set these css properties so when click on the bottom of the editor with the math function pop up open it can close*/
body[b-mubqraffde], html[b-mubqraffde] {
    margin: 0;
    padding: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#editor[b-mubqraffde] {
    height: 300px;
    border: 1px solid #ccc;
}
/*this is to allow the formula pop uop fro the math to show over the razeb steos control. without thisn override it will be cut off on the edges and wont display*/

.rz-steps .rz-widget-content[b-mubqraffde] {
    overflow-x: visible !important;
    overflow-y: visible !important;
}
/*to allow the math popup to overlay other elements witout them "peeking thru"*/

.ql-snow .ql-tooltip[b-mubqraffde] {
    z-index: 99999;
}
/* _content/TestsUI/Components/Pages/CreateQus/ReviewQuAnsSol.razor.rz.scp.css */
/* Modern label styling */
label[b-l9nt4h5s8b] {
    display: block;
    margin-bottom: 1rem;
    margin-top: 2rem;
    font-weight: 700;
    font-size: 1.18rem;
    color: #222;
    letter-spacing: 0.01em;
}

/* Container */
.quill-processor-container[b-l9nt4h5s8b] {
    width: 100%;
    margin: 40px 0 0 0;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 4px 24px 0 rgba(60,72,88,0.10);
    padding: 44px 3vw 36px 3vw;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* Content display areas */
 .content-display[b-l9nt4h5s8b],
#answer-content[b-l9nt4h5s8b],
#solution-content[b-l9nt4h5s8b] {
    margin: 1rem 0 2.2rem 0;
    padding: 32px 28px;
    border: 1.5px solid #e0e0e0;
    border-radius: 14px;
    background: #fafbfc;
    font-size: 1.12rem;
    min-height: 64px;
    box-shadow: 0 2px 8px rgba(60,72,88,0.06);
    word-break: break-word;
    transition: box-shadow 0.2s, border-color 0.2s;
    position: relative;
}

/* Modern empty state */
.content-display:empty[b-l9nt4h5s8b]::before,
#answer-content:empty[b-l9nt4h5s8b]::before,
#solution-content:empty[b-l9nt4h5s8b]::before {
    content: "None provided";
    color: #b0b8c1;
    font-style: italic;
    font-size: 1.12rem;
    letter-spacing: 0.01em;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    width: 100%;
    text-align: center;
    background: none;
    border-radius: 10px;
    margin: 0;
    padding: 0;
}

/* Focus effect */
.content-display:focus-within[b-l9nt4h5s8b],
#answer-content:focus-within[b-l9nt4h5s8b],
#solution-content:focus-within[b-l9nt4h5s8b] {
    box-shadow: 0 2px 16px rgba(39, 174, 96, 0.10);
    border-color: #27ae60;
}

/* Table styling */
#answer-content table[b-l9nt4h5s8b] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(60,72,88,0.08);
    margin-top: 0.5rem;
}

#answer-content th[b-l9nt4h5s8b], #answer-content td[b-l9nt4h5s8b] {
    padding: 16px 18px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 1.05rem;
    vertical-align: middle;
}

#answer-content th[b-l9nt4h5s8b] {
    background: #f7f9fa;
    font-weight: 700;
    color: #222;
    font-size: 1.08rem;
    letter-spacing: 0.01em;
}

#answer-content tr:last-child td[b-l9nt4h5s8b] {
    border-bottom: none;
}

#answer-content tr:hover td[b-l9nt4h5s8b] {
    background: #f3f7fa;
    transition: background 0.2s;
}

/* Green check mark for correct answer */
.correct-answer-tick[b-l9nt4h5s8b] {
    color: #27ae60;
    font-weight: bold;
    font-size: 1.25em;
    margin-left: 0.5em;
    vertical-align: middle;
    display: inline-block;
    line-height: 1;
}

#answer-content td .correct-answer-tick[b-l9nt4h5s8b] {
    display: block;
    margin-left: 0;
    margin-top: 0.25em;
    color: #27ae60;
    font-size: 1.3em;
    font-weight: bold;
    text-align: left;
}

/* Modern label above answer table */
.answer-table-label[b-l9nt4h5s8b] {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 1.08rem;
    color: #222;
    background: #f7f9fa;
    border-radius: 8px 8px 0 0;
    padding: 0.75rem 1.2rem 0.75rem 1.1rem;
    margin-bottom: 0;
    margin-top: 0.2rem;
    border-bottom: 1px solid #e0e0e0;
    gap: 0.6em;
    letter-spacing: 0.01em;
}

.answer-table-check[b-l9nt4h5s8b] {
    color: #27ae60;
    font-size: 1.25em;
    font-weight: bold;
    margin-right: 0.4em;
    vertical-align: middle;
    display: inline-block;
    line-height: 1;
}

/* Scoped styles for deep selectors */
[b-l9nt4h5s8b] .correct-answer-tick {
    color: #27ae60;
    font-weight: bold;
    font-size: 1.25em;
    margin-left: 0.5em;
    vertical-align: middle;
    display: inline-block;
    line-height: 1;
}

[b-l9nt4h5s8b] #answer-content td .correct-answer-tick {
    display: block;
    margin-left: 0;
    margin-top: 0.25em;
    color: #27ae60;
    font-size: 1.3em;
    font-weight: bold;
    text-align: left;
}

[b-l9nt4h5s8b] .answer-table-label {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 1.08rem;
    color: #222;
    background: #f7f9fa;
    border-radius: 8px 8px 0 0;
    padding: 0.75rem 1.2rem 0.75rem 1.1rem;
    margin-bottom: 0;
    margin-top: 0.2rem;
    border-bottom: 1px solid #e0e0e0;
    gap: 0.6em;
    letter-spacing: 0.01em;
}

[b-l9nt4h5s8b] .answer-table-check {
    color: #27ae60;
    font-size: 1.25em;
    font-weight: bold;
    margin-right: 0.4em;
    vertical-align: middle;
    display: inline-block;
    line-height: 1;
}

[b-l9nt4h5s8b] .mc-label, 
[b-l9nt4h5s8b] #answer-content td.mc-label {
    text-align: center !important;
    vertical-align: middle !important;
}

[b-l9nt4h5s8b] #answer-content td.mc-label {
    min-width: 56px; /* Prevents squishing on small screens */
    width: 64px;
    max-width: 80px;
    word-break: break-word;
}

/* Center label and checkmark, allow flexible width */
[b-l9nt4h5s8b] .mc-label,
[b-l9nt4h5s8b] #answer-content td.mc-label,
[b-l9nt4h5s8b] #answer-content td:first-child {
    text-align: center !important;
    vertical-align: middle !important;
    min-width: 3.5em;
    max-width: 7em;
    width: 1%;
    white-space: nowrap;
    word-break: normal;
}

/* Prevent label header from wrapping */
[b-l9nt4h5s8b] #answer-content th.mc-label,
[b-l9nt4h5s8b] #answer-content th:first-child {
    text-align: center !important;
    white-space: nowrap;
}

/* Responsive adjustments */
@media (max-width: 900px) {
    .quill-processor-container[b-l9nt4h5s8b] {
        max-width: 98vw;
        padding: 18px 4vw 18px 4vw;
        gap: 18px;
    }
    .content-display[b-l9nt4h5s8b],
    #answer-content[b-l9nt4h5s8b],
    #solution-content[b-l9nt4h5s8b] {
        padding: 14px 8px;
        font-size: 1rem;
        margin: 0.5rem 0 1.2rem 0;
    }
    label[b-l9nt4h5s8b] {
        margin-top: 0.75rem;
        margin-bottom: 0.5rem;
        font-size: 1rem;
    }
    [b-l9nt4h5s8b] #answer-content table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    [b-l9nt4h5s8b] #answer-content th, 
    [b-l9nt4h5s8b] #answer-content td {
        min-width: 7em;
        font-size: 0.98rem;
        padding: 0.7em 0.5em;
    }
    [b-l9nt4h5s8b] #answer-content td.mc-label,
    [b-l9nt4h5s8b] #answer-content td:first-child {
        min-width: 4em;
        max-width: 8em;
        font-size: 1.05rem;
        white-space: nowrap;
    }
}

/* Hide hidden editor */
#hidden-editor[b-l9nt4h5s8b] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Buttons and form controls remain as is, but you can modernize further if desired */
button.btn[b-l9nt4h5s8b] {
    min-width: 120px;
    font-weight: 500;
    border-radius: 6px;
    padding: 10px 22px;
    font-size: 1rem;
    box-shadow: 0 1px 2px rgba(60,72,88,0.04);
    transition: background 0.2s, color 0.2s;
}

.mb-3[b-l9nt4h5s8b] {
    margin-bottom: 2rem !important;
}

.d-flex.gap-2.mt-3[b-l9nt4h5s8b] {
    gap: 20px;
    margin-top: 32px;
}
/* _content/TestsUI/Components/Pages/CreateQus/TrueFalseAnswer.razor.rz.scp.css */
/* Modern, spacious, responsive True/False table styles */
.true-false-setup[b-jx4950mros] {
    margin: 2.5rem 0 2rem 0;
    display: flex;
    justify-content: center;
}

.true-false-setup table[b-jx4950mros] {
    width: 100%;
    max-width: 900px;
    background: #f8fafc !important;
    border-radius: 12px !important;
    box-shadow: 0 3px 15px rgba(60,72,88,0.1) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden;
    font-size: 1.08rem;
    border: none !important;
    margin-bottom: 2rem;
}

.true-false-setup th[b-jx4950mros],
.true-false-setup td[b-jx4950mros] {
    padding: 1.2em 1.4em !important;
    text-align: center !important;
    border-bottom: 1px solid #e5e7eb !important;
    font-size: 1.05em;
}

/* More specific selector to override Bootstrap */
    .true-false-setup table thead tr[b-jx4950mros] {
        background-color: #3b82f6 !important; /* Modern blue background */
        color: white !important;
        border-radius: 10px 10px 0 0 !important;
    }

    /* More specific selector for th elements */
    .true-false-setup table thead tr th[b-jx4950mros] {
        font-weight: 600 !important;
        letter-spacing: 0.02em;
        padding: 1.2em 1.4em !important;
        color: white !important;
        border-bottom: none !important;
        background-color: transparent !important; /* Ensure transparent background so tr color shows */
    }

  
}

.true-false-setup tbody tr:hover td[b-jx4950mros] {
    background-color: #e0f2fe !important;
    transition: background 0.2s;
}

.true-false-setup input[type="radio"][b-jx4950mros] {
    width: 1.4em;
    height: 1.4em;
    accent-color: #2563eb;
    cursor: pointer;
    margin: 0;
}

/* Responsive for small screens */
@media (max-width: 900px) {
    .true-false-setup table[b-jx4950mros],
    .true-false-setup thead[b-jx4950mros],
    .true-false-setup tbody[b-jx4950mros],
    .true-false-setup th[b-jx4950mros],
    .true-false-setup td[b-jx4950mros],
    .true-false-setup tr[b-jx4950mros] {
        display: block;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    
    .true-false-setup thead[b-jx4950mros] {
        display: none;
    }
    
    .true-false-setup tr[b-jx4950mros] {
        margin-bottom: 14px;
        border-radius: 10px;
        box-shadow: 0 1px 8px rgba(60,72,88,0.1);
        background: #fff;
        padding: 8px 0;
    }
    
    .true-false-setup td[b-jx4950mros] {
        text-align: left !important;
        padding: 12px 18px !important;
        border-bottom: none !important;
        position: relative;
    }
    
    .true-false-setup td[b-jx4950mros]:before {
        content: attr(data-label);
        font-weight: 600;
        color: #64748b;
        display: block;
        margin-bottom: 6px;
        font-size: 0.97em;
    }
}
/* _content/TestsUI/Components/Pages/CreateQus/UploadQusSequence.razor.rz.scp.css */
h3[b-a1synjpqbt] {
    font-size: 2.2rem;
    font-weight: 800;
    margin-top: 2.5rem;
    margin-bottom: 2rem;
    letter-spacing: 0.01em;
    line-height: 1.2;
    color: #23272f;
}
/* _content/TestsUI/Components/Pages/ManageExam/DuplicateQuestionDialog.razor.rz.scp.css */
/* Main dialog container */
.dialog[b-0llp38ptv5] {
    background: #fff;
    padding: 1.5rem;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    max-width: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    max-height: 90vh;
}

/* Dialog header with improved styling */
.dialog-header[b-0llp38ptv5] {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
   /* border-bottom: 2px solid #2563eb;*/
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
}

.dialog-header h5[b-0llp38ptv5] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
    letter-spacing: -0.02em;
}

.dialog-header[b-0llp38ptv5]::after {
    content: "Duplicate Question";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.75rem;
    font-weight: 700;
    color: #1e293b;
    background: linear-gradient(90deg, #3b82f6 0%, #10b981 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Dialog content */
.dialog-content[b-0llp38ptv5] {
    flex: 1;
    overflow-y: auto;
    padding: 0.5rem 0;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 #f1f5f9;
}

.dialog-content[b-0llp38ptv5]::-webkit-scrollbar {
    width: 6px;
}

.dialog-content[b-0llp38ptv5]::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 8px;
}

.dialog-content[b-0llp38ptv5]::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 8px;
}

/* Loading spinner */
.text-center .spinner-border[b-0llp38ptv5] {
    color: #2563eb;
    margin-bottom: 0.75rem;
}

/* Enhanced Section headers */
.section-header[b-0llp38ptv5] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #1e293b;
    display: flex;
    align-items: center;
    padding: 0.75rem 1rem;
    border-bottom: none;
    background: linear-gradient(90deg, #f0f9ff 0%, #f8fafc 100%);
    border-radius: 8px 8px 0 0;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

/* Content sections */
.question-section[b-0llp38ptv5],
.options-section[b-0llp38ptv5],
.explanation-section[b-0llp38ptv5] {
    margin-bottom: 1.5rem;
    padding: 0;
    background: #fff;
    border-radius: 8px;
    transition: all 0.2s ease;
    border: 1px solid #e2e8f0;
    overflow: hidden;
}

.question-section:hover[b-0llp38ptv5],
.options-section:hover[b-0llp38ptv5],
.explanation-section:hover[b-0llp38ptv5] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.question-section > div:not(.section-header)[b-0llp38ptv5],
.options-section > div:not(.section-header)[b-0llp38ptv5],
.explanation-section > div:not(.section-header)[b-0llp38ptv5] {
    padding: 1rem;
}

/* Math containers */
.math-container[b-0llp38ptv5] {
    padding: 0.75rem;
    background: #f8fafc;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    margin-bottom: 0.5rem;
}

.math-field[b-0llp38ptv5] {
    min-height: 2rem;
}

/* Question details */
.question-details[b-0llp38ptv5] {
    background: #f8fafc;
    border-radius: 8px;
    padding: 1rem;
    border: 1px solid #e2e8f0;
}

/* Edit fields layout */
.edit-fields-row[b-0llp38ptv5] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
    margin-top: 0.5rem;
}

.edit-field[b-0llp38ptv5] {
    display: flex;
    align-items: center;
}

.edit-field label[b-0llp38ptv5] {
    font-weight: 500;
    color: #475569;
    margin-right: 0.5rem;
    white-space: nowrap;
}

/* Answer table styling */
.answer-table[b-0llp38ptv5] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
}

.answer-table th[b-0llp38ptv5],
.answer-table td[b-0llp38ptv5] {
    padding: 0.75rem 1rem;
    text-align: left;
    border-bottom: 1px solid #e2e8f0;
    vertical-align: middle;
}

.answer-table tr:last-child td[b-0llp38ptv5] {
    border-bottom: none;
}

.answer-table tr[b-0llp38ptv5] {
    transition: background-color 0.2s ease;
    position: relative;
}

/* Highlight row with correct answer */
.answer-table tr.correct-answer[b-0llp38ptv5] {
    background-color: rgba(16, 185, 129, 0.05);
}

.answer-table tr:hover[b-0llp38ptv5] {
    background-color: #f1f5f9;
}

/* Answer columns layout */
.label-column[b-0llp38ptv5] {
    width: 60px;
    font-weight: 600;
    color: #475569;
    position: relative;
}

/* New style for correct answer label */
.label-column.correct[b-0llp38ptv5]::before {
    content: "?";
    position: absolute;
    left: -6px;
    top: 50%;
    transform: translateY(-50%);
    color: #10b981;
    font-size: 1.1rem;
    font-weight: bold;
    background-color: #d1fae5;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #10b981;
    box-shadow: 0 2px 4px rgba(16, 185, 129, 0.2);
}

.answer-column[b-0llp38ptv5] {
    width: auto;
}

/* Redesigned correct column */
.correct-column[b-0llp38ptv5] {
    width: 60px;
    text-align: center;
}

/* Improved green check */
.green-check[b-0llp38ptv5] {
    color: white;
    font-size: 1rem;
    font-weight: bold;
    background-color: #10b981;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    animation: pulse-green-b-0llp38ptv5 2s infinite;
}

@keyframes pulse-green-b-0llp38ptv5 {
    0% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4);
    }
    70% {
        box-shadow: 0 0 0 8px rgba(16, 185, 129, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
    }
}

/* Icon buttons */
.btn-icon[b-0llp38ptv5] {
    padding: 0.35rem;
    background: transparent;
    border: none;
    cursor: pointer;
    line-height: 1;
    border-radius: 50%;
    color: #64748b;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-icon:hover[b-0llp38ptv5] {
    background-color: #e2e8f0;
    color: #2563eb;
}

.btn-icon i[b-0llp38ptv5] {
    font-size: 0.875rem;
}

/* Dialog buttons */
.dialog-buttons[b-0llp38ptv5] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid #e2e8f0;
    gap: 0.75rem;
}

/* Button styles */
.btn[b-0llp38ptv5] {
    border-radius: 6px;
    padding: 0.5rem 1.25rem;
    font-weight: 500;
    transition: all 0.2s ease;
}

.btn-success[b-0llp38ptv5] {
    background-color: #10b981;
    color: white;
    border: none;
}

.btn-success:hover:not([disabled])[b-0llp38ptv5] {
    background-color: #059669;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.btn-secondary[b-0llp38ptv5] {
    background-color: #f1f5f9;
    color: #334155;
    border: 1px solid #cbd5e1;
}

.btn-secondary:hover:not([disabled])[b-0llp38ptv5] {
    background-color: #e2e8f0;
    color: #1e293b;
}

.btn:disabled[b-0llp38ptv5] {
    opacity: 0.65;
    cursor: not-allowed;
}

.btn-sm[b-0llp38ptv5] {
    padding: 0.3rem 0.75rem;
    font-size: 0.875rem;
}

/* Input fields styling */
.form-control[b-0llp38ptv5] {
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    padding: 0.4rem 0.75rem;
    transition: all 0.2s ease;
}

.form-control:focus[b-0llp38ptv5] {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
    outline: none;
}

.form-control-sm[b-0llp38ptv5] {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

/* Validation styling */
.is-invalid[b-0llp38ptv5] {
    border-color: #dc3545;
    padding-right: calc(1.5em + .75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

.invalid-feedback[b-0llp38ptv5] {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 80%;
    color: #dc3545;
}

.invalid-feedback.d-block[b-0llp38ptv5] {
    display: block;
}

.alert-danger[b-0llp38ptv5] {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    position: relative;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    font-size: 0.875rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .dialog[b-0llp38ptv5] {
        padding: 1rem;
        border-radius: 8px;
    }
    
    .edit-fields-row[b-0llp38ptv5] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
    
    .edit-field[b-0llp38ptv5] {
        width: 100%;
        justify-content: space-between;
    }
    
    .dialog-buttons[b-0llp38ptv5] {
        flex-direction: column-reverse;
        width: 100%;
    }
    
    .dialog-buttons .btn[b-0llp38ptv5] {
        width: 100%;
        margin-bottom: 0.5rem;
    }
    
    .section-header[b-0llp38ptv5] {
        font-size: 1.1rem;
        padding: 0.6rem 0.8rem;
    }
    
    .answer-table th[b-0llp38ptv5],
    .answer-table td[b-0llp38ptv5] {
        padding: 0.5rem;
    }
    
    .dialog-header[b-0llp38ptv5]::after {
        font-size: 1.5rem;
    }
}

/* Highlight the correct answer column header */
.answer-table th.correct-column[b-0llp38ptv5] {
    color: #2196f3;
    font-weight: 600;
    text-align: center;
    background: #e3f2fd;
    border-left: 2px solid #bbdefb;
}

/* Center and highlight the correct answer cell */
.answer-table td.correct-column[b-0llp38ptv5] {
    text-align: center;
    background: #f5faff;
    border-left: 2px solid #e3f2fd;
}

/* Center the content of the correct answer column */
.answer-table td.correct-column[b-0llp38ptv5],
.answer-table th.correct-column[b-0llp38ptv5] {
    text-align: center;
    vertical-align: middle;
}

.answer-table td.correct-column .d-flex[b-0llp38ptv5],
.answer-table td.correct-column .d-flex.align-items-center[b-0llp38ptv5] {
    justify-content: center;
    align-items: center;
    display: flex;
    height: 100%;
    min-height: 40px; /* adjust as needed for vertical centering */
}

/* Optional: Center the radio/checkbox inside the flex container */
.answer-table td.correct-column .d-flex[b-0llp38ptv5] {
    justify-content: center;
    align-items: center;
}

/* Optional: style the info icon */
.correct-help-icon[b-0llp38ptv5] {
    font-size: 1rem;
    color: #2196f3;
    margin-left: 0.25rem;
    cursor: help;
    vertical-align: middle;
}

/* Small screens */
@media (max-width: 480px) {
    .dialog[b-0llp38ptv5] {
        padding: 0.75rem;
    }
    
    .question-section > div:not(.section-header)[b-0llp38ptv5],
    .options-section > div:not(.section-header)[b-0llp38ptv5],
    .explanation-section > div:not(.section-header)[b-0llp38ptv5] {
        padding: 0.75rem;
    }
    
    .question-details[b-0llp38ptv5] {
        padding: 0.75rem;
    }
    
    .btn-icon[b-0llp38ptv5] {
        padding: 0.25rem;
    }
    
    .green-check[b-0llp38ptv5] {
        width: 24px;
        height: 24px;
    }
}
/* _content/TestsUI/Components/Pages/ManageExam/EditQuestionDialog.razor.rz.scp.css */
.dialog-header[b-168v7t6pe7] {
    margin-bottom: 15px;
}

.overlay[b-168v7t6pe7] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* Grey transparent background */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.dialog[b-168v7t6pe7] {
    background: white; /* White pop-up background */
    padding: 20px;
    border-radius: 5px;
    min-width: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    max-height: 80vh;
    height: 70vh;
    display: flex;
    flex-direction: column;
}

.dialog-buttons[b-168v7t6pe7] {
    text-align: right;
}

.validation-message[b-168v7t6pe7] {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* for the editor */
.ql-toolbar .ql-active[b-168v7t6pe7] {
    background-color: green !important;
    color: red !important;
}

body[b-168v7t6pe7], html[b-168v7t6pe7] {
    margin: 0;
    padding: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#editor[b-168v7t6pe7] {
    height: 80%; /* 60% of the dialog's height */
    min-height: 200px; /* Optional: set a minimum height */
    border: 1px solid #ccc;
    flex: 1 1 auto; /* Allow it to grow/shrink if needed */
}


.rz-steps .rz-widget-content[b-168v7t6pe7] {
    overflow-x: visible !important;
    overflow-y: visible !important;
}

.ql-snow .ql-tooltip[b-168v7t6pe7] {
    z-index: 99999;
}

/* Formula Editor Centering Fix */
.ql-tooltip[data-mode="formula"][b-168v7t6pe7] {
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 9999 !important;
    width: auto !important;
    min-width: 320px !important;
    max-width: 90vw !important;
    max-height: 90vh !important;
    overflow-y: visible !important; /* Change from auto to visible */
    box-shadow: 0 5px 10px rgba(0,0,0,0.2) !important;
    background-color: white !important;
    padding: 10px !important;
    border-radius: 4px !important;
}


/* Better input field */
/* .ql-tooltip[data-mode="formula"] input[type=text].mathquill4quill-latex-input {
    width: 100% !important;
    padding: 8px !important;
    margin: 8px 0 !important;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    } */

/* Operator buttons */
.mathquill4quill-operator-container[b-168v7t6pe7] {
    max-height: 60vh;
    overflow-y: auto;
    padding: 0 5px;
}

/* Category styling */
.mathquill4quill-operator-category[b-168v7t6pe7] {
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 5px;
    color: #555;
}

/* Button container */
.mathquill4quill-button-container[b-168v7t6pe7] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

/* Individual buttons */
.mathquill4quill-operator-button[b-168v7t6pe7] {
    margin: 3px !important;
    background: #f5f5f5 !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
    transition: all 0.2s ease !important;
}

    .mathquill4quill-operator-button:hover[b-168v7t6pe7] {
        background: #e9e9e9 !important;
    }
/* _content/TestsUI/Components/Pages/ManageExam/EditTemplateDialog.razor.rz.scp.css */
[b-oolihkvm3h] .rz-card {
    max-width: 100%;
    overflow: hidden;
}

[b-oolihkvm3h] .rz-textbox,
[b-oolihkvm3h] .rz-numeric-input {
    width: 100%;
}

[b-oolihkvm3h] .rz-grid-table {
    min-width: 500px;
}

[b-oolihkvm3h] .rz-button {
    margin-left: 0.5rem;
}

[b-oolihkvm3h] .rz-required {
    color: var(--rz-danger);
}
/* _content/TestsUI/Components/Pages/ManageExam/ManageExam.razor.rz.scp.css */
/* === Main Layout === */
.manage-exam-container[b-170p45ohhb] {
    --primary-color: #3498db;
    --success-color: #2ecc71;
    --danger-color: #e74c3c;
    --warning-color: #f39c12;
    --info-color: #3498db;
    --light-bg: #f8f9fa;
    --card-bg: #ffffff;
    --border-color: #e0e0e0;
    --text-color: #333333;
    --text-muted: #6c757d;
    --shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
    --radius: 0.5rem;
    --transition: all 0.2s ease-in-out;
    
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    /* Increase max width and use percentage for more responsive sizing */
    max-width: 92%; 
    margin: 0 auto;
    padding: 1rem;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Add a minimum width to prevent it from being too narrow on very large screens */
@media (min-width: 1800px) {
    .manage-exam-container[b-170p45ohhb] {
        max-width: 1650px;
    }
}

/* For medium-sized screens, use more of the available width */
@media (min-width: 992px) and (max-width: 1799px) {
    .manage-exam-container[b-170p45ohhb] {
        max-width: 95%;
    }
}

/* For smaller screens, use nearly all available width */
@media (max-width: 991px) {
    .manage-exam-container[b-170p45ohhb] {
        max-width: 98%;
        padding: 0.75rem;
    }
}

/* === Header === */
.exam-header[b-170p45ohhb] {
    background: var(--card-bg);
    border-radius: var(--radius);
    padding: 1.25rem;
    box-shadow: var(--shadow);
    margin-bottom: 1rem;
}

.header-content[b-170p45ohhb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.exam-header h1[b-170p45ohhb] {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 600;
    color: var(--text-color);
    display: flex;
    align-items: center;
}

.exam-header h1 .bi[b-170p45ohhb] {
    margin-right: 0.75rem;
    color: var(--primary-color);
}

.status-indicator[b-170p45ohhb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius);
    font-weight: 500;
    font-size: 0.9rem;
    transition: var(--transition);
}

.status-viewing[b-170p45ohhb] {
    background-color: #e3f2fd;
    color: #0d6efd;
}

.status-editing[b-170p45ohhb] {
    background-color: #fff3cd;
    color: #ffc107;
}

/* === Cards === */
.card[b-170p45ohhb] {
    background: var(--card-bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    overflow: hidden;
    border: 1px solid var(--border-color);
}

.card-header[b-170p45ohhb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem;
    background-color: rgba(0, 0, 0, 0.02);
    border-bottom: 1px solid var(--border-color);
    flex-wrap: wrap;
    gap: 1rem;
}

.card-header h2[b-170p45ohhb] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--text-color);
    display: flex;
    align-items: center;
}

.card-header h2 .bi[b-170p45ohhb] {
    margin-right: 0.75rem;
    color: var(--primary-color);
}

.card-body[b-170p45ohhb] {
    padding: 1.25rem; /* Reduced from 1.5rem */
}

/* === Form Elements === */
.form-grid[b-170p45ohhb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); /* Adjust minimum size */
    gap: 1.25rem; /* Slightly reduced gap */
}

.form-grid-column[b-170p45ohhb] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.form-group[b-170p45ohhb] {
    margin-bottom: 1rem; /* Slightly reduced */
}

.form-label[b-170p45ohhb] {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: var(--text-color);
    min-width: 140px; /* Reduced from 150px */
}

.input-container[b-170p45ohhb] {
    display: flex;
    align-items: center;
}

.form-control[b-170p45ohhb] {
    width: 100%;
    padding: 0.5rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--text-color);
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid var(--border-color);
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-control:focus[b-170p45ohhb] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(52, 152, 219, 0.25);
    outline: 0;
}

.form-control:disabled[b-170p45ohhb], .form-control[readonly][b-170p45ohhb], .form-control-plaintext[b-170p45ohhb] {
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    opacity: 0.8;
}

.form-check-input[b-170p45ohhb] {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.5rem;
    cursor: pointer;
}

.switch-container[b-170p45ohhb] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* === Action Buttons === */
.action-buttons[b-170p45ohhb] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.btn[b-170p45ohhb] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    transition: var(--transition);
}

.btn-primary[b-170p45ohhb] {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.btn-primary:hover[b-170p45ohhb] {
    background-color: #2980b9;
}

.btn-success[b-170p45ohhb] {
    color: #fff;
    background-color: var(--success-color);
    border-color: var(--success-color);
}

.btn-success:hover[b-170p45ohhb] {
    background-color: #27ae60;
}

.btn-secondary[b-170p45ohhb] {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d;
}

.btn-secondary:hover[b-170p45ohhb] {
    background-color: #5a6268;
}

.btn-info[b-170p45ohhb] {
    color: #fff;
    background-color: var(--info-color);
    border-color: var(--info-color);
}

.btn-info:hover[b-170p45ohhb] {
    background-color: #2980b9;
}

.btn-danger[b-170p45ohhb] {
    color: #fff;
    background-color: var(--danger-color);
    border-color: var(--danger-color);
}

.btn-danger:hover[b-170p45ohhb] {
    background-color: #c0392b;
}

.btn .bi[b-170p45ohhb] {
    font-size: 1rem;
}

/* === Summary Section === */
.exam-summary[b-170p45ohhb] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--border-color);
}

.highlight-value[b-170p45ohhb] {
    font-weight: 600;
    font-size: 1.1rem;
    color: var(--primary-color);
}

/* === Questions Section === */
.questions-card[b-170p45ohhb] {
    margin-top: 1.5rem;
    overflow: visible;
    width: 100%; /* Ensure full width */
}

/* Optimize the questions container within the Qus component */
[b-170p45ohhb] .questions-container {
    padding: 1rem; /* Reduce padding from 20px */
}

/* More efficient layout for small screens */
@media (max-width: 576px) {
    .manage-exam-container[b-170p45ohhb] {
        padding: 0.375rem; /* Further reduce padding on small screens */
    }
    
    .card-body[b-170p45ohhb] {
        padding: 1rem; /* Even smaller padding on mobile */
    }
    
    [b-170p45ohhb] .questions-container {
        padding: 0.5rem; /* Minimal padding on mobile */
    }
}

/* === Responsive Design === */
@media (max-width: 768px) {
    .header-content[b-170p45ohhb] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .card-header[b-170p45ohhb] {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .action-buttons[b-170p45ohhb] {
        width: 100%;
        justify-content: flex-start;
        margin-top: 1rem;
    }
    
    .form-grid[b-170p45ohhb] {
        grid-template-columns: 1fr;
    }
}

/* Override ::deep rules to be more space efficient */
[b-170p45ohhb] .col-md-6 {
    padding: 0 0.75rem; /* Reduced from 1rem */
}

[b-170p45ohhb] .form-label {
    min-width: 140px; /* Reduced from 150px */
}

/* Make the form label arrangement more responsive */
@media (max-width: 768px) {
    [b-170p45ohhb] .form-group {
        flex-direction: column;
        align-items: flex-start;
    }
    
    [b-170p45ohhb] .form-label {
        min-width: auto;
        width: 100%;
        margin-bottom: 0.25rem;
    }
    
    [b-170p45ohhb] .input-container,
    [b-170p45ohhb] .input-group {
        width: 100%;
    }
}

/* === Validation Styles === */
.validation-message[b-170p45ohhb] {
    color: var(--danger-color);
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* === Date/Time Input Styles === */
input[type="date"].form-control[b-170p45ohhb],
input[type="time"].form-control[b-170p45ohhb] {
    min-width: auto;
    width: 100%;
}

input[type="date"].no-validation-date[b-170p45ohhb],
input[type="date"].no-validation-date.invalid[b-170p45ohhb] {
    border-color: var(--border-color) !important;
    box-shadow: none !important;
    background-image: none !important;
}

    /* Exam Details Section */
[b-170p45ohhb] .exam-details-section {
    padding: 1.5rem;
    background: #fff;
    border-radius: 0.5rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    margin-bottom: 1.5rem;
}

/* Section Headers */
[b-170p45ohhb] .section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e9ecef;
}

/* Form Layout */
[b-170p45ohhb] .form-group {
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-170p45ohhb] .form-label {
    min-width: 140px; /* Reduced from 150px */
    margin-bottom: 0;
    font-weight: 500;
    color: #495057;
}

/* Read-only and Disabled States */
[b-170p45ohhb] .form-control:disabled,
[b-170p45ohhb] .form-control[readonly],
[b-170p45ohhb] .form-control-plaintext {
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 0.375rem;
    padding: 0.375rem 0.75rem;
    opacity: 0.8;
}

/* Action Buttons */
[b-170p45ohhb] .actions {
    display: flex;
    gap: 0.5rem;
}

[b-170p45ohhb] .btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
}

/* Input Validation */
[b-170p45ohhb] .validation-message {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
}

/* Date Input Styling Override */
[b-170p45ohhb] input[type="date"].form-control,
[b-170p45ohhb] input[type="time"].form-control {
    min-width: 200px;
}

[b-170p45ohhb] input[type="date"].no-validation-date,
[b-170p45ohhb] input[type="date"].no-validation-date.invalid {
    border-color: #ced4da !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* State Banner */
[b-170p45ohhb] .state-banner {
    background-color: #e3f2fd;
    border-left: 4px solid #2196f3;
    padding: 1rem;
    margin-bottom: 1.5rem;
    border-radius: 0.375rem;
}

/* Grid Layout */
[b-170p45ohhb] .row {
    margin-bottom: 1rem;
}

[b-170p45ohhb] .col-md-6 {
    padding: 0 0.75rem; /* Reduced from 1rem */
}

/* Input Groups */
[b-170p45ohhb] .input-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-170p45ohhb] .w-auto {
    min-width: 120px;
}

/* _content/TestsUI/Components/Pages/ManageExam/ManageExamTemplates.razor.rz.scp.css */
.container[b-64a2mzxz19] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

[b-64a2mzxz19] .rz-button {
    margin-right: 0.5rem;
}

[b-64a2mzxz19] .rz-dropdown {
    width: 100%;
    max-width: 300px;
}

[b-64a2mzxz19] .rz-grid-table {
    min-width: 800px;
}

[b-64a2mzxz19] .rz-cell-data {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

h3[b-64a2mzxz19] {
    margin-bottom: 2rem;
    color: var(--rz-primary);
}

.row[b-64a2mzxz19] {
    margin-bottom: 1rem;
}

[b-64a2mzxz19] .rz-button-light {
    background-color: var(--rz-base-200);
}

[b-64a2mzxz19] .rz-button-light:hover {
    background-color: var(--rz-base-300);
}
/* _content/TestsUI/Components/Pages/ManageExam/QuestionBankDialog.razor.rz.scp.css */
.hidden-by-loading[b-sw2rvq5qxb] {
    display: none !important; /* Use !important to ensure override if needed */
}

.question-value-input[b-sw2rvq5qxb] {
    min-width: 80px;
    border-radius: 4px;
    height: 32px;
    padding: 0.25rem 0.5rem;
}

.question-metadata[b-sw2rvq5qxb] {
    margin-top: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    .question-metadata[b-sw2rvq5qxb] {
        flex-direction: column;
        align-items: flex-start;
    }
}
.question-metadata > div:last-child[b-sw2rvq5qxb] {
    margin-top: 8px;
}


.question-bank-container[b-sw2rvq5qxb] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    padding: 1rem;
    overflow: hidden;
}

.search-filters-container[b-sw2rvq5qxb] {
    flex: 0 0 auto;
}

.search-results-container[b-sw2rvq5qxb] {
    flex: 1 1 auto;
    overflow-y: auto;
    padding-right: 0.5rem;
}

.animate-invalid[b-sw2rvq5qxb] {
    animation: shake-b-sw2rvq5qxb 0.5s;
    border-color: red !important;
}

/* Apply animation and border to the input inside the wrapper with .animate-invalid */
[b-sw2rvq5qxb] .question-value-input.animate-invalid input {
    border-color: red !important;
    animation: shake-b-sw2rvq5qxb 0.5s;
    border-width: 1px !important;
    border-style: solid !important;
    animation: shake-b-sw2rvq5qxb 0.5s; 
}

@keyframes shake-b-sw2rvq5qxb {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-5px);
    }

    50% {
        transform: translateX(5px);
    }

    75% {
        transform: translateX(-5px);
    }

    100% {
        transform: translateX(0);
    }
}
/* _content/TestsUI/Components/Pages/ManageExam/Questions.razor.rz.scp.css */

.sentinel[b-rgnk8soay1] {
    min-height: 10px;
    width: 100%;
    margin: 5px 0;
    background-color: rgba(255, 0, 0, 0.1);
}

.loading-indicator[b-rgnk8soay1] {
    text-align: center;
    padding: 10px;
    font-style: italic;
    color: #666;
}

.correct-answer[b-rgnk8soay1] {
    color: green;
    font-weight: bold;
    margin-left: 5px;
}

.answers-section[b-rgnk8soay1] {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 5px;
}

.questions-container[b-rgnk8soay1] {
    padding: 20px;
}

.question-item[b-rgnk8soay1] {
    margin-bottom: 20px;
    padding: 15px;
    border: 1px solid #ccc; /* Light border */
    border-radius: 5px;
    background-color: #f9f9f9;
}

.question-details[b-rgnk8soay1], .options-section[b-rgnk8soay1], .explanation-section[b-rgnk8soay1] {
    margin-top: 10px;
}

    .options-section ul[b-rgnk8soay1] {
        list-style-type: none;
        padding: 0;
    }

    .options-section li[b-rgnk8soay1] {
        display: flex;
        align-items: center;
        margin-bottom: 5px;
    }

        .options-section li span[b-rgnk8soay1] {
            margin-right: 10px;
        }

.action-buttons button[b-rgnk8soay1] {
    margin-right: 5px;
}

.answer-table[b-rgnk8soay1] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

    .answer-table th[b-rgnk8soay1], .answer-table td[b-rgnk8soay1] {
        padding: 8px;
        text-align: left;
        border-bottom: 1px solid #e0e0e0;
    }

.label-column[b-rgnk8soay1] {
    width: 40px;
    font-weight: bold;
}

.answer-column[b-rgnk8soay1] {
    width: auto;
}

.correct-column[b-rgnk8soay1] {
    width: 50px;
    text-align: center;
}

.green-check[b-rgnk8soay1] {
    color: #28a745; /* Bootstrap green */
    font-size: 1.2rem;
    font-weight: bold;
}
/* _content/TestsUI/Components/Pages/ManageExam/Qus.razor.rz.scp.css */
.correct-answer[b-swezc5km09] {
    color: green;
    font-weight: bold;
    margin-left: 5px;
}

.answers-section[b-swezc5km09] {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 5px;
}

.questions-container[b-swezc5km09] {
    padding: 20px;
}

.question-item[b-swezc5km09] {
    margin-bottom: 32px;
    padding: 24px;
    border: 1px solid #ccc; /* Light border */
    border-radius: 8px;
    background-color: #f9f9f9;
}

.question-header-row[b-swezc5km09] {
    display: flex;
    gap: 24px;
    align-items: center;
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 12px;
    color: #444;
}

/* Reduce font size for IDs */
.question-header-row .question-order[b-swezc5km09],
.question-header-row .exam-det-id[b-swezc5km09],
.question-header-row .question-id[b-swezc5km09] {
    font-size: 1rem;
    font-weight: 500;
}

.question-details[b-swezc5km09], .options-section[b-swezc5km09], .explanation-section[b-swezc5km09] {
    margin-top: 20px;
}

.options-section[b-swezc5km09] {
    margin-top: 18px;
    margin-bottom: 18px;
}

.action-buttons[b-swezc5km09] {
    margin-top: 18px;
}

    .options-section ul[b-swezc5km09] {
        list-style-type: none;
        padding: 0;
    }

    .options-section li[b-swezc5km09] {
        display: flex;
        align-items: center;
        margin-bottom: 12px;
    }

        .options-section li span[b-swezc5km09] {
            margin-right: 10px;
        }

.answer-table[b-swezc5km09] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 18px;
    margin-bottom: 18px;
}

    .answer-table th[b-swezc5km09], .answer-table td[b-swezc5km09] {
        padding: 8px;
        text-align: left;
        border-bottom: 1px solid #e0e0e0;
    }

.label-column[b-swezc5km09] {
    width: 40px;
    font-weight: bold;
}

.answer-column[b-swezc5km09] {
    width: auto;
}

.correct-column[b-swezc5km09] {
    width: 50px;
    text-align: center;
}

.green-check[b-swezc5km09] {
    color: #28a745; /* Bootstrap green */
    font-size: 1.2rem;
    font-weight: bold;
}

/* New styles for edit buttons */
.btn-icon[b-swezc5km09] {
    padding: 0.25rem 0.4rem;
    background: transparent;
    border: none;
    cursor: pointer;
    line-height: 1;
}

    .btn-icon:hover[b-swezc5km09] {
        background-color: rgba(0,0,0,0.05);
        border-radius: 4px;
    }

    .btn-icon:disabled[b-swezc5km09] {
        opacity: 0.5;
        cursor: not-allowed;
    }

.edit-field[b-swezc5km09] {
    display: flex;
    align-items: center;
}

.edit-fields-row[b-swezc5km09] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.edit-field[b-swezc5km09] {
    display: flex;
    align-items: center;
}

/* ------ Question Row Styles ------ */

.question-row[b-swezc5km09] {
    display: flex;
    align-items: center;
    gap: 18px; /* More space between badge and text */
    margin-bottom: 18px;
}

.question-number-badge[b-swezc5km09] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: #f5f7fa;
    color: #2d7ff9;
    font-size: 1.3rem;
    font-weight: 900;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(45,127,249,0.08);
    border: 2px solid #e3e8ee;
    margin: 0;
    padding: 0;
    text-align: center;
    letter-spacing: 0.5px;
    transition: box-shadow 0.15s, border-color 0.15s;
    vertical-align: middle;
}


/* Fix: Properly escape the media query with @@ - used when <style> in the document*/
@media (max-width: 768px) {
    .edit-fields-row[b-swezc5km09] {
        flex-direction: column;
        align-items: flex-start;
    }


    .edit-field[b-swezc5km09] {
        margin-bottom: 0.5rem;
    }

    .info-label[b-swezc5km09] {
        background-color: #e7f3fe;
        color: #084298;
        border: 1px solid #b6e0fe;
        border-radius: 4px;
        padding: 0.75rem 1.25rem;
        margin-bottom: 1rem;
        font-size: 1rem;
        font-weight: 500;
    }

    .question-option-buttons[b-swezc5km09] {
        display: flex;
        gap: 20px;
        justify-content: center;
        margin: 10px 0;
    }

    .btn-option[b-swezc5km09] {
        min-width: 180px;
        padding: 10px 15px;
        border-radius: 5px;
        font-weight: 500;
        transition: all 0.2s ease;
    }

        .btn-option:hover[b-swezc5km09] {
            transform: translateY(-2px);
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }

    .btn-cancel[b-swezc5km09] {
        border-radius: 50%;
        width: 38px;
        height: 38px;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-left: 10px;
        align-self: center;
    }

    .question-option-buttons[b-swezc5km09] {
        display: flex;
        gap: 20px;
        justify-content: center;
        margin: 10px 0;
        position: relative;
    }

    [b-swezc5km09] .question-bank-dialog {
        max-width: 98% !important;
    }

        [b-swezc5km09] .question-bank-dialog .rz-dialog-content {
            padding: 0;
            overflow: hidden;
        }

        [b-swezc5km09] .question-bank-dialog .rz-dialog {
            max-width: none !important;
        }

    table[b-swezc5km09] {
        border-collapse: collapse;
        margin: 1em 0;
        width: auto;
        min-width: 400px;
    }

    th[b-swezc5km09], td[b-swezc5km09] {
        border: 1px solid #888;
        padding: 8px 12px;
        text-align: center;
    }

    th[b-swezc5km09] {
        background: #f0f0f0;
        font-weight: bold;
    }

    .strikethrough[b-swezc5km09] {
        text-decoration: line-through;
        color: #888;
    }


    .main-viewport[b-swezc5km09] {
        height: 100vh;
        min-height: 100vh;
        max-height: 100vh;
        display: flex;
        flex-direction: column;
        /*     overflow: hidden; */
    }


    .math-container[b-swezc5km09] {
        display: inline; /* Ensures inline math stays inline */
        vertical-align: middle;
    }

 
}

.btn-action[b-swezc5km09] {
    display: inline-flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 500;
    border: none;
    border-radius: 8px;
    padding: 0.6rem 1.4rem;
    margin-right: 12px;
    transition: background 0.18s, box-shadow 0.18s, color 0.18s;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    cursor: pointer;
    gap: 0.5rem;
}

.btn-delete[b-swezc5km09] {
    background: #e74c3c;
    color: #fff;
}
.btn-delete:hover[b-swezc5km09] {
    background: #c0392b;
}

.btn-duplicate[b-swezc5km09] {
    background: #ffd600;
    color: #222;
}
.btn-duplicate:hover[b-swezc5km09] {
    background: #ffb300;
    color: #111;
}

.edit-field label[b-swezc5km09],
.question-details label[b-swezc5km09] {
    font-weight: 700;
}

.label-bold[b-swezc5km09] {
    font-weight: 700;
}

.empty-state[b-swezc5km09] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    background-color: #f8f9fa;
    border-radius: 8px;
    margin: 20px 0;
}

.empty-state-content[b-swezc5km09] {
    text-align: center;
    padding: 2rem;
}

.empty-state .bi[b-swezc5km09] {
    color: #6c757d;
}

.empty-state h4[b-swezc5km09] {
    margin-bottom: 1rem;
    color: #343a40;
}

.question-option-buttons[b-swezc5km09] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

@media (min-width: 768px) {
    .question-option-buttons[b-swezc5km09] {
        flex-direction: row;
        justify-content: center;
    }
}
/* _content/TestsUI/Components/Pages/ManageExam/ReOrderQus.razor.rz.scp.css */
/* Modern neutral look: no blue or purple backgrounds or borders */

/* Section container */
.rz-background-color-info-lighter[b-n00uyqwowf],
.rz-border-info-light[b-n00uyqwowf],
.rz-p-12[b-n00uyqwowf] {
    background: #f7fafd !important;
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}

/* Section card */
.drag-item[b-n00uyqwowf] {
    background: #fff !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 12px 0 rgba(80,80,80,0.06), 0 1.5px 4px 0 rgba(80,80,80,0.03) !important;
    margin-bottom: 2rem !important;
    padding: 1.5rem !important;
    border: 1.5px solid #e0e0e0 !important;
    transition: box-shadow 0.2s;
}

/* Remove blue/purple from Radzen cards */
.rz-card[b-n00uyqwowf],
.rz-variant-filled[b-n00uyqwowf],
.rz-background-color-primary-light[b-n00uyqwowf],
.rz-color-on-primary-light[b-n00uyqwowf],
.rz-background-color-primary-lighter[b-n00uyqwowf],
.rz-color-on-primary-lighter[b-n00uyqwowf] {
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    color: #222 !important;
    margin-bottom: 1.5rem !important;
    padding: 1.25rem !important;
}

/* Section header */
.rz-tree-title[b-n00uyqwowf],
.section-title[b-n00uyqwowf] {
    font-weight: 600;
    font-size: 1.1rem;
    color: #222;
}

/* Question card */
.question-card[b-n00uyqwowf] {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 2px 12px 0 rgba(80,80,80,0.08), 0 1.5px 4px 0 rgba(80,80,80,0.06);
    margin: 1.5rem 0;
    padding: 1.25rem 1.5rem;
    transition: box-shadow 0.2s;
    border: 1.5px solid #e0e0e0;
    position: relative;
}

.question-card:hover[b-n00uyqwowf] {
    box-shadow: 0 4px 24px 0 rgba(80,80,80,0.16), 0 3px 8px 0 rgba(80,80,80,0.12);
    border-color: #bdbdbd;
}

.question-card .question-number[b-n00uyqwowf] {
    font-weight: 600;
    margin-right: 0.5em;
    color: #6366f1;
    display: inline;
}

.question-card .question-text[b-n00uyqwowf] {
    display: inline;
}

/* MathJax and math containers */
.math-container[b-n00uyqwowf],
.mjx-container[b-n00uyqwowf] {
    max-width: 100%;
    overflow-x: auto;
    font-size: 1.1em;
    background: transparent !important;
}

/* General improvements for drag/drop and spacing */
[draggable="true"][b-n00uyqwowf] {
    cursor: grab !important;
}

.rz-tree[b-n00uyqwowf] {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Optional: Add a subtle hover effect for cards */
.rz-card:hover[b-n00uyqwowf] {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
    border-color: #bdbdbd !important;
}

.rz-can-drop[b-n00uyqwowf] {
    background-color: #f0f4f8 !important;
}

.invalid-drop[b-n00uyqwowf] {
    cursor: not-allowed !important;
    opacity: 0.5;
}

.custom-section-card[b-n00uyqwowf] {
    background: #fff !important;
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 12px 0 rgba(80,80,80,0.06), 0 1.5px 4px 0 rgba(80,80,80,0.03) !important;
    margin-bottom: 2rem !important;
    padding: 1.5rem !important;
    transition: box-shadow 0.2s;
}

.header-row[b-n00uyqwowf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 2.5rem;
    margin-bottom: 1.5rem;
    gap: 1.5rem;
}

.exam-reorder-title[b-n00uyqwowf] {
    font-size: 2rem;
    font-weight: 700;
    color: #23272f;
    letter-spacing: -0.5px;
    margin: 0;
    padding: 0;
    line-height: 1.1;
}

.save-changes-btn[b-n00uyqwowf] {
    min-width: 160px;
    font-size: 1rem;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(80,80,80,0.04);
}
