@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@400;500;600;700&display=swap');
:root {
    /* Student Portal Theme Colors */
    --dark-primary-color: #000000;
    --primary-color: #13006a;
    --secondary-color: #8B0000;
    --third-color: #bf7955;
    --student-primary: #13006a;
    --student-primary-dark: #1a1050;
    --student-secondary: #8B0000;
    --student-accent: #bf7955;
    --student-success: #10b981;
    --student-warning: #f59e0b;
    --student-danger: #8B0000;
    --student-info: #13006a;
    --sidebar-width: 280px;
    --sidebar-collapsed-width: 70px;
    --header-height: 65px;
    --transition-speed: 0.3s;

    /* Legacy variables mapped to new theme */
    --purple: #2E1C7B;
    --yellow: #f59e0b;
    --deep-yellow: #bf7955;
    --red: #8B0000;
    --accent: #2E1C7B;
    --primary-fg: #fff;

    --body-fg: #333;
    --body-bg: #fff;
    --body-quiet-color: #666;
    --body-medium-color: #444;
    --body-loud-color: #000;

    --header-color: #ffffff;
    --header-branding-color: var(--primary-color);
    --header-bg: var(--primary-color);
    --header-link-color: var(--primary-fg);

    --breadcrumbs-fg: #c4dce8;
    --breadcrumbs-link-fg: var(--body-bg);
    --breadcrumbs-bg: var(--student-primary-dark);

    --link-fg: var(--primary-color);
    --link-hover-color: var(--student-primary-dark);
    --link-selected-fg: var(--primary-color);

    --hairline-color: #e8e8e8;
    --border-color: #ccc;

    --error-fg: var(--student-danger);

    --message-success-bg: #dfd;
    --message-warning-bg: #ffc;
    --message-error-bg: #ffefef;

    --darkened-bg: #f8f8f8;
    --selected-bg: #e4e4e4;
    --selected-row: #ffc;

    --button-fg: #fff;
    --button-bg: var(--primary-color);
    --button-hover-bg: var(--student-primary-dark);
    --default-button-bg: var(--primary-color);
    --default-button-hover-bg: var(--student-primary-dark);
    --close-button-bg: #747474;
    --close-button-hover-bg: #333;
    --delete-button-bg: var(--student-danger);
    --delete-button-hover-bg: #6B0000;

    --object-tools-fg: var(--button-fg);
    --object-tools-bg: var(--primary-color);
    --object-tools-hover-bg: var(--student-primary-dark);

    --bgColor-danger-emphasis: var(--student-danger);
    --bgColor-danger-muted: rgba(139, 0, 0, 0.1);
    --bgColor-default: var(--primary-color);
    --bgColor-disabled: #212830;
    --bgColor-done-emphasis: var(--student-success);
    --bgColor-done-muted: rgba(16, 185, 129, 0.15);
    --bgColor-emphasis: var(--student-primary-dark);
    --bgColor-muted: #f8f9fa;
    --bgColor-neutral-emphasis: #656c76;

    /* Gradients */
    --primary-gradient: linear-gradient(135deg, var(--primary-color) 0%, var(--student-primary-dark) 100%);
    --success-gradient: linear-gradient(135deg, var(--student-success) 0%, #059669 100%);
    --warning-gradient: linear-gradient(135deg, var(--student-warning) 0%, #d97706 100%);
    --danger-gradient: linear-gradient(135deg, var(--student-danger) 0%, #6B0000 100%);
    --info-gradient: linear-gradient(135deg, var(--student-info) 0%, var(--student-primary-dark) 100%);
    --card-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
    --hover-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
    --border-radius: 5px;

    --font-family-primary:
        "Inter",
        "Montserrat",
        system-ui,
        Roboto,
        "Helvetica Neue",
        Arial,
        sans-serif,
        "Apple Color Emoji",
        "Segoe UI Emoji",
        "Segoe UI Symbol",
        "Noto Color Emoji";
    --font-family-monospace:
        ui-monospace,
        Menlo,
        Monaco,
        "Cascadia Mono",
        "Segoe UI Mono",
        "Roboto Mono",
        "Oxygen Mono",
        "Ubuntu Monospace",
        "Source Code Pro",
        "Fira Mono",
        "Droid Sans Mono",
        "Courier New",
        monospace,
        "Apple Color Emoji",
        "Segoe UI Emoji",
        "Segoe UI Symbol",
        "Noto Color Emoji";

    color-scheme: light;
}

/* Wrapper */
.content-wrapper>.content {
    padding: 0rem;
}

.content-wrapper .content-header{
    padding: 8px !important;
}

/* --- Professional Page Loader Styles --- */
.page-loader-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--third-color) 0%, var(--student-primary-dark) 100%);
    z-index: 9999;
    display: none;
    justify-content: center;
    align-items: center;
    opacity: 1;
    transition: opacity 0.5s ease-out;
}

