body {
    /* background: url("../wp-content/themes/custom/img/body-bg.png") top center repeat-y;
		background: url("./hooks/OIP2.jpg") top center repeat-y;
		background: url("./hooks/OIP3.jpg") top center repeat-y;
        background-size: auto; */
/*    background: linear-gradient(#0b2442, #091b32);
            linear-gradient(#054c91, #04407a 20%, #054c91); 
	  Light colourfull gradient
	    background: linear-gradient(#054c91, #04407a);  */ /*#05529c Microsoft Blue;  #030C1D; 
	    url("<?php echo PREPEND_PATH; ?>hooks/Diamond-Back.jpg") top center repeat-y
      url("./hooks/Diamond-Back.jpg") top center repeat-y,
*/
/*background: linear-gradient(#0e3157, #0b2442 20%, #081e36) ;*/
background: url("../../../hooks/Diamond-Back.jpg") top center repeat-y;
}
/* TIMS Additions from Header */
    .profile-menu-text { display: inline; } 
    .open > .dropdown-menu { transition: display 0.4s ease-in-out; }
    /* Fade and slide down animation */
    @keyframes fadeSlideDown {
        from {
            opacity: 0;
            transform: translateY(-10px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    
    /* Fade and slide up animation */
    @keyframes fadeSlideUp {
        from {
            opacity: 1;
            transform: translateY(0);
        }
        to {
            opacity: 0;
            transform: translateY(-10px);
        }
    }
    
    /* Apply animation when dropdown is shown */
    .navbar-nav .dropdown.open > .dropdown-menu {
        animation: fadeSlideDown 0.3s ease-in-out forwards;
    }
    
    /* Apply reverse animation when dropdown is hidden */
    .navbar-nav .dropdown > .dropdown-menu {
        animation: fadeSlideUp 0.3s ease-in-out forwards;
    }
    .children-links a img, .child-tab-label a img {
      width: 32px; /* Set desired width */
      height: 32px; /* Maintain aspect ratio */
    }

/* Set padding-top and cursor style for .tile */
.no-padd {
    padding-left: 0;
    padding-right: 0;
}

.tile {
    padding: 11px;
    cursor: pointer;
    position: relative; /* Needed to position the tooltip text */
    /*transition: background-color 0.4s ease-in-out;  Add a transition to the opacity */
    -webkit-transition: background-color 0.4s linear;
    -moz-transition: background-color 0.4s linear;
    -o-transition: background-color 0.4s linear;
    -ms-transition: background-color 0.4s linear;
    transition: background-color 0.4s linear;
}

/* Change background color on hover for .tile */
.tile:hover {
    background-color: rgba(200, 200, 200, 0.25);
}

.tile-add {
    position: absolute; 
    right: 0px; 
    margin-right: 0px;
}

.tooltiptext {
    width: 190px;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 1em;
    border-radius: 6px;
    position: absolute;
    color: white;
    font-size: 12px;
    white-space: normal; /* Wrap text */
    max-width: 200px; /* Limit width */
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.4s ease-in-out; /* Smooth fade effect */
    z-index: 1000;
    pointer-events: none; /* Avoid tooltip interfering with hover */
}

.til22e .tooltiptex22t {
    visibility: hidden;
    width: 140px;
    background-color: #555;
    color: #fff;
    text-align: center;
    padding: 1em;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    top: calc(100% + 10px); /* Position the tooltip 10px below the .tile */
    bottom: auto; /* Reset the bottom value */
    left: 50%;
    margin-left: -70px;
    opacity: 0;
    height: 0;
    overflow: hidden;
    transition: opacity 1s, height 0.5s ease-in-out;
}

.til22e:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
    height: auto;
}
/* Rounded circles behind homepage icons, be sure to remove the js which is setting element style to 32px */
.tile p img{
	width: 48px; height: 48px; /* border-radius: 50%; border: none; padding: 5px; background:#F1F1F1 */
}

/* Anotherr style
.tile p img{ 
	width: 60px; height: 60px; border-radius: 50%; border: 2px solid #F0F0F0; padding: 12px; background:#F0F0F0
}
*/


/* TIMS Additions from Footer */
td a {
  color: #555;
}
.table-striped > tbody > tr:nth-child(odd).highlighted-record > td ,
.table-striped > tbody > tr:nth-child(odd).highlighted-record > th ,
.highlighted-record {
    background-color: #ddd !important; color: #fff !important;
}
@media (max-width: 1229px) {
  .hide-below-1230 {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .navbar-toggle {    display: none;  }
  .navbar-header {      float: left;  }
  .container {width: 95% !important;}
  .form-horizontal .control-label {  padding-top: 5px;  }
}
@media (max-width: 767px) {
  .navbar-toggle {    display: block; }
  .navbar-header {      float: none;  }
  .navbar-toggle {
      position: relative;
      float: right;
      padding: 9px 10px;
      margin-top: 4px;
      margin-right: 15px;
      margin-bottom: 8px;
      background-color: transparent;
      background-image: none;
      border: 1px solid transparent;
      border-radius: 4px;
    } 
  .navbar-brand span { display: none; }
  .navbar .nav > li {  float: none; width:100%;}
  .nav  {  float: none; width:100%;}
}
.navbar, .navbar .nav > li > a {
    height: 40px !important;
}
.table-responsive {
    background-color: #fff;
}
.page-header h1 a, #fixAGContainer h1 {
  color: #0d2d53 !important; /* #0d2d53 for lighter backgrounds */
  font-size: 20px;
  text-transform: uppercase;
}
.calendars-toolbar {
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
    margin-bottom: 0;
}

.calendars-container {
    background: #E9E9E9;
    border: 1px solid #e7e7e7;
    margin-bottom: 15px;
}

.calendars-container, .calendars-toolbar {
    padding: 6px;
}

.fc-day-number.text-info.text-bold {
    color: #000;
}

.fc-toolbar h2 {
    font-size: 1.5em;
    text-transform: uppercase;
}
.calendars-container h3 {
    font-size: 1.2em;
    font-weight: normal;
    text-transform: capitalize;
}

.bootstrap-datetimepicker-widget table td span.active,
.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background-color: #767676 !important;
}

.bootstrap-datetimepicker-widget table td.today:before {
  border-bottom-color: #767676 !important;
}    

.page-header h1 a img {
  margin-top: -3px !important;
  max-width: 42px;
  max-height: 42px;
}
.select2-container .select2-choice {
  background: #fff;
}
.select2-results .select2-highlighted {
    background: #767676;
}
.select2-container .select2-choice .select2-arrow {
  background: #fff;
  border-left: none;
}
.select2-container .select2-choice {
  border: 1px solid #dddddd;
}
.select2-results {
    font-size: 12px !important;
}
.form-control-static {
    padding-top: 5px;
}

.form-control-static {
    padding-bottom: 6px;
    min-height: 28px;
}

div.row.pagination-section {
  /*color: #eee;  // For dark backgrounds only */
}

input[type="checkbox"], input[type="radio"] {
    margin-top: 5px;
}

/*    li.child-tab-label.active a, .children-tabs > .tab-content,{ */
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus, 
.tab-content, li.child-tab-label.active a { 
    background-color: #ffffff70;
}

div.datePicker { font-size: 1em; }

#admin-tools-menu-button {
    margin-top: -.3em !important;
}
[class^=ckbx-style-] label {
    height: 1.2em !important;
}
[class^=ckbx-style-] label:before {
    width: 3.25em !important;
    padding-left: .35em !important;
}
.ckbx-style-15 label:after {
    width: 1.2em !important;
    height: 1.2em !important;
}
.ckbx-style-15 input[type=checkbox]:checked+label:before {
    background: #56c046 !important;
}
.ckbx-style-15 label:before {
    content: "\2714\2716" !important;
    background: #c9302c !important;
    font-size: .7em !important;
    padding-top: 2px !important;
}
[class^=ckbx].ckbx-large {
    padding-top: 2.41px;
}
@media all and (-webkit-min-device-pixel-ratio: 0) and (min-resolution:0.001dpcm) {
    .ckbx-style-15 label:before {
        letter-spacing: 10px !important;
    }
}
/*    
@-moz-document url-prefix() {
    .ckbx-style-15 label:before {
        letter-spacing: 6px
    }
}
*/
/* TIMS PALETTE */
.panel-body {
  background: #E9E9E9;
}
.btn-success,
.panel-success {
  background-color: #1a8832;
}
.btn-info,
.panel-info {
  background-color: #0077cc;
}
.btn-warning,
.panel-warning {
  background-color: #e97132;
}
.btn-danger,
.panel-danger {
  background-color: #cc0000;
}
.btn-primary,
.panel-primary {
  background-color: #174985;
}
.alert-danger {
  background-color: #ff4242;
}
.alert-success {
  background-color: #479958;
}
.alert-warning {
  background-color: #ed9062;
}
.alert-info {
  background-color: #2ea4cf;
}
.alert-primary {
  background-color: #3674c1;
}
.text-danger {
  color: #cf3636;
}
.text-success {
  color: #3c814a;
}
.text-warning {
  color: #ed9062;
}
.text-info {
  color: #2993b9;
}
.text-primary {
  color: #326cb4;
}
.panel-primary > .panel-heading, .label-primary {
    color: #ffffff;
    background-color: #174985;
    border-color: #174985;
}
.panel-primary {
    border-color: #174985;
}
.panel-success > .panel-heading, .label-success {
    color: #ffffff;
    background-color: #2d6f3f;
    border-color: #2d6f3f;
}
.panel-success {
    border-color: #2d6f3f;
}
.panel-warning > .panel-heading, .label-warning {
    color: #ffffff;
    background-color: #d46a00;
    border-color: #d46a00;
}
.panel-warning {
    border-color: #d46a00;
}
.panel-danger > .panel-heading, .label-danger {
    color: #ffffff;
    background-color: #cc0000;
    border-color: #cc0000;
}
.panel-danger {
    border-color: #cc0000;
}
.panel-info > .panel-heading, .label-info {
    color: #ffffff;
    background-color: #0077cc;
    border-color: #0077cc;
}
.panel-info {
    border-color: #0077cc;
}
a {
  color: #32609c;
  text-decoration: none;
}
a:hover,
a:focus {
  color: #396db1;
  text-decoration: underline;
}
.upload-toolbox {
    box-shadow: unset;
}

