﻿.form-label {
    margin-bottom: .5rem;
    font-size: 1rem;
    color: #434F80;
}

.form-control {
    font-size: 12px;
}

.btn {
    font-size: 1rem;
    background-color: #FFFFFF;
}

    .btn.btn-primary {
        background-color: #3C6DB2;
    }

    .btn.btn-warning {
        background-color: #ADC52D;
    }

    .btn.text-primary {
        color: #3C6DB2;
    }

    .btn.text-warning {
        color: #ADC52D;
    }

    .btn.btn-outline.btn-outline-primary {
        border-color: #3C6DB2;
        color: #3C6DB2;
    }
    .btn.btn-outline.btn-outline-warning {
        border-color: #ADC52D;
        color: #ADC52D;
    }

    .btn-check:active + .btn.btn-light-primary, .btn-check:checked + .btn.btn-light-primary, .btn.btn-light-primary.active, .btn.btn-light-primary.show, .btn.btn-light-primary:active:not(.btn-active), .btn.btn-light-primary:focus:not(.btn-active), .btn.btn-light-primary:hover:not(.btn-active), .show > .btn.btn-light-primary {
        color: var(--bs-primary-inverse);
        border-color: var(--bs-primary);
        background-color: #3C6DB2 !important
    }

    .btn-check:active + .btn.btn-light-warning, .btn-check:checked + .btn.btn-light-warning, .btn.btn-light-warning.active, .btn.btn-light-warning.show, .btn.btn-light-waning:active:not(.btn-active), .btn.btn-light-warning:focus:not(.btn-active), .btn.btn-light-warning:hover:not(.btn-active), .show > .btn.btn-light-warning {
        color: var(--bs-warning-inverse);
        border-color: var(--bs-warning);
        background-color: #ADC52D !important
    }

    .btn.btn-light-warning:hover i, .btn.btn-outline-warning:hover i {
        color: var(--bs-warning) !important;
        transition: color .15s !important;
    }

    .btn.btn-light-primary:hover i, .btn.btn-outline-primary:hover i {
        color: var(--bs-primary) !important;
        transition: color .15s !important;
    }

.link-primary {
    color: #3C6DB2;
}

.text-primary {
    color: #3C6DB2 !important;
}

.text-warning {
    color: #ADC52D !important;
}

.icon {
    position: absolute;
    padding: 10px;
    width: calc(1.5em + 1.3rem + 2px);
    text-align: center;
    z-index: 30 !important;
}

.icon-right {
    position: absolute;
    right: 0;
    padding: 10px;
    width: calc(1.5em + 1.3rem + 2px);
    text-align: center;
    z-index: 30 !important;
}

