/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/Other/CascadeStyleSheet.css to edit this template
*/
/* 
    Created on : Apr 23, 2024, 1:49:14 PM
    Author     : cll
*/

h4, .h4 {
    font-size: calc(1rem + 0.3vw);
}

.checkbox, .form-check-input {
    cursor: pointer;
}


/* Bootstrap Icons inside mini buttons */
.btn-mini .bi {
  font-size: 12px;           /* BS2-ish glyph size */
  line-height: 1;            /* no extra vertical space */
  vertical-align: -0.125em;  /* tiny baseline nudge */
  /* optional crispness tweaks for font icons */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* If you ever place text next to the icon in a mini button */
.btn-mini .bi + span,
.btn-mini span + .bi {
  margin-left: 4px;
}

/* Icon-only mini buttons (retro BS2 look) */
.btn-mini.btn-icon{
  width:26px;           /* 21x21 renders crisper across DPIs than 20x20 */
  height:22px;
  padding:0;
  border-radius:3px;    /* BS2 mini corners */
  display:inline-flex;
  align-items:center;
  justify-content:center;
}


.btn {
  --bs-btn-font-size: 0.875rem;    
  --bs-btn-padding-y: 0.25rem;
  --bs-info: #0dcaf0;
  --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);  
  background-color: var(--bs-btn-bg);
  background-image: var(--bs-gradient);
}

.btn-primary {
  --bs-btn-bg: #0d44cc;
  --bs-btn-border-color: #0d44cc;
  --bs-btn-hover-bg: #0044cc;
  --bs-btn-active-bg: #003399;
  --bs-gradient: linear-gradient(180deg, rgba(0, 136, 204, 1), rgba(0, 136, 204, 0));
}

.btn-primary:hover, .btn-warning:hover, .btn-info:hover, .btn-danger:hover, .btn-success:hover {
  background-image: none;
  transition: none;
}


.btn-primary.check-label:hover {
     color: white;
     background-color: #004285;
     border-color: #0d2255;
 }