.page-loader-overlay.fade-out {
    opacity: 0;
}

.loader-container {
    text-align: center;
    color: white;
}

.loader-logo {
    font-size: 3rem;
    margin-bottom: 1rem;
    animation: pulse 2s ease-in-out infinite;
}

.loader-spinner {
    position: relative;
    width: 80px;
    height: 80px;
    margin: 0 auto 1.5rem;
}

.spinner-ring {
    position: absolute;
    border: 4px solid transparent;
    border-radius: 50%;
    animation: spin-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}

.spinner-ring:nth-child(1) {
    width: 64px;
    height: 64px;
    top: 8px;
    left: 8px;
    border-color: #fff transparent transparent transparent;
    animation-delay: -0.45s;
}

.spinner-ring:nth-child(2) {
    width: 64px;
    height: 64px;
    top: 8px;
    left: 8px;
    border-color: transparent #fff transparent transparent;
    animation-delay: -0.3s;
}

.spinner-ring:nth-child(3) {
    width: 64px;
    height: 64px;
    top: 8px;
    left: 8px;
    border-color: transparent transparent #fff transparent;
    animation-delay: -0.15s;
}

.spinner-ring:nth-child(4) {
    width: 64px;
    height: 64px;
    top: 8px;
    left: 8px;
    border-color: transparent transparent transparent #fff;
}

.loader-text {
    font-size: 1.1rem;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
    animation: fadeInOut 2s ease-in-out infinite;
}

@keyframes spin-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        opacity: 1;
    }
    50% {
        transform: scale(1.1);
        opacity: 0.8;
    }
}

@keyframes fadeInOut {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

/* Legacy support - hide old loader classes */
.loader-spinner {
    /* Reset old styles if they exist */
}

/* Class to show the loader */
.page-loader-overlay.show {
    display: flex;
}

/*
    Progress Bar Style
*/
#form-progress-container .progress-bar {
    font-size: 1rem;
    transition: width 0.4s cubic-bezier(.4,0,.2,1);
}
.uploading-text {
    animation: pulse 1.2s infinite;
}
@keyframes pulse {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
}

/* ---------- Buttons - Student Portal Theme ----------------- */
.btn.btn-primary {
    color: #fff;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    box-shadow: none;
}

.btn.btn-primary:hover {
    background-color: var(--third-color) !important;
    border-color: var(--third-color) !important;
}

/*--------- Login Page Styles ---------*/
/*
 * Digital Apex Login Page Styles
--*/

/* reset */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
sub,
sup,
tt,
var,
b,
u,
i,
dl,
dt,
dd,
ol,
nav ul,
nav li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
copyright,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
copyright,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

ol,
ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* start editing from here */
a {
    text-decoration: none;
}

.txt-rt {
    text-align: right;
}

/* text align right */
.txt-lt {
    text-align: left;
}

/* text align left */
.txt-center {
    text-align: center;
}

/* text align center */
.float-rt {
    float: right;
}

/* float right */
.float-lt {
    float: left;
}

/* float left */
.clear {
    clear: both;
}

/* clear float */
.pos-relative {
    position: relative;
}

