body {
  background: #fff;
  -webkit-font-smoothing: antialiased;
  font-size: 12.5px;
  /* margin-top: 70px; */
}
.font-b {
font-size: 12.5px !important;
}
.container {
height: auto;
margin: 30px auto;
}

.custom-menu ul {
  margin-bottom: 0;
  padding-left: 0;
}

.custom-menu li {
  width: 100%;
}

.custom-menu a {
  text-decoration: none;
}
.p-column-filter-buttonbar .p-button-sm[aria-label="Apply"] {
  margin-left: .5rem !important;
}

.cw-3 .p-inputnumber-input {
  max-width: 8ch;
}

.cw-5 .p-inputnumber-input {
  max-width: 12ch;
}

.cw-text-black .p-inputnumber-input {
  color: 12ch;
}

.cw-15 {
  width: 30ch;
}



.cw-10 {
  width: 16ch;
}

.p-dropdown-items-wrapper ul {
  padding-left: 0;
}

.p-contextmenu ul {
  padding-left: 0;
}


.custom-list-box ul {
  margin-bottom: 0 !important;
  padding-left: 0 !important;
  display: block !important;
}

.custom-list-box a {
  text-decoration: none !important;
}

.case-search-bar-wrapper .p-listbox-list-wrapper {
  position: absolute;
  z-index: 9;
  width: 30rem !important;
  border: 1px solid #e5e7eb;
  box-shadow: var(--bs-box-shadow) !important;
  background-color: #FFFF;
  /* outline: #d1d5db solid 1px; */
  /* Make sure it matches the width of the parent container */
}

/* Optionally, you can also add some styles to the parent to ensure proper positioning */
.case-search-bar-wrapper {
  position: relative;
}

.custom-list-box {
  border: none;
}

.custom-list-box .p-listbox-header {
  padding: 0 !important;
  border-bottom: none;
  color: #374151;
  background: #f9fafb;
  margin: 0;
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}




.sidebar1 {
  height: 100%;
  width: 60px;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #fff;
  transition: 0.5s;
  overflow-x: hidden;
  /* padding-top: 60px; */
  white-space: nowrap;
}

.sidebar1 a {
  /* padding: 8px 8px 8px 32px;
  text-decoration: none; */
  /* font-size: 20px; */
  color: #333;
  display: block;
}

.sidebar1 a:hover {
  color: #f1f1f1;
}

main .sidebar1 {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

.material-icons,
.icon-text {
  vertical-align: middle;
}

.material-icons {
  padding-bottom: 3px;
  margin-right: 30px;
}

#main {
  padding: 16px;
  margin-left: 60px;
  transition: margin-left 0.5s;
}

@media screen and (max-height: 450px) {
  .sidebar1 {
    padding-top: 15px;
  }
  .sidebar1 a {
    font-size: 18px;
  }
}

.sidebar1-links {
  margin-left: 6px;
  margin-right: 30px !important;
  font-size: 15px;
}

.nav-item {
  /* margin-bottom: 10px !important; */
}

.arrow {
  font-size: 10px;
  margin-left: 5px;
  vertical-align: middle;
}

.mui-table-head th {
  background-color: #ced4da;
  font-weight: 900;
}

.mui-table-footer td {
  background-color: #ced4da;
  font-weight: 600;
  font-size: 12.5px;
}

.table-secondary {
  background-color: #f8f9fa !important
  
}

.table-tertiary {
  background-color: #e9ecef !important;
  font-weight: 600;
}

/* .p-datatable-wrapper {
  border: 1px solid #dee2e6;
  border-radius: 5px;
 
} */

.p-datatable-table {
  font-size: 12px;
}

.p-datatable th,
.p-datatable td {
    border: 1px solid #dee2e6;
    padding: 0.6rem;
}

.p-sortable-column .p-sortable-column-icon {
  width: 10px; /* Set the desired width */
  height: 10px; /* Set the desired height */
}

.wrapper-overflow .p-datatable-wrapper {
  overflow: visible !important;
}


.p-calendar {
  max-height: 38px;
}



.x-sm-font {
  font-size: x-small;
}

.x-font {
  font-size: small;
}


.sm-padding>:not(caption)>*>* {
  padding: .1rem .5rem !important;
}

.bg-light {
  background-color: #fff!important;
}

.md\:w-30rem {
  width: 30rem !important;
}

.p-hidden-listbox .p-listbox-list-wrapper {
  display: none;
}