[data-kt-app-layout=light-sidebar] .app-sidebar {
    background-color: #3C6DB2;
    border-right: 0px solid var(--bs-gray-200)
}

    [data-kt-app-layout=light-sidebar] .app-sidebar .hover-scroll-overlay-y:hover, [data-kt-app-layout=light-sidebar] .app-sidebar .scroll-y:hover {
        scrollbar-color: #3C6DB2 transparent
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover:not(.here) > .menu-link:not(.disabled):not(.active):not(.here) .menu-title, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-title {
        color: #FFFFFF;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover:not(.here) > .menu-link:not(.disabled):not(.active):not(.here) .menu-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover:not(.here) > .menu-link:not(.disabled):not(.active):not(.here) .menu-icon .svg-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.hover:not(.here) > .menu-link:not(.disabled):not(.active):not(.here) .menu-icon i, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-icon .svg-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-icon i {
        color: #FFFFFF;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-sub .menu-item .menu-link .menu-title {
        color: #D0D3D9;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-title {
        color: #D0D3D9;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon .svg-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-icon i {
        color: #D0D3D9;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
        color: #3C6DB2 !important;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-title {
        color: #3C6DB2 !important;
    }
    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon .svg-icon, [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-icon i {
        color: #3C6DB2 !important;
    }

    [data-kt-app-layout=light-sidebar] .app-sidebar .menu .menu-item.show > .menu-link .menu-title {
        color: #FFFFFF;
    }


@media (min-width: 992px) {
    .app-sidebar-toggle {
        background-color: #FFFFFF;
    }

    .app-sidebar-menu .menu > .menu-item {
        margin-left: .115rem
    }

        .app-sidebar-menu .menu > .menu-item > .menu-link > .menu-title {
            font-size: 1rem;
        }
}

@media (min-width: 992px) {
    [data-kt-app-layout=light-sidebar] .app-toolbar {
        border-top: 1px solid var(--bs-border-color)
    }

    body:not([data-kt-app-toolbar-fixed=true]) .app-toolbar {
        height: auto;
        background-color: #E03A3E;
        border-top: 0;
        border-bottom: 0;
        box-shadow: none;
        border-bottom: 7px solid #ADC52D;
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
        margin-bottom: .5rem !important;
    }
}

@media (max-width: 991.98px) {
    body:not([data-kt-app-toolbar-fixed-mobile=true]) .app-toolbar {
        height: auto;
        background-color: #E03A3E;
        border-top: 0;
        border-bottom: 0;
        box-shadow: none;
        border-bottom: 3px solid #ADC52D;
    }
}

.page-title > .d-flex > .flex-column > a > i {
    color: #FFFFFF;
    font-size: 20px !important;
}

.page-title > .d-flex > .flex-column > i {
    color: #FFFFFF !important;
    font-size: 20px !important;
}

.page-title > .d-flex > h1 {
    color: #FFFFFF !important;
    font-size: 28px !important;
    font-weight: normal !important;
}

/* Global table beautification */
.table {
    background-color: #FFFFFF;
    border: 1px solid var(--bs-gray-200);
    border-radius: .75rem;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(28, 39, 60, 0.06);
}

.table > thead > tr > th,
.table thead th {
    vertical-align: middle;
    background: #3C6DB2 !important; /* brand primary */
    color: #FFFFFF !important;
    font-weight: 600;
    font-size: 14px !important;
    letter-spacing: .2px;
}

.table > tbody > tr > td {
    color: #264D84 !important;
    font-size: 14px !important;
    vertical-align: middle;
    background-color: #FFFFFF;
    padding-top: .85rem;
    padding-bottom: .85rem;
}

/* Striped & hover states */
.table.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: #F6FAFF !important; /* light brand */
}

.table.table-hover > tbody > tr:hover > * {
    background-color: #EEF3FF !important;
}

/* Bordered variants */
.table.table-bordered {
    border-color: var(--bs-gray-300) !important;
}
.table.table-bordered > :not(caption) > * {
    border-color: var(--bs-gray-300) !important;
}

/* Tighten actions cell */
.table > tbody > tr > td > .btn {
    font-size: 14px;
}
.table > tbody > tr > td > .d-flex > .btn {
    font-size: 14px;
}

/* DataTables pagination beautification */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border: 1px solid var(--bs-gray-300) !important;
    border-radius: .475rem !important;
    padding: .35rem .65rem !important;
    margin: 0 .15rem !important;
    color: #3C6DB2 !important;
    background: #FFFFFF !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #3C6DB2 !important;
    color: #FFFFFF !important;
    border-color: #3C6DB2 !important;
}

.btn-white {
    background-color: #FFFFFF !important;
    color: #E03A3E !important;
}

.btn-grey {
    background-color: #DEE6F7 !important;
}

.btn-outline-white {
    background-color: transparent !important;
}

.btn.btn-outline.btn-outline-white {
    border-color: #FFFFFF;
    color: #FFFFFF;
}

.app-container > div > .btn-white:hover, .btn-white:hover i {
    background-color: #D0D3D9 !important;
    transition: background-color .15s !important;
}
.app-container > div > .btn-white > i {
    color: #E03A3E;
}

.nav {
    border-bottom: 3px solid #3C6DB2 !important;
}
.nav-pills {
    --bs-nav-pills-link-active-bg: #3C6DB2;
}

.nav-pills .nav-link {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.nav-tabs .nav-link {
    border: none !important;
}

.nav-fill .nav-link {
    padding: 1rem 0;
}

@media (min-width: 1200px) {
    .h3, h3 {
        font-size: 1.75rem;
    }
}

.modal-footer {
    padding-top: 0 !important;
    border-top: none;
}

.modal-body {
    padding-bottom: 0.5rem;
}

#sig-canvas {
    border: 2px dotted #454545;
    border-radius: 15px;
    cursor: crosshair;
}