/* Position Relative */
.pos-absolute {
    position: absolute;
}

/* Position Absolute */
.vertical-base {
    vertical-align: baseline;
}

/* vertical align baseline */
.vertical-top {
    vertical-align: top;
}

/* vertical align top */
nav.vertical ul li {
    display: block;
}

/* vertical menu */
nav.horizontal ul li {
    display: inline-block;
}

/* horizontal menu */
img {
    max-width: 100%;
}

/* //end reset */

body {
    font-size: 100%;
    font-family: var(--font-family-primary);
}

/* Heading Hierarchy - Responsive */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-primary);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 0.5em;
}

h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
h2 { font-size: clamp(1.5rem, 2.5vw, 2rem); }
h3 { font-size: clamp(1.25rem, 2vw, 1.75rem); }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }

.main-bg {
    background: url(../assets/loginPage/login_background_image.jpg) no-repeat center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    min-height: 100vh;
}

/* Login page title styling */
.main-bg h1 {
    color: #fff;
    letter-spacing: 3px;
}

/* //title */

.image-style {
    background: url(../logo/apex_logo.png) no-repeat center;
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    min-height: 371px;
}

/* vertical tabs */
.vertical-tab {
    color: #333;
    display: block;
    margin: auto;
    position: relative;
    float: left;
    /* width: 70%; */
}

.image-style {
    float: left;
    width: 25%;
}

.vertical-tab input[name="sections"] {
    left: -9999px;
    position: absolute;
    top: -9999px;
}

.vertical-tab .section-w3ls {
    display: block;
}

.vertical-tab .section-w3ls label {
    background: #fff;
    border-right: 1px solid #dcdcdc;
    cursor: pointer;
    display: block;
    font-size: 17px;
    padding: 33px 20px;
    position: relative;
    width: 189px;
    z-index: 100;
    color: #111;
    text-align: center;
}

.vertical-tab .section-w3ls article {
    display: none;
    left: 230px;
    min-width: 570px;
    position: absolute;
    top: 0;
}

/* .vertical-tab .section-w3ls article:after {
    background-color: #fff;
    bottom: 0;
    content: "";
    display: block;
    left: -229px;
    position: absolute;
    top: 0;
    width: 220px;
    z-index: 1;
} */

.vertical-tab input[name="sections"]:checked+label {
    background: var(--bgColor-default);
    border-right: 1px solid #000;
    color: #fff;
}

.vertical-tab input[name="sections"]:checked~article {
    display: block;
}

label.icon-left-w3pvt span {
    display: block;
    font-size: 30px;
    margin-bottom: 7.8px;
}

/* //vertical tabs */

/* form style */
.sub-main-w3 form {
    background: #ffff;
    padding: 1em;
}

p.para-style {
    margin-bottom: .8em;
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 1.8;
}

p.para-style-2 {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 1.8;
    margin-bottom: 2em;
}

p.para-style-2 a {
    color: blue;
}
/*
.input {
    margin-bottom: 1em;
    padding: 13px 15px;
    border: 1px solid #eee;
    background: #eee;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.input span {
    font-size: 15px;
    color: #464646;
    margin-right: 10px;
}

.input input {
    color: #000;
    font-size: 14px;
    letter-spacing: 1px;
    box-sizing: border-box;
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
} */

.submit {
    margin: 2.3em auto 0;
    background: var(--bgColor-default);
    border: none;
    cursor: pointer;
    font-weight: 600;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
    display: block;
    color: #fff;
    padding: 14px 30px;
    -webkit-border-radius: 0;
    -o-border-radius: 0;
    -ms-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-size: 15px;
    letter-spacing: 2px;
    width: 100%;
}

.submit:hover {
    background: var(--secondary);
    opacity: .8;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
}

a.bottom-text-w3ls {
    color: #757474;
    font-size: 14px;
    display: inherit;
    letter-spacing: 1px;
    text-align: center;
    margin-top: 3.2em;
}

/* //form style */

/* copyright */
.copyright {
    margin-top: 9vw;
    padding-bottom: 1.5vw;
}