/* Random */
.min-line-height {
height: 75px !important;
}

.h-40{
height: 40px;
}
.w-20px{
  width: 5px !important;
}

.w-30{
  width: 30%!important;
}

.p-listbox ul {
  display: block;
} 
ul {
list-style-type: none;
/* display: flex; */
}

.flex {
  display: flex !important;
}

.p-multiselect-items-wrapper ul {
  display: block !important;
  padding-left: 0rem !important;
}

.no-wrapper {
  overflow: visible;
}
.mt-34{
  margin-top:34px;
}

.small-text {
  font-size: 10px;
}

.asc:after {
  content: ' ▲';
}
.desc:after {
  content: ' ▼';
}

.comment-column {
  max-width: 120px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.name-column {
  max-width: 150px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.comment-column:hover {
  white-space: normal;
  overflow: visible;
  z-index: 2;
  position: relative;
  width: auto;
  max-width: none; /* Reset max-width on hover */
}


.name-column:hover {
  white-space: normal;
  overflow: visible;
  z-index: 2;
  position: relative;
  width: auto;
  max-width: none; /* Reset max-width on hover */
}

.btn-success-hover:hover {
  background-color: #129559 !important;
    color: white !important;
}

.btn-warning-hover:hover {
  background-color: #ffc107 !important;
    color: black !important;
}

.cursor-auto {
  cursor: auto !important;
}

.td-p-0 .td {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}


.dropdown-toggle-v2::after {
  content: none;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

/* Nav */
.nav-link-top {
  display: block;
  padding: 1rem 1rem !important;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none !important;
  color: #103c49;
  position: relative;
}

.nav-link-top:hover {
color: #D3628D;
}

.nav-link-top .badge {
position: absolute;
top: 5px;
right: -2px;
color: #fff;
background-color: #dc3545;
}

.a_link{
text-decoration: none !important;
color: #103c49;
cursor: pointer;
font-weight: 500;
}

.a_link2{
  /* text-decoration: none !important; */
  color: #084a5e;
  cursor: pointer;
  }

.a_link:hover{
  text-decoration: none !important;
  color: #5a9ab0 !important;
  }

.nav-tabs .nav-link.active {
color:  #103c49;
background-color: #F9FAFB  !important;

}
/* .nav-tabs .nav-link.active {
color:  #fff;
background-color: #103c49 !important;
}

.nav-tabs .nav-link:hover {
color: #D3628D !important;
}

.nav-tabs .nav-link.active:hover {
  color: #8BBEE7 !important;
  } */

.link-hv:hover{
color: #008F8C !important;
}



/* Avatars */
#avatar {
  vertical-align: middle;
  width: 200px;
  height: 200px;
  object-fit: cover;
}

#avatar2 {
  vertical-align: middle;
  width: 150px;
  object-fit: cover;
}

/* Form Control */
.form-control{
  padding: .275rem .75rem;
  font-size: 12.5px;
}

.form-control, .form-control-sm,  .form-select {
  border-color: #145266;
}

.form-control:focus, .form-control-sm:focus, .form-select:focus {
  border-color: #145266;
  box-shadow: 0 0 0 0.15rem rgb(35 96 110 / 25%);
}

.fc-v2{
  min-height: 38px;
  border-color: rgb(204, 204, 204);
}

.fc-v3{
  border-color: rgb(204, 204, 204);
}

/* .form-control-v2 {
  border-color: #145266;
}

.form-control-v2:focus {
  border-color: #145266;
  box-shadow: 0 0 0 0.25rem rgb(35 96 110 / 25%);
} */

.input-group-addon {
  display: flex;
  align-items: center;
  justify-content: center;
}


#dismissAlert {
  z-index: 1000; /* Ensure the alert is on top of other elements */
  top: 5%; 
  left: 50%; 
  transform: translate(-50%, -50%); 
  width: 50%;
}



/* Buttons And Pills */
.btn-pbc3 {
--bs-btn-color: #fff;
--bs-btn-bg: #CC6699;
--bs-btn-border-color: #CC6699;
--bs-btn-hover-color: #fff;
--bs-btn-hover-bg: #af4c7f;
--bs-btn-hover-border-color: #af4c7f;
--bs-btn-focus-shadow-rgb: 130,138,145;
--bs-btn-active-color: #fff;
--bs-btn-active-bg: #af4c7f;
--bs-btn-active-border-color: #af4c7f;
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
--bs-btn-disabled-color: #fff;
--bs-btn-disabled-bg: #CC6699;
--bs-btn-disabled-border-color: #CC6699;
}