.select2-container .select2-choice {
    border-radius: 0px;
}
/*.select2-container *:focus, &.select2-container--focus,
.select2-container .select2-choice:focus,
.select2-container--open .select2-choice,
.select2-container-open .select2-choice {
  border-color: #75a5e4 !important;
  outline: 0; 
  border: 3px solid red!important;
}
.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
    -webkit-box-shadow: unset;
            box-shadow: unset;
    -webkit-transition: border-color ease-in-out .15s;
         -o-transition: border-color ease-in-out .15s;
            transition: border-color ease-in-out .15s;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
  border: 3px solid red!important;
}
*/
.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
    border: 1px solid #66afe9;
    outline: none;

  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
    -webkit-transition: border-color ease-in-out .15s;
         -o-transition: border-color ease-in-out .15s;
            transition: border-color ease-in-out .15s;
}
.panel-heading .flip.tv-tools {
    margin-top: -5px;
}
hr {
    margin: 20px 0;
}
form > div.detail_view {
    padding: 0;
}
.modal-body form > div.detail_view {
    padding-top: 15px;
}
.users-area > .row {
  background-color: rgba(255, 255, 255, 0.2); /* #414954 Semi-transparent white background */
  box-shadow: 0 0px 10px rgba(0, 0, 0, 0.2); /* Optional: Slight shadow for depth */
  border-radius: 10px; /* Optional: Rounded corners for a smoother look */
  padding: 5px; /* Optional: Adds space inside the div */
  backdrop-filter: blur(7px); /* Apply blur to the background */
}
/* Styles specific to Dashboards */

    /* Medium devices (desktops, 992px and up) */
    @media (min-width: 992px) {
      .equal-height {
        min-height: 200px;
      }
    }
    
    /* Large devices (large desktops, 1200px and up) */
    @media (min-width: 1200px) {
      .equal-height {
        min-height: 240px;
      }
    }

    .loader {
      border: 6px solid #c9c9c9; /* Light grey */
      border-top: 6px solid #174985; /* Blue */
      border-radius: 50%;
      width: 30.39px;
      height: 30.39px;
      margin: 0 auto 10px;
      animation: spin 2s linear infinite;
    }
    
    @keyframes spin {
      0% { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }

    .metric-box {
        display: flex;
        align-items: center;
        background-color: #ffffff70;
        border: 1px solid #DDDDDD;
        border-top: none;
    }
    .metric-count {
        background: #fff;
        padding: 15px;
        text-align: center;
        border-radius: 5px;
        width: 80px;
    }
    .metric-count h1 {
        margin: 0;
        font-size: 36px;
        color: #0F4D3D;
        font-weight: bold;
    }
    .metric-count span {
        font-size: 12px;
        color: #0F4D3D;
        font-weight: bold;
    }
    .metric-text {
        font-size: 16px;
        margin-left: 15px;
        color: #3F3D56;
        font-weight: bold;
    }
    .metric-info {
        font-size: 12px;
        margin-left: 15px;
        line-height: 1.2em;
        font-weight: normal
    }
    .m-big {
        font-size:2em;
        font-weight: bold;
        margin: 0;
        padding: 0;
    }
    .m-small {
        font-size:1em;
        font-weight: Normal;
        margin: -0.5em 0em 0em;
        padding: 0;
    }