.btn-primary.check-label:active, .btn-check:checked + .btn-primary.check-label {
     box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     background-color: #003399;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 }

 .btn-info {
  --bs-btn-color: #fff;
  --bs-btn-bg: #49afcd;
  --bs-btn-border-color: #2f96b4;
  --bs-btn-hover-bg: #2f96b4;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #2f96b4;
  --bs-btn-active-border-color: #2f96b4;
  --bs-gradient: linear-gradient(180deg, rgba(91, 192, 222, 1), rgba(47, 150, 180, 1));
} 

/*  
  --bs-gradient: linear-gradient(180deg, #5bc0de, #2f96b4);
*/

.btn.btn-info:hover {
  background-color: #2f96b4; /* A slightly darker blue/cyan */
  border-color: #23819c; /* A darker border color */
  color: #ffffff; /* White text */
}

.btn-info.check-label:hover {
     color: white;
     background-color: #2f96b4;
     border-color: #146c43;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
}

.btn-info.check-label:active, .btn-check:checked + .btn-info.check-label {
     box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     background-color: #2b89a6;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 }

 
/*


     background-color: #0088cc !important;
     border-color: #146c43;
  --bs-btn-bg: #49afcd;
  --bs-btn-border-color: #49afcd;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #2f96b4;
  --bs-btn-active-border-color: #2f96b4;
background-image: linear-gradient(to bottom, #5bc0de, #2f96b4); info
background-image: linear-gradient(to bottom, #0088cc, #0044cc); primary

*/

.btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: #5bb75b;
  --bs-btn-border-color: #5bb75b;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #157347;
  --bs-gradient: linear-gradient(180deg, #62c462, #51a351);
}

.btn-success.check-label:hover {
     color: white;
     background-color: #51a351;
     border-color: #0d2255;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 }

 .btn-success.check-label:active, .btn-check:checked + .btn-success.check-label {
     box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     background-color: #157347;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 }

/* BS2-like warning button using BS5 variables */
.btn-warning {
  /* base */
  --bs-btn-color: #fff;
  --bs-btn-bg: #faa732; /*250. 167, 50*/
  --bs-btn-border-color: #c67605;

  /* hover */
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #f89406; /* 248, 148, 6 */
  --bs-btn-hover-border-color: #c67605;

  /* active/checked */
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #f89406;
  --bs-btn-active-border-color: #a65d04;

  /* disabled (optional, keeps palette consistent) */
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #fbb450;
  --bs-btn-disabled-border-color: #c67605;

  /* gradient like BS2 */
  --bs-gradient: linear-gradient(to bottom, #fbb450, #f89406);

  text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}

/* keep gradient on base/hover; BS2 flattened when active */
.btn-warning {
  background-image: var(--bs-gradient);
}
.btn-warning:active,
.btn-check:checked + .btn-warning {
  background-image: none;
  box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
}

label.btn.btn-warning.check-label:hover {
  background-color: #f89406 !important; /* Set the desired darker yellow */
  /* You might also need to override background-image if a gradient is present */
/*  background-image: none !important; */
}

.btn-danger {
  --bs-btn-border-color: #c67605;
  --bs-btn-bg: #ee5f5b;
  --bs-btn-border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  --bs-gradient: linear-gradient(180deg, #ee5f5b, #bd362f);
}

/*
  --bs-btn-color: #fff;
  --bs-btn-bg: #dc3545;
  --bs-btn-border-color: #dc3545;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #bb2d3b;
  --bs-btn-hover-border-color: #b02a37;
  --bs-btn-focus-shadow-rgb: 225, 83, 97;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #b02a37;
  --bs-btn-active-border-color: #a52834;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #dc3545;
  --bs-btn-disabled-border-color: #dc3545;

*/

.btn-danger.check-label:hover {
     color: white;
     background-color: #c21a14;
     border-color: #802420;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 }

.btn-danger.check-label:active, .btn-check:checked + .btn-danger.check-label {
     box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
     background-color: #bd362f;
     --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
 }

 .btn-sm {
     --bs-btn-font-size: 0.6rem;
 } 
 
 .card {
     --bs-card-bg: #f5f5f5;
     padding: 19px;
 }

 
.accordion-button {
     padding: 0.2rem var(--bs-accordion-btn-padding-x);
     background-color: unset;
     white-space: normal; /* Allow text wrapping and line breaks */
     color: #0088cc;
     text-decoration: none;
 }

.accordion-button:hover, .accordion-button:focus {
    text-decoration: underline; /* underline only on hover/focus */
    color: #005580; /* darker shade for hover/focus, matching BS2 */
}
 
 .accordion-item {
     background-color: unset;
 }

.dropdown-item:hover, .dropdown-item:focus {
    background-color: #0081c2;
}
 
 .dropdown-item:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* remove the gap so it doesn't close */
}

/* Reduce padding and spacing in dropdown menus */

.dropdown-divider {
    margin: 4px 0; /* reduce spacing around dividers */
}

/* Override padding specifically for dropdown menu items */
.dropdown-menu .dropdown-item,
.dropdown-menu .dropdown-item .nav-link {
    padding-top: 2px;
    padding-bottom: 2px;
    padding-left: 5px;
    padding-right: 5px;
}

/* Fix dropdown item hover colors to match Bootstrap 2.x appearance */
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu .dropdown-item:hover .nav-link,
.dropdown-menu .dropdown-item:focus .nav-link {
    background-color: #0081c2 !important; /* match original blue background */
}

/* Fix cascading submenu appearance for Bootstrap 5.x */
.dropdown-menu .dropdown-submenu {
    background-color: #ffffff !important; /* white background */
    border: 1px solid rgba(0,0,0,.15); /* subtle border like original */
    border-radius: 4px; /* rounded corners like original */
    padding: 5px 0; /* vertical padding */
}

.dropdown-menu .dropdown-submenu .dropdown-item {
    background-color: transparent !important; /* transparent background by default */
    color: #212529 !important; /* default dark text color */
    border: none !important; /* remove unwanted borders */
    padding: 3px 20px; /* padding similar to original */
}

.dropdown-menu .dropdown-submenu .dropdown-item:hover,
.dropdown-menu .dropdown-submenu .dropdown-item:focus {
    background-color: #0081c2 !important; /* blue background on hover */
    color: #ffffff !important; /* white text on hover */
}

/* Sets cascading menu item to white instead of leaving it dark */
ul.dropdown-menu li.dropdown-item.dropend a.dropdown-item.dropdown-toggle.show,
ul.dropdown-menu.show li.dropdown-item.dropend:hover > a.dropdown-item.dropdown-toggle {
  color: #ffffff !important; /* Force text color to white */
}

/* Remove transitions on the "CS Archive" link and other top-level dropdown items */
a.nav-link { /* Other standard top-level menu items */
  transition: none !important; /* Remove all transitions */
}

/* Remove extra padding/margin from nested submenu links */
.dropdown-menu .dropdown-submenu .dropdown-item .nav-link {
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
    background-color: transparent !important;
}

/* Align submenu parent item ("CS Archive") with other menu items */
.dropdown-menu > li > .dropdown-item {
    font-size: 14px; /* match original Bootstrap 2.x font size */
    padding: 3px 16px; /* match original padding */
    color: #212529; /* default text color */
}

/* Ensure submenu caret aligns correctly */
.dropdown-toggle::after {
    color: gray;
    margin-left: 0.5em;
}

/* Run CIBERSORTx dropdown appearance */
 button.btn.dropdown-toggle.btn-light {
  /* Apply the Bootstrap 2 gradient from white to light gray */
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x; /* Standard for BS2 gradients */

  /* Set a solid background color as a fallback and to match the gradient end */
  background-color: #e6e6e6;

  /* Match Bootstrap 2 border color (a slightly darker gray) */
  border-color: #cccccc;

  /* Apply a Bootstrap 2-style box shadow for depth */
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

/* Remove extra padding/margin from nested submenu links */
.dropdown-menu .dropdown-submenu .dropdown-item {
    padding: 3px 20px !important;
    font-size: 14px !important;
}

/* Adjust submenu positioning slightly if needed */
.dropdown-submenu {
    margin-left: 0 !important;
}

/* Align submenu caret (triangle) to the far right */
.dropdown-menu .dropdown-toggle::after {
    float: right;
    margin-top: 5px; /* adjust as needed */
    margin-right: -5px; /* adjust as needed */
}

/* Position cascading submenu to the right of parent menu item */
.dropdown-submenu {
    position: relative;
}

.dropdown-item.dropend {
    position: relative;
    color: white;
}

/* Hover-to-open on pointer devices (keeps mobile tap behavior intact) */
@media (hover: hover) and (pointer: fine) {
  .dropdown-menu > .dropend:hover > .dropdown-submenu {
    display: block;
  }
}


li.dropend:hover > ul.dropdown-menu.dropdown-submenu {
  left: 100%; /* Position to the right of the parent LI */
  top: 0;     /* Align top with the parent LI */
  /* Ensure position is absolute if not already applied elsewhere */
  position: absolute;
}

li.dropend ul.dropdown-menu.dropdown-submenu a.nav-link:hover,
li.dropend ul.dropdown-menu.dropdown-submenu a.nav-link:focus {
  color: #ffffff; /* Set text color to white */
}



/* Show dropdown submenu on hover , optional - BS2.x site didn't have this behavior'*/
/* .dropdown:hover > .dropdown-menu {
    display: block;
} */




/*
     --bs-accordion-btn-bg: var(--bs-secondary-bg-rgb);
.check-label:hover {
     color: white !important;
     background-color: blue !important;
     border-color: black !important;
 }

.btn-success {
  background-image: linear-gradient(to bottom, #62c462, #51a351);    
}*/


/* Slightly narrower container at large screens to match original Bootstrap 2.x width */
@media (min-width: 1200px) {
    .container {
        max-width: 1200px; /* Adjust this value slightly if needed */
    }
}

/* Pulled down from higher above to group with other navbar overrides */

.navbar-nav {
    --bs-nav-link-hover-color: white;
}

.nav-link {
    padding: 0.1rem var(--bs-nav-link-padding-x);
}

/* Navbar background and text color to match original Bootstrap 2.x appearance */
.navbar {
    background-color: #000; /* black background */
    background-image: none; /* remove gradient */
    box-shadow: 0 .25rem .5rem rgba(0,0,0,.07); /* existing shadow */
    border-bottom: 1px solid #dddddd;       /* gray line */    
}


/* Active tab highlighting to match original Bootstrap 2.x appearance */
.navbar .nav-link.active,
.navbar .nav-link:hover,
.navbar .nav-link.show {
    background-color: #000 !important; /* black background for active/hover */
    color: #fff !important; /* white text */
}

/* Navbar padding and spacing adjustments */
.navbar-nav .nav-link {
    padding-top: 8px;
    padding-bottom: 8px;
    padding-left: 1rem !important;  /* increase left padding */
    padding-right: 1rem !important; /* increase right padding */
    font-size: 14px; /* match original font size */
}

/* Navbar brand font weight adjustment */
.navbar-brand {
    font-weight: 500; /* match original font weight */
}

.nav-link {
    color: #111111;
}

  .navbar { min-height: 0; }
  /* Normalize link paddings to match your other pages (BS5 defaults) */
  .navbar .nav-link { padding-top: .5rem; padding-bottom: .5rem; }
  .navbar .navbar-brand { padding-top: .3125rem; padding-bottom: .3125rem; }  


/* Adjust alignment of right navbar dropdown (after clicking on Welcome, <name of user> )*/  
.dropdown-menu form li {
    padding-left: 9px !important; /* Match the padding of your dropdown-items */
    /* You might need !important if other rules override this */
}  

/* Target the power icon within the form list item in the dropdown menu */
.dropdown-menu form li i.bi-power {
    font-size: 18px; /* Or 20px for a larger increase */
    /* You might need !important here if other rules are overriding font-size */
}
  

/* Match original Bootstrap 2.x typography */
body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px; /* Slightly larger base font size */
    line-height: 1.2; /* Match original line-height */
    color: #333; /* Original Bootstrap 2.x default text color */
    font-weight: 200; /* normal weight */    
    letter-spacing: 0.25px; /* adjust letter-spacing slightly if needed */
}

/* Headings adjustments to match original Bootstrap 2.x */
h1, h2, h3, h4, h5, h6 {
    font-family: inherit; /* same as body font */
    font-weight: 700; /* original Bootstrap 2.x default */
    line-height: 1.1; /* original Bootstrap 2.x default */
    color: inherit; /* inherit body color */
  padding-top: 0.3em;
}

/* Adjust paragraph spacing to match original Bootstrap 2.x */
p {
    margin-bottom: 15px; /* Original Bootstrap 2.x spacing */
}

/* Precisely match original Bootstrap 2.x banner styling */
.alert.alert-danger {
    color: #b94a48; /* original Bootstrap 2.x alert-danger text color (red) */
    padding: 8px 15px; /* original Bootstrap 2.x padding */
    margin-bottom: 20px; /* original Bootstrap 2.x margin-bottom */
/*    line-height: 1.5; */ /* vertically center text properly */
    border-color: #ebccd1;    
}

.alert-banner {
    background-color: #f2dede; /* lighter red matching original Bootstrap 2.x */
    color: #a94442; /* original text color */
    padding: 8px 15px; /* smaller padding matching original */
    border-radius: 4px; /* rounded corners matching original */
    margin-bottom: 15px; /* smaller margin-bottom matching original spacing */
}

.alert-banner h4 {
    margin: 0; /* remove extra margin from heading */
    font-size: 17px; /* adjust font size to match original appearance */
    font-weight: bold; /* match original font weight */
}

/* Increase boldface text weight to match Bootstrap 2.x */
b, strong {
    font-weight: 700; /* or try 600 if 700 is too bold */
}

/* Match Bootstrap 2.x alert-warning text color */
.alert-warning {
    color: #8a6d3b; /* original Bootstrap 2.x warning text color */
    border-color: #faebcc;
}

/* Match Bootstrap 2.x alert-success text color */
.alert-success {
    color: #3c763d; /* original Bootstrap 2.x success text color */
    border-color: #d6e9c6;
}

.alert-info {
    color: #31708f;
    border-color: #bce8f1;
}

/* Match Bootstrap 2.x hyperlink color and underline on hover */
a {
    color: #0088cc;
    text-decoration: none; /* no underline by default */
}

a:hover, a:focus {
    color: #005580; /* slightly darker shade for hover/focus */
    text-decoration: underline; /* underline on hover/focus */
}

/* Override Bootstrap 5 reboot rule for onclick links without href */
a[onclick]:not([href]) {
    color: #0088cc; /* Bootstrap 2.x default link color */
    text-decoration: none;
}

a[onclick]:not([href]):hover,
a[onclick]:not([href]):focus {
    color: #005580; /* darker shade on hover/focus */
    text-decoration: underline;
}

/* Restore h3 font size within accordion buttons */
h3 .accordion-button {
    font-size: inherit; /* inherit font size from parent h3 */
    padding: 0.5rem 1rem; /* adjust padding if needed */
    color: #0088cc;
}

/* Modal header centered and larger (h3 size) */
.modal-title {
    font-size: 1.75rem; /* roughly h3 size */
    margin: 0 auto; /* center horizontally */
    text-align: center;
    width: 100%;
}

/* Increase modal width slightly (~half an inch wider) */
.modal-dialog {
    max-width: 850px; /* default modal-lg is ~800px, adjust as needed */
}

/* Decrease modal body text size slightly and set line spacing to 1.2 */
.modal-body {
    font-size: 0.9rem; /* slightly smaller than default */
    line-height: 1.2;
}

/* Increase modal height by approximately 1.5 inches for scrollable modals */
.modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 100px); /* Adjust this value as needed */
}

/* Restore Bootstrap 2.x blockquote appearance */
blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee;
}

blockquote p {
    margin-bottom: 0;
    font-size: inherit;
    font-weight: 300;
    line-height: 1.25;
}

blockquote small {
    display: block;
    line-height: 20px;
    color: #999;
}

blockquote small:before {
    content: '\2014 \00A0';
}

/* Restore Bootstrap 2.x <pre> tag appearance */
pre {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.42857143;
    color: #333;
    word-break: break-all;
    word-wrap: break-word;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
}

/* Set default table background to transparent */
.table {
  --bs-table-bg: transparent;
}


.table-responsive {
  overflow-x: auto;
}

.table-responsive table {
  border-collapse: separate;
  border-spacing: 0;
}

.table-responsive td,
.table-responsive th {
  white-space: normal; /* Allow text wrapping */
  word-wrap: break-word; /* Break long words if necessary */
  max-width: 400px; /* Adjust this value as needed */
}

.table-fixed-header {
  max-height: 500px; /* Adjust this height as needed */
  overflow-y: auto;  /* Enable vertical scrolling */
  overflow-x: auto;  /* Enable horizontal scrolling if needed */
}

.table-fixed-header table {
  width: 100%;
  border-collapse: separate; /* Required for sticky positioning */
  border-spacing: 0;
}

.table-fixed-header th {
  position: sticky; /* Fix header to top */
  top: 0;
  background-color: #fff; /* Match your header background color */
  z-index: 2; /* Ensure header stays above body cells */
  box-shadow: 0 2px 2px -1px rgba(0,0,0,0.2); /* Optional subtle shadow */
}

/* Optional: Ensure text wrapping in cells */
.table-fixed-header td,
.table-fixed-header th {
  white-space: normal;
  word-wrap: break-word;
  max-width: 400px; /* Adjust as needed */
}

/* Override Bootstrap 5 striped table color to match hero container background */
.table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-striped-bg: #f9f9f9; /* Bootstrap 2 hero-unit background color */
}

/* Set table header background to transparent */
.table thead th {
    background-color: rgba(var(--bs-secondary-bg-rgb), var(--bs-bg-opacity)) !important;
}

.col-form-label-sm, .form-check-label {
  font-size: 14px;
}

.table-controls .row > * {
  padding-right: calc(var(--bs-gutter-x) * 0.2);
  padding-left: calc(var(--bs-gutter-x) * 0.2);
}

.table-controls .mb-3 {
    margin-bottom: 0.5rem !important;
}

/* Bootstrap 2-style depressed button effect */
.btn-group .btn.active {
  box-shadow: inset 0 4px 6px rgba(0,0,0,0.3); /* Stronger inset shadow */
  filter: brightness(95%); /* Slightly darker background */
}

/* Temporary pressed effect when clicking */
.btn-group .btn:active {
  box-shadow: inset 0 5px 8px rgba(0,0,0,0.4);
  filter: brightness(70%);
}


/*

.table-header-rotated {
  border-collapse: collapse;
  overflow: visible; /* Ensure overflow is visible */
/*}

.table-header-rotated th.rotate-45 {
  position: relative;
  height: 160px; /* Slightly increased height to prevent cutoff */
/*  width: 50px; /* Slightly increased width to accommodate rotation */
/*  min-width: 50px;
  max-width: 50px;
  vertical-align: bottom;
  padding: 0;
  font-size: 13px;
  line-height: 1.0;
  overflow: visible; /* Ensure overflow is visible */
/*}

.table-header-rotated th.rotate-45 > div {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform-origin: bottom left;
  transform: translateX(-1%) rotate(-45deg); /* Adjust translateX to nudge text slightly right */
/*  width: 140px; /* Increase width to ensure text fits without cutoff */
/*}

.table-header-rotated th.rotate-45 span {
  display: inline-block;
  width: 100%;
  text-align: left;
  white-space: nowrap;
}*/


/* From header */
   .table-legend td {
 width: 50px;
 font-size:1.0em; 
   text-align: center;
 border:1.0pt solid windowtext;
    }
   .table-jobs th {
     font-size: 0.85em;
    }
   .table-jobs td {
     font-size: 0.85em;
     max-width: 300px;
    }
   .form-jobs {
     margin-bottom: 0px;
    }
     table tr { height: 30px }
.progress {
    height: 30px;
  background-image: none;
  -webkit-print-color-adjust: exact;
  box-shadow: inset 0 0;
  -webkit-box-shadow: inset 0 0;
}
.bar {
    line-height: 30px;
    background-image: none;
    -webkit-print-color-adjust: exact;
    box-shadow: inset 0 0;
    -webkit-box-shadow: inset 0 0;}
td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 20px;
}
/* error container */
   errors {
     background-color:#163356;
     color:#fff;
     width:400px;
     padding:20px;
     margin:5px auto;
     display:none;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
     }
 
/* title */
errors h2 {
  margin:-5px 0;
  color:yellow;
}
/* Sidenav for Docs
-------------------------------------------------- */
/* Sidebar container offset and width */
/* Sidebar fixed positioning and offset */
.bs-docs-sidebar {
  top: 80px; /* Adjust to match your top navbar height */
  width: 228px;
  padding-left: 15px; /* Adjust left offset as needed */
}
/* Sidebar navigation styling */
.bs-docs-sidenav {
  margin: 0;
  padding: 0;
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(0,0,0,.065);
}

.bs-docs-sidenav .nav-header {
  padding: 8px 14px;
  font-size: 12px;
  font-weight: bold;
  color: #999;
  text-transform: uppercase;
}

.bs-docs-sidenav .nav-link {
  display: block;
  padding: 8px 14px;
  font-size: 13px;
  color: #0088cc;
  border: 1px solid #e5e5e5;
  margin-bottom: -1px;
  border-radius: 0;
  background-color: #fff;
}

.bs-docs-sidenav .nav-link:hover {
  background-color: #f5f5f5;
  color: #005580;
}

.bs-docs-sidenav .nav-link.active {
  background-color: #0088cc;
  color: #fff;
  text-shadow: 0 1px 0 rgba(0,0,0,.15);
  box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
}

/* Rounded corners ONLY for first and last items */
.bs-docs-sidenav .nav-link:first-of-type {
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

.bs-docs-sidenav .nav-link:last-of-type {
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}

/* Chevron right-aligned */
.bs-docs-sidenav .nav-link .float-end {
  font-weight: bold;
  opacity: 0.5;
}

.bs-docs-sidenav .nav-link.active .float-end {
  color: #fff;
  opacity: 1;
}

/* Images inside accordion content */
.accordion .accordion-body img {
  max-width: 100%;
  height: auto;          /* preserve aspect ratio */
  display: block;        /* removes stray descender gaps */
  margin: 0 auto;        /* optional: center small images */
  max-height: 70vh;      /* optional: keep huge images from getting absurd */
  object-fit: contain;   /* plays nicely with max-height */
}

/* Safety: prevent any horizontal scroll if something else overflows */
.accordion .accordion-body {
  overflow-x: hidden;
}

/* Show hand cursor when hovering over a closed accordion */
.accordion-button.collapsed:hover {
  cursor: pointer;
}


/* Makes the gray background on pages match the BS2-style */
.container > div#tophero {
  background-color: #eeeeee !important;
}

.w-csxform { width:570px !important; }


/* =========================
   Bootstrap-select TOGGLE (BS2 look)
   ========================= */

/* Idle (unclicked) — BS2 gradient */
.bootstrap-select > .dropdown-toggle.btn-default,
button.btn.dropdown-toggle.btn-default,
button.btn.dropdown-toggle.btn-light {
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
  background-repeat: repeat-x;
  background-color: #e6e6e6;
  border-color: #cccccc;
  color: #333;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),
              0 1px 2px rgba(0,0,0,0.05);
}

/* Hover/Focus (not open) — darker bg + stronger shadow */
.bootstrap-select > .dropdown-toggle.btn-default:hover,
.bootstrap-select > .dropdown-toggle.btn-default:focus {
  background-image: none;
  background-color: #e6e6e6;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.15),
              0 2px 4px rgba(0,0,0,0.15);
}

.bootstrap-select > .dropdown-toggle.btn-default:focus {
  border-color: #000;
    
}

/* Depressed look while OPEN (robust across versions) */
.bootstrap-select .dropdown-toggle[aria-expanded="true"],
.btn-group.bootstrap-select.show > .dropdown-toggle,
.bootstrap-select .dropdown-toggle.show {
  background-image: none !important;
  background-color: #d9d9d9 !important;
  border-color: #000 !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.2),
              0 1px 3px rgba(0,0,0,0.15) !important;
  color: #333 !important;
}

/* Keyboard focus (not open) — subtle pressed look */
.bootstrap-select .dropdown-toggle:focus-visible {
  background-image: none !important;
  background-color: #e6e6e6 !important;
  border-color: #000 !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.2),
              0 1px 3px rgba(0,0,0,0.15) !important;
}

/* Optional: remove BS5 glow when not open */
.bootstrap-select > .dropdown-toggle:focus {
  box-shadow: none;
}

/* Safety reset on close to avoid “half-pressed after close” */
.bootstrap-select .dropdown-toggle[aria-expanded="false"]:not(:hover):not(:focus) {
  background-image: linear-gradient(to bottom, #ffffff, #e6e6e6) !important;
  background-color: #e6e6e6 !important;
  border-color: #cccccc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),
              0 1px 2px rgba(0,0,0,0.05) !important;
}

/* =========================
   Dropdown MENU items
   ========================= */

/* Compact items (no fixed height) */
.bootstrap-select .dropdown-menu .dropdown-item {
  padding: 3px 8px;           /* 3px vertical, 8px horizontal */
  line-height: 20px;          /* BS2-ish compact height */
  font-size: 0.875rem;        /* optional */
  color: #000;
  background: transparent;
}

/* Neutralize BS5 active/selected look unless hovering/focused */
.bootstrap-select .dropdown-menu li.selected > a.dropdown-item,
.bootstrap-select .dropdown-menu .dropdown-item.active,
.bootstrap-select .dropdown-menu .dropdown-item:active:not(:hover):not(:focus) {
  background: transparent !important;
  color: #000 !important;
}

/* BS2-style highlight on hover/focus */
.bootstrap-select .dropdown-menu .dropdown-item:hover,
.bootstrap-select .dropdown-menu .dropdown-item:focus,
.bootstrap-select .dropdown-menu li a.dropdown-item:hover,
.bootstrap-select .dropdown-menu li a.dropdown-item:focus,
.bootstrap-select .dropdown-menu .dropdown-toggle:hover,
.bootstrap-select .dropdown-menu .dropdown-toggle:focus {
  color: #fff !important;
  background-color: #0081c2 !important;
  background-image: linear-gradient(to bottom, #0088cc, #0077b3) !important;
}

/* Progress bar BS5 --> BS2 specifically for #progressbar and #progressouter in Run CIBERSORTx*/
/* Container: subtle inset & rounded corners, BS2-style */
#progressbar #progressouter.progress {
  background-color: #f7f7f7;
  background-image: linear-gradient(#f5f5f5, #f9f9f9);
  border-radius: 4px;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
  height: 30px;               /* BS2 default bar height */
  overflow: hidden;
}

/* The bar itself (BS2 used .bar) */
#progressbar #progressouter .bar {
  height: 100%;
  line-height: 30px;          /* centers % text if you add it */
  text-align: center;
  font-size: 14px;       /* bump up for legibility */
  font-weight: bold;     /* adds thickness */
  /* BS2 "info" blue with glossy gradient */
  background-color: #5bc0de;
  background-image:
    linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,0)),
    linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%,
                           rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
  background-size: auto, 40px 40px;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
}

