.wlc-rccom-h-80 {
    height: 80px !important;
}
/* Prevent wrapping for rows on medium tablets (scoped to register-student-edit only) */
@media (min-width: 768px) and (max-width: 1024px) {
    .register-student-edit .no-wrap-md {
        flex-wrap: nowrap !important;
    }
}
/* Scoped styles for Extranet Home only */
@media (min-width: 768px) and (max-width: 1024px) {
    /* Scoped strictly to JobShadow Placement Detail page */
    .wlc-js-placement .wlc-comments-md-full {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-top: 1rem !important;
    }
}

.extranet-home .whiteboard a {
    color: #428bca !important;
}

.extranet-home .word-break li a {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* Internship Request Detail (scoped, replaces inline CSS from internshipRequestDetail.ascx) */
.internship-request-detail h3 {
    /*border-bottom: 1px solid #204582;*/
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Scoped styles for Reset Password page */
.reset-password-page .cms-req {
    color: #FF0000;
}
/*=== File Upload Controls ===*/
.file-upload-control {
    max-width: 300px;
    max-height: 150px;
}

/*=== Scoped: Shared action bar styles for known wrappers (Bootstrap 4) ===*/
.internship-pre-interview-questions .wlc-actions,
.jobshadow-edit .wlc-actions,
.internship-parent-info .wlc-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
}

/* Order and spacing (scope by custom class names, not IDs) */
.internship-pre-interview-questions .wlc-prev,
.jobshadow-edit .wlc-prev,
.internship-parent-info .wlc-prev {
    order: 0;
    margin: 0 12px 0 0 !important;
}

.internship-pre-interview-questions .wlc-save-approve,
.jobshadow-edit .wlc-save-approve,
.internship-parent-info .wlc-save-approve {
    order: 1;
    margin: 0 12px 0 0 !important;
}

.internship-pre-interview-questions .wlc-submit,
.jobshadow-edit .wlc-submit,
.internship-parent-info .wlc-submit {
    order: 2;
    margin: 0 12px 0 12px !important;
}

.internship-pre-interview-questions .wlc-save-later,
.jobshadow-edit .wlc-save-later,
.internship-parent-info .wlc-save-later {
    order: 3;
    margin-left: 12px !important;
}

/* Remove extra margins on buttons */
.internship-pre-interview-questions .wlc-actions .btn,
.jobshadow-edit .wlc-actions .btn,
.internship-parent-info .wlc-actions .btn {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Mobile: stack vertically centered */
@media (max-width: 576px) {
    .internship-pre-interview-questions .wlc-actions,
    .jobshadow-edit .wlc-actions,
    .internship-parent-info .wlc-actions {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
    }

        .internship-pre-interview-questions .wlc-actions .btn,
        .jobshadow-edit .wlc-actions .btn,
        .internship-parent-info .wlc-actions .btn {
            order: initial !important;
            margin: 0 !important;
            width: auto !important;
        }
}
/* (Job Shadow and Parent Info specific blocks consolidated above) */
/* Extranet Reporting page overrides (scoped to .report to prevent overlap) */
.report ul {
    list-style: none;
    margin: 5px 0 30px 0;
    padding: 0;
}

.report .quick-icon .text {
    word-wrap: break-word;
    white-space: normal;
    line-height: 1.2;
}

@media (max-width: 768px) {
    .report .quick-icon {
        min-height: auto !important;
        height: auto !important;
    }

        .report .quick-icon .text {
            font-size: 0.9em;
            padding: 5px;
        }
}
/* Bootstrap 4 Custom Styles for Workplace Learning Connection */
/* Survey Edit page styles - scoped to avoid overlap */
.survey-edit .status-radio-container .radio-item {
    margin-bottom: 8px;
    padding-right: 10px;
}

    .survey-edit .status-radio-container .radio-item label {
        margin-left: 5px;
        white-space: nowrap;
    }

@media (max-width: 767.98px) {
    .survey-edit .status-radio-container .col-sm-2,
    .survey-edit .status-radio-container .col-sm-6 {
        width: 100% !important;
        margin-bottom: 15px;
        padding-right: 0;
    }

    .survey-edit .status-date-container .col-sm-4 {
        width: 100% !important;
        margin-bottom: 15px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .survey-edit .status-radio-container .row {
        flex-direction: column !important;
    }

    .survey-edit .status-radio-container .col-sm-2,
    .survey-edit .status-radio-container .col-sm-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 15px;
    }
}

@media (min-width: 1025px) {
    .survey-edit .status-radio-container .col-sm-2 {
        width: 20% !important;
    }

    .survey-edit .status-radio-container .col-sm-6 {
        width: 60% !important;
    }
}

@media (min-width: 1024px) and (max-width: 1024px) {
    .survey-edit .col-lg-3 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    .survey-edit .table-responsive {
        overflow-x: auto !important;
        width: 100% !important;
    }
}

@media (max-height: 520px) {
    .survey-edit .status-radio-container .row {
        flex-direction: column !important;
    }

    .survey-edit .status-radio-container .col-sm-2,
    .survey-edit .status-radio-container .col-sm-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 12px;
    }
}

.survey-edit .status-date-container {
    display: none !important;
}

/* WLC FIXED LAYOUT - DO NOT TOUCH! */
html, body {
    width: 100%;
    height: 100%;
}

/* Header Styles - Updated for Bootstrap 4 */
#header {
    position: fixed;
    top: 0;
    left: 0;
    height: 60px;
    width: 100%;
    background: #333;
    color: #fff;
    box-shadow: inset 0 -5px 5px rgba(0,0,0,.4);
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
}

#middle {
    height: auto;
    min-height: 100%;
    background: #fff;
    padding: 0 0 0 200px;
}

#fixed-nav {
    background: #e6e6e6;
    width: 200px;
    position: fixed;
    left: 0;
    top: 60px;
    height: 91%;
    overflow-y: auto;
}

#footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 30px;
    background: #333;
    color: #999;
    line-height: 30px;
    font-size: 12px;
    padding-left: 5px;
}

#main {
    padding-top: 30px;
    padding-bottom: 50px;
    /*    display: inline-block;*/
    margin-bottom: 30px;
    width: 100%;
}

/* Global Styles */
a:focus {
    outline: none;
}

h1 {
    font-weight: 300;
    margin: 0;
}

h2 {
    font-size: 21px;
    color: #333;
    /*border-bottom: 1px solid #ccc;*/
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
}

h3 {
    font-size: 12px;
}

h4 {
    font-size: 12px;
    color: #666;
    text-transform: uppercase;
}

.btn-default {
    background: #f3f3f3;
}

/* Animate These */
#header a, #fixed-nav a, #banner .nav-tabs a, ul a {
    -webkit-transition: all .15s linear;
    -moz-transition: all .15s linear;
    -o-transition: all .15s linear;
    transition: all .15s linear;
}

/* Fixed Header Styles - Updated for Bootstrap 4 */
.header-left {
    display: flex;
    align-items: center;
    flex: 1;
}

.brand {
    font: 21px "Ubuntu", Arial, Helvetica, sans-serif;
    line-height: 60px;
    color: #fff;
    display: flex;
    align-items: center;
    text-decoration: none;
    margin-right: 20px;
}

    .brand:hover {
        color: #fff;
        text-decoration: none;
        opacity: .9;
    }

    .brand img {
        margin-right: 10px;
        height: 30px;
        width: auto;
    }

/* Header Tools - Updated for Bootstrap 4 */
#hdr-tools {
    display: flex;
    align-items: center;
    gap: 15px;
}

.separator {
    width: 1px;
    height: 30px;
    background-color: #fff;
    opacity: 0.7;
}

#hdr-tools ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

#hdr-tools a {
    color: #fff;
    padding: 0 5px;
    display: block;
    opacity: .7;
    text-decoration: none;
}

    #hdr-tools a:hover {
        background: none;
        opacity: 1;
        border-radius: 0;
        text-decoration: none;
    }

#hdr-tools p {
    line-height: 60px;
    display: block;
    opacity: .7;
    padding: 0 5px 0 0;
    margin: 0;
}

/* Search Styles - Updated for Bootstrap 4 */
#search {
    padding: 2px 10px 0 0;
    margin-right: 0;
    display: flex;
    align-items: center;
}

    #search .form-group {
        margin: 0;
        display: flex;
        align-items: center;
    }

    #search input, #search button {
        height: 30px;
        padding: 3px 6px 3px 10px;
        border: none;
        border-radius: 0;
    }

    #search input {
        margin-right: -8px;
        border-radius: 3px 0 0 3px;
        width: 170px;
        background: #ccc;
        border: none;
        outline: none;
    }

    #search button {
        padding: 0 8px;
        border-radius: 0 3px 3px 0;
        background: #007bff;
        color: white;
        border: none;
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 30px;
    }

        #search button:hover {
            background: #0056b3;
        }

        #search button i {
            font-size: 14px;
        }

/* Warning Banner - Updated for Bootstrap 4 */
.hdr-warning {
    margin-left: 30px;
    color: white;
    font-size: 16px;
    border: 2px solid red;
    padding: 6px 12px;
    background-color: red !important;
    border-radius: 4px;
    font-weight: bold;
    white-space: nowrap;
    display: inline-block;
}

@media(max-width:1320px) {
    .hdr-warning {
        display: none;
    }
}

/* Navigation Styles - Updated for Bootstrap 4 */
#fixed-nav {
    border-right: 4px solid #333;
    background: #e6e6e6;
    width: 200px;
    position: fixed;
    left: 0;
    top: 60px;
    height: calc(100vh - 90px);
    overflow-y: auto;
    z-index: 40;
}

    #fixed-nav ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    #fixed-nav a {
        display: block;
        text-decoration: none;
    }

    #fixed-nav > ul > li > a {
        padding: 12px 15px;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #f2f2f2;
        font: 500 16px 'Ubuntu', Arial, Helvetica, sans-serif;
        color: #333;
        position: relative;
        text-shadow: 1px 1px 0 #fff;
        transition: all 0.2s ease;
    }

        #fixed-nav > ul > li > a span {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
        }

    #fixed-nav > ul > li:last-child a {
        box-shadow: 0 1px 0 #f2f2f2;
    }

    #fixed-nav a:hover {
        background: rgba(0,0,0,.05);
        text-decoration: none;
    }

    #fixed-nav > ul > li > a:focus {
        background: rgba(255,255,255,.35);
        text-decoration: none;
    }

    #fixed-nav > ul > li.active > a {
        color: #fff;
        background: #0167a7;
        border-color: #00568c;
        text-shadow: 1px 1px 0 #666;
    }

    #fixed-nav ul ul li.active a {
        font-weight: 700;
        color: #0167a7;
    }

    #fixed-nav ul ul {
        background: #d7d7d7;
        border-top: 1px solid #c4c4c4;
        border-bottom: 1px solid #c4c4c4;
        margin-top: -1px;
    }

        #fixed-nav ul ul a {
            padding: 8px 15px 8px 25px;
            color: #333;
            font: 400 14px "Ubuntu", Arial, Helvetica, sans-serif;
        }

        #fixed-nav ul ul li:first-child a {
            margin-top: 10px;
        }

        #fixed-nav ul ul li:last-child a {
            margin-bottom: 15px;
        }

/* Banner Styles - Updated for Bootstrap 4 */
#banner {
    background: url(../../Bootstrap3/img/bkg-icon.jpg) 0 0 no-repeat #0167a7;
    color: #fff;
    padding: 20px 20px 0 20px;
    border-top: 1px solid #1c83c3;
    position: relative;
    box-shadow: inset 0 -5px 5px rgba(0,0,0,.2);
    margin: 0 0 10px 0;
    display: block;
    justify-content: space-between;
    align-items: center;
}

    #banner h1 {
        padding: 0px 0 20px 0;
        margin: 0;
        flex: 1;
    }

    #banner .nav-tabs {
        border: none;
        margin: 0 0 0 0;
    }

        #banner .nav-tabs a {
            color: #fff;
            color: rgba(255,255,255,.8);
            border: none;
        }

            #banner .nav-tabs a:hover, #banner .nav-tabs a:focus {
                background: none;
                color: #fff;
            }

        #banner .nav-tabs li.active a {
            color: #555;
        }

.banner-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .banner-actions .btn {
        border-color: #004f80;
    }

/* Form Styles - Updated for Bootstrap 4 */
.form-condensed .form-group {
    margin-top: 0;
    margin-bottom: 5px;
}

    .form-condensed .form-group .btn {
        height: 28px;
    }

.form-condensed .form-control {
    height: 28px;
    padding: 4px 6px 2px;
    font-size: 12px;
}

.search-actions {
    border-top: 1px solid #e6e6e6;
    padding-top: 10px;
    margin-top: 5px;
    width: 100%;
    float: left;
}

.support a {
    background-color: red !important;
    text-shadow: 1px 1px 0 red !important;
}

    .support a:hover {
        background-color: red !important;
        text-shadow: 1px 1px 0 red !important;
    }

/* Responsive Design - Updated for Bootstrap 4 */
@media (max-width: 1024px) {
    .hdr-auto {
        height: auto !important;
    }

    .mdl-pad-top {
        padding-top: 7% !important;
    }

    .fixed-nav-top {
        padding-top: 7% !important;
    }
}

/* Tablet breakpoint - hide header tools and show mobile menu */
@media (max-width: 991px) {
    /* Hide header tools on tablet - moved to mobile menu */
    #hdr-tools {
        display: none;
    }

    /* Show mobile menu toggle on tablet */
    .mobile-menu-toggle {
        display: block;
        position: fixed;
        top: 15px;
        left: 15px;
        z-index: 1000;
        background: #333;
        color: white;
        border: none;
        padding: 8px 12px;
        border-radius: 4px;
        font-size: 16px;
    }

    /* Hide fixed navigation on tablet */
    #fixed-nav {
        display: none;
    }

    #middle {
        padding-left: 0;
    }

    /* Increase main padding-top for tablet */
    #main {
        padding-top: 70px;
    }
}

@media (max-width: 1023px) {

    .portal-ulNav {
        display: none;
    }

    .mobile-menu-toggle-portal {
        display: block;
        position: fixed;
        top: 15px;
        left: 15px;
        z-index: 1000;
        background: #333;
        color: white;
        border: none;
        padding: 8px 12px;
        border-radius: 4px;
        font-size: 16px;
    }

    .hdr-auto {
        height: auto !important;
    }

    .mdl-pad-top {
        padding-top: 7% !important;
    }

    .fixed-nav-top {
        padding-top: 7% !important;
    }

    .hdr-warning {
        margin-left: 15px;
        color: white;
        font-size: 14px;
        border: 2px solid red;
        padding: 6px 8px;
        background-color: red !important;
    }

    #header {
        flex-direction: column;
        height: auto;
        /*        padding: 10px 15px;*/
    }

    .header-left {
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 10px;
    }

    .brand {
        margin-bottom: 10px;
        margin-right: 0;
    }

    /* Mobile menu overlay */
    .mobile-menu-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.5);
        z-index: 999;
    }

        .mobile-menu-overlay.show {
            display: block;
        }

    /* Mobile menu panel */
    .mobile-menu-panel {
        position: fixed;
        top: 0;
        left: -280px;
        width: 280px;
        height: 100%;
        background: #e6e6e6;
        z-index: 1000;
        transition: left 0.3s ease;
        overflow-y: auto;
    }

        .mobile-menu-panel.show {
            left: 0;
        }

    /* Mobile user section styling */
    .mobile-user-section {
        padding: 15px;
        border-bottom: 1px solid #ccc;
        background: #f8f9fa;
    }

    .mobile-user-info {
        margin-bottom: 15px;
    }

        .mobile-user-info p {
            margin: 0 0 10px 0;
            font-size: 16px;
            color: #333;
        }

    .mobile-nav-links {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .mobile-nav-links li {
            margin-bottom: 5px;
        }

        .mobile-nav-links a {
            color: #0167a7;
            text-decoration: none;
            font-size: 14px;
            padding: 5px 0;
            display: block;
        }

            .mobile-nav-links a:hover {
                color: #0056b3;
                text-decoration: underline;
            }

    .mobile-search {
        display: flex;
        align-items: center;
        gap: 5px;
    }

        .mobile-search .form-group {
            flex: 1;
            margin: 0;
        }

        .mobile-search input {
            width: 100%;
            padding: 8px 12px;
            border: 1px solid #ccc;
            border-radius: 4px;
            font-size: 14px;
        }

        .mobile-search button {
            padding: 8px 12px;
            background: #007bff;
            color: white;
            border: none;
            border-radius: 4px;
            font-size: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 40px;
        }

            .mobile-search button:hover {
                background: #0056b3;
            }

    .mobile-menu-panel ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .mobile-menu-panel a {
        display: block;
        padding: 12px 15px;
        color: #333;
        text-decoration: none;
        border-bottom: 1px solid #ccc;
    }

        .mobile-menu-panel a:hover {
            background: rgba(0,0,0,.05);
        }

    .mobile-menu-panel .active > a {
        background: #0167a7;
        color: white;
    }
}

@media (max-width: 576px) {
    #header {
        padding: 10px 15px;
    }

    .header-left {
        margin-bottom: 5px;
    }

    .brand {
        font-size: 18px;
        line-height: 40px;
    }

        .brand img {
            height: 25px;
        }

    .hdr-warning {
        font-size: 12px;
        padding: 4px 6px;
        margin-left: 10px;
    }

    /* Adjust mobile menu for smaller screens */
    .mobile-menu-panel {
        width: 260px;
    }

    .mobile-user-section {
        padding: 10px;
    }

    .mobile-user-info p {
        font-size: 14px;
    }

    .mobile-search input {
        font-size: 12px;
        padding: 6px 10px;
    }

    .mobile-search button {
        padding: 6px 10px;
        font-size: 12px;
        min-width: 35px;
    }
}