.fv-row p {
    margin-bottom: 2px !important;
}

.td-action {
    padding-top: 0.5rem;
    padding-bottom: 0;
    min-width: 400px;
}

.dt-container {
    overflow-x: hidden !important;
}

.select2-selection__rendered {
    line-height: 1.5 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 6px;
}

.select2-selection {
    height: 40px !important;
    padding: .775rem 1rem;
    font-size: .95rem;
    border: 1px solid var(--bs-gray-300) !important;
    border-radius: .475rem !important;
    font-weight: 500 !important;
}

.select2-search__field {
    border: 1px solid var(--bs-gray-300) !important;
    border-radius: .475rem !important;
}

.file-upload > input {
    display: none;
    visibility: hidden;
}

.file-upload i {
    cursor:pointer;
    font-size:18px;
}

/* Checklist (checkbox) line bold and visible globally */
input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: #000000; /* fallback for modern browsers */
    border: 3px solid #000000 !important;
    box-shadow: 0 0 0 2px #00000022;
}

input[type="checkbox"]:focus {
    outline: 2px solid #000000;
    outline-offset: 2px;
}

/* Make checklist label text bold and more visible */
label, .checklist-label {
    font-weight: bold;
    color: #264D84;
    font-size: 1.1em;
}

/* Optional: If you use li for checklist items */
li.checklist-item {
    border-bottom: 2px solid #000000;
    padding-bottom: 4px;
    margin-bottom: 6px;
}

/* Optional: Increase spacing for checklist */
.checklist, ul.checklist {
    margin-top: 10px;
    margin-bottom: 10px;
}

/* Radio button line bold and visible globally */
input[type="radio"] {
    width: 20px;
    height: 20px;
    accent-color: #000000; /* fallback for modern browsers */
    border: 3px solid #000000 !important;
    box-shadow: 0 0 0 2px #00000022;
}

input[type="radio"]:focus {
    outline: 2px solid #000000;
    outline-offset: 2px;
}

/* Make radio label text bold and more visible */
label, .radio-label {
    font-weight: bold;
    color: #264D84;
    font-size: 1.1em;
}

/* --- Cards (generic) --- */
.card {
    background: #FFFFFF;
    border: 1px solid var(--bs-gray-200);
    border-radius: .75rem;
    box-shadow: 0 6px 16px rgba(28, 39, 60, 0.08);
    margin-bottom: 1rem;
}
.card-header {
    padding: .9rem 1.25rem;
    font-weight: 600;
    color: #264D84;
    border-bottom: 1px solid var(--bs-gray-200);
    background: #F8FAFF;
    border-top-left-radius: .75rem;
    border-top-right-radius: .75rem;
}
.card-body {
    padding: 1rem 1.25rem;
}

/* Center align items in Manage Alumni metric cards */
.alumni-manage .cards-row .card .card-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
}
.alumni-manage .cards-row .card .card-icon {
    position: absolute;
    right: 12px;
    top: 10px;
    float: none;
}
.alumni-manage .cards-row .card .card-title {
    margin-top: 10px;
}

/* Metric cards row */
.cards-row { margin-bottom: 1rem; }
.card .card-title {
    font-size: .95rem;
    color: #60708F;
}
.card .card-value {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1C273C;
}
.card .card-icon {
    float: right;
    font-size: 32px;
    color: #B8C0CF;
}

/* Color variants */
.card-total {
    border-left: 6px solid #3C6DB2;
}
.card-warn {
    border-left: 6px solid #E6A100;
}
.card-info {
    border-left: 6px solid #17A2B8;
}
.card-success {
    border-left: 6px solid #28A745;
}

/* Spacing between cards in summary row */
.cards-row {
    margin-left: -10px;
    margin-right: -10px;
}
.cards-row > [class*='col-'] {
    padding-left: 10px;
    padding-right: 10px;
}
.cards-row .card {
    margin-bottom: 20px;
}

/* Small screens spacing */
@media (max-width: 767px) {
    .card .card-icon { font-size: 26px; }
    .card .card-value { font-size: 1.5rem; }
}