.copyright h2 {
    font-size: 15px;
    color: #fff;
    letter-spacing: 1px;
    text-align: center;
    line-height: 1.8;
}

.copyright h2 a {
    color: #fff;
    font-weight: bold;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
}

.copyright h2 a:hover {
    opacity: .8;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
}

/* //copyright */

/* responsive */

@media(max-width: 1050px) {
    .sub-main-w3 {
        max-width: 900px;
    }

    .vertical-tab .section-w3ls article {
        min-width: 445px;
    }

    p.para-style-2 {
        font-size: 14px;
        margin-bottom: 1em;
    }

    p.para-style {
        margin-bottom: .7em;
        font-size: 14px;
    }
}

@media(max-width: 900px) {
    .sub-main-w3 {
        max-width: 768px;
    }

    .vertical-tab .section-w3ls article {
        min-width: 400px;
        left: 175px;
    }

    .vertical-tab .section-w3ls label {
        width: 134px;
        font-size: 15px;
        padding: 34px 20px;
    }

    .main-bg h1 {
        padding: 1.5rem 0.5rem 0.5rem;
    }
}

@media(max-width: 768px) {
    .sub-main-w3 {
        max-width: 575px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .image-style {
        float: none;
        width: 100%;
        min-height: 300px;
        order: 2;
    }

    .vertical-tab {
        float: none;
        width: 100%;
    }
}

@media(max-width: 640px) {
    .copyright h2 {
        font-size: 14px;
    }
}

@media(max-width: 600px) {
    .sub-main-w3 {
        max-width: 500px;
    }

    .vertical-tab .section-w3ls article {
        min-width: 365px;
        left: 135px;
    }

    .vertical-tab .section-w3ls label {
        width: 114px;
        font-size: 15px;
        padding: 31px 10px;
    }

}

@media(max-width: 480px) {
    .vertical-tab .section-w3ls article {
        min-width: 291px;
        left: 109px;
    }

    .vertical-tab .section-w3ls label {
        width: 89px;
        font-size: 14px;
        padding: 26.8px 10px;
    }

    .sub-main-w3 {
        max-width: 400px;
    }

    .image-style {
        min-height: 220px;
    }

    .sub-main-w3 form {
        padding: 1.5em;
    }

    .submit {
        font-size: 14px;
    }

    .input input {
        font-size: 13px;
    }

    p.para-style {
        margin-bottom: .4em;
        font-size: 13px;
    }

    p.para-style-2 {
        font-size: 13px;
    }

    .input {
        padding: 12px 12px;
    }

    a.bottom-text-w3ls {
        margin-top: 3em;
    }

    .last-btn {
        margin: 1em auto 0;
    }

    .copyright h2 {
        font-size: 0.8125rem;
    }
}

@media(max-width: 414px) {
    .sub-main-w3 {
        max-width: 320px;
    }

    .vertical-tab .section-w3ls article {
        position: static;
    }

    .vertical-tab .section-w3ls label {
        width: 100%;
        font-size: 14px;
        padding: 20px 0;
        border-right: none;
        border-bottom: 1px solid #dcdcdc;
        border-top: 1px solid #dcdcdc;
    }

    .vertical-tab input[name="sections"]:checked+label {
        border-right: none;
        border-bottom: 1px solid #000;
        border-top: none;
    }

    .image-style {
        min-height: 190px;
    }

    .main-bg h1 {
        padding: 1.5rem 0.5rem 0.75rem;
    }

    .copyright h2 {
        font-size: 0.8125rem;
    }

    .last-btn {
        margin: 1.5em auto 0;
    }

    p.para-style {
        margin-bottom: 1em;
    }

    p.para-style-2 {
        margin-bottom: 2em;
    }

}

@media(max-width: 320px) {
    .sub-main-w3 {
        max-width: 270px;
    }

    .vertical-tab .section-w3ls article {
        min-width: 270px;
    }
}

/* //responsive */
.sub-main-w3 {
    max-width: 100%;
    /* margin: 1rem auto; */
    padding: 0;
}
/*
.sub-main-w3 form {
    background: #ffffff;
    padding: 2em;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
    margin: 0;
} */

.legend {
    color: var(--primary);
    font-size: 28px;
    text-align: center;
    margin-bottom: 1.5em;
    font-weight: 500;
    position: relative;
}

.legend::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    border-radius: 2px;
}