/* Telerik Overrides - Updated for Bootstrap 4 */
.RadGrid_Metro {
    border-radius: 5px;
    -webkit-border-radius: 5px;
}

    .RadGrid_Metro .rgMasterTable {
        font-size: 13px !important;
    }

.RadGrid .rgRow td, .RadGrid .rgAltRow td {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
}

    .RadGrid .rgRow td .btn-sm, .RadGrid .rgAltRow td .btn-sm {
        padding: 3px 5px;
        font-size: 11px;
    }

.RadGrid_Metro .rgActiveRow td, .RadGrid_Metro .rgSelectedRow td {
    background-color: #0167A7;
    border-color: #0167A7 !important;
}

.RadGrid_Metro .rgActiveRow td, .RadGrid_Metro .rgSelectedRow .school-name {
    color: #fff;
    opacity: .7;
}

.RadGrid_MetroTouch td.rgPagerCell {
    border-bottom: 1px solid #cdcdce !important;
    border-top: 0 none !important;
    border-width: 0 0 1px !important;
}

/* .RadPicker {
    max-width: 280px;
} */

.rcInputCell input {
    border-color: #ccc !important;
    border-radius: 5px 0 0 5px !important;
    font-size: 14px;
    height: 32px !important;
}

/*.rcCalPopup {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-position: 4px 3px !important;
    border-bottom: 1px solid #ccc;
    border-image: none;
    border-left: medium none !important;
    border-radius: 0 5px 5px 0;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    margin-left: -2px !important;
    padding: 4px !important;
    z-index: auto !important;
}*/

/*.rcTimePopup {
    border-radius: 0 5px 5px 0; 
    border-right: 1px solid #ccc; 
    border-top: 1px solid #ccc; 
    margin-left: -2px !important; 
    border-bottom: 1px solid #ccc; 
    background-position: 3px -97px !important; 
    padding: 4px !important;
    z-index: auto !important;
}*/

.rslHorizontal {
    z-index: 0 !important;
}

.RadGrid .form-group {
    margin-bottom: 0px !important;
    padding-top: 5px;
}

.RadTabStrip_Metro .rtsLevel1 .rtsLink {
    border-radius: 6px !important;
    -webkit-border-radius: 6px !important;
}

.RadGrid_Metro a.btn {
    color: #fff !important;
}

/* Additional Bootstrap 4 Utilities */
.clear {
    clear: both;
}

/* Gap utility for flexbox spacing */
.gap-2 {
    gap: 0.5rem;
}

.gap-3 {
    gap: 1rem;
}

.attribution {
    float: right;
    color: #fff;
    font-size: 12px;
}

.powered-by {
    color: #fff;
    width: 210px;
}

    .powered-by span {
        float: left;
        margin-right: 10px;
    }

    .powered-by img {
        width: 120px;
        float: left;
    }

.powered-by-admin img {
    padding-top: 6px;
}

.chk-deletelogo {
    display: block;
    padding-top: 7px;
}

