/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. 
This is for bfs purpose only.*/
.footer__blank--space {
    padding-bottom: 14.25rem !important;
}

.footer__dept--left {    
    margin-bottom: 0;
    margin-right: 5%;

}

.footer__dept--right {
   
    width: 65%;
}

.light-background {
    background-color: lightblue !important;
    
}
.select__help__bfs {
    display: block;
    color: black;
    font-size:smaller;
    margin-top: 8px;
}
a.right-link {
    position: absolute !important;
    right: 0 !important;
    color: white !important;
    padding-right: 3em;
  
}

    a.right-link:hover {
        color: yellow !important;
    }

.anchorbutton , .ucla a:not(.page):visited{
    color: #fff !important;
}


.required_text {
    color: darkred !important;
}

.fau_text {
    font-size: 12px;
}

.error {
    color: darkred !important;
    font-size: small;
}

.module-title {
    font-weight: 700;
    font-size: 24px;
    border-left: 8px solid #FFD100;
    padding: 0 0 0 8px;
    margin: 0;
}

.error-message {
    display: inline-block;
    background-color: #ff0000; /* red */
    border-radius: 50%; /* makes the background circular */
    width: 1em; /* sets the width and height of the circle */
    height: 1em;
    color: #ffffff; /* sets the text color to white */
    font-weight: bold; /* makes the text bold */
    line-height: 1em; /* centers the text vertically within the circle */
    text-align: center; /* centers the text horizontally within the circle */
}
span.field-validation-error:not(:empty):before, label.error:before {
    /* width: 0px; */
    /*height: 2px;*/
    content: "";
    display: inline-block;
    -webkit-mask-image: url("../ucla-web-icons/denotive/triangle-exclamation-solid.svg");
    mask-image: url("../ucla-web-icons/denotive/triangle-exclamation-solid.svg");
    /*  background: url("../ucla-web-icons/denotive/triangle-exclamation-solid.svg");*/
    background-repeat: no-repeat;
    margin-right: 3px;
    margin-top:0px;
    background-color: darkred; /* red */
    /*border-radius: 90%;*/ /* makes the background circular */
    width: 1.3em; /* sets the width and height of the circle */
    height: 1.3em;
    color: #ffffff; /* sets the text color to white */
    font-weight: bold; /* makes the text bold */
    line-height: 1em; /* centers the text vertically within the circle */
    text-align: center; /* centers the text horizontally within the circle */
    /* border-style: solid; */
    /* border-width: 12px 12px 0px 4px; */
    /* position: absolute; */
    /* border-color: transparent red transparent transparent; */
    /* border-left: 5px solid transparent; */
    /* border-right: 5px solid transparent; */
    /* border-bottom: 5px solid #000; */
}
.field-validation-error, label.error {
    color: darkred;
    font-size: small;
    /*min-height: 34px;*/
     display: inline-flex;
    align-items: center;
}
a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
  color: #0366d6;
  white-space: nowrap;
}



.btn--group {
    display: flex;
    gap: 8px;
    align-items: center;
}

    .btn--group .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        vertical-align: middle;
    }

    .btn--group a.btn {
        line-height: 1;
    }



.btn-primary {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}
.btn {
    padding: 10px 16px;
    font-size: 1rem;
    line-height: 1rem;
    font-weight: bold;
    border-radius: 2px;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    margin-right: 4px;
}
.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: #1b6ec2;
  border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  font-size: 14px;
}
@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.border-top {
  border-top: 1px solid #e5e5e5;
}
.border-bottom {
  border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#main-content {
  flex: 1;
}

.footer {
  width: 100%;
  margin-top: auto;
}


.left-margin-20{
    margin-left:20px;
}

.header-wrap {
    z-index: 1000 !important;
}

@media (max-width: 1026px) {
    .nav-primary {
       top: 0px;
    }

    #header{
        width: 72%;
    }
}



@media (max-width: 392px) {

    #header {
        width: 100%;
    }
}

.custom-cell {
    /* Define styles for the cells in specific columns */
    text-align: left;
}

.custom-cellex {
    text-align: left;
    font-size: 0.9rem !important;
}

.custom-header {
    /* Define styles for the header row */
    text-align: left;
    padding: 8px 16px;
    font-weight: bold;
    background-color: #daebfe;
}

.button-center {
    text-align: center
}

.sidephoto {
    height: 406px;
    width: 350px;
    margin-top: 14px;
    margin-left: 38px;
}