/* White text only when background is dark */
#progressbar #progressouter .bar.bg-success,
#progressbar #progressouter .bar.bg-info {
  color: #fff;
}

/* Black text fallback for lighter bar colors */
#progressbar #progressouter .bar {
  color: #111;
}

/* Stripes + animation (BS2 .progress-striped.active) */
#progressbar #progressouter.progress-striped.active .bar {
  animation: progress-bar-stripes 2s linear infinite;
}

@keyframes progress-bar-stripes {
  from { background-position: 0 0, 40px 0; }
  to   { background-position: 0 0, 0 0; }
}

/* Optional state colors if you need them later (BS2 lookalikes) */
#progressbar #progressouter.progress-success .bar { background-color: #62c462; }
#progressbar #progressouter.progress-warning .bar { background-color: #f89406; }
#progressbar #progressouter.progress-danger  .bar { background-color: #ee5f5b; }

/* --- Override BS5 .bg-info to use BS2 "info" blue --- */
#progressbar #progressouter .bar.bg-info {
  background-color: #5bc0de !important;   /* BS2 teal-blue */
  background-image:
    linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,0)),
    linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%,
                           rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent);
  background-size: auto, 40px 40px;
}

/* --- Override BS5 .bg-success to a lighter BS2-style green --- */
#progressbar #progressouter .bar.bg-success {
  background-color: #62c462 !important;   /* mid green */
  background-image:
    linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,0)),
    linear-gradient(45deg, rgba(255,255,255,.15) 25%, transparent 25%,
                           transparent 50%, rgba(255,255,255,.15) 50%,
                           rgba(255,255,255,.15) 75%, transparent 75%);
  background-size: 40px 40px;
}