.bg-color-disable {
    background-color: #f5f5f5;
    border: 1px solid #cccccc;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    color: #555555;
    display: block;
    font-size: 14px;
    height: 34px;
    line-height: 1.42857;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

h2 .noline {
    border-bottom: 0px !important;
    padding: 0 !important;
}

.Accept {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
    width: 200px;
}

.Reject {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a;
    width: 200px;
}

.t5 {
    top: 5px !important;
}

.font16 label {
    font-size: 16px;
}

.rgDataDiv {
    height: auto !important;
}

/* Custom card header color override */
.card-header.bg-primary {
    color: #fff;
    background-color: #0167a7 !important;
    border-color: #00568c !important;
}

.checkbox-list {
    max-width: 100% !important;
}

    .checkbox-list label {
        vertical-align: text-top;
    }

/* Specific styling for school edit form checkboxes only */
.school-checkbox-list label {
    vertical-align: middle;
    display: inline-block;
    margin-left: 5px;
    margin-bottom: 0;
}

.school-checkbox-list table {
    border-collapse: separate;
    border-spacing: 0;
}

.school-checkbox-list td {
    vertical-align: middle;
    padding: 2px 5px;
    white-space: nowrap;
}

.school-checkbox-list input[type="checkbox"] {
    margin-right: 5px;
    vertical-align: middle;
}

.control-label {
    font-weight: bold;
}

@media (min-width: 576px) {
    .checkbox-list label {
        margin-left: 2px;
        display: inline;
    }
}

/* Bootstrap 4 specific overrides */
.navbar-nav {
    flex-direction: row;
}

.navbar-form {
    display: flex;
    align-items: center;
}

.navbar-right {
    margin-left: auto;
}

/* Fix for Bootstrap 4 button groups */
.btn-group > .btn {
    position: relative;
    flex: 1 1 auto;
}

/* Fix for Bootstrap 4 form controls */
.form-control:focus {
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* Fix for Bootstrap 4 dropdowns */
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0.125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
}

    .dropdown-menu.show {
        display: block;
    }

/* ===== ESSENTIAL STYLES FROM ORIGINAL CUSTOM.CSS ===== */

/* GLYPHICONS SUPPORT FOR BOOTSTRAP 4 */
@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/fonts/glyphicons-halflings-regular.eot');
    src: url('https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/fonts/glyphicons-halflings-regular.woff') format('woff'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Essential Glyphicons - Add the most commonly used ones */
.glyphicon-asterisk:before {
    content: "\2a";
}

.glyphicon-plus:before {
    content: "\2b";
}

.glyphicon-minus:before {
    content: "\2212";
}

.glyphicon-search:before {
    content: "\e003";
}

.glyphicon-user:before {
    content: "\e008";
}

.glyphicon-ok:before {
    content: "\e013";
}

.glyphicon-remove:before {
    content: "\e014";
}

.glyphicon-home:before {
    content: "\e021";
}

.glyphicon-file:before {
    content: "\e022";
}

.glyphicon-time:before {
    content: "\e023";
}

.glyphicon-download:before {
    content: "\e025";
}

.glyphicon-upload:before {
    content: "\e027";
}

.glyphicon-lock:before {
    content: "\e033";
}

.glyphicon-flag:before {
    content: "\e034";
}

.glyphicon-book:before {
    content: "\e043";
}

.glyphicon-print:before {
    content: "\e045";
}

.glyphicon-camera:before {
    content: "\e046";
}

.glyphicon-list:before {
    content: "\e056";
}

.glyphicon-map-marker:before {
    content: "\e062";
}

.glyphicon-edit:before {
    content: "\e065";
}

.glyphicon-check:before {
    content: "\e067";
}

.glyphicon-chevron-left:before {
    content: "\e079";
}

.glyphicon-chevron-right:before {
    content: "\e080";
}

.glyphicon-chevron-up:before {
    content: "\e113";
}

.glyphicon-chevron-down:before {
    content: "\e114";
}

.glyphicon-calendar:before {
    content: "\e109";
}

.glyphicon-briefcase:before {
    content: "\e139";
}

.glyphicon-dashboard:before {
    content: "\e141";
}

.glyphicon-phone:before {
    content: "\e145";
}

.glyphicon-usd:before {
    content: "\e148";
}

.glyphicon-sort:before {
    content: "\e150";
}

.glyphicon-log-in:before {
    content: "\e161";
}

.glyphicon-log-out:before {
    content: "\e163";
}

.glyphicon-wrench:before {
    content: "\e136";
}

.glyphicon-tasks:before {
    content: "\e137";
}

.glyphicon-filter:before {
    content: "\e138";
}

.glyphicon-eye-open:before {
    content: "\e105";
}

.glyphicon-eye-close:before {
    content: "\e106";
}

.glyphicon-warning-sign:before {
    content: "\e107";
}

.glyphicon-info-sign:before {
    content: "\e086";
}

.glyphicon-question-sign:before {
    content: "\e085";
}

.glyphicon-exclamation-sign:before {
    content: "\e101";
}

.glyphicon-remove-sign:before {
    content: "\e083";
}

.glyphicon-ok-sign:before {
    content: "\e084";
}

.glyphicon-plus-sign:before {
    content: "\e081";
}

.glyphicon-minus-sign:before {
    content: "\e082";
}

.glyphicon-arrow-left:before {
    content: "\e091";
}

.glyphicon-arrow-right:before {
    content: "\e092";
}

.glyphicon-arrow-up:before {
    content: "\e093";
}

.glyphicon-arrow-down:before {
    content: "\e094";
}

.glyphicon-share:before {
    content: "\e066";
}

.glyphicon-resize-full:before {
    content: "\e096";
}

.glyphicon-resize-small:before {
    content: "\e097";
}

.glyphicon-zoom-in:before {
    content: "\e015";
}

.glyphicon-zoom-out:before {
    content: "\e016";
}

.glyphicon-off:before {
    content: "\e017";
}

.glyphicon-signal:before {
    content: "\e018";
}

.glyphicon-cog:before {
    content: "\e019";
}

.glyphicon-trash:before {
    content: "\e020";
}

.glyphicon-road:before {
    content: "\e024";
}

.glyphicon-download-alt:before {
    content: "\e025";
}

.glyphicon-inbox:before {
    content: "\e028";
}

.glyphicon-play-circle:before {
    content: "\e029";
}

.glyphicon-repeat:before {
    content: "\e030";
}

.glyphicon-refresh:before {
    content: "\e031";
}

.glyphicon-list-alt:before {
    content: "\e032";
}

.glyphicon-headphones:before {
    content: "\e035";
}

.glyphicon-volume-off:before {
    content: "\e036";
}

.glyphicon-volume-down:before {
    content: "\e037";
}

.glyphicon-volume-up:before {
    content: "\e038";
}

.glyphicon-qrcode:before {
    content: "\e039";
}

.glyphicon-barcode:before {
    content: "\e040";
}

.glyphicon-tag:before {
    content: "\e041";
}

.glyphicon-tags:before {
    content: "\e042";
}

.glyphicon-bookmark:before {
    content: "\e044";
}

.glyphicon-font:before {
    content: "\e047";
}

.glyphicon-bold:before {
    content: "\e048";
}

.glyphicon-italic:before {
    content: "\e049";
}

.glyphicon-text-height:before {
    content: "\e050";
}

.glyphicon-text-width:before {
    content: "\e051";
}

.glyphicon-align-left:before {
    content: "\e052";
}

.glyphicon-align-center:before {
    content: "\e053";
}

.glyphicon-align-right:before {
    content: "\e054";
}

.glyphicon-align-justify:before {
    content: "\e055";
}

.glyphicon-indent-left:before {
    content: "\e057";
}

.glyphicon-indent-right:before {
    content: "\e058";
}

.glyphicon-facetime-video:before {
    content: "\e059";
}

.glyphicon-picture:before {
    content: "\e060";
}

.glyphicon-adjust:before {
    content: "\e063";
}

.glyphicon-tint:before {
    content: "\e064";
}

.glyphicon-move:before {
    content: "\e068";
}

.glyphicon-step-backward:before {
    content: "\e069";
}

.glyphicon-fast-backward:before {
    content: "\e070";
}

.glyphicon-backward:before {
    content: "\e071";
}

.glyphicon-play:before {
    content: "\e072";
}

.glyphicon-pause:before {
    content: "\e073";
}

.glyphicon-stop:before {
    content: "\e074";
}

.glyphicon-forward:before {
    content: "\e075";
}

.glyphicon-fast-forward:before {
    content: "\e076";
}

.glyphicon-step-forward:before {
    content: "\e077";
}

.glyphicon-eject:before {
    content: "\e078";
}

.glyphicon-plus-sign:before {
    content: "\e081";
}

.glyphicon-minus-sign:before {
    content: "\e082";
}

.glyphicon-remove-sign:before {
    content: "\e083";
}

.glyphicon-ok-sign:before {
    content: "\e084";
}

.glyphicon-question-sign:before {
    content: "\e085";
}

.glyphicon-info-sign:before {
    content: "\e086";
}

.glyphicon-screenshot:before {
    content: "\e087";
}

.glyphicon-remove-circle:before {
    content: "\e088";
}

.glyphicon-ok-circle:before {
    content: "\e089";
}

.glyphicon-ban-circle:before {
    content: "\e090";
}

.glyphicon-share-alt:before {
    content: "\e095";
}

.glyphicon-exclamation-sign:before {
    content: "\e101";
}

.glyphicon-gift:before {
    content: "\e102";
}

.glyphicon-leaf:before {
    content: "\e103";
}

.glyphicon-fire:before {
    content: "\e104";
}

.glyphicon-plane:before {
    content: "\e108";
}

.glyphicon-random:before {
    content: "\e110";
}

.glyphicon-comment:before {
    content: "\e111";
}

.glyphicon-magnet:before {
    content: "\e112";
}

.glyphicon-retweet:before {
    content: "\e115";
}

.glyphicon-shopping-cart:before {
    content: "\e116";
}

.glyphicon-folder-close:before {
    content: "\e117";
}

.glyphicon-folder-open:before {
    content: "\e118";
}

.glyphicon-resize-vertical:before {
    content: "\e119";
}

.glyphicon-resize-horizontal:before {
    content: "\e120";
}

.glyphicon-hdd:before {
    content: "\e121";
}

.glyphicon-bullhorn:before {
    content: "\e122";
}

.glyphicon-bell:before {
    content: "\e123";
}

.glyphicon-certificate:before {
    content: "\e124";
}

.glyphicon-thumbs-up:before {
    content: "\e125";
}

.glyphicon-thumbs-down:before {
    content: "\e126";
}

.glyphicon-hand-right:before {
    content: "\e127";
}

.glyphicon-hand-left:before {
    content: "\e128";
}

.glyphicon-hand-up:before {
    content: "\e129";
}

.glyphicon-hand-down:before {
    content: "\e130";
}

.glyphicon-circle-arrow-right:before {
    content: "\e131";
}

.glyphicon-circle-arrow-left:before {
    content: "\e132";
}

.glyphicon-circle-arrow-up:before {
    content: "\e133";
}

.glyphicon-circle-arrow-down:before {
    content: "\e134";
}

.glyphicon-globe:before {
    content: "\e135";
}

.glyphicon-fullscreen:before {
    content: "\e140";
}

.glyphicon-paperclip:before {
    content: "\e142";
}

.glyphicon-heart-empty:before {
    content: "\e143";
}

.glyphicon-link:before {
    content: "\e144";
}

.glyphicon-pushpin:before {
    content: "\e146";
}

.glyphicon-gbp:before {
    content: "\e149";
}

.glyphicon-sort-by-alphabet:before {
    content: "\e151";
}

.glyphicon-sort-by-alphabet-alt:before {
    content: "\e152";
}

.glyphicon-sort-by-order:before {
    content: "\e153";
}

.glyphicon-sort-by-order-alt:before {
    content: "\e154";
}

.glyphicon-sort-by-attributes:before {
    content: "\e155";
}

.glyphicon-sort-by-attributes-alt:before {
    content: "\e156";
}

.glyphicon-unchecked:before {
    content: "\e157";
}

.glyphicon-expand:before {
    content: "\e158";
}

.glyphicon-collapse-down:before {
    content: "\e159";
}

.glyphicon-collapse-up:before {
    content: "\e160";
}

.glyphicon-flash:before {
    content: "\e162";
}

.glyphicon-new-window:before {
    content: "\e164";
}

.glyphicon-record:before {
    content: "\e165";
}

.glyphicon-save:before {
    content: "\e166";
}

.glyphicon-open:before {
    content: "\e167";
}

.glyphicon-saved:before {
    content: "\e168";
}

.glyphicon-import:before {
    content: "\e169";
}

.glyphicon-export:before {
    content: "\e170";
}

.glyphicon-send:before {
    content: "\e171";
}

.glyphicon-floppy-disk:before {
    content: "\e172";
}

.glyphicon-floppy-saved:before {
    content: "\e173";
}

.glyphicon-floppy-remove:before {
    content: "\e174";
}

.glyphicon-floppy-save:before {
    content: "\e175";
}

.glyphicon-floppy-open:before {
    content: "\e176";
}

.glyphicon-credit-card:before {
    content: "\e177";
}

.glyphicon-transfer:before {
    content: "\e178";
}

.glyphicon-cutlery:before {
    content: "\e179";
}

.glyphicon-header:before {
    content: "\e180";
}

.glyphicon-compressed:before {
    content: "\e181";
}

.glyphicon-earphone:before {
    content: "\e182";
}

.glyphicon-phone-alt:before {
    content: "\e183";
}

.glyphicon-tower:before {
    content: "\e184";
}

.glyphicon-stats:before {
    content: "\e185";
}

.glyphicon-sd-video:before {
    content: "\e186";
}

.glyphicon-hd-video:before {
    content: "\e187";
}

.glyphicon-subtitles:before {
    content: "\e188";
}

.glyphicon-sound-stereo:before {
    content: "\e189";
}

.glyphicon-sound-dolby:before {
    content: "\e190";
}

.glyphicon-sound-5-1:before {
    content: "\e191";
}

.glyphicon-sound-6-1:before {
    content: "\e192";
}

.glyphicon-sound-7-1:before {
    content: "\e193";
}

.glyphicon-copyright-mark:before {
    content: "\e194";
}

.glyphicon-registration-mark:before {
    content: "\e195";
}

.glyphicon-cloud-download:before {
    content: "\e197";
}

.glyphicon-cloud-upload:before {
    content: "\e198";
}

.glyphicon-tree-conifer:before {
    content: "\e199";
}

.glyphicon-tree-deciduous:before {
    content: "\e200";
}

.glyphicon-cd:before {
    content: "\e201";
}

.glyphicon-save-file:before {
    content: "\e202";
}

.glyphicon-open-file:before {
    content: "\e203";
}

.glyphicon-level-up:before {
    content: "\e204";
}

.glyphicon-copy:before {
    content: "\e205";
}

.glyphicon-paste:before {
    content: "\e206";
}

.glyphicon-alert:before {
    content: "\e209";
}

.glyphicon-equalizer:before {
    content: "\e210";
}

.glyphicon-king:before {
    content: "\e211";
}

.glyphicon-queen:before {
    content: "\e212";
}

.glyphicon-pawn:before {
    content: "\e213";
}

.glyphicon-bishop:before {
    content: "\e214";
}

.glyphicon-knight:before {
    content: "\e215";
}

.glyphicon-baby-formula:before {
    content: "\e216";
}

.glyphicon-tent:before {
    content: "\26fa";
}

.glyphicon-blackboard:before {
    content: "\e218";
}

.glyphicon-bed:before {
    content: "\e219";
}

.glyphicon-apple:before {
    content: "\f8ff";
}

.glyphicon-erase:before {
    content: "\e221";
}

.glyphicon-hourglass:before {
    content: "\231b";
}

.glyphicon-lamp:before {
    content: "\e223";
}

.glyphicon-duplicate:before {
    content: "\e224";
}

.glyphicon-piggy-bank:before {
    content: "\e225";
}

.glyphicon-scissors:before {
    content: "\e226";
}

.glyphicon-bitcoin:before {
    content: "\e227";
}

.glyphicon-btc:before {
    content: "\e227";
}

.glyphicon-xbt:before {
    content: "\e227";
}

.glyphicon-yen:before {
    content: "\00a5";
}

.glyphicon-jpy:before {
    content: "\00a5";
}

.glyphicon-ruble:before {
    content: "\20bd";
}

.glyphicon-rub:before {
    content: "\20bd";
}

.glyphicon-scale:before {
    content: "\e230";
}

.glyphicon-ice-lolly:before {
    content: "\e231";
}

.glyphicon-ice-lolly-tasted:before {
    content: "\e232";
}

.glyphicon-education:before {
    content: "\e233";
}

.glyphicon-option-horizontal:before {
    content: "\e234";
}

.glyphicon-option-vertical:before {
    content: "\e235";
}

.glyphicon-menu-hamburger:before {
    content: "\e236";
}

.glyphicon-modal-window:before {
    content: "\e237";
}

.glyphicon-oil:before {
    content: "\e238";
}

.glyphicon-grain:before {
    content: "\e239";
}

.glyphicon-sunglasses:before {
    content: "\e240";
}

.glyphicon-text-size:before {
    content: "\e241";
}

.glyphicon-text-color:before {
    content: "\e242";
}

.glyphicon-text-background:before {
    content: "\e243";
}

.glyphicon-object-align-top:before {
    content: "\e244";
}

.glyphicon-object-align-bottom:before {
    content: "\e245";
}

.glyphicon-object-align-horizontal:before {
    content: "\e246";
}

.glyphicon-object-align-left:before {
    content: "\e247";
}

.glyphicon-object-align-vertical:before {
    content: "\e248";
}

.glyphicon-object-align-right:before {
    content: "\e249";
}

.glyphicon-triangle-right:before {
    content: "\e250";
}

.glyphicon-triangle-left:before {
    content: "\e251";
}

.glyphicon-triangle-bottom:before {
    content: "\e252";
}

.glyphicon-triangle-top:before {
    content: "\e253";
}

.glyphicon-console:before {
    content: "\e254";
}

.glyphicon-superscript:before {
    content: "\e255";
}

.glyphicon-subscript:before {
    content: "\e256";
}

.glyphicon-menu-left:before {
    content: "\e257";
}

.glyphicon-menu-right:before {
    content: "\e258";
}

.glyphicon-menu-down:before {
    content: "\e259";
}

.glyphicon-menu-up:before {
    content: "\e260";
}

/* Additional Telerik Overrides */
.RadUpload .ruFileWrap {
    height: 32px !important;
}

.RadUpload .ruFakeInput {
    height: 20px !important;
    border-radius: 5px;
    -webkit-border-radius: 5px;
}

    .RadUpload .ruFakeInput:hover {
        cursor: pointer !important;
    }

.RadUpload_Default .ruButton {
    background-image: none !important;
    background: #5BC0DE !important;
    height: auto !important;
    width: auto !important;
    color: #fff !important;
    padding: 6px 12px !important;
    display: inline-block;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

.ruStyled:hover {
    cursor: crosshair !important;
}

.RadUpload_Default .ruButton:hover {
    cursor: crosshair !important;
}

div.RadUpload_Default .ruFileWrap .ruButtonHover {
    background: #31B0D5 !important;
    cursor: crosshair !important;
}

/* Form and Validation Styles */
.req {
    color: Red !important;
}


.btn-success {
    background-color: #5cb85c;
    border-color: #4cae4c;
    color: #ffffff !important;
}

.form-horizontal .control-label {
    text-align: left;
}

legend {
    border-width: 0 !important;
    width: auto !important;
    margin-bottom: 0px;
    margin-left: 10px !important;
}

fieldset {
    border: 1px solid !important;
    padding: 10px;
    margin-top: 3% !important;
}

.small, .text-muted {
    color: gray;
    font-size: 0.8em;
    vertical-align: top;
}

/* Bootstrap Sub child main navigation */
.childNav .nav-tabs > li.active > a, .childNav .nav-tabs > li.active > a:hover, .childNav .nav-tabs > li.active > a:focus {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #3276b1;
    border-color: #dddddd #dddddd transparent;
    border-image: none;
    border-style: solid;
    border-width: 1px;
    color: #fff;
    cursor: default;
}

.childNav .nav-tabs > li > a {
    background: none repeat scroll 0 0 #eeeeee;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
    color: #666;
    line-height: 1.42857;
    margin-left: 2px;
}

.childNav .nav > li > a {
    display: block;
    font-size: 12px;
    padding: 10px;
    position: relative;
}

.cms-tabs .rtsUL > li > a:hover {
    background-color: lightGray !important;
    border-radius: 4px 4px 0 0;
}

.cms-tabs .rtsUL > li:hover .rtsTxt {
    /*    color: White !important; */
    border-radius: 4px 4px 0 0;
}

.cms-tabs .rtsUL > li > a {
    background: none repeat scroll 0 0 #eeeeee;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0;
    color: #666 !important;
    line-height: 1.42857;
    margin-left: 2px;
}

.cms-tabs .rtsUL > li > a {
    display: block;
    font-size: 12px;
    padding: 9px;
    position: relative;
}

.cms-tabs .rtsTxt {
    text-transform: none !important;
}

.cms-tabs .rtsLevel .rtsUL {
    padding: 5px 5px 0;
}

.rtsOut {
    padding: 0 !important;
}

/* Filter Styles */
.filter {
    border: 1px solid #ccc;
    padding: 20px;
    margin: 0 0px;
    background: #f9f9f9;
    border-radius: 5px;
}

    .filter label {
        text-transform: uppercase;
        font-size: 12px;
        color: #888;
    }

    .filter .dropdown-toggle {
        position: relative;
    }

    .filter .dropdown-menu .active a {
        background: #eee;
        color: #333;
    }

    .filter .dropdown-menu a:hover {
        background: #aaa;
    }

    .filter .glyphicon {
        opacity: .5;
    }

.filterWidth {
    padding-right: 6px;
}

.checkbox-list td {
    vertical-align: top;
}

.checkbox-list label {
    font-weight: normal;
    margin-left: 0px;
    margin-right: 10px;
    vertical-align: top;
}

.checkbox-list-width label {
    width: 90%;
}

/* Comment Styles */
.commentText {
    border-bottom: 1px solid #eee;
    padding: 8px;
}

.commentWigit {
    background-color: #f4f4f4;
    border: 1px solid #D3D3D3;
    padding: 0;
}

.commentBar {
    background-color: #D3D3D3;
    padding: 3px;
}

.commentAdd {
    border-bottom: 1px solid #eee;
    padding: 8px;
}

.mt5 {
    margin-top: 5px;
}

/* Dropdown Menu Styles */
.dropdown-menu > li > a {
    color: #000 !important;
    padding: 3px 20px;
    text-decoration: none;
}

span.school-name {
    clear: both;
    display: block;
    font-size: 10px;
    color: #626262;
}

span.grade {
    font-size: 11px;
    float: right;
}

.dropdown-menu li.primary a:hover {
    background-color: #428BCA;
    color: #fff !important;
    border-radius: 0;
}

.dropdown-menu li.success a:hover {
    background-color: #5CB85C;
    color: #fff !important;
    border-radius: 0;
}

.dropdown-menu li.info a:hover {
    background-color: #5BC0DE;
    color: #fff !important;
    border-radius: 0;
}

.dropdown-menu li.warning a:hover {
    background-color: #F0AD4E;
    color: #fff !important;
    border-radius: 0;
}

.dropdown-menu li.danger a:hover {
    background-color: #D9534F;
    color: #fff !important;
    border-radius: 0;
}

.dropdown-menu li.inverse a:hover {
    background-color: #333333;
    color: #fff !important;
    border-radius: 0;
}

h3 {
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
}

.dark-blue {
    color: #204582;
}

.dark-blue-backgroud {
    background-color: #204582;
}

/* Quick Icon Styles */
a.quick-icon {
    padding: 30px 20px;
    background-color: #F6F6F6;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
    color: #fff;
    opacity: 0.8;
    width: 150px;
    text-align: center;
}

    a.quick-icon:hover {
        -webkit-box-shadow: inset 0 0 30px 0 rgba(0,0,0,0.3);
        box-shadow: inset 0 0 30px 0 rgba(0,0,0,0.8);
        text-decoration: none;
    }

    a.quick-icon span.text {
        font-size: 22px;
        position: relative;
        top: -8px;
    }

.glyphicon-lg {
    font-size: 30px;
}

.quick-icon .glyphicon {
    left: -2px;
}

a.quick-icon span.text {
    font-size: 18px;
    position: relative;
    top: -8px;
    display: block;
    margin-top: 20px;
    line-height: 25px;
}

.quick-icon-green {
    background-color: #37A840 !important;
}

.quick-icon-dark-green {
    background-color: #3D8942 !important;
}

.quick-icon-light-blue {
    background-color: #46AAEC !important;
}

.quick-icon-blue {
    background-color: #116CAA !important;
}

.quick-icon-grayblue {
    background-color: #6685BD !important;
}

.quick-icon-red {
    background-color: #CB250E !important;
}

.quick-icon-dark-red {
    background-color: #930000 !important;
}

.quick-icon-orange {
    background-color: #F39F4B !important;
}

.quick-icon-dark-orange {
    background-color: #E98210 !important;
}

.glyphicon-th-list:before {
    content: "\e012";
}

.quick-icon-purple {
    background-color: #7A55A8 !important;
}

.quick-icon-config {
    background-color: #D5D5D5 !important;
    color: #000 !important;
    text-shadow: 1px 1px 2px #fff;
    -webkit-box-shadow: inset 0 0 30px 0 rgba(255,255,255,0.4);
    box-shadow: inset 0 0 30px 0 rgba(255,255,255,0.4);
    border: 1px solid #bbb;
}

.quick-icon-sm {
    padding: 16px 6px !important;
}

    .quick-icon-sm .glyphicon {
        left: -11px !important;
        font-size: 20px;
        top: 7px;
    }

    .quick-icon-sm span {
        position: relative;
        top: -7px;
        line-height: 9px;
    }

/* Progress Bar Styles */
.progress {
    height: 40px;
    opacity: .8;
    border: 1px solid #999;
    overflow: scroll;
    scrollbar-width: none;
}

.progress-bar {
    font-size: 18px !important;
    padding-top: 0px !important;
    border-right: 2px solid #3F8F3F;
    border-left: 1px solid #ccc;
    min-width: 60px;
}

.progress-bar-default {
    background-color: #8C8C8C;
}

.progress-bar-dark-blue {
    background-color: #0951BD;
}

/* News Styles */
h4.news-title {
    font-size: 16px;
    margin-bottom: 0px;
}

article.news-item {
    margin-top: 15px;
}

/* Steps Styles */
.steps-2 .progress-bar-step {
    width: 100%;
}

.steps-4 .progress-bar-step {
    width: 100%;
}

.steps-6 .progress-bar-step {
    width: 100%;
}

.steps-6 .progress-bar-step-last {
    width: 100%;
}

.steps-9 .progress-bar-step {
    width: 100%;
}

.steps-9 .progress-bar-step-last {
    width: 100%;
}

.quick-icon h5 {
    font-size: 16px;
    margin-top: 7px;
    margin-bottom: 8px;
}

.green {
    color: #5CB85C;
}

.blue {
    color: #428BCA;
}

/* Responsive Quick Icons */
@media (min-width: 768px) {
    a.quick-icon {
        padding: 20px 10px;
        width: 96px;
    }

        a.quick-icon span.text {
            font-size: 12px;
            line-height: 12px;
        }

    .glyphicon-lg {
        font-size: 26px;
    }

    .quick-icon-sm {
        padding: 15px 10px !important;
    }

        .quick-icon-sm span {
            line-height: inherit;
        }

        .quick-icon-sm .glyphicon {
            left: -11px !important;
            font-size: 18px;
            top: 0;
        }

    .checkbox-list label {
        font-weight: normal;
        margin-left: 5px;
        margin-right: 5px;
    }

    #banner {
        display: flex;
    }
}

@media (min-width: 992px) {
    /* Medium devices styles */
}

@media (min-width: 1200px) {
    a.quick-icon {
        width: 190px;
        padding: 30px 20px;
    }

    .quick-icon-sm {
        padding: 12px 10px !important;
    }

        .quick-icon-sm .glyphicon {
            left: -2px !important;
            font-size: 30px;
            top: 2px;
        }

        .quick-icon-sm span {
            position: relative;
            top: -7px;
            line-height: 19px;
        }

    a.quick-icon span.text {
        font-size: 18px;
    }

    a.quick-icon-config span.text, .report a.quick-icon span.text {
        line-height: 18px;
    }

    .glyphicon-lg {
        font-size: 30px;
    }

    .checkbox-list label {
        font-weight: normal;
        font-size: 14px;
        margin-left: 10px;
        margin-right: 10px;
    }
}

@media (min-width: 1400px) {
    a.quick-icon {
        width: 220px;
    }

        a.quick-icon .quick-icon-sm {
            padding: 12px 20px;
        }
}

.checkbox label {
    display: inline-block;
    min-width: 50px;
}

.alert-required {
    padding: 5px;
    margin-bottom: 0px;
}

/* Chart Tab Formatting Fix */
.cms-tabs .rtsUL > li.rtsSelected > a, .cms-tabs .rtsUL > li.rtsSelected:hover > a, .cms-tabs .rtsUL > li.rtsSelected:focus > a {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #3276b1 !important;
    border-color: #dddddd #dddddd transparent;
    border-image: none;
    border-style: solid;
    border-width: 0px;
    color: #fff !important;
    cursor: pointer;
}

.cms-tabs .rtsUL > li.rtsSelected > a, .cms-tabs .rtsUL > li.rtsSelected:hover > a, .cms-tabs .rtsUL > li.rtsSelected:focus > a {
    border-width: 1px !important;
}

.cms-tabs .rtsLevel1 .rtsUL > li.rtsSelected > a, .cms-tabs .rtsUL > li.rtsSelected:hover > a, .cms-tabs .rtsUL > li.rtsSelected:focus > a {
    border-width: 0px !important;
}

.card {
    margin-bottom: 20px;
}

.bg-success {
    background-color: #beecab !important;
    color: #468847 !important;
}

.bg-warning {
    background-color: #fff1c5 !important;
    color: #e1a901 !important;
}

.bg-danger {
    background-color: #d83340 !important;
    color: #f1f0f0 !important;
}

.bg-info {
    background-color: #17a2b847 !important;
    color: #17a2b8 !important;
}

.btn-default {
    border-color: #cccccc;
}

#banner .pull-right {
    margin: 0px 0 20px 0;
}

.progress a {
    display: contents !important;
}

/* ===== PLACEMENT LIST MODAL STYLES ===== */
/* Modal positioning and sizing for placement list */
.modal-dialog.modal-lg {
    margin-top: 80px;
}

.modal-dialog.modal-sm {
    margin-top: 360px;
}

#popupLoaderPrivate {
    z-index: 99999;
}

#popupLoader {
    height: 100% !important;
}

    #popupLoader .modal-dialog.modal-dialog-centered.modal-sm {
        margin-top: 0px !important;
    }

@media (max-width: 430px) {
    #popupLoader .modal-dialog.modal-dialog-centered.modal-sm {
        margin-left: 20% !important;
    }
}

#loader {
    width: 160px;
}

label {
    display: inline-block;
}


/* ========================================
   Student Request In Progress - Custom Styles
   ======================================== */