.fixed-table__wrapper tbody td {
    font-size: 1rem;
    line-height: 1.33;
    color: #333;
    padding: 8px 16px;
    word-wrap: break-word;
}

.word-wrap {
    white-space: normal !important;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.text_span {
    min-height: 40px;
}

.fau_text {
    font-size: 12px;
}

table, th, td {
    border: 1px solid #b3b3b3;
    border-collapse: collapse;
    width:100%;
}

.no-border-table {
    border: 0;
}

    .no-border-table th,
    .no-border-table td {
        border: 0;
    }


.fixed-table__wrappers {
    width: 100%;
}


.custom-cell-px {
    padding: 10px;
}
.bold_label {
   font-weight: bold;
}
.table {
    max-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    margin-bottom: 1.4;
    border-bottom: 1px solid #b3b3b3
}

    .table th, .table td {
        padding: 8px;
        line-height: 1.4;
        text-align: left;
        vertical-align: top;
        border-top: 1px solid #b3b3b3
    }

    .table th {
        font-weight: bold
    }

    .table thead th {
        vertical-align: bottom
    }

    .table caption + thead tr:first-child th, .table caption + thead tr:first-child td, .table colgroup + thead tr:first-child th, .table colgroup + thead tr:first-child td, .table thead:first-child tr:first-child th, .table thead:first-child tr:first-child td {
        border-top: 0
    }

    .table tbody + tbody {
        border-top: 2px solid #b3b3b3
    }

    .table > caption {
        color: #666;
        padding: 5px
    }

        .table > caption.top {
            caption-side: top
        }

        .table > caption.bottom {
            caption-side: bottom
        }

    .table.hover tbody tr:hover td, .table.hover tbody tr:hover th {
        background-color: #d9d9d9
    }

    .table.striped tbody tr:nth-child(odd) td, .table.striped tbody tr:nth-child(odd) th {
        background-color: #ebebeb
    }

    .table.bordered {
        border: 1px solid #b3b3b3;
        border-collapse: separate;
        *border-collapse: collapse;
        border-left: 0;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
        border-radius: 4px
    }

        .table.bordered th, .table.bordered td {
            border-left: 1px solid #b3b3b3
        }

        .table.bordered caption + thead tr:first-child th, .table.bordered caption + tbody tr:first-child th, .table.bordered caption + tbody tr:first-child td, .table.bordered colgroup + thead tr:first-child th, .table.bordered colgroup + tbody tr:first-child th, .table.bordered colgroup + tbody tr:first-child td, .table.bordered thead:first-child tr:first-child th, .table.bordered tbody:first-child tr:first-child th, .table.bordered tbody:first-child tr:first-child td {
            border-top: 0
        }

            .table.bordered thead:first-child tr:first-child th:first-child, .table.bordered tbody:first-child tr:first-child td:first-child {
                -webkit-border-top-left-radius: 4px;
                border-top-left-radius: 4px;
                -moz-border-radius-topleft: 4px
            }

            .table.bordered thead:first-child tr:first-child th:last-child, .table.bordered tbody:first-child tr:first-child td:last-child {
                -webkit-border-top-right-radius: 4px;
                border-top-right-radius: 4px;
                -moz-border-radius-topright: 4px
            }

        .table.bordered thead:last-child tr:last-child th:first-child, .table.bordered tbody:last-child tr:last-child td:first-child, .table.bordered tfoot:last-child tr:last-child td:first-child {
            -webkit-border-radius: 0 0 0 4px;
            -moz-border-radius: 0 0 0 4px;
            -ms-border-radius: 0 0 0 4px;
            -o-border-radius: 0 0 0 4px;
            border-radius: 0 0 0 4px;
            -webkit-border-bottom-left-radius: 4px;
            border-bottom-left-radius: 4px;
            -moz-border-radius-bottomleft: 4px
        }

        .table.bordered thead:last-child tr:last-child th:last-child, .table.bordered tbody:last-child tr:last-child td:last-child, .table.bordered tfoot:last-child tr:last-child td:last-child {
            -webkit-border-bottom-right-radius: 4px;
            border-bottom-right-radius: 4px;
            -moz-border-radius-bottomright: 4px
        }

        .table.bordered caption + thead tr:first-child th:first-child, .table.bordered caption + tbody tr:first-child td:first-child, .table.bordered colgroup + thead tr:first-child th:first-child, .table.bordered colgroup + tbody tr:first-child td:first-child {
            -webkit-border-top-left-radius: 4px;
            border-top-left-radius: 4px;
            -moz-border-radius-topleft: 4px
        }

        .table.bordered caption + thead tr:first-child th:last-child, .table.bordered caption + tbody tr:first-child td:last-child, .table.bordered colgroup + thead tr:first-child th:last-child, .table.bordered colgroup + tbody tr:first-child td:last-child {
            -webkit-border-top-right-radius: 4px;
            border-top-right-radius: 4px;
            -moz-border-radius-topleft: 4px
        }

    .table.condensed th, .table.condensed td {
        padding: 4px 5px
    }

.primary_table {
    color: #e2e6ef;
    background-color: #234189;
    border-color: #192e60;
    text-shadow: none;
    font-family: "Helvetica","Arial",sans-serif !important;
}

table, th, td {
    border: 1px solid #b3b3b3;
    border-collapse: collapse;
}

.no-border-table {
    border: 0;
}

    .no-border-table th,
    .no-border-table td {
        border: 0;
    }

/* 1. Make the table full width and force equal column math */
.table-fau {
    width: 100% !important;
    table-layout: fixed !important; /* This is the "magic" property for even spacing */
    border-collapse: collapse !important;
}

    /* 2. Reset the individual cells so they don't fight for 100% width */
    .table-fau th,
    .table-fau td {
        width: auto !important;
        overflow: hidden; /* Prevents content from breaking the even grid */
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center !important;
        padding: 8px 5px !important;
    }

.anchorbutton,
.ucla a.btn:not(.page):visited {
    color: #ffffff !important;
}

a.anchor-med-font {
    font-size: 15px;
}

/* ============================================================
   KioskSearch Page Styles
   ============================================================ */

/* Pagination */
.kiosk-pagination a,
.kiosk-pagination span {
    margin: 4px;
    padding: 6px 10px;
    border: 1px solid #ccc;
    text-decoration: none;
    background-color: #ebebeb;
}

.kiosk-pagination .active {
    background: #2774AE;
    color: white;
    font-weight: bold;
}

/* Fixed-width result table */
.kiosk-fixed-table {
    overflow-x: auto;
    width: 100%;
}

.kiosk-fixed-table table {
    width: 100%;
    table-layout: fixed;
}

.kiosk-fixed-table th,
.kiosk-fixed-table td {
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
    padding: 8px;
}

    .kiosk-fixed-table th.custom-header {
        background-color: #daebfe;
        color: #000;
        font-weight: bold;
    }

/* Column width constraints */
.kiosk-fixed-table td:nth-child(1),
.kiosk-fixed-table th:nth-child(1) { width: 12%; }

.kiosk-fixed-table td:nth-child(2),
.kiosk-fixed-table th:nth-child(2) { width: 12%; }

.kiosk-fixed-table td:nth-child(3),
.kiosk-fixed-table th:nth-child(3) { width: 12%; }

.kiosk-fixed-table td:nth-child(4),
.kiosk-fixed-table th:nth-child(4) { width: 12%; }

.kiosk-fixed-table td:nth-child(5),
.kiosk-fixed-table th:nth-child(5) { width: 15%; }

.kiosk-fixed-table td:nth-child(6),
.kiosk-fixed-table th:nth-child(6) { width: 10%; }

.kiosk-fixed-table td:nth-child(7),
.kiosk-fixed-table th:nth-child(7) { width: 15%; }

.kiosk-fixed-table td:nth-child(8),
.kiosk-fixed-table th:nth-child(8) { width: 12%; }

/* Tab panels - hidden by default; active tab set server-side via inline style */
.tabcontent {
    display: none !important;
}

/* T&C Modal */
#tc-modal-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}

#tc-modal-overlay.active {
    display: flex;
}

#tc-modal {
    background: #fff;
    width: 700px;
    max-width: 90vw;
    max-height: 80vh;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}

#tc-modal-header {
    background-color: #2774AE;
    color: white;
    padding: 12px 16px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#tc-modal-close {
    cursor: pointer;
    font-size: 1.2em;
    background: none;
    border: none;
    color: white;
    font-weight: bold;
}

#tc-modal-body {
    padding: 16px;
    overflow-y: auto;
    flex: 1;
    font-size: 0.9em;
    line-height: 1.6;
}


.smalldisclaimer { 
    font-style: italic;
    font-size: 0.8em;
}