.btn-pc3-link {
  --bs-btn-font-weight: 400;
  --bs-btn-color: #CC6699;
  --bs-btn-bg: transparent;
  --bs-btn-border-color: transparent;
  --bs-btn-hover-color: #af4c7f;
  --bs-btn-hover-border-color: transparent;
  --bs-btn-active-color: #af4c7f;
  --bs-btn-active-border-color: transparent;
  --bs-btn-disabled-color: #6c757d;
  --bs-btn-disabled-border-color: transparent;
  --bs-btn-box-shadow: 0 0 0 #000;
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  text-decoration: none;
}

.btn {
/* border: none; */
font-size: 12.5px !important;
}

.ns-btn{
border: none;
background-color: transparent;
}

.rounded-pill-mv{
  width: 70px;
  background-color: #8AA6A3;
  border:none;
  line-height: 25px;
  font-weight: 500;
  border-radius: 15px;
  color: #fff;
  margin-right: 7px;
}

.rounded-pill-mv:hover{
background-color: #5a9ab0 !important;
color: #fff;
border: none !important;
}


.btn-check:checked + .rounded-pill-mv{
background-color: #145266 !important;
}

button:disabled,
button[disabled]{
  color: #666666;
}

.bg-light-f th {
  background: #f9fafb;
}
.lead {
  font-size: unset;
}


/* .p-button {
  border-radius: 6px !important;
} */

.p-datepicker-trigger {
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
  border-top-right-radius: 5px !important;
  border-bottom-right-radius: 5px !important;

}


.dialog-m-cs {
  width: 500px !important;
}

.dialog-l-cs {
  width: 900px !important;
}

.p-invalid .rs__control {
    border-color: #e24c4c;
}
/* .accordion-button:focus { 
  box-shadow: none !important;
} */


.accordion-button:not(.collapsed) {
  background-color: transparent;
}

/* styles.css */

/* === Excel Export Button === */
.btn-excel {
  background: #1d6f42;
  /* background-image: linear-gradient(180deg, #1d6f42 0%, #155b35 100%); */
  color: #fff;
  border:   #1d6f42 ;
    /* border-radius: 6px;
  padding: 0.5rem 1rem;
  font-weight: 500; */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  /* box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  transition: all 0.25s ease-in-out; */
  cursor: pointer;
}

.btn-excel i {
  font-size: 1.1rem;
}

/* Hover: brighter gradient + stronger shadow */
.btn-excel:hover {
  background: #1f864d;
  /* transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25); */
}





/* Colors */
.pc1{
  color: #8BBEE7;
}

.pc2{
  /* color: #23606E; */
  color: #103c49;
}



.pbc2{
  /* background: #23606E; */
  background: #103c49;
}

.disabled{
  color: #666666;
}

.disabled:hover{
  color: #666666 !important;
}

.pc3{
color:  #CC6699;
}

.pbc3{
  background-color:  #CC6699;
}

.pbc3_o{
  background-color: #fff;
  color: #CC6699;
  border: 0.8px solid #CC6699 !important;
}

.pbc5{
  background-color: #8AA6A3;
}

.c-warning {
  color: #f1c21b;
}

.c-success {
  color: #24A148;
}

.border-pc2 {
  border-color: #103c49 !important;
}


.p-invalid > .css-13cymwt-control {
    border-color: #e24c4c;
}


/* Icons */
.fa-2x:hover, .fa-3x:hover {
  /* color: #407282; */
  color: #5a9ab0;
}

.fc-btn{
  color:#fff;
  padding: .275rem .75rem;

}

.fc-btn:hover{
background-color: #8BBEE7;
color:#fff;

}

.input-container {
  position: relative;
  display: inline-block;
}

.bi-calendar3 {
  position: absolute;
  top: 35%;
  left: 78%; /* Adjust the position as needed */
  transform: translateY(-50%);
  width: 20px; /* Adjust the size as needed */
  height: 20px;
}

/* Dropdown */
.wrapper{
  width: 100%;
}

.select-box {
position: relative;
display: flex;
flex-direction: column;
}