.form-section {
    margin-bottom: 2.5rem;
    padding: 1.8rem;
    border: 1px solid #e8eaed;
    border-radius: 1px;
    background: #fafbfc;
    position: relative;
}

.section-title {
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--primary);
    margin-bottom: 1.0rem;
    padding-bottom: 0.2rem;
}

.form-group {
    margin-bottom: 1em !important;
}

.form-label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 500;
    color: #333;
    font-size: 1em;
}

.form-label.required::after {
    content: " *";
    color: var(--red);
    font-weight: bold;
}

.form-group input,
.form-group select,
.form-group textarea,
.input input,
.input select,
.input textarea {
    color: #333;
    font-size: 1em;
    letter-spacing: 0.5px;
    box-sizing: border-box;
    border: 1px solid var(--primary);
    outline: none;
    background: white;
    width: 100%;
    padding: 12px 12px;
    border-radius: 5px;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus,
.input input:focus,
.input select:focus,
.input textarea:focus {
    border-color: var(--secondary);
    box-shadow: 0 0 5px rgba(59, 39, 212, 0.2);
    background: #f9f9f9;
}

.form-group textarea,
.input textarea {
    min-height: 80px;
    resize: vertical;
    font-family: inherit;
}
.form-group span,
.input span {
    font-size: 14px;
    color: #666;
    margin-right: 10px;
    font-weight: 500;
    min-width: fit-content;
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

.submit {
    margin: 2.3em auto 0;
    background: var(--primary);
    border: none;
    cursor: pointer;
    font-weight: 600;
    transition: 0.3s all ease;
    display: block;
    color: #fff;
    padding: 16px 32px;
    border-radius: 6px;
    font-size: 15px;
    letter-spacing: 1px;
    width: 100%;
    text-transform: uppercase;
}

.submit:hover {
    background: var(--accent);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(59, 39, 212, 0.3);
}

.dt-buttons .buttons-copy,
.dt-buttons .buttons-csv,
.dt-buttons .buttons-excel,
.dt-buttons .buttons-pdf,
.dt-buttons .buttons-print,
.dt-buttons .buttons-collection
{
    background-color: white !important;
}

.btn {
    display: inline-block;
    padding: 0 14px;
    height: 40px;
    line-height: 40px;
    border: none;
    border-radius: 8px;
    background: var(--bgColor-default);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(59, 39, 212, 0.10);
    transition: background 0.3s, box-shadow 0.3s, transform 0.2s;
    outline: none;
    position: relative;
    overflow: hidden;
    margin: 5px;
}

.btn-group.btn:hover, .btn:hover, .btn:focus {
    color: #fff;
    background: var(--secondary);
    box-shadow: 0 6px 20px rgba(59, 39, 212, 0.18);
}

.btn:active {
    background: linear-gradient(135deg, var(--bgColor-default), var(--accent));
    box-shadow: 0 2px 8px rgba(59, 39, 212, 0.10);
}

.btn-back {
    background: transparent;
    color: var(--primary);
    border: 1px solid var(--primary);
    padding: 10px 24px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, box-shadow 0.2s;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-align: center;
    letter-spacing: 0.5px;
}

.btn-back:hover,
.btn-back:focus {
    background: rgb(169, 169, 169);
    color: #fff;
    box-shadow: 0 2px 8px rgba(59, 39, 212, 0.10);
}

/* .btn-back::before {
    content: "←";
    font-size: 1.1em;
    margin-right: 6px;
    display: inline-block;
} */

/* Professional Edit & Delete Buttons */
/* Professional color schemes */
.btn-view {
    background:  #1565c0;
    color: #ffffff;
    border: 1px solid #1565c0;
}

.btn-view:hover {
    background: #1565c0c3;
    color: white;
    border-color: #1565c0c3;
}

.btn-edit {
    background: #00cf00;
    color: #ffffff;
    border: 1px solid #00cf00;
}

.btn-edit:hover {
    background: #2e7d32;
    color: white;
    border-color: #2e7d32;
}

.btn-delete {
    background: #f72a49;
    color: #ffffff;
    border: 1px solid #f72a49;
}

.btn-delete:hover {
    background: #c62828;
    color: white;
    border-color: #c62828;
}

/* Focus states for accessibility */
.btn-edit:focus, .btn-delete:focus, .btn-view:focus {
    outline: none;
    outline-offset: 2px;
    box-shadow: none;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 2.5rem;
    padding-top: 2rem;
    border-top: 2px solid #e8eaed;
    gap: 1rem;
}

.file-upload {
    position: relative;
    display: block;
    width: 100%;
}

.file-upload-wrapper {
    border: 2px dashed #dadce0;
    border-radius: 8px;
    background: #fafbfc;
    padding: 2rem;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
}

.file-upload-wrapper:hover {
    border-color: var(--primary);
    background: #f8f9ff;
}

.file-upload-input {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    z-index: 2;
}

.file-upload-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    color: #666;
}

.error-message {
    color: var(--red);
    font-size: 0.8125rem;
    margin-top: 6px;
    font-weight: 500;
}

.success-message {
    color: var(--accent);
    font-size: 0.8125rem;
    margin-top: 6px;
    font-weight: 500;
}

@media (max-width: 768px) {
    .form-row {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .form-actions {
        flex-direction: column;
        gap: 1rem;
    }

    .sub-main-w3 {
        margin: 1rem;
    }

    .sub-main-w3 form {
        padding: 1.5em;
    }
}
/*  Super Admin Dashboard Styles */
.stats-card {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 10px;
    color: white;
    padding: 20px;
    margin-bottom: 20px;
}
.financial-card {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    border-radius: 10px;
    color: white;
    padding: 20px;
    margin-bottom: 20px;
}
.chart-container {
    background: white;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    margin-bottom: 20px;
}
.metric-card {
    text-align: center;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 15px;
}
.metric-value {
    font-size: 2rem;
    font-weight: bold;
    margin-bottom: 5px;
}
.metric-label {
    font-size: 0.9rem;
    opacity: 0.8;
}

/* Summernote Default Style */
/* Restore Summernote default content styles */
.note-editable {
    font-family: inherit;
    font-size: 1rem;
    color: #212529;
    background: #fff;
    min-height: 150px;
    line-height: 1.6;
    padding: 1em;
    border-radius: 0.25rem;
}

.note-editable h1,
.note-editable h2,
.note-editable h3,
.note-editable h4,
.note-editable h5,
.note-editable h6 {
    font-weight: bold;
    margin-top: 1em;
    margin-bottom: 0.5em;
}

.note-editable b,
.note-editable strong {
    font-weight: bold;
}

.note-editable i,
.note-editable em {
    font-style: italic;
}

.note-editable u {
    text-decoration: underline;
}

.note-editable ol,
.note-editable ul {
    list-style: initial;
    margin-left: 2em;
    padding-left: 1em;
}

.note-editable ul {
    list-style-type: disc;
}

.note-editable ol {
    list-style-type: decimal;
}

.note-editable blockquote {
    border-left: 4px solid #ccc;
    margin: 1em 0;
    padding-left: 1em;
    color: #555;
    font-style: italic;
}

.note-editable pre,
.note-editable code {
    background: #f8f9fa;
    border-radius: 4px;
    padding: 0.5em;
    font-family: var(--font-family-monospace);
    font-size: 0.95em;
}

.note-editable a {
    color: #0d6efd;
    text-decoration: underline;
}

.note-editable img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0.5em 0;
}

/* File Styles */
.file-drop-area {
    border: 2px dashed #ddd;
    border-radius: 8px;
    padding: 2rem;
    text-align: center;
    background: #fafafa;
    transition: all 0.3s ease;
    cursor: pointer;
}

.file-drop-area:hover,
.file-drop-area.dragover {
    border-color: #007bff;
    background: #f0f8ff;
}

.file-preview-item {
    position: relative;
    margin-bottom: 1rem;
}

.file-preview-item img {
    max-width: 100%;
    height: 100px;
    object-fit: cover;
    border-radius: 4px;
}

.file-preview-remove {
    position: absolute;
    top: 5px;
    right: 5px;
    background: rgba(220, 53, 69, 0.8);
    color: white;
    border: none;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/* Statistic and Filter Styles */
.stats-card {
    background: linear-gradient(135deg, var(--bs-primary), var(--bs-info));
    border-radius: 15px;
    color: white;
    padding: 1.5rem;
    margin-bottom: 1rem;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.2);
}

.stats-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0, 123, 255, 0.3);
}