/* Small format text styling */
.small-format {
    font-size: 10px;
    line-height: 16px;
}

/* Stationary Edit Radio Button Styles */
.form-check-inline input[type="radio"] {
    margin-right: 8px;
}

.form-check-inline label {
    margin-right: 25px;
    font-weight: normal;
}

/* ===== HORIZONTAL RADIO BUTTON STYLES ===== */
/* Bootstrap 4 horizontal radio button styling */
.form-check-horizontal table {
    border: none !important;
    width: auto !important;
}

/* Validation message styling */
.val-msg {
    font-weight: bold;
    display: block;
}

/* Custom scroll styling */
.custom-scroll {
    overflow-x: scroll;
}


/* Label styling to match the design */
.col-md-4 label {
    display: block !important;
    margin-bottom: 5px !important;
    font-weight: bold !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    letter-spacing: 0.5px !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    font-family: sans-serif !important;
}

/* Enhanced table responsiveness for RadGrid */
.table-responsive {
    /*    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;*/
    border: 1px solid #dee2e6 !important;
    border-radius: 0.375rem !important;
    width: 100% !important;
}

/* RadGrid specific responsive styling */
.RadGrid {
    width: 100% !important;
    border: none !important;
}

    .RadGrid .rgMasterTable {
        width: 100% !important;
        table-layout: auto !important;
    }

    .RadGrid .rgHeader {
        white-space: nowrap !important;
    }

    .RadGrid .rgRow {
        white-space: nowrap !important;
    }

    .RadGrid .rgAltRow {
        white-space: nowrap !important;
    }

    /* Ensure columns don't wrap */
    .RadGrid td, .RadGrid th {
        white-space: nowrap !important;
        padding: 8px !important;
    }

/* Desktop/Laptop view - No horizontal scroll, show all columns */
@media (min-width: 992px) {
    /*    .table-responsive {
        overflow-x: visible !important;
    }*/

    .RadGrid {
        min-width: auto !important;
    }

        .RadGrid .rgMasterTable {
            min-width: auto !important;
            width: 100% !important;
        }

        /* Allow text wrapping on desktop for better column fit */
        .RadGrid td, .RadGrid th {
            white-space: normal !important;
            word-wrap: break-word !important;
        }
}

/* Tablet view - Limited horizontal scroll */
@media (min-width: 768px) and (max-width: 991.98px) {
    .RadGrid {
        min-width: 1000px !important;
    }

        .RadGrid .rgMasterTable {
            min-width: 1000px !important;
        }
}

/* Mobile view - Full horizontal scroll */
@media (max-width: 767.98px) {
    /*    .table-responsive {
        font-size: 0.875rem !important;
    }*/
    .RadGrid {
        min-width: 1200px !important;
    }

        .RadGrid .rgMasterTable {
            min-width: 1200px !important;
        }
}

/* Override Telerik's built-in scrolling for desktop */
@media (min-width: 992px) {
    .RadGrid .rgScrollWrapper {
        overflow-x: visible !important;
    }

    .RadGrid .rgScroll {
        overflow-x: visible !important;
    }
}

.form-check-horizontal label {
    margin-bottom: 0;
    cursor: pointer;
    padding-left: 0;
    vertical-align: middle;
    display: inline-block;
    font-weight: normal;
    color: #333;
}

/* ========================================
   Student Request In Progress - Additional Styles
   ======================================== */

/* Telerik RadDatePicker Custom Styling */
.date-pic {
    width: 100% !important;
}

    .date-pic .RadInput {
        width: 100% !important;
    }

        .date-pic .RadInput .riTextBox {
            width: 100% !important;
            padding: 8px 35px 8px 12px !important;
            border: 1px solid #d1d5db !important;
            border-radius: 4px !important;
            background-color: white !important;
            font-size: 14px !important;
            color: #374151 !important;
            outline: none !important;
            transition: border-color 0.2s ease !important;
            box-sizing: border-box !important;
        }

            .date-pic .RadInput .riTextBox:focus {
                border-color: #3b82f6 !important;
                box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
            }

        .date-pic .RadInput .riButton {
            right: 0 !important;
            top: 0 !important;
            width: 35px !important;
            height: 100% !important;
            background: transparent !important;
            border: none !important;
            border-left: 1px solid #d1d5db !important;
            border-radius: 0 4px 4px 0 !important;
        }

            .date-pic .RadInput .riButton:hover {
                background-color: #f9fafb !important;
            }

            .date-pic .RadInput .riButton .riIcon {
                color: #6b7280 !important;
                font-size: 14px !important;
            }




/* Communication Series Styles */
.message {
    font-size: 1.2em;
    width: 100%;
    font-weight: bold;
    color: #005100;
    margin-right: 4px;
}

.RadGrid_Metro .rgRow td,
.RadGrid_Metro .rgAltRow td,
.RadGrid_Metro .rgEditRow td {
    border-color: #E5E5E5;
}

.RadGrid_Metro .rgEditRow {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
}

.ver-align-bottom {
    vertical-align: bottom;
}

/* Internship Pre-Application Basic Info Styles */
.internship-pre-app h3 {
    /*border-bottom: 1px solid #204582;*/
    padding-bottom: .5rem;
    color: #204582;
    margin-bottom: 1.25rem !important;
}

.internship-pre-app label.col-form-label,
.internship-pre-app label.control-label {
    font-weight: 700;
}

.internship-pre-app .checkbox-spaced input[type="checkbox"] {
    margin-right: 1rem;
}

/* Apply same spacing for Job Shadow page */
#wlc-jobshadow .checkbox-spaced input[type="checkbox"] {
    margin-right: 1rem;
}

/* Medium screens: allow label words to break to avoid overlap */
@media (min-width: 768px) and (max-width: 991.98px) {
    #wlc-jobshadow .wrap-any-md {
        word-break: break-word;
        hyphens: auto;
    }
}


/* Modal and loader styles */
.internship-pre-app .modal-dialog-custom {
    margin-top: 250px;
    width: 220px;
}

.internship-pre-app #loader {
    width: 160px;
}



/* Mobile view - arrange checkboxes vertically only */
@media (max-width: 767.98px) {
    .checkbox-list {
        display: block !important;
    }

        .checkbox-list table {
            display: block !important;
            width: 100% !important;
        }

        .checkbox-list tr {
            display: block !important;
            margin-bottom: 0.5rem !important;
            width: 100% !important;
        }

        /*    .checkbox-list td {
        display: block !important;
        width: 100% !important;
    }*/

        .checkbox-list input[type="checkbox"] {
            margin-right: 0.5rem !important;
            margin-top: 0 !important;
        }

        .checkbox-list label {
            margin-bottom: 0 !important;
            display: inline !important;
        }
}


/* Parent Information Form Styles */
.parent-info h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

.parent-info label.col-form-label {
    font-weight: bold;
}

/* Add spacing between checkbox and text */
.parent-info .checkbox input[type="checkbox"] {
    margin-right: 8px;
}

/* Previous Internship Form Styles */
.previous-internship-info h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Current Employment Form Styles */
.current-employment-info h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* News page specific styles */
.no-border {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.mr-2 {
    margin-right: 0.5rem !important;
}

/* Responsive button spacing for news page */
@media (max-width: 576px) {
    .float-right {
        float: none !important;
        display: block !important;
        width: 100% !important;
        margin-bottom: 0.5rem !important;
    }
}

/* ========================================
   Personal Reference Form Styles
   ======================================== */

/* Personal Reference H3 styling - moved from internshipPre-ApplicationPersonalReference.ascx */
.personal-reference h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* ========================================
   Student Portal Bootstrap 4 Updates
   ======================================== */

/* Bootstrap 4 spacing utilities */
.p-1 {
    padding: 0.25rem !important;
}

.mt-3 {
    margin-top: 1rem !important;
}

.mt-4 {
    margin-top: 1.5rem !important;
}

.mt-6 {
    margin-top: 3rem !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.mr-2 {
    margin-right: 0.5rem !important;
}

/* Bootstrap 4 flexbox utilities */
.d-flex {
    display: flex !important;
}

.flex-column {
    flex-direction: column !important;
}

.gap-3 {
    gap: 1rem !important;
}

/* Bootstrap 4 order utilities */
.order-md-1 {
    order: 1 !important;
}

.order-md-2 {
    order: 2 !important;
}

.order-1 {
    order: 1 !important;
}

.order-2 {
    order: 2 !important;
}

/* Bootstrap 4 responsive column classes */
.col-12 {
    flex: 0 0 100%;
    max-width: 100%;
}

/* Bootstrap 4 jumbotron updates */
.jumbotron .display-4 {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 1.2;
}

.jumbotron .lead {
    font-size: 1.25rem;
    font-weight: 300;
}

/* Quick icon button updates for Bootstrap 4 */
.quick-icon {
    border: none !important;
    border-radius: 0 !important;
    transition: all 0.15s ease-in-out !important;
    text-decoration: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 120px !important;
    height: 150px !important;
    width: calc(40% - 0.5rem) !important;
    margin-bottom: 1rem !important;
    margin-right: 1rem !important;
    float: left !important;
    padding: 10px 8px !important;
}

/* ========================================
   Student Portal - Standalone Tile Styles
   (scoped – will not affect other pages)
   ======================================== */
.student-tiles .sp-tile {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    text-decoration: none !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 18px 16px !important;
    min-height: 96px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
    transition: transform .15s ease, box-shadow .15s ease !important;
    width: 100% !important;
    flex-direction: column;
}

    .student-tiles .sp-tile:hover {
        transform: translateY(-2px) !important;
        box-shadow: 0 6px 12px rgba(0,0,0,0.2) !important;
    }

.student-tiles .sp-icon {
    margin-right: .5rem !important;
    opacity: 1 !important;
}

.student-tiles .sp-text {
    font-weight: 700 !important;
    font-size: 1rem !important;
}

/* Student Job Shadow Edit (Step 2) - scoped */
.jobshadow-edit h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Color variants */
.student-tiles .sp-slate {
    background-color: #7a93bf !important;
}

.student-tiles .sp-sky {
    background-color: #6abcf0 !important;
}

.student-tiles .sp-orange {
    background-color: #f2ab60 !important;
}

/* Compact on small screens */
@media (max-width: 767.98px) {
    .student-tiles .sp-tile {
        min-height: 84px !important;
        padding: 14px 12px !important;
    }

    .student-tiles .sp-text {
        font-size: .95rem !important;
    }
}

/* ========================================
   Educator Portal - Single Tile Style (scoped)
   ======================================== */
.educator-tiles .ep-tile {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: #fff !important;
    background-color: #6abcf0 !important; /* light blue like screenshot */
    border-radius: 10px !important;
    padding: 14px 18px !important;
    min-height: 84px !important;
    width: 100% !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15) !important;
}

    .educator-tiles .ep-tile .ep-icon {
        margin-right: .5rem !important;
        opacity: 1 !important;
    }

    .educator-tiles .ep-tile .ep-text {
        font-weight: 700 !important;
        font-size: 1rem !important;
    }

.quick-icon:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.15) !important;
    text-decoration: none !important;
}

/* Clear float after every 2 tiles */
.quick-icon:nth-child(2n) {
    margin-right: 0 !important;
}

/* Container for quick icons */
.col-lg-5, .col-md-6, .col-sm-12 {
    overflow: hidden;
}

.quick-icon h5 {
    margin: 0 !important;
    font-size: 1rem !important;
    font-weight: 500 !important;
    text-align: center !important;
    line-height: 1.3 !important;
}

.quick-icon .glyphicon {
    margin: 0 0 8px 0 !important;
    font-size: 24px !important;
    display: block !important;
}

.quick-icon span.text {
    font-size: 1rem !important;
    font-weight: 500 !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    display: block !important;
}

@media (max-width: 1024px) {
    .extranet-home .quick-icon span.text {
        font-size: 0.9rem !important;
        white-space: normal !important;
        word-break: break-word !important;
    }
}

/* Responsive quick icon adjustments */
@media (max-width: 767.98px) {
    .quick-icon {
        min-height: 80px !important;
        height: 80px !important;
        margin-bottom: 0.75rem !important;
        padding: 6px 6px !important;
        width: calc(45% - 0.5rem) !important;
    }

        .quick-icon h5 {
            font-size: 0.9rem !important;
        }

        .quick-icon .glyphicon {
            font-size: 18px !important;
            margin: 0 0 4px 0 !important;
        }

        .quick-icon span.text {
            font-size: 0.9rem !important;
        }

    .jumbotron .display-4 {
        font-size: 2rem !important;
    }
}

@media (min-width: 768px) {
    .order-md-1 {
        order: 1 !important;
    }

    .order-md-2 {
        order: 2 !important;
    }
}

@media (max-width: 767.98px) {
    .order-1 {
        order: 1 !important;
    }

    .order-2 {
        order: 2 !important;
    }
}

/* ========================================
   Survey Form Bootstrap 4 Updates
   ======================================== */

/* Survey form specific spacing */
.mt-0 {
    margin-top: 0 !important;
}

.mt-2 {
    margin-top: 0.5rem !important;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}

/* Bootstrap 4 form check styling for radio buttons */
.form-check {
    display: block;
    position: relative;
    padding-left: 1.25rem;
    margin-bottom: 0.125rem;
}

    .form-check .form-check-input {
        position: absolute;
        margin-top: 0.3rem;
        margin-left: -1.25rem;
    }

    .form-check .form-check-label {
        margin-bottom: 0px !important;
        margin-top: 5px !important;
        cursor: pointer;
    }

/* Survey form responsive text alignment */
.text-md-right {
    text-align: right !important;
}

.text-left {
    text-align: left !important;
}

@media (max-width: 767.98px) {
    .text-md-right {
        text-align: left !important;
    }
}

/* Survey form inline block elements */
.d-inline-block {
    display: inline-block !important;
}

/* Survey form validation styling */
.alert-required {
    padding: 0.25rem 0.5rem !important;
    margin-bottom: 0 !important;
    font-size: 0.875rem !important;
}

/* Survey form checkbox list improvements */
.checkbox-list {
    display: block !important;
}

    .checkbox-list .form-check {
        margin-bottom: 0.5rem !important;
    }

/* Survey form responsive improvements */
@media (max-width: 767.98px) {
    .col-form-label {
        margin-bottom: 0.5rem !important;
    }

    .form-group.row {
        margin-bottom: 1.5rem !important;
    }
}

/* Pre-Interview Questions H3 styling - moved from internshipPre-ApplicationPre-InterviewQuestions.ascx */
.internship-pre-interview-questions h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Text justify utility class */
.text-justify {
    text-align: justify !important;
}

/* Multi-line textarea styling */
.multi-line {
    min-height: 100px;
    resize: vertical;
}

/* Guidance Review Form Styles - moved from internshipGuidanceReview.ascx */
.guidance-review h1 {
    font-weight: 450;
}

.guidance-review h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

.guidance-review .col-form-label {
    text-align: right !important;
    padding-top: 0.375rem;
    font-weight: bold;
}

/* Responsive label alignment for small screens */
@media (max-width: 767.98px) {
    .guidance-review .col-form-label {
        text-align: left !important;
    }
}

.guidance-review .form-check {
    margin-bottom: 1rem;
}

.guidance-review .form-check-input {
    margin-top: 0.25rem;
    margin-right: 0.5rem;
}

.guidance-review .form-check-label {
    margin-bottom: 0;
    line-height: 1.5;
}

.guidance-review .form-group {
    margin-bottom: 1.5rem;
}

.guidance-review .form-control {
    margin-bottom: 0.5rem;
}

/* Guidance Review (migrated from jobShadowGuidanceReview.ascx) */
.guidance-review h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Modal styles for jobShadowGuidanceReview */
.guidance-review .modal-title-custom {
    font-size: 16px;
}

.guidance-review .modal-dialog-loader {
    margin-top: 250px;
    width: 220px;
}

.guidance-review .loader-img {
    width: 160px;
}

/* Icon opacity utility for rawResult.ascx - scoped to prevent conflicts */
.raw-result .icon-opacity-important {
    opacity: 1 !important;
}

/* Login.aspx scoped styles */
.login-page .siteName {
    font-size: 16px;
}

/* comment.ascx scoped styles */
/* commentWigit.ascx */
.comment-widget .scroll-bar {
    max-height: 350px;
    overflow-y: auto;
}

.comment-widget .fa {
    top: 2px;
    left: 1px;
}


/* relatedEdit.ascx scoped styles */
.related-edit .categorization {
    padding-bottom: 10px;
}

.related-edit .form-back {
    background-color: #F1F1F1;
    padding: 10px;
    padding-left: 10px;
    margin-left: 0px;
    border: solid 1px #D2D2D2;
}

