html {
    font-size: 10px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

/*@media print{
    body{
        font-size:12px;
        line-height:1.4;
        font-family:Arial,sans-serif;
        margin:initial;
        padding:0;
    }

    .container{
        width:100%;
        margin:initial;
        padding:0;
    }
    h1{
        font-size:24px;
        text-align:center;
    }

    .table{
        width:100%;
        border-collapse:collapse;
    }
    table,th,td{
        border:1px solid black;
    }
    th,td{
        padding:8px;
        text-align:left;
    }
   
}*/



/*@page {
    size: landscape;
}*/

/*@media print and (orientation:landscape) {
}*/

body {
    margin-bottom: 60px;
    /*font-size: 12px;*/
    /* line-height: 1.4;
    font-family: Arial,sans-serif;
    margin: initial;
    padding: 0;*/
    /*margin: 0;
    background: #CCCCCC;*/
}

.container {
    width: 100%;
    padding: 0;
    position: initial;
}

.table {
    width: 100%;
    border-collapse: collapse;
}
/*.table-responsive{
    overflow-x:initial
        
}*/
.vertical-line {
    display: inline-block;
    border-left: 1px solid #ccc;
    margin: 0 10px;
    height: 30px;
}

button {
    overflow: visible;
    width: auto;
}

button.link {
    font-family: "Verdana" sans-serif;
    font-size: 1em;
    text-align: left;
    color: blue;
    background: none;
    margin: 0;
    padding: 0;
    border: none;
    cursor: pointer;
    -moz-user-select: text;
    /* override all your button styles here if there are any others */
}

button.link span {
    text-decoration: underline;
}

button.link:hover span,
button.link:focus span {
    color: black;
}

.printTable{
    font-size:12px;
}


.custom-hover {
    transition: all 0.3s ease;
    cursor: pointer;
    /*font-weight:bold;*/
}

li.custom-hover:hover,
li.custom-hover:focus {
    background-color: red !important;
}

a.custom-hover:hover,
a.custom-hover:focus {
    color: #574fec !important;
    /*outline: 2px solid #005fcc;*/ /* High contrast color */
    /*outline-offset: 2px;*/
    text-decoration:underline;
}

    a.custom-hover:hover i,
    a.custom-hover:focus i {
        color: #574fec !important;
        /*outline: 2px solid #005fcc;*/ /* High contrast color */
        /*outline-offset: 2px;*/
    }

button.custom-hover:hover,
button.custom-hover:focus {
    background-color: #fff !important;
    border-color: #574fec !important;
    color: #574fec !important;
}
button.custom-hover-secondary:hover,
button.custom-hover-secondary:focus {
    background-color: #fff !important;
    border-color: #6c757d !important;
    color: #6c757d !important;
}

button.custom-hover-red:hover,
button.custom-hover-red:focus {
    background-color: #F8F9FA !important;
    border-color: #B02A37 !important;
    color: #B02A37 !important;
}

.redButton {
    background-color: #B02A37;
    color: #F8F9FA;
    border: solid 2px;
    border-color: #B02A37;
    font-weight: bold;
}

.custom-hoverTwo {
    transition: all 0.3s ease;
    cursor: pointer;
    font-weight: bold;
    /*color: #574fec !important;*/
}
li.custom-hoverTwo:hover,
li.custom-hoverTwo:focus {
    background-color: red !important;
    border-color: red !important;
    color: white !important;
}
/*li.custom-hoverTwo:hover a,
li.custom-hoverTwo:focus a {
    background-color: red !important;
    border-color: red !important;
    color: white !important;
}*/

a.custom-hoverTwo:hover,
a.custom-hoverTwo:focus {
    background-color: red !important;
    border-color: red !important;
    color: white !important
}

.custom-hoverBigFont:hover,
.custom-hoverBigFont:focus {
    font-weight: bold;
    text-decoration: underline;
}

.closeBtn {
    display: inline-block;
    padding: 8px;
    /*transition: border 0.3s ease;*/
    text-decoration:none;
    float:right;
}

    .closeBtn:hover,
    .closeBtn:focus {
        border: 2px solid #B02A37;
    }


.lgWarning {
    background-color: #FDECEA; /* light red background with sufficient contrast */
    border-left: 4px solid #D93025; /* strong visual indicator (not color alone) */
    color: #5F0A00; /* dark text ensuring 7:1+ contrast */
    padding: 12px 16px;
    border-radius: 4px;
    font-size: 1rem;
    line-height: 1.5;
}

    /* Strong element inside alert */
    .lgWarning strong {
        font-weight: 700;
        color: #B71C1C; /* darker red icon text for visibility */
    }

    /* Accessibility: visible focus for keyboard users */
    .lgWarning:focus {
        outline: 3px solid #005FCC; /* WCAG AA contrast-compliant focus style */
        outline-offset: 2px;
    }