.options-container {
position: absolute;
z-index: 1;
}
.select-box .options-container {
background: white;
width: 100%;
opacity: 0;
border-radius: 8px;
overflow: hidden;
order: 1;
color: rgb(56, 52, 52);

}
.select-box .option {
padding: 5px 0px 5px 20px;
cursor: pointer;
}
.select-box .option .radio {
display: none;
}


.selected {
background: white;
border-radius: 8px;
color: rgb(56, 52, 52);
position: relative;
order: 0;
padding-left: 0px;
}
.selected:after{  
content: '\f106';
  position: absolute;
  right: 10px;
  top: 5px;
  font-family: 'Font Awesome 5 Free';
  font-weight: 700;
  color: black;
  transform: rotate(180deg);
  transition: all .4s;
}

.select-box .option:hover {
background: #fff;
border-radius: 5px;
color: #8AD891;

}
.select-box .option input:hover{
  font-weight: 700px;
}

.search-box input {
width: 100%;
padding: 14px 14px;
opacity: 0;
outline: 1px solid black;
outline-offset: -10px;
z-index: 100;
border: none;
}

.select-box .options-container.active {
margin-top: 40px;
max-height: 180px;
opacity: 1;
overflow-y: scroll;
transition: all 0.4s;
border: 1px solid #a4a1a1;
z-index: 3;
}
.select-box .options-container.active ~ .selected::after {
transform: rotateY(180deg);
}
.select-box .options-container::-webkit-scrollbar {
width: 7px;
background: #888;
border-radius:  8px ;
height: 1px;
}
.select-box .options-container::-webkit-scrollbar-thumb {
background: #464749;
border-radius: 8px 8px 8px 8px;

}
.select-box .options-container.active ~ .search-box input {
opacity: 1;
pointer-events: auto;
}

/* Tables */
#obj_table th {
text-align: left;
font-weight: 400;
/* color: #fff;
background-color: #145266 !important; */
border: none !important;
}

table th {
  font-weight: 400;
}

thead {
vertical-align: middle !important;
}


.family_table td, .obs_table td{
border: 0.5px solid #008F8C;
text-align: center;
padding: 4px 5px;
}

.obs_table td{
width: 55px;

}

.family_table input, .obs_table input{
border: none;
margin: 4px 0px;
}

.family_table input:focus, .obs_table input:focus{
border: none;
outline: none;
}

.family_table th{
border: 0.5px solid #008F8C;
text-align: center;
padding: 1em;
}

.update-table {
padding: 10px;
font-size: 18px;
border: none;
background-color: #007bff;
color: #fff;
cursor: pointer;
}

.special-th {
  border-color: green;
}

.fs-26 {
  font-size: 26px;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
  border-color: rgb(204, 204, 204);
}

.form-control.is-valid, .was-validated .form-control:valid {
  border-color: rgb(204, 204, 204);
  padding-right: calc(1.5em + .75rem);
  background-image: none !important;
  background-repeat: no-repeat;
  background-position: right calc(.375em + .1875rem) center;
  background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

.form-control.is-valid:focus, .was-validated .form-control:valid:focus {
  border-color: rgb(204, 204, 204);
  box-shadow: none;
}

.form-check-input.is-valid, .was-validated .form-check-input:valid {
  border-color: rgb(204, 204, 204);
}

.form-check-input.is-valid:checked, .was-validated .form-check-input:valid:checked {
  background-color: #0d6efd;
}

/* 
.wrapper{
  width: 100%;
}

.select-box {
position: relative;
display: flex;
flex-direction: column;
}
.select-box .options-container {
background: white;
width: 100%;
opacity: 0;
border-radius: 8px;
overflow: hidden;
order: 1;
color: rgb(56, 52, 52);

}
.select-box .option, .selected {
padding: 5px 20px;
cursor: pointer;
}
.select-box .option .radio {
display: none;
}
.selected {
background: white;
border-radius: 8px;
color: rgb(56, 52, 52);
position: relative;
order: 0;
padding-left: 0px;
}
.selected:after{  
content: '\f106';
  position: absolute;
  right: 30px;
  top: 8px;
  font-family: 'Font Awesome 5 Free';
  font-weight: 700;
  color: black;
  transform: rotate(180deg);
  transition: all .4s;
}

.select-box .option:hover {
background: #fff;
border-radius: 5px;
color: #8AD891;

}
.select-box .option input:hover{
  font-weight: 700px;
}

.search-box input {
width: 100%;
padding: 14px 14px;
opacity: 0;
outline: 1px solid black;
outline-offset: -10px;
z-index: 100;
border: none;
}

.select-box .options-container.active {
max-height: 240px;
opacity: 1;
overflow-y: scroll;
transition: all 0.4s;
}
.select-box .options-container.active ~ .selected::after {
transform: rotateY(180deg);
}
.select-box .options-container::-webkit-scrollbar {
width: 7px;
background: #888;
border-radius:  8px ;
height: 1px;
}
.select-box .options-container::-webkit-scrollbar-thumb {
background: #464749;
border-radius: 8px 8px 8px 8px;

}
.select-box .options-container.active ~ .search-box input {
opacity: 1;
pointer-events: auto;
} */


/* Photos */
.photo-item {
float:left;
overflow:hidden;
position:relative;
text-align:center;
cursor:default;
}

.photo-item .photo-overlay {
width:100%;
height: 100%;
position:absolute;
overflow:hidden;
top:0;
left:0;
opacity:0;
background-color:rgba(0,0,0,0.5);
-webkit-transition:all .4s ease-in-out;
transition:all .4s ease-in-out
}

.photo-item img {
display:block;
position:relative;
-webkit-transition:all .4s linear;
transition:all .4s linear;
}

.photo-item:hover .photo-overlay {
opacity:1;
filter:alpha(opacity=100);
}

#overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
display: none;
z-index: 9999;
align-items: center;
justify-content: center;
}