/* allows smooth transitions when the progress bar is incremented */
#progress {
  transition: width 0.5s ease !important;   /* 0.5s = half-second animation */
}

/* BS2-style glossy gradients for generic BS5 progress bars (stacked) */
.progress .progress-bar {
  /* glossy overlay */
  background-image:
    linear-gradient(rgba(255,255,255,.2), rgba(0,0,0,.15));
  background-blend-mode: overlay;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
}

  .progress .bar.success { background-color: var(--bs-success); }


/* Contextual colors tuned toward BS2 palette */
.progress .progress-bar.bg-success, .progress .bar-success {
  background: linear-gradient(to bottom, #66c46a, #3ea851); /* overwrite completely */
  background-color: #3ea851;
}

.progress .progress-bar.bg-warning, .progress .bar-warning {
--bs-gradient: linear-gradient(to bottom, #fbb450, #f89406);    
  background-color: #f89406; /* BS2 warning-ish */
  color: #111;               /* readable on warm yellow */
}

.progress .progress-bar.bg-danger, .progress .bar-danger {
  background-color: #ee5f5b; /* BS2 danger-ish */
}


/* Poll counter during runs */
#pollcount {
  font-size: 12px;
  opacity: 0.6;        /* subtle */
  margin-left: 6px;
}

/* Thin, unobtrusive countdown meter below the main bar */
#progressbar #pollmeter {
  height: 4px;
  background: #f2f3f5;      /* faint gray track */
  border-radius: 2px;
  margin-top: 6px;
  overflow: hidden;
}

#progressbar #pollmeter > div {
  height: 100%;
  width: 0%;                /* wave starts empty, fills to 100% */
  background: #cfd4da;      /* faint gray fill */
  transition: width 1s linear;  /* duration will be overridden per-cycle in JS */
}

@media (prefers-reduced-motion: reduce) {
  #progressbar #pollmeter > div { transition: none; }
}


/* Console viewport for console logs while CSx is running: ~450px tall with vertical scroll */
#consoleone .accordion-inner,
#consoleone .panel-body {        /* BS3 fallback */
  max-height: 450px;
  overflow-y: auto;
}

/* Background color for BS2-stype hero units */
.custom-container {
    background-color: #eeeeee !important;
}