.related-edit .form-front {
    padding: 10px;
    margin-left: 20px;
    border: solid 1px #D2D2D2;
    background: #e5e5e5; /* Old browsers */
    background: -moz-linear-gradient(top, #e5e5e5 0%, #ffffff 33%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e5e5e5), color-stop(33%,#ffffff)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #e5e5e5 0%,#ffffff 33%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #e5e5e5 0%,#ffffff 33%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, #e5e5e5 0%,#ffffff 33%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e5e5', endColorstr='#ffffff', GradientType=0 ); /* IE6-9 */
}

.related-edit h1 {
    width: 100%;
    border-bottom: 1px solid #B7B7B7;
    padding-bottom: 5px;
    font-size: 1.7em;
    margin-bottom: 20px;
}

.guidance-review .control-label {
    text-align: right !important;
    margin-bottom: 20px;
    font-weight: bold;
}

.guidance-review .cb label {
    vertical-align: top;
    display: inline !important;
    font-weight: bold;
}

.guidance-review .checkbox-list label {
    font-weight: bold;
}

.guidance-review label.col-sm-2,
.guidance-review label.col-sm-3 {
    font-weight: bold;
}

.guidance-review.form-horizontal .form-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
}

    .guidance-review.form-horizontal .form-group > .col-sm-2,
    .guidance-review.form-horizontal .form-group > .col-sm-10,
    .guidance-review.form-horizontal .form-group > .col-sm-3,
    .guidance-review.form-horizontal .form-group > .col-sm-9,
    .guidance-review.form-horizontal .form-group > .col-sm-12 {
        float: none;
    }

    .guidance-review.form-horizontal .form-group > .col-sm-2 {
        width: 16.66666667%;
    }

    .guidance-review.form-horizontal .form-group > .col-sm-10 {
        width: 83.33333333%;
    }

.guidance-review .p0 {
    padding-left: 0;
    padding-right: 0;
}

.guidance-review .pl0 {
    padding-left: 0;
}

.guidance-review .pr0 {
    padding-right: 0;
}

.guidance-review .action-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}

    .guidance-review .action-row > div {
        float: none;
    }

/* Parent-Review-JobShadow-Request page specific overrides */
.parent-review-jobshadow-page .btn-back-to-listing {
    display: none !important;
}

.guidance-review .form-text {
    margin-top: 0.25rem;
    margin-bottom: 0;
}

/*.guidance-review .btn {
    margin-top: 1rem;
}
*/
.guidance-review .alert {
    margin-bottom: 2rem;
}

.guidance-review .alert-info {
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    color: #495057;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* Modal title font size */
.modal-title {
    font-size: 16px !important;
}

/* ========================================
   Job Shadow Request Detail Styles - Bootstrap 4
   ======================================== */

/* Job Shadow Request Detail H3 styling */
.job-shadow-detail h3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Job Shadow Request Detail label styling */
.job-shadow-detail .col-form-label {
    text-align: right !important;
    font-weight: bold;
    padding-top: calc(0.375rem + 1px);
    padding-bottom: calc(0.375rem + 1px);
    margin-bottom: 0;
    font-size: inherit;
    line-height: 1.5;
}

.form-horizontal .form-group:before, .form-horizontal .form-group:after {
    display: table;
    content: " ";
}

.job-shadow-detail .form-group:before, .job-shadow-detail .form-group:after {
    display: table;
    content: " ";
}

.job-shadow-detail .form-group:after {
    clear: both;
}

.form-horizontal .form-group:after {
    clear: both;
}

/* Responsive label alignment for small screens */
@media (max-width: 767.98px) {
    .job-shadow-detail .col-form-label {
        text-align: left !important;
    }
}

/* No z-index utility class */
.no-zindex {
    z-index: 0 !important;
}

/* News Edit page specific styles */
.mt-3 {
    margin-top: 1rem !important;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.ml-2 {
    margin-left: 0.5rem !important;
}

/* Form spacing for news edit */
.form-group.row {
    margin-bottom: 1rem;
}

/* Button group spacing */
.d-flex.justify-content-between {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* Dropdown menu right alignment */
.dropdown-menu-right {
    right: 0 !important;
    left: auto !important;
}

/* Dropdown item text styling */
.dropdown-item-text {
    padding: 0.5rem 1rem;
    color: #6c757d;
    font-size: 0.875rem;
}

    .dropdown-item-text p {
        margin-bottom: 0.5rem;
    }

        .dropdown-item-text p:last-child {
            margin-bottom: 0;
        }

/* ========================================
   REQUEST LIST RESPONSIVE STYLES
   ======================================== */

/* Responsive button styles - only for small screens */
@media (max-width: 768px) {
    .btn-responsive-container {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }

        .btn-responsive-container .col-sm-6 {
            width: 100% !important;
            max-width: 100% !important;
            text-align: center !important;
            margin-bottom: 15px;
        }

            .btn-responsive-container .col-sm-6:first-child {
                margin-bottom: 10px;
            }

            .btn-responsive-container .col-sm-6:last-child {
                margin-bottom: 0;
            }

        .btn-responsive-container .btn {
            width: auto !important;
            margin: 5px !important;
            display: inline-block !important;
            min-width: 100px;
        }

        .btn-responsive-container .col-sm-6:first-child .btn {
            display: inline-block !important;
            margin: 5px !important;
        }

        .btn-responsive-container .ml-2 {
            margin-left: 5px !important;
        }

        .btn-responsive-container .text-left,
        .btn-responsive-container .text-right {
            text-align: center !important;
        }

    /* Responsive styles for Assign Internship Coordinator section */
    .coordinator-responsive-container {
        flex-direction: column !important;
        align-items: flex-start !important;
    }

        .coordinator-responsive-container .form-group {
            width: 100% !important;
            margin-right: 0 !important;
            margin-bottom: 15px !important;
        }

        .coordinator-responsive-container .form-control {
            width: 100% !important;
        }

        .coordinator-responsive-container .btn {
            width: auto !important;
            min-width: 120px;
        }
}

/* Make RadGrid pager wrap nicely at <=430px (Page on first line, Item on second) */
@media (max-width: 430px) {
    .RadGrid .rgPager, .RadGrid_Metro .rgPager {
        white-space: normal !important;
    }

/*        .RadGrid .rgPager .rgStatus,
        .RadGrid_Metro .rgPager .rgStatus,
        .RadGrid .rgPager .rgInfoPart,
        .RadGrid_Metro .rgPager .rgInfoPart,
        .RadGrid .rgPager .rgNumPart,
        .RadGrid_Metro .rgPager .rgNumPart,
        .RadGrid .rgPager .rgArrPart,
        .RadGrid_Metro .rgPager .rgArrPart {
            display: block !important;
            float: none !important;
            width: 100% !important;
            margin: 0 0 4px 0 !important;
            text-align: left !important;
        }*/

        .RadGrid .rgPager .rgNumPart,
        .RadGrid_Metro .rgPager .rgNumPart {
            margin-top: 2px !important;
        }

/*    .RadGrid .rgPagerCell .rgWrap {
        float: none !important;
    }*/
}

/* Custom width utilities for modal components */
.modal-width-220 {
    width: 220px !important;
    margin-top: 250px !important;
}

.modal-width-500 {
    width: 500px !important;
    margin-top: 250px !important;
}

.img-width-160 {
    width: 160px !important;
}

/* Job Shadow specific styles */
.job-shadow-trash-icon {
    padding: 2px 0px 6px 0px;
}

.modal-process-title {
    font-family: Arial, Verdana, Helvetica, sans-serif;
}

/* Communication List specific styles */
.communication-table thead th a {
    color: #000 !important;
}

.communication-pager {
    color: #000 !important;
}

    .communication-pager[disabled^="disabled"] {
        color: #DDDDDD !important;
        text-decoration: none !important;
    }

/* Communication Widget specific styles */
.section-name {
    color: #E29A2C !important;
    font-weight: bold !important;
}

.communication-widget-margin {
    margin: 10px !important;
}

/* Internship Placement Edit Modal Styles */
#popupInternshipPlacement .modal-dialog {
    width: 80% !important;
}

    #popupInternshipPlacement .modal-dialog .modal-content {
        max-height: 600px !important;
        overflow-y: auto !important;
    }

/* Table cell text alignment */
td {
    text-align: left;
}

/* Fix dropdown visibility in RadGrid Actions button */
.RadGrid .dropdown-menu {
    z-index: 9999 !important;
    position: absolute !important;
    display: none !important;
    min-width: 160px !important;
    padding: 0.5rem 0 !important;
    margin: 0 !important;
    font-size: 1rem !important;
    color: #212529 !important;
    text-align: left !important;
    list-style: none !important;
    background-color: #fff !important;
    background-clip: padding-box !important;
    border: 1px solid rgba(0, 0, 0, 0.15) !important;
    border-radius: 0.25rem !important;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175) !important;
}

    .RadGrid .dropdown-menu.show {
        display: block !important;
    }

.RadGrid .dropdown-item {
    display: block !important;
    width: 100% !important;
    padding: 0.25rem 1rem !important;
    clear: both !important;
    font-weight: 400 !important;
    color: #212529 !important;
    text-align: inherit !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    /*    background-color: transparent !important;*/
    border: 0 !important;
}

    .RadGrid .dropdown-item:hover,
    .RadGrid .dropdown-item:focus {
        color: #16181b !important;
        text-decoration: none !important;
        /*background-color: #f8f9fa !important;*/
    }

.RadGrid .dropdown-divider {
    height: 0 !important;
    margin: 0.5rem 0 !important;
    overflow: hidden !important;
    border-top: 1px solid #e9ecef !important;
}

/* Ensure dropdown button group works properly */
.RadGrid .btn-group {
    position: relative !important;
    display: inline-flex !important;
    vertical-align: middle !important;
}

    .RadGrid .btn-group .dropdown-toggle::after {
        display: inline-block !important;
        margin-left: 0.255em !important;
        vertical-align: 0.255em !important;
        content: "" !important;
        border-top: 0.3em solid !important;
        border-right: 0.3em solid transparent !important;
        border-bottom: 0 !important;
        border-left: 0.3em solid transparent !important;
    }

/* Style CheckBoxList with form-check-inline class to match image layout */
.form-check-inline {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    flex-wrap: wrap;
}

    .form-check-inline li {
        margin-bottom: 1rem !important;
        display: flex !important;
        align-items: center !important;
        width: 48% !important;
        margin-right: 2% !important;
    }

        .form-check-inline li:nth-child(even) {
            margin-right: 0 !important;
        }

    .form-check-inline input[type="checkbox"] {
        margin-right: 0.25rem !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        flex-shrink: 0 !important;
        width: auto !important;
        vertical-align: middle !important;
    }

    .form-check-inline label {
        margin: 0 !important;
        cursor: pointer !important;
        line-height: 1.2 !important;
        font-weight: normal !important;
        vertical-align: middle !important;
        display: inline-block !important;
    }


/* Style form-check elements to match image layout */
.form-check {
    margin-bottom: 0.75rem !important;
    display: flex !important;
    align-items: center !important;
}

    .form-check input[type="checkbox"] {
        margin-right: 0.25rem !important;
        margin-top: -0.17rem !important;
        margin-bottom: 0 !important;
        flex-shrink: 0 !important;
        width: auto !important;
        vertical-align: middle !important;
    }

    .form-check label {
        /*margin: 0 !important;*/
        cursor: pointer !important;
        line-height: 1.4 !important;
        font-weight: normal !important;
        /*vertical-align: middle !important;*/
        display: inline-block !important;
        font-size: 0.875rem !important;
        text-transform: none !important;
    }

/* Contact Edit CheckBoxList Styles - moved from contactEdit.ascx */
/*.checkbox-list td {
    vertical-align: top !important;
    max-width: 60px !important;
}*/

/* Contact Edit Form - Checkbox and Radio Button Alignment */
.checkbox-two-column {
    display: table !important;
    width: 100% !important;
}

    .checkbox-two-column table {
        width: 100% !important;
        border: none !important;
        margin: 0 !important;
    }

    .checkbox-two-column tr {
        display: table-row !important;
    }

    .checkbox-two-column td {
        width: 50% !important;
        padding: 2px 8px 2px 0 !important;
        vertical-align: middle !important;
        border: none !important;
        max-width: none !important;
    }

    .checkbox-two-column input[type="checkbox"],
    .checkbox-two-column input[type="radio"] {
        margin-right: 6px !important;
        margin-top: 0 !important;
        vertical-align: middle !important;
    }

    .checkbox-two-column label {
        margin: 0 !important;
        font-weight: normal !important;
        vertical-align: middle !important;
        display: inline !important;
        cursor: pointer !important;
    }

/* Radio buttons in horizontal layout (Ethnicity) */
.radio-horizontal {
    display: table !important;
    width: 100% !important;
}

    .radio-horizontal table {
        width: 100% !important;
        border: none !important;
        margin: 0 !important;
    }

    .radio-horizontal tr {
        display: table-row !important;
    }

    .radio-horizontal td {
        width: 50% !important;
        padding: 2px 8px 2px 0 !important;
        vertical-align: middle !important;
        border: none !important;
        max-width: none !important;
    }

    .radio-horizontal input[type="radio"] {
        margin-right: 6px !important;
        margin-top: 0 !important;
        vertical-align: middle !important;
    }

    .radio-horizontal label {
        margin: 0 !important;
        font-weight: normal !important;
        vertical-align: middle !important;
        display: inline !important;
        cursor: pointer !important;
    }

/* Radio buttons in vertical layout (Sex) */
.radio-vertical {
    display: table !important;
    width: 100% !important;
}

    .radio-vertical table {
        width: 100% !important;
        border: none !important;
        margin: 0 !important;
    }

    .radio-vertical tr {
        display: table-row !important;
    }

    .radio-vertical td {
        width: 100% !important;
        padding: 2px 0 !important;
        vertical-align: middle !important;
        border: none !important;
        max-width: none !important;
    }

    .radio-vertical input[type="radio"] {
        margin-right: 6px !important;
        margin-top: 0 !important;
        vertical-align: middle !important;
    }

    .radio-vertical label {
        margin: 0 !important;
        font-weight: normal !important;
        vertical-align: middle !important;
        display: inline !important;
        cursor: pointer !important;
    }

/* Business Career Styles - moved from businessCareer.ascx */
.career-pathway {
    margin-bottom: 2rem;
}

.pathway-title {
    font-size: 1.5em !important;
    color: #4E7103 !important;
    font-weight: normal !important;
    display: block !important;
    margin-bottom: 1rem !important;
}

/* Three-column career checkbox layout */
.career-three-column {
    display: table !important;
    width: 100% !important;
}

    .career-three-column table {
        width: 100% !important;
        border: none !important;
        margin: 0 !important;
    }

    .career-three-column tr {
        display: table-row !important;
    }

    .career-three-column td {
        width: 33.33% !important;
        padding: 2px 8px 2px 0 !important;
        vertical-align: middle !important;
        border: none !important;
        max-width: none !important;
    }

    .career-three-column input[type="checkbox"] {
        margin-right: 6px !important;
        margin-top: 0 !important;
        vertical-align: middle !important;
    }

    .career-three-column label {
        margin: 0 !important;
        font-weight: normal !important;
        vertical-align: middle !important;
        display: inline !important;
        cursor: pointer !important;
        font-size: 0.9rem !important;
        line-height: 1.3 !important;
    }

/* Responsive adjustments for career checkboxes */
@media (max-width: 768px) {
    .career-three-column td {
        width: 50% !important;
    }
}

@media (max-width: 576px) {
    .career-three-column td {
        width: 100% !important;
    }
}


/* ========================================
   Business List Control Styles
   ======================================== */

/* Center search/view all buttons and export button on small screens only */

/* Season CheckBoxList styling to match image layout */
.form-check-inline-season {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    width: 100% !important;
}

    .form-check-inline-season li {
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        flex: 1 !important;
        justify-content: center !important;
    }

    .form-check-inline-season input[type="checkbox"] {
        margin-right: 0.5rem !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        flex-shrink: 0 !important;
        width: auto !important;
        vertical-align: middle !important;
    }

    .form-check-inline-season label {
        margin: 0 !important;
        cursor: pointer !important;
        line-height: 1.2 !important;
        font-weight: normal !important;
        vertical-align: middle !important;
        display: inline-block !important;
        font-size: 0.875rem !important;
        text-transform: none !important;
        white-space: nowrap !important;
    }

/* ========================================
   INTERNSHIP EDIT SEASON CHECKBOXES
   ======================================== */