/* Pool */
.full {
width: 100%;
display: table;
border: #015958 solid 2px;
margin-bottom: 20px;
border-radius: 5px;
font-family: Trebuchet MS;
box-shadow: 5px 5px 10px rgb(33 37 41 / 30%);
}

.full:hover {
box-shadow: 5px 5px 10px rgb(33 37 41 / 45%);
background-color: #F9F6F8;
}

.full_column-15 {
float: left;
width: 15%;
padding: 10px;
}

.full_column-35 {
float: left;
width: 30%;
padding: 10px;
}

.full_column {
float: left;
width: 25%;
padding: 10px;
}

.full_item {
padding: auto;
margin: 15px;
color: #2D2A26;
}

strong {
/* color: #D3628D; */
padding: 1em 0;
}

/* Pool Filter */
.filter_cont {
border-radius: 5px;
border: #015958 solid 2px;
padding: 15px 30px;
}

.filt_container {
display: none;
flex-wrap: wrap;
padding: 10px;
background-color: #f2f2f2;
border: 1px solid #ddd;
}

#filter-button, .fa-angle-down {
top: 0;
left: 0;
padding: 10px;
background-color: #fff;
cursor: pointer;
}

/* Search bar */
#search_by {
border-radius: 8px;
border: none;
color: #015958;
}

.searchbar {
width: 500px;
height: 30px;
border-radius: 10px;
padding: 8px;
border: 0px !important;
background-color: rgba(1, 91, 89, 0.2);
}

/* Unknown */
.border-box {
border: 0.8px solid #CC6699 !important;
border-radius: 5%;
}



/* 
.sidebar {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}

.sidebar-sticky {
  position: relative;
  top: 0;
  height: calc(100vh - 48px);
  padding-top: .5rem;
  overflow-x: hidden;
  overflow-y: auto;
}
 */
.sidebar .nav-link {
  font-weight: 500;
  color: #333;
}

.sidebar .nav-link .feather {
  margin-right: 4px;
  color: #999;
}




.container1 {
  display: flex;
  flex-direction: row;
  height: 100%;
}

.sidebar {
  flex: 1;
  width: 12%;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}

.content {
  margin: 30px;
  flex: 9;
  width: 85%;
  margin-left: 14%; /* add margin to content to make space for the sidebar */
}

.admin-logout-links {
  position: absolute;
  bottom: 0;
  width: 100%;
}

.flex-cont {
  display: flex;
}
.right-div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

.content_fl {
  flex: 1;

}

.fields-100 {
  width: 120px;
}

.fields-50 {
  width: 50px;
}

.fixed-table th,
    .fixed-table td {
      width: 120px; /* Set your desired width for th and td elements */
      text-align: left; /* Optional: Adjust text alignment */
    }
    
    .fixed-table-container {
      overflow-x: auto;
    }

    .fixed-table {
      table-layout: fixed;
      width: 50px; /* Set the total width of the table */
    }


.text-black-25 {
    --bs-text-opacity: 1;
    color: rgba(0,0,0,.25)!important;
}