.stats-card.success, .btn-success {
    background: linear-gradient(135deg, #28a745, #20c997);
}

.stats-card.warning, .btn-warning {
    background: linear-gradient(135deg, #ffc107, #fd7e14);
}

.stats-card.danger, .btn-danger {
    background: linear-gradient(135deg, #dc3545, #e83e8c);
}

.stats-card.info, .btn-info {
    background: linear-gradient(135deg, #17a2b8, #6f42c1);
}

.filter-section {
    background: white;
    border-radius: 15px;
    padding: 1.5rem;
    margin-bottom: 2rem;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
}

.table-container {
    background: white;
    border-radius: 15px;
    padding: 1.5rem;
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.08);
}

.status-badge {
    padding: 0.4rem 0.8rem;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
}

.status-pending {
    background-color: rgba(255, 193, 7, 0.2);
    color: #856404;
    border: 1px solid rgba(255, 193, 7, 0.3);
}

.status-under-review {
    background-color: rgba(23, 162, 184, 0.2);
    color: #0c5460;
    border: 1px solid rgba(23, 162, 184, 0.3);
}

.status-accepted {
    background-color: rgba(40, 167, 69, 0.2);
    color: #155724;
    border: 1px solid rgba(40, 167, 69, 0.3);
}

.status-rejected {
    background-color: rgba(220, 53, 69, 0.2);
    color: #721c24;
    border: 1px solid rgba(220, 53, 69, 0.3);
}

.status-enrolled {
    background-color: rgba(111, 66, 193, 0.2);
    color: #4a148c;
    border: 1px solid rgba(111, 66, 193, 0.3);
}

.quick-filters {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}

.quick-filter-btn {
    padding: 0.5rem 1rem;
    border-radius: 20px;
    border: 1px solid #dee2e6;
    background: white;
    color: #6c757d;
    text-decoration: none;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

.quick-filter-btn:hover,
.quick-filter-btn.active {
    background: var(--bs-primary);
    color: white;
    border-color: var(--bs-primary);
    text-decoration: none;
}

/* Data Table Styles */
/* table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
    margin-right: .5em;
    display: inline-block;
    box-sizing: border-box;
    content: '';
    border-top: 5px solid transparent;
    border-left: 10px solid rgba(0, 0, 0, 0.5);
    border-bottom: 5px solid transparent;
    border-right: 0px solid transparent;
} */

/* Bootstrap Form Check Input - Override icheck hidden inputs */
.form-check-input {
    position: relative !important;
    opacity: 1 !important;
    width: 1.25em;
    height: 1.25em;
    margin-top: 0.125em;
    vertical-align: top;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.25em;
    appearance: none;
    cursor: pointer;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.form-check-input:checked {
    background-color: #0d6efd;
    border-color: #0d6efd;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.form-check-input:hover {
    border-color: #0d6efd;
}

.form-check-input:focus {
    border-color: #0d6efd;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.form-check-input:disabled {
    pointer-events: none;
    filter: none;
    opacity: 0.5;
}