/* Season checkboxes horizontal spacing - Reduced spacing */
.season-checkboxes {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: 100% !important;
    gap: 0.5rem !important;
}

    .season-checkboxes label {
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
        display: inline-flex !important;
        align-items: center !important;
        font-size: 0.9rem !important;
    }

    .season-checkboxes input[type="checkbox"] {
        margin-right: 0.25rem !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

/* Reduced spacing for internship edit form elements */
.internship-edit .form-check {
    margin-bottom: 0.25rem !important;
    padding-left: 0 !important;
}

.internship-edit .form-check-input {
    margin-right: 0.25rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.internship-edit .form-check-label {
    margin-bottom: 0 !important;
    font-size: 0.9rem !important;
    line-height: 1.2 !important;
}

/* Radio button list spacing reduction */
.internship-edit .form-check-horizontal table {
    border-spacing: 0.5rem 0 !important;
}

.internship-edit .form-check-horizontal td {
    padding: 0.25rem !important;
}

.internship-edit .form-check-horizontal label {
    margin-right: 0.5rem !important;
    font-size: 0.9rem !important;
}

/* ========================================
   RESPONSIVE BUTTON STYLES
   ======================================== */

/* Responsive button styles for small screens */
@media (max-width: 575.98px) {
    .btn-sm-inline-block {
        display: block !important;
        width: 100% !important;
        margin-bottom: 0.5rem !important;
    }

        .btn-sm-inline-block:last-child {
            margin-bottom: 0 !important;
        }

    /* Custom spacing for secondary button group */
    .button-group-secondary {
        margin-top: 0.75rem !important;
    }

    /* Move buttons down on small screens */
    .row.mt-3 {
        margin-top: 2rem !important;
    }
}

@media (min-width: 576px) {
    .btn-sm-inline-block {
        display: inline-block !important;
        width: auto !important;
    }

    /* Reset margin for larger screens */
    .button-group-secondary {
        margin-top: 0 !important;
    }
}

/* ========================================
   FORM FIELD RESPONSIVE STYLES
   ======================================== */

/* Form field responsive styles */
@media (max-width: 767.98px) {
    .form-group.row .col-form-label {
        margin-bottom: 0.5rem;
        padding-bottom: 0;
    }

    .form-group.row .col-12 {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Ensure text areas and inputs take full width on mobile */
    .form-control {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Fix checkbox list on mobile */
    .checkbox-list {
        display: flex;
        flex-direction: column;
    }

        .checkbox-list input[type="checkbox"] {
            margin-right: 0.5rem;
        }
}

/* ========================================
   RADIO BUTTON SPACING STYLES
   ======================================== */

/* Universal radio button spacing - target everything */
/*table td {
    padding-right: 1.5rem !important;
}*/

table td:last-child {
    padding-right: 0 !important;
}

/* Target RadioButtonList specifically */
td input[type="radio"] {
    margin-right: 0.5rem !important;
    vertical-align: middle;
}

input[type="radio"]:last-child {
    margin-right: 0 !important;
}

/* Target table cells containing radio buttons */
td:has(input[type="radio"]) {
    padding-right: 1.5rem !important;
}

    td:has(input[type="radio"]):last-child {
        padding-right: 0 !important;
        margin-right: 0 !important;
    }

/* Force table spacing */
table {
    border-collapse: separate !important;
}

/* Add spacing after radio buttons section */
@media (max-width: 767.98px) {
    .form-check-horizontal {
        margin-bottom: 1.5rem !important;
    }

    .form-group:has(.form-check-horizontal) {
        margin-bottom: 2rem !important;
    }
}

/* ========================================
   TELERIK RADGRID RESPONSIVE STYLES
   ======================================== */

/* Add horizontal scroll for RadGrid on small screens */
@media (max-width: 768px) {
    /*    .table-responsive {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }*/

    .RadGrid {
        min-width: 600px !important;
    }
}

/* ========================================
   COMMUNICATION EDIT BUTTON LAYOUT
   ======================================== */

/* Button layout for small screens */
@media (max-width: 768px) {
    .button-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }

    .button-row-1,
    .button-row-2,
    .button-row-3 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    .button-row-2 {
        gap: 0.5rem;
    }
}

/* Desktop layout - horizontal arrangement */
@media (min-width: 769px) {
    .button-container {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        gap: 0.5rem;
    }

    .button-row-1,
    .button-row-2,
    .button-row-3 {
        display: contents;
    }
}

/* ========================================
   PLACEMENT LIST RESPONSIVE STYLES
   ======================================== */

/* Center export button and align search/view all buttons on small screens only */

@media (max-width: 767.98px) {
    .d-flex.w-100.align-items-center {
        flex-direction: column !important;
        align-items: stretch !important;
    }

        .d-flex.w-100.align-items-center > div:first-child {
            margin-bottom: 1rem !important;
            text-align: center !important;
        }

        .d-flex.w-100.align-items-center > div:last-child {
            text-align: center !important;
        }

        .d-flex.w-100.align-items-center > div:first-child .btn {
            display: inline-block !important;
            width: auto !important;
            margin: 0 0.25rem !important;
        }
}


/* Button spacing for business list layout */
.btn-group .btn {
    margin-right: 0.5rem;
}

    .btn-group .btn:last-child {
        margin-right: 0;
    }

.d-flex .btn {
    margin-right: 0.5rem;
}

    .d-flex .btn:last-child {
        margin-right: 0;
    }

/* Responsive button layout */
@media (max-width: 767.98px) {
    .d-flex.flex-column .btn {
        width: 100%;
        margin-right: 0;
        margin-bottom: 0.5rem;
    }

        .d-flex.flex-column .btn:last-child {
            margin-bottom: 0;
        }
}

/* Ensure proper spacing for date pickers */
.RadDatePicker {
    width: 100% !important;
    margin-top: 0.5rem;
}

    .RadDatePicker .rdpInput {
        width: 100% !important;
    }

/* Ensure date picker labels are positioned above inputs */
.col-md-3 .form-label {
    display: block;
    margin-bottom: 0.5rem;
}

/* Hide less important columns on small screens */
@media (max-width: 768px) {
    /* Removed code as it was affecting the business list values and other tables */
}

@media (max-width: 576px) {
    /* Removed code as it was affecting the business list values and other tables */

    /* Make action button smaller on mobile */
    /*    .RadGrid .btn-success {
        font-size: 12px !important;
        padding: 4px 8px !important;
    }*/
}

/* Ensure table fits in container */
.RadGrid {
    min-width: 100% !important;
}

/* Better mobile pager */
@media (max-width: 768px) {
    .RadGrid .rgPager {
        text-align: center !important;
    }

        .RadGrid .rgPager .rgPagerButton {
            padding: 4px 8px !important;
            margin: 2px !important;
        }
}

/* Fix horizontal scrolling for RadGrid on small screens */
@media (max-width: 767.98px) {
    /*    .table-responsive {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        width: 100% !important;
    }*/

    /* Target RadGrid's internal structure */
    .RadGrid_Metro {
        overflow-x: auto !important;
        width: 100% !important;
    }

        .RadGrid_Metro .rgDataDiv {
            overflow-x: auto !important;
            width: 100% !important;
        }

        .RadGrid_Metro .rgMasterTable {
            min-width: 1000px !important;
            width: auto !important;
        }

            .RadGrid_Metro .rgMasterTable td,
            .RadGrid_Metro .rgMasterTable th {
                white-space: nowrap !important;
                padding: 6px 8px !important;
                font-size: 12px !important;
            }
}

/* ========================================
   Event Site Contact List Styles
   ======================================== */

/* Responsive table styling for event site contact list */
@media only screen and (max-width: 767px) {
    .RadGrid {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

        .RadGrid .rgMasterTable {
            min-width: 600px !important;
        }
}

/* ========================================
   Business Tab Navigation Styles
   ======================================== */

/* Telerik RadTabStrip styling for Business tab navigation */
.RadTabStripTop_Metro .rtsLevel1 {
    background-color: White !important;
}

.RadTabStrip_Metro .rtsLevel1 .rtsUL {
    background-color: White !important;
}

.RadTabStrip_Metro .rtsLevel1 .rtsLI {
    color: white !important;
}

.RadTabStrip_Metro .rtsLevel1 .rtsLink {
    border: medium none;
    color: #666 !important;
}


/* ========================================
   County List Responsive Styles
   ======================================== */

/* Add spacing between columns for tablet and desktop */
@media (min-width: 768px) {
    .county-list-responsive td {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
}

/* ========================================
   Educator Listing Styles
   ======================================== */

/* Small format text */
.small-format {
    font-size: 10px;
    line-height: 16px;
}

/* Validation message styling */
.val-msg {
    font-weight: bold;
    display: block;
}

/* Custom scroll for tables */
.custom-scroll {
    overflow-x: scroll;
}

/* Left margin utility */
.mr-left {
    margin-left: 10px;
}

/* ========================================
   Events Edit Modal Styles
   ======================================== */

/* Event Site and School Modal Dialog Sizing */
#popupSchool .modal-dialog {
    width: 70%;
}

    #popupSchool .modal-dialog .modal-content {
        max-height: 640px;
        overflow: auto;
    }

#popupEventSite .modal-dialog {
    width: 70%;
}

/* Communication Section Name Styling */
.section-name {
    color: #E29A2C;
    font-weight: bold;
}

/* Survey Status Radio Buttons - Always horizontal with proper alignment */
.survey-status-radio {
    display: inline-flex !important;
    align-items: center !important;
    margin-right: 1.5rem !important;
    white-space: nowrap !important;
}

/* Survey Table Field Names - Always Bold */
.table td strong {
    font-weight: bold !important;
}

/* Survey Form Field Labels - Always Bold */
.col-form-label {
    font-weight: bold !important;
}

.survey-status-radio:last-child {
    margin-right: 0 !important;
}

.survey-status-radio .form-check-input {
    margin-right: 0.5rem !important;
    margin-top: 0 !important;
    flex-shrink: 0 !important;
}

.survey-status-radio label {
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

.val-msg {
    font-weight: bold;
    display: block;
}

div.RadGrid .rgPager .rgAdvPart {
    display: none;
}

/* Mobile-only: Stack form fields vertically */
@media (max-width: 575.98px) {
    .mobile-stack .col-4 {
        width: 100% !important;
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* Teacher Portal Navigation Styles */
.nav-pills .nav-link {
    border-radius: 0.25rem !important;
    margin: 0.125rem !important;
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #007bff !important;
    background-color: transparent !important;
    border: none !important;
    text-align: center !important;
}

    .nav-pills .nav-link:hover {
        color: #0056b3 !important;
        background-color: transparent !important;
        border: none !important;
    }

    .nav-pills .nav-link.active {
        color: #495057 !important;
        background-color: #e9ecef !important;
        border: 1px solid #dee2e6 !important;
    }

.nav-pills.flex-column .nav-link {
    margin-bottom: 0.25rem !important;
}

@media (max-width: 575.98px) {
    .nav-pills.flex-column .nav-link {
        margin-bottom: 0.5rem !important;
        text-align: center !important;
    }
}

/* Welcome and Navigation Box Styles */
.welcome-box {
    background-color: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.375rem !important;
    padding: 1rem !important;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.nav-box {
    background-color: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.375rem !important;
    /*    padding: 0.75rem !important;*/
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

    .nav-box .nav-tabs {
        border-bottom: none !important;
        margin-bottom: 0 !important;
    }

        .nav-box .nav-tabs .nav-link {
            border: none !important;
            background-color: transparent !important;
            color: #495057 !important;
            padding: 0.5rem 1rem !important;
            margin-right: 0.25rem !important;
            border-radius: 0.25rem !important;
            margin-bottom: 5px !important
        }

            .nav-box .nav-tabs .nav-link:hover {
                background-color: #e9ecef !important;
                color: #495057 !important;
            }

            .nav-box .nav-tabs .nav-link.active {
                background-color: #e9ecef !important;
                color: #495057 !important;
                border: 1px solid #dee2e6 !important;
            }

/* Mobile Responsive Button Layout */
@media (max-width: 767.98px) {
    .d-flex.justify-content-between.align-items-center {
        flex-direction: column !important;
        align-items: stretch !important;
    }

        .d-flex.justify-content-between.align-items-center > div:first-child {
            margin-bottom: 1rem !important;
            text-align: center !important;
        }

        .d-flex.justify-content-between.align-items-center > div:last-child {
            text-align: center !important;
        }

        .d-flex.justify-content-between.align-items-center > div:first-child .btn {
            display: block !important;
            width: 100% !important;
            margin: 0.25rem 0 !important;
        }

        .d-flex.justify-content-between.align-items-center > div:last-child .btn {
            display: block !important;
            width: 100% !important;
            margin: 0.25rem 0 !important;
        }
}
/* Mobile view - arrange form-check-inline checkboxes vertically only */
@media (max-width: 767.98px) {
    .form-check-inline:not(.survey-status-radio) {
        display: block !important;
    }

    /* Keep survey status radio buttons horizontal on mobile */
    .survey-status-radio {
        display: inline-flex !important;
        margin-right: 1rem !important;
    }

    .form-check-inline table {
        display: block !important;
        width: 100% !important;
    }

    .form-check-inline tr {
        display: block !important;
        margin-bottom: 0.5rem !important;
        width: 100% !important;
    }

    .form-check-inline td {
        display: block !important;
        width: 100% !important;
    }

    .form-check-inline input[type="checkbox"] {
        margin-right: 0.5rem !important;
        margin-top: 0 !important;
    }

    .form-check-inline label {
        margin-bottom: 0 !important;
        display: inline !important;
    }
}

/* Mobile view - fix Coordinators field positioning to prevent overlap */
@media (max-width: 767.98px) {
    .form-group.row:has(#ddlCoordinator) {
        clear: both !important;
        margin-top: 1rem !important;
    }

    /* Alternative selector for browsers that don't support :has() */
    .form-group.row:nth-child(4) {
        clear: both !important;
        margin-top: 1rem !important;
    }
}

/* ========================================
   My Account Form Styles - Bootstrap 4
   ======================================== */

/* My Account card styling */
.my-account-card {
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    border: 1px solid rgba(0, 0, 0, 0.125) !important;
}

/* My Account form label styling */
.my-account-form .col-form-label {
    font-weight: bold !important;
    color: #495057 !important;
    text-align: left !important;
    padding-top: calc(0.375rem + 1px) !important;
    padding-bottom: calc(0.375rem + 1px) !important;
    margin-bottom: 0 !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
}

/* My Account form control styling */
.my-account-form .form-control {
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    color: #495057 !important;
    background-color: #fff !important;
    background-clip: padding-box !important;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

    .my-account-form .form-control:focus {
        color: #495057 !important;
        background-color: #fff !important;
        border-color: #80bdff !important;
        outline: 0 !important;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
    }

/* My Account button styling */
.my-account-form .btn {
    display: inline-block !important;
    font-weight: 400 !important;
    text-align: center !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    user-select: none !important;
    border: 1px solid transparent !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    border-radius: 0.25rem !important;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.my-account-form .btn-success {
    color: #fff !important;
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

    .my-account-form .btn-success:hover {
        color: #fff !important;
        background-color: #218838 !important;
        border-color: #1e7e34 !important;
    }

.my-account-form .btn-outline-primary {
    color: #007bff !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: #007bff !important;
}

    .my-account-form .btn-outline-primary:hover {
        color: #fff !important;
        background-color: #007bff !important;
        border-color: #007bff !important;
    }

.my-account-form .btn-outline-secondary {
    color: #6c757d !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: #6c757d !important;
}

    .my-account-form .btn-outline-secondary:hover {
        color: #fff !important;
        background-color: #6c757d !important;
        border-color: #6c757d !important;
    }

/* My Account radio button list styling */
.my-account-form .form-check-inline {
    display: inline-flex !important;
    align-items: center !important;
    padding-left: 0 !important;
    margin-right: 1rem !important;
}

    .my-account-form .form-check-inline input[type="radio"] {
        position: static !important;
        margin-top: 0 !important;
        margin-right: 0.25rem !important;
        margin-left: 0 !important;
    }

    .my-account-form .form-check-inline label {
        margin-bottom: 0 !important;
        cursor: pointer !important;
    }

/* My Account validation styling */
.my-account-form .text-danger {
    color: #dc3545 !important;
}

.my-account-form .text-muted {
    color: #6c757d !important;
}

.my-account-form .small {
    font-size: 0.875em !important;
}

/* My Account responsive adjustments */
@media (max-width: 767.98px) {
    .my-account-form .col-form-label {
        text-align: left !important;
        margin-bottom: 0.5rem !important;
        font-weight: bold !important;
    }

    .my-account-form .col-sm-3 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .my-account-form .col-sm-9 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .my-account-form .col-md-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 1rem !important;
    }

    .my-account-form .col-md-4 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 1rem !important;
    }

    .my-account-form .btn-group-vertical {
        width: 100% !important;
    }

        .my-account-form .btn-group-vertical .btn {
            width: 100% !important;
            margin-bottom: 0.5rem !important;
        }

            .my-account-form .btn-group-vertical .btn:last-child {
                margin-bottom: 0 !important;
            }
}
/* ========================================
   Educator Listing Tablet View Fix
   ======================================== */

/* Fix tablet view only - 2 fields per row on tablet */
@media (min-width: 576px) and (max-width: 767.98px) {
    .educator-form .col-sm-6.col-lg-3 {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
}

/* County list responsive behavior - only for mobile */
@media (max-width: 767.98px) {
    .county-list-responsive {
        display: flex !important;
        flex-direction: column !important;
    }

        .county-list-responsive table {
            width: 100% !important;
        }

        .county-list-responsive td {
            display: block !important;
            width: 100% !important;
            margin-bottom: 0.5rem !important;
        }
}

/* ===== EDUCATOR REGISTER STYLES ===== */
.title-top {
    display: none;
}

/* Modal dialog custom positioning */
.modal-dialog.modal-dialog-centered {
    margin-top: 250px;
}

/* Loading image size */
#loader {
    width: 160px;
}

/* Educator Register Form Responsive Styles */
@media (max-width: 575.98px) {
    .educator-register .col-form-label {
        text-align: left !important;
        margin-bottom: 0.5rem !important;
    }

    .educator-register .col-sm-3 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .educator-register .col-sm-9 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .educator-register .col-sm-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 0.5rem !important;
    }

    .educator-register .col-sm-4 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 0.5rem !important;
    }
}

/* Custom width utilities */
.w-550 {
    width: 550px !important;
}

/* Mass Status Box Styles */
.mass-status-box {
    width: 175px !important;
    background-color: #DDFDC4 !important;
    border-color: #BBB99D !important;
}

.mass-status-header {
    background-color: #56B906 !important;
    border-bottom: solid 1px #27710A !important;
}

/* Related List Styles */
.rgCommandTable tbody {
    display: none;
}

/* Compiled Result Survey Styles */
.question {
    font-size: 14px;
    font-weight: bold;
}

.panel-body-grid {
    overflow: scroll !important;
    max-height: 400px !important;
}

.panel-success {
    border-color: #EDEDED !important;
}

    .panel-success > .panel-heading {
        background-color: #EDEDED !important;
        border-color: #d6e9c6;
        color: #468847;
    }

.pagination {
    margin-top: 20px;
}

.line {
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
}

/*.rgExpandCol {
    display: none !important;
}*/

.filter-inline {
    display: inline;
}

.filter .glyphicon {
    opacity: 1;
}

.small-format {
    font-size: 10px;
    line-height: 16px;
}

.val-msg {
    font-weight: bold;
    display: block;
}

/* Raw Result Survey Styles */
.btn-color {
    color: #ffffff !important;
}

.inner-grid {
    border: 1px solid #999 !important;
}

.btn-info {
    text-transform: initial !important;
}

a.btn-pager {
    color: black;
}

    a.btn-pager[disabled^="disabled"] {
        color: #DDDDDD !important;
        text-decoration: none;
    }

.glyphicon {
    opacity: 0.5 !important;
}

/* ========================================
   Reporting List Control Styles
   ======================================== */

/* ========================================
   Job Shadow Internship Report Control Styles
   ======================================== */

/* Custom style for jobShadowInternshipReport.ascx RadCalendar border */
.jobshadow-internship-border-custom {
    border-color: #ececec;
}

/* ========================================
   Event Request Control Styles
   ======================================== */

/* Custom radio button styling for EventRequest.ascx */
.event-request-radio-custom {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .event-request-radio-custom li {
        margin-bottom: 8px;
        display: flex;
        align-items: center;
    }

    .event-request-radio-custom input[type="radio"] {
        margin-right: 8px;
        width: 16px;
        height: 16px;
        accent-color: #007bff;
    }

    .event-request-radio-custom label {
        margin: 0;
        font-weight: normal;
        cursor: pointer;
    }

/* ========================================
   Outside Reference Form Styles
   ======================================== */

/* Outside Reference form styling */
.outside-reference-info {
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-radius: 0.375rem !important;
    padding: 1rem !important;
    margin-bottom: 1.5rem !important;
    color: #495057 !important;
}

.outside-reference-textarea {
    min-height: 100px !important;
    resize: vertical !important;
}

.outside-reference-buttons .col-sm-4 {
    margin-bottom: 0.5rem !important;
}

/* Responsive button layout for outside reference form */
@media (max-width: 767.98px) {
    .outside-reference-buttons {
        flex-direction: column !important;
        align-items: center !important;
    }

        .outside-reference-buttons .col-sm-4 {
            width: 100% !important;
            text-align: center !important;
            margin-bottom: 0.75rem !important;
        }

            .outside-reference-buttons .col-sm-4:last-child {
                margin-bottom: 0 !important;
            }
}

/* ========================================
   Parent Review Form Styles
   ======================================== */

/* Parent Review form styling */
.parent-review-info {
    background-color: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-radius: 0.375rem !important;
    padding: 1rem !important;
    margin-bottom: 1.5rem !important;
    color: #495057 !important;
}

/* Parent Review form label styling */
.parent-review-form .col-form-label {
    font-weight: bold !important;
    color: #495057 !important;
    text-align: left !important;
    padding-top: calc(0.375rem + 1px) !important;
    padding-bottom: calc(0.375rem + 1px) !important;
    margin-bottom: 0 !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
}

/* Bootstrap 4 grid system with float-left for same-row layout */
@media (min-width: 768px) {
    .parent-review-form .col-sm-1,
    .parent-review-form .col-sm-2,
    .parent-review-form .col-sm-3,
    .parent-review-form .col-sm-4,
    .parent-review-form .col-sm-5,
    .parent-review-form .col-sm-6,
    .parent-review-form .col-sm-7,
    .parent-review-form .col-sm-8,
    .parent-review-form .col-sm-9,
    .parent-review-form .col-sm-10,
    .parent-review-form .col-sm-11 {
        float: left !important;
    }
}

/* Ensure proper spacing and alignment */
.parent-review-form .form-group.row {
    margin-bottom: 1rem !important;
}

.parent-review-form .col-sm-3 {
    padding-right: 15px !important;
}

.parent-review-form .col-sm-9 {
    padding-left: 15px !important;
}

/* Parent Review form control styling */
.parent-review-form .form-control {
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    color: #495057 !important;
    background-color: #fff !important;
    background-clip: padding-box !important;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

    .parent-review-form .form-control:focus {
        color: #495057 !important;
        background-color: #fff !important;
        border-color: #80bdff !important;
        outline: 0 !important;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
    }

/* Parent Review button styling */
.parent-review-form .btn {
    display: inline-block !important;
    font-weight: 400 !important;
    text-align: center !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
    user-select: none !important;
    border: 1px solid transparent !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    border-radius: 0.25rem !important;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.parent-review-form .btn-success {
    color: #fff !important;
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

    .parent-review-form .btn-success:hover {
        color: #fff !important;
        background-color: #218838 !important;
        border-color: #1e7e34 !important;
    }

.parent-review-form .btn-primary {
    color: #fff !important;
    background-color: #007bff !important;
    border-color: #007bff !important;
}

    .parent-review-form .btn-primary:hover {
        color: #fff !important;
        background-color: #0056b3 !important;
        border-color: #004085 !important;
    }

.parent-review-form .btn-link {
    color: #007bff !important;
    background-color: transparent !important;
    border: none !important;
    text-decoration: none !important;
}

    .parent-review-form .btn-link:hover {
        color: #0056b3 !important;
        text-decoration: underline !important;
    }

/* Parent Review validation styling */
.parent-review-form .text-danger {
    color: #dc3545 !important;
}

    .parent-review-form .text-danger.small {
        font-size: 0.875em !important;
    }

/* Parent Review modal styling */
.parent-review-modal-title {
    font-size: 16px !important;
}

.parent-review-modal-footer {
    margin-top: 0 !important;
}

.parent-review-loader-modal {
    margin-top: 250px !important;
    width: 220px !important;
}

.parent-review-loader-img {
    width: 160px !important;
}

/* Parent Review responsive adjustments */
@media (max-width: 767.98px) {
    .parent-review-form .form-group.row {
        display: block !important;
        align-items: flex-start !important;
        /* flex-wrap: nowrap !important; */
    }

    .parent-review-form .col-form-label {
        text-align: left !important;
        margin-bottom: 0 !important;
        font-weight: bold !important;
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        padding-right: 0.75rem !important;
        padding-left: 0 !important;
    }

    .parent-review-form .col-sm-3 {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        padding-right: 0.75rem !important;
        padding-left: 0 !important;
    }

    .parent-review-form .col-sm-9 {
        flex: 1 !important;
        width: auto !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .parent-review-buttons {
        flex-direction: column !important;
        align-items: center !important;
    }

        .parent-review-buttons .col-sm-4 {
            width: 100% !important;
            text-align: center !important;
            margin-bottom: 0.75rem !important;
        }

            .parent-review-buttons .col-sm-4:last-child {
                margin-bottom: 0 !important;
            }
}

/* ========================================
   JS INTERNSHIP REPORT PAGE STYLES
   ======================================== */

/* JS Internship Report Navigation Styles */
.js-internship-report-navbar {
    border: 1px solid #dee2e6 !important;
    border-radius: 0.25rem !important;
    background-color: #f8f9fa !important;
    padding: 0.5rem !important;
    z-index: 0 !important;
}

    .js-internship-report-navbar .navbar-nav {
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important;
        grid-template-rows: auto auto !important;
        gap: 0 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .js-internship-report-navbar .nav-item {
        text-align: center !important;
    }

        .js-internship-report-navbar .nav-item:nth-child(6) {
            grid-column: 1 / 3 !important;
            grid-row: 2 !important;
        }

    .js-internship-report-navbar .nav-link {
        padding: 0.75rem 1rem !important;
        color: #495057 !important;
        text-decoration: none !important;
        background-color: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        transition: all 0.15s ease-in-out !important;
        display: block !important;
        font-size: 0.875rem !important;
        line-height: 1.2 !important;
    }

        .js-internship-report-navbar .nav-link:hover {
            background-color: #e9ecef !important;
            color: #495057 !important;
            text-decoration: none !important;
        }

        .js-internship-report-navbar .nav-link.active {
            background-color: #6c757d !important;
            color: #ffffff !important;
            font-weight: bold !important;
        }

/* Responsive adjustments for JS Internship Report */
@media (max-width: 1200px) {
    .js-internship-report-navbar .navbar-nav {
        grid-template-columns: repeat(3, 1fr) !important;
        grid-template-rows: auto auto auto !important;
    }

    .js-internship-report-navbar .nav-item:nth-child(6) {
        grid-column: 1 / 4 !important;
        grid-row: 3 !important;
    }
}

@media (max-width: 768px) {
    .js-internship-report-navbar .navbar-nav {
        grid-template-columns: 1fr !important;
        grid-template-rows: repeat(6, auto) !important;
    }

    .js-internship-report-navbar .nav-item:nth-child(6) {
        grid-column: 1 !important;
        grid-row: 6 !important;
    }
}

/* ========================================
   Activity List Control Styles
   ======================================== */

.calendar-today {
    background-color: orange;
}

/* RadGrid column alignment styles */
.RadGrid .rgHeader,
.RadGrid .rgDataCell {
    text-align: left;
}

    .RadGrid .rgHeader[data-field="NoOfStudent"],
    .RadGrid .rgDataCell[data-field="NoOfStudent"] {
        text-align: center;
        width: 100px;
    }

    /* Events Activity List specific styles */
    .RadGrid .rgHeader[data-field="SpeakerCount"],
    .RadGrid .rgDataCell[data-field="SpeakerCount"] {
        text-align: center;
        width: 80px;
    }

    .RadGrid .rgHeader[data-field="County"],
    .RadGrid .rgDataCell[data-field="County"] {
        width: 125px;
    }

    .RadGrid .rgHeader[data-field="DateStart"],
    .RadGrid .rgDataCell[data-field="DateStart"] {
        width: 75px;
    }

    /* Internship Activity List specific styles */
    .RadGrid .rgHeader[data-field="DateModified"],
    .RadGrid .rgDataCell[data-field="DateModified"] {
        width: 100px;
    }

    .RadGrid .rgHeader[data-field="DateBirth"],
    .RadGrid .rgDataCell[data-field="DateBirth"] {
        width: 100px;
    }
/* Responsive table improvements */
/*.table-responsive {
    overflow-x: auto;
}*/

/* Custom styles for EventRequest loader modal */
.event-request-loader-modal-custom {
    margin-top: 250px;
    width: 220px;
}

/* Custom styles for EventRequest file link */
#file-link {
    width: 100px !important;
    white-space: normal;
}

/* Make buttons left-aligned on small screens only for internshipGuidanceReview.ascx - specific to this control */
.internship-guidance-review-buttons .col-sm-4.text-center,
.internship-guidance-review-buttons .col-sm-4.text-right {
    text-align: left !important;
}

/* ========================================
   Extranet Home (Default.aspx) - Scoped Styles
   ======================================== */
.extranet-home .whiteboard a {
    color: #428bca !important;
}

.extranet-home .word-break li a {
    overflow-wrap: break-word;
}

.extranet-home .support-contact-container {
    display: flex !important;
    gap: 16px !important;
    margin-bottom: 20px !important;
    align-items: flex-start !important;
    width: 80% !important;
}

@media(max-width:768px) {
    .extranet-home .support-contact-container {
        width: 90% !important;
    }
}

.extranet-home .support-block {
    flex: 0 0 calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
}

.extranet-home .contact-blocks {
    flex: 0 0 calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

.extranet-home .support-block .quick-icon {
    width: 100% !important;
    min-height: 120px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.extranet-home .contact-blocks .btn {
    width: 100% !important;
    height: 70px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.extranet-home .support-contact-container .quick-icon {
    display: flex !important;
}

.extranet-home .support-contact-container {
    clear: both !important;
    overflow: hidden !important;
}

.extranet-home .contact-download {
    border-radius: 0 !important;
}

@media (max-width: 426px) {
    .extranet-home .col-lg-5 .support-contact-container {
        width: 90% !important;
    }

    .extranet-home .support-block .quick-icon {
        min-height: 87px !important;
        height: 90px !important;
    }

    .extranet-home .contact-blocks .btn {
        height: 40px !important;
        padding-top: 6px !important;
        padding-bottom: 6px !important;
        font-size: 14px !important;
    }
}

@media (min-width: 576px) {
    .internship-guidance-review-buttons .col-sm-4.text-center {
        text-align: center !important;
    }

    .internship-guidance-review-buttons .col-sm-4.text-right {
        text-align: right !important;
    }
}

/* Make buttons left-aligned on small screens only for internshipPre-ApplicationBasicInfo.ascx - specific to this control */
.internship-pre-app-buttons .col-sm-4.text-center,
.internship-pre-app-buttons .col-sm-4.text-right {
    text-align: left !important;
}

@media (min-width: 576px) {
    .internship-pre-app-buttons .col-sm-4.text-center {
        text-align: center !important;
    }

    .internship-pre-app-buttons .col-sm-4.text-right {
        text-align: right !important;
    }
}

/* RadGrid Responsive Styles */
/* Make RadGrid responsive on all screen sizes */
/*.table-responsive {
    overflow-x: auto !important;
}*/

/* Ensure RadGrid table is responsive */
.RadGrid .rgMasterTable {
    min-width: 100% !important;
}

/* Make RadGrid responsive on medium screens and above */
/*@media (min-width: 768px) {
.table-responsive {
        overflow-x: auto !important;
    }
}*/

/*@media (min-width: 992px) {
    .table-responsive {
        overflow-x: auto !important;
    }
}*/

/*@media (min-width: 1200px) {
    .table-responsive {
        overflow-x: auto !important;
    }
}*/


/* Teacher Reference Form Styles */
.teacher-reference-info {
    background-color: #d1ecf1 !important;
    border-color: #bee5eb !important;
    color: #0c5460 !important;
    padding: 1rem !important;
    border-radius: 0.375rem !important;
    margin-bottom: 1.5rem !important;
}

.teacher-reference-form .col-form-label {
    font-weight: bold !important;
    text-align: left !important;
    padding-top: 0.375rem !important;
    padding-bottom: 0.375rem !important;
    margin-bottom: 0 !important;
    color: #495057 !important;
}

.teacher-reference-form .form-control {
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    color: #495057 !important;
    background-color: #fff !important;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

    .teacher-reference-form .form-control:focus {
        color: #495057 !important;
        background-color: #fff !important;
        border-color: #80bdff !important;
        outline: 0 !important;
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
    }

.teacher-reference-form .form-control-plaintext {
    padding-top: 0.375rem !important;
    padding-bottom: 0.375rem !important;
    margin-bottom: 0 !important;
    line-height: 1.5 !important;
    color: #495057 !important;
    background-color: transparent !important;
    border: solid transparent !important;
    border-width: 1px 0 !important;
}

.teacher-reference-textarea {
    min-height: 100px !important;
    resize: vertical !important;
}

.teacher-reference-form .btn {
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    border-radius: 0.375rem !important;
    border: 1px solid transparent !important;
    font-weight: 400 !important;
    text-align: center !important;
    vertical-align: middle !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.teacher-reference-form .btn-success {
    color: #fff !important;
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

    .teacher-reference-form .btn-success:hover {
        color: #fff !important;
        background-color: #218838 !important;
        border-color: #1e7e34 !important;
    }

.teacher-reference-form .btn-primary {
    color: #fff !important;
    background-color: #007bff !important;
    border-color: #007bff !important;
}

    .teacher-reference-form .btn-primary:hover {
        color: #fff !important;
        background-color: #0069d9 !important;
        border-color: #0062cc !important;
    }

.teacher-reference-form .btn-link {
    font-weight: 400 !important;
    color: #007bff !important;
    text-decoration: none !important;
    background-color: transparent !important;
    border: 0 !important;
}

    .teacher-reference-form .btn-link:hover {
        color: #0056b3 !important;
        text-decoration: underline !important;
        background-color: transparent !important;
        border: 0 !important;
    }

.teacher-reference-buttons .col-sm-4 {
    margin-bottom: 0.5rem !important;
}

@media (min-width: 768px) and (max-width: 991.98px) {
    /* Tablet view - prevent overlapping */
    .teacher-reference-form .col-sm-3 {
        flex: 0 0 30% !important;
        max-width: 30% !important;
        padding-right: 15px !important;
    }

    .teacher-reference-form .col-sm-4 {
        flex: 0 0 35% !important;
        max-width: 35% !important;
        padding-right: 15px !important;
    }

    .teacher-reference-form .col-sm-9 {
        flex: 0 0 70% !important;
        max-width: 70% !important;
        padding-left: 15px !important;
    }

    .teacher-reference-form .col-sm-12 {
        flex: 0 0 65% !important;
        max-width: 65% !important;
        padding-left: 15px !important;
    }

    .teacher-reference-form .col-form-label {
        word-wrap: break-word !important;
        white-space: normal !important;
        hyphens: auto !important;
        line-height: 1.4 !important;
    }
}

@media (max-width: 767.98px) {
    .teacher-reference-buttons {
        flex-direction: column !important;
    }

        .teacher-reference-buttons .col-sm-4 {
            width: 100% !important;
            max-width: 100% !important;
            flex: 0 0 100% !important;
            margin-bottom: 0.5rem !important;
        }

            .teacher-reference-buttons .col-sm-4:last-child {
                margin-bottom: 0 !important;
            }

    .teacher-reference-form .col-form-label {
        text-align: left !important;
        margin-bottom: 0.5rem !important;
    }

    .teacher-reference-form .col-sm-3 {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .teacher-reference-form .col-sm-9 {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }
}

@media (min-width: 768px) {
    .teacher-reference-form .col-sm-1,
    .teacher-reference-form .col-sm-2,
    .teacher-reference-form .col-sm-3,
    .teacher-reference-form .col-sm-4,
    .teacher-reference-form .col-sm-5,
    .teacher-reference-form .col-sm-6,
    .teacher-reference-form .col-sm-7,
    .teacher-reference-form .col-sm-8,
    .teacher-reference-form .col-sm-9,
    .teacher-reference-form .col-sm-10,
    .teacher-reference-form .col-sm-11 {
        float: left !important;
    }
}

.teacher-reference-form .form-group.row {
    margin-bottom: 1rem !important;
}

.teacher-reference-form .col-sm-3 {
    padding-right: 15px !important;
}

.teacher-reference-form .col-sm-9 {
    padding-left: 15px !important;
}

/* Job Shadow Guidance Review Form Styles */
.job-shadow-buttons .col-sm-4 {
    margin-bottom: 0.5rem !important;
}

@media (max-width: 767.98px) {
    .job-shadow-buttons {
        flex-direction: column !important;
    }

        .job-shadow-buttons .col-sm-4 {
            width: 100% !important;
            max-width: 100% !important;
            flex: 0 0 100% !important;
            margin-bottom: 0.5rem !important;
        }

            .job-shadow-buttons .col-sm-4:last-child {
                margin-bottom: 0 !important;
            }

    /* Fix mobile overlapping for job shadow guidance review */
    #wlc-guidance .form-group {
        margin-bottom: 1rem !important;
        display: block !important;
    }

    #wlc-guidance .col-sm-2,
    #wlc-guidance .col-sm-3 {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        float: none !important;
        margin-bottom: 0.5rem !important;
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    #wlc-guidance .col-sm-9,
    #wlc-guidance .col-sm-10 {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        float: none !important;
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    #wlc-guidance .control-label {
        text-align: left !important;
        margin-bottom: 0.5rem !important;
    }
}

/* Comprehensive Program Report - Contact Type Responsive */
@media (min-width: 576px) {
    .contact-type-responsive .checkbox-list {
        column-count: 5;
    }
}

@media (max-width: 575.98px) {
    .contact-type-responsive .checkbox-list {
        column-count: 2;
    }

        .contact-type-responsive .checkbox-list label {
            display: block;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            margin-bottom: 8px;
        }
}

/* School Detail - Loading Modal */
.modal-dialog-loading {
    width: 220px !important;
    max-width: 220px !important;
}

/* School Detail - Loading Image */
.loading-image {
    max-width: 160px !important;
}

/* Job Shadow Report - Date Labels Responsive */
@media (min-width: 576px) {
    .jobshadow-date-labels-row {
        display: flex;
        margin-bottom: 0;
    }

        .jobshadow-date-labels-row .col-sm-3:nth-child(3),
        .jobshadow-date-labels-row .col-sm-3:nth-child(4) {
            display: flex;
            align-items: flex-end;
        }

            .jobshadow-date-labels-row .col-sm-3:nth-child(3) label,
            .jobshadow-date-labels-row .col-sm-3:nth-child(4) label {
                margin-bottom: 0.5rem;
            }
}

/* State Counting Reporting Page Styles */
.state-counting-reporting-container {
    overflow-x: auto;
}

/* Student Job Shadow Edit Form Styles */
.wlc-jobshadow-edit .form-horizontal .control-label {
    text-align: right !important;
}

.wlc-jobshadow-edit H3 {
    border-bottom: 1px solid #204582;
    padding-bottom: 3px;
    color: #204582;
    margin-bottom: 20px !important;
}

/* Scoped alignment fixes for Job Shadow form */
.wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
}

    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-2,
    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-7,
    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-3 {
        float: none;
    }

    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-2 {
        width: 16.66666667%;
    }

    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-7 {
        width: 58.33333333%;
    }

    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-3 {
        width: 25%;
    }

    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group .col-sm-7 > [class*='col-sm-'] {
        float: left;
    }

.wlc-jobshadow-edit #wlc-jobshadow .p0 {
    padding-left: 0;
    padding-right: 0;
}

.wlc-jobshadow-edit #wlc-jobshadow .pl0 {
    padding-left: 0;
}

.wlc-jobshadow-edit #wlc-jobshadow .pr0 {
    padding-right: 0;
}

.wlc-jobshadow-edit #wlc-jobshadow .action-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}

    .wlc-jobshadow-edit #wlc-jobshadow .action-row > div {
        float: none;
    }

/* Mobile responsive fixes for Job Shadow form */
@media (max-width: 767px) {
    .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group {
        display: block;
    }

        .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-2,
        .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-7,
        .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group > .col-sm-3 {
            width: 100% !important;
            float: none !important;
            margin-bottom: 10px;
        }

        .wlc-jobshadow-edit #wlc-jobshadow.form-horizontal .form-group .col-sm-7 > [class*='col-sm-'] {
            width: 100% !important;
            float: none !important;
            margin-bottom: 10px;
        }

    .wlc-jobshadow-edit #wlc-jobshadow .control-label {
        text-align: left !important;
        font-weight: bold;
        margin-bottom: 5px;
    }

    .wlc-jobshadow-edit #wlc-jobshadow .action-row {
        display: block;
    }

        .wlc-jobshadow-edit #wlc-jobshadow .action-row > div {
            width: 100% !important;
            text-align: center !important;
            margin-bottom: 10px;
        }
}

/* Student Job Shadow Progress Bar Styles */
.wlc-jobshadow-edit .progress-bar-step1 {
    width: 50% !important;
}

/* Custom Border Utility Classes */
.wlc-jobshadow-edit .bl0 {
    border-left: 0px !important;
}

/* Document Template Edit Form Styles */
.document-template-edit-form .col-form-label {
    text-align: left !important;
    font-weight: bold !important;
}

.document-template-edit-form .form-control {
    width: 100%;
}

.document-template-edit-form .btn {
    margin-bottom: 10px;
}

.document-template-edit-form .text-danger {
    font-size: 12px;
    margin-top: 5px;
}

.document-template-buttons {
    margin-top: 20px;
}

    .document-template-buttons .col-sm-6 {
        margin-bottom: 0.5rem !important;
    }

/* Checkbox and Radio Button Styling for Document Template */
.document-template-checkbox-list {
    max-width: 100% !important;
}

    .document-template-checkbox-list label {
        vertical-align: text-top;
        font-weight: normal;
        margin-left: 2px;
        margin-right: 10px;
        display: inline;
    }

    .document-template-checkbox-list input[type="checkbox"] {
        margin-right: 5px;
        margin-bottom: 0;
        vertical-align: middle;
    }

.document-template-radio-list {
    max-width: 100% !important;
}

    .document-template-radio-list label {
        vertical-align: text-top;
        font-weight: normal;
        margin-left: 2px;
        margin-right: 10px;
        display: inline;
    }

    .document-template-radio-list input[type="radio"] {
        margin-right: 5px;
        margin-bottom: 0;
        vertical-align: middle;
    }

/* Form Check Styling */
.document-template-edit-form .form-check {
    display: flex;
    align-items: center;
    margin-bottom: 0;
}

.document-template-edit-form .form-check-input {
    margin-right: 8px;
    margin-bottom: 0;
}

.document-template-edit-form .form-check-label {
    margin-bottom: 0;
    font-weight: normal;
    cursor: pointer;
}

/* Mobile responsive adjustments for Document Template Edit */
@media (max-width: 767.98px) {
    .document-template-buttons .col-sm-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        margin-bottom: 10px;
    }

    .document-template-edit-form .form-group {
        display: block !important;
    }

    .document-template-edit-form .col-sm-3,
    .document-template-edit-form .col-sm-7,
    .document-template-edit-form .col-sm-9 {
        flex: none !important;
        max-width: 100% !important;
        float: none !important;
    }

    /* Stack checkboxes and radio buttons vertically on mobile */
    .document-template-checkbox-list,
    .document-template-radio-list {
        display: block !important;
    }

        .document-template-checkbox-list table,
        .document-template-radio-list table {
            display: block !important;
            width: 100% !important;
        }

        .document-template-checkbox-list tr,
        .document-template-radio-list tr {
            display: block !important;
            margin-bottom: 0.5rem !important;
            width: 100% !important;
        }

        .document-template-checkbox-list td,
        .document-template-radio-list td {
            display: block !important;
            width: 100% !important;
        }

        .document-template-checkbox-list input[type="checkbox"],
        .document-template-radio-list input[type="radio"] {
            margin-right: 0.5rem !important;
            margin-top: 0 !important;
        }

        .document-template-checkbox-list label,
        .document-template-radio-list label {
            margin-bottom: 0 !important;
            display: inline !important;
        }

    /* Mobile button alignment for document template */
    .document-template-buttons {
        flex-direction: column !important;
    }

        .document-template-buttons .col-sm-6 {
            width: 100% !important;
            max-width: 100% !important;
            flex: 0 0 100% !important;
            margin-bottom: 0.5rem !important;
            text-align: center !important;
        }

            .document-template-buttons .col-sm-6:last-child {
                margin-bottom: 0 !important;
            }
}

/* Document Template Modal Styling */
#popupBracketKeys .modal-dialog {
    width: 45%;
}

    #popupBracketKeys .modal-dialog .modal-content {
        max-height: 600px;
        overflow-y: auto;
    }

/* Business Contact Listing Styles */
.wlc-business-contact-listing .txt-dec {
    text-decoration: underline !important;
}

.wlc-business-contact-listing .selectOption label {
    vertical-align: middle !important;
}

.wlc-business-contact-listing #panInCompleteChkBox label {
    padding-left: 0.4em;
}

/* Business Contact Listing - Responsive Checkbox List with Flexbox */
.wlc-business-contact-listing .wlc-checkbox-list-responsive {
    display: flex;
    flex-wrap: wrap;
}

    .wlc-business-contact-listing .wlc-checkbox-list-responsive tr {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .wlc-business-contact-listing .wlc-checkbox-list-responsive td {
        display: flex;
        align-items: flex-start;
        padding: 0.25rem 0.5rem;
        border: none;
        flex: 1;
        min-width: 200px;
    }

    .wlc-business-contact-listing .wlc-checkbox-list-responsive input[type="checkbox"] {
        margin-right: 0.5rem;
        margin-top: 0.25rem;
        flex-shrink: 0;
    }

    .wlc-business-contact-listing .wlc-checkbox-list-responsive label {
        margin-bottom: 0;
        line-height: 1.4;
        font-weight: normal;
        cursor: pointer;
    }

/* Responsive adjustments for Business Contact Listing Checkbox */
@media (max-width: 1200px) {
    .wlc-business-contact-listing .wlc-checkbox-list-responsive td {
        min-width: 180px;
    }
}

@media (max-width: 992px) {
    .wlc-business-contact-listing .wlc-checkbox-list-responsive td {
        min-width: 150px;
    }
}

@media (max-width: 768px) {
    .wlc-business-contact-listing .wlc-checkbox-list-responsive td {
        min-width: 45%;
        flex: 0 0 45%;
    }
}

@media (max-width: 576px) {
    .wlc-business-contact-listing .wlc-checkbox-list-responsive td {
        min-width: 100%;
        flex: 0 0 100%;
    }
}

/* Custom responsive placement layout for 768px and 1024px */
.wlc-placement-responsive .row {
    display: flex;
    flex-wrap: wrap;
}

/* 768px screen size */
@media (max-width: 768px) {
    .wlc-placement-responsive .wlc-placement-form {
        flex: 0 0 100%;
        max-width: 100%;
        order: 1;
    }

    .wlc-placement-responsive .wlc-placement-comments {
        flex: 0 0 100%;
        max-width: 100%;
        order: 2;
        margin-top: 2rem;
    }
}

/* 1024px screen size */
@media (min-width: 769px) and (max-width: 1024px) {
    .wlc-placement-responsive .wlc-placement-form {
        flex: 0 0 100%;
        max-width: 100%;
        order: 1;
    }

    .wlc-placement-responsive .wlc-placement-comments {
        flex: 0 0 100%;
        max-width: 100%;
        order: 2;
        margin-top: 2rem;
    }
}

/* Above 1024px - default Bootstrap behavior */
@media (min-width: 1025px) {
    .wlc-placement-responsive .wlc-placement-form {
        flex: 0 0 75%;
        max-width: 75%;
        order: 1;
    }

    .wlc-placement-responsive .wlc-placement-comments {
        flex: 0 0 25%;
        max-width: 25%;
        order: 2;
    }
}

/* Word breaking for Placement Date and Placement Notes on 768px and 1024px */



/* === Bootstrap 4: Increase space between checkbox and label text (scoped) === */

/* Mobile dropdown visibility fix for jobShadowPlacement.ascx only */
@media (max-width: 425px) {
    /* Only apply to dropdowns within job-shadow-placement control */
    .job-shadow-placement .btn-group .dropdown-menu {
        position: fixed !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 90vw !important;
        max-width: 320px !important;
        z-index: 9999 !important;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
        border: 1px solid rgba(0, 0, 0, 0.15) !important;
        border-radius: 0.25rem !important;
        max-height: 80vh !important;
        overflow-y: auto !important;
    }

        .job-shadow-placement .btn-group .dropdown-menu.show {
            display: block !important;
            position: fixed !important;
        }

        /* Ensure dropdown items are properly styled on mobile - scoped to job-shadow-placement */
        .job-shadow-placement .btn-group .dropdown-menu .dropdown-item {
            display: block;
            width: 100%;
            padding: 0.75rem 1rem;
            clear: both;
            font-weight: 400;
            color: #212529;
            text-align: left;
            text-decoration: none;
            white-space: normal;
            background-color: transparent;
            border: 0;
            border-bottom: 1px solid #e9ecef;
            font-size: 0.9rem;
        }

            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item:last-child {
                border-bottom: none;
            }

            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item:hover,
            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item:focus {
                color: #16181b;
                text-decoration: none;
                background-color: #f8f9fa;
            }

            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item.active,
            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item:active {
                color: #fff;
                text-decoration: none;
                background-color: #007bff;
            }

            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item.disabled,
            .job-shadow-placement .btn-group .dropdown-menu .dropdown-item:disabled {
                color: #6c757d;
                pointer-events: none;
                background-color: transparent;
            }

        .job-shadow-placement .btn-group .dropdown-menu .dropdown-divider {
            height: 0;
            margin: 0.5rem 0;
            overflow: hidden;
            border-top: 1px solid #e9ecef;
        }

    /* Ensure dropdown button has proper touch target - scoped to job-shadow-placement */
    .job-shadow-placement .btn-group .btn {
        min-height: 44px;
        padding: 0.5rem 1rem;
    }
}

.RadTabStrip .rtsLevel .rtsLink {
    text-decoration: none !important;
}

    .RadTabStrip .rtsLevel .rtsLink:hover {
        text-decoration: none !important;
        color: #666 !important;
    }

a:hover {
    text-decoration: none !important;
}


@media(min-width: 991px) and (max-width:1023px) {
    #fixed-nav {
        top: 130px;
    }

    #main {
        padding-top: 100px;
    }
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px solid #000000;
    border-right: 4px solid transparent;
    border-bottom: 0 dotted;
    border-left: 4px solid transparent;
    content: "";
}

.badge {
    background: #999999;
    border-radius: 10px;
    color: #ffffff;
    padding: 3px 7px;
}

.bordered-checkbox-list {
    padding: 10px;
}


@media (min-width: 992px) and (max-width: 1320px) {
    #liWarning {
        display: none;
    }
}

@media (max-width: 425px) {
    .header-center .brand, .hdr-warning {
        font-size: 10px;
    }
}

.btn-primary {
    color: #fff;
    background-color: #0167a7;
    border-color: #00568c;
}

.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
    padding-right: 7px;
    padding-left: 10px;
}

.RadCalendar .rcWeek th {
    text-align: center !important;
}

.card {
    background-color: #f9f9f9;
}

.rgWrap.rgInfoPart {
    margin-right: 10px;
}

.progress-bar-success {
    background-image: -webkit-gradient(linear, left 0%, left 100%, from(#5cb85c), to(#449d44));
    background-image: -webkit-linear-gradient(top, #5cb85c, 0%, #449d44, 100%);
    background-image: -moz-linear-gradient(top, #5cb85c 0%, #449d44 100%);
    background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);
}

.tab-content {
    margin-top: 20px;
}

.student-tiles {
    margin-bottom: 20px;
}

#ulNav a {
    color: #fff !important;
    margin-right: 20px !important;
    border-left: #fff solid 2px;
    padding-left: 20px !important;
}

.whiteboard {
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 5px rgba(0, 0, 0, .2);
    padding: 0 15px 20px 15px;
    /*margin-top: 70px;*/
    margin: 15px auto;
    padding-top: 20px !important;
    margin-bottom: 60px;
    width: 100%;
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: hidden;
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    display: none;
    width: 100%;
    height: inherit;
    overflow: hidden;
    outline: 0;
}

.mobile-menu-panel ul li ul {
    margin-left: 10px;
    border-left: 1px solid #ccc;
}

.RadCalendar .rcRow td {
    text-align: center !important;
}

.rtsHorizontal .rtsLI {
    margin-bottom: 2px;
}

.RadGrid td.message-column {
    white-space: normal !important;
    word-break: break-word;
    max-width: 400px; /* adjust */
}