.input-sm:focus-visible{
  box-shadow: 0 0 0 2px #4f46e5;
}
.container2 {
  margin-top: 50px;
}
.btn-nt-primary{
  --btn-bg: #4f46e5;
  --btn-bg-hover: #6366f1;

  min-width: 115px;
  height: 40px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px; /* space between text & svg */

  padding: 0 16px;
  border-radius: 8px;

  background-color: var(--btn-bg);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  line-height: 1;

  border: none;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;

  transition:
    background-color .2s ease,
    box-shadow .2s ease,
    transform .15s ease;
}
.btn-nt-primary:hover{
  background-color: var(--btn-bg-hover);
  color:white !important;
}

.btn-nt-primary:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.35);
  color:white !important;
}

.btn-nt-primary:active{
  transform: translateY(1px);
}
.btn-nt-primary svg{
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  fill: currentColor;
  color:white !important;
}




.btn-nt-secondary-lead-icon{
  background-color:rgb(238 242 255); ;
  font-weight: 400;
  border-radius: 6px;
  color: #4f46e5;
  padding: 10px 14px;
  border: none;
  transition: all 0.3s ease-in-out;
  display: flex;
  flex-direction: row-reverse;
}

.btn-nt-secondary-lead-icon:hover{
  background-color: rgb(224 231 255) ;
  font-weight: 600;
  border-radius: 6px;
  color: #4f46e5;
  padding: 10px 14px;
  border: none;
  transition: all 0.3s ease-in-out;
  display: flex;
  flex-direction: row-reverse;
}

.btn-nt-primary-lead-icon{
    background-color: rgb(79 70 229);
    font-weight: 600;
    border-radius: 6px;
    color: white;
    padding: 10px 14px;
    border: none;
    transition: all 0.3s ease-in-out;
    display: flex;
    flex-direction: row-reverse;
}

.btn-nt-primary-lead-icon:hover{
    background-color: rgb(99 102 241);
}

.icon-in-button-nt{
    margin-right:10px;
}



.btn-nt-secondary{
    min-width: 105px;
    background-color: rgb(255, 255, 255);
    font-weight: 600;
    border-radius: 6px;
    color: rgb(0, 0, 0);
    padding: 10px 14px;
    border: none;
    transition: all 0.3s ease-in-out;
    border: 1px solid #b7bcd8;
    max-height: 40px;
    white-space: nowrap;
}
.btn-nt-secondary:hover{
    min-width: 105px;
    background-color: rgb(245 244 255);
}




.btn-nt-soft{
    min-width: 105px;
    background-color: #eef2ff;
    font-weight: 600;
    border-radius: 6px;
    color: #4f46e5;
    padding: 10px 14px;
    border: none;
    transition: all 0.3s ease-in-out;
    border: 1px solid #b7bcd8;
}
.btn-nt-soft:hover{
    min-width: 105px;
    background-color: #cfdafc;
}

.input-with-label-nt {
  font-weight: 300;
  padding: 6px 12px;
  width: 100%;
  height: 40px;
  border-radius: 6px;

  border: 1px solid #b7bcd8;
  outline: none;

  transition:
      border-color 0.25s ease,
      box-shadow 0.25s ease,
      transform 0.15s ease;
}

.input-with-label-nt:focus-visible {
  border-color: rgb(79 70 229);
  box-shadow: 0 0 0 1px rgb(78, 70, 229);
  transform: translateY(-1px);
}

::placeholder {
  color: #b7bcd8 !important;
  opacity: 1; /* Firefox */
  font-weight: 500;
}


.select-nt{
    padding: 6px 12px;
    width: 100%;
    height: 38px;
    transition: all 0.3s ease-in-out;
    border: 1px solid #b7bcd8;
    border-radius: 6px;
}

.select-nt:focus-visible{
    outline: none;
    border:2px solid rgb(79 70 229);

}

option:hover {
  background-color: rgb(79 70 229) !important;
}

.heading-section-nt{
    padding: 0px 0px 20px;
    width: 100%;
    margin: 0;
}

.heading-section-divider-nt{
    border: 1px solid #eeeff3;
    width: 100%;
}
.heading-section-container-nt{
    margin: 20px 10px;
}




.checkbox-custom {
  appearance: none; /* Remove default styling */
  width: 20px;
  height: 20px;
  border: 2px solid rgb(79 70 229);
  border-radius: 4px;
  outline: none;
  cursor: pointer;
}

.checkbox-custom:checked {
  background-color: rgb(79 70 229); /* Change background when checked */
  border: 2px solid rgb(79 70 229);
}

.checkbox-custom:checked::after {
  color: white;
  font-size: 16px;
  position: relative;
  left: 4px;
  top: -2px;
}


input[type="checkbox"] {

}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 5px;
}

.container:hover input ~ .checkmark {
  background-color: #ccc;
}

input:checked ~ .checkmark {
  background-color: rgb(79 70 229);
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

input[type='checkbox']:checked {
    background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
}




input:checked ~ .checkmark:after {
  display: block;
}

.checkmark:after {
  left: 10px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}



.container-shadows-nt{
    box-shadow: 0px 12px 80px #4f46e50d;
}

.label-centric-nt{
    display: flex;
    align-items: center;
}

.button-without-style-nt{
  background-color: transparent;
    border: none;
}

.icon-default-style-nt{
  color:rgb(79, 70, 229);
  margin-left: 10px;
    margin-right: 10px;
}

.top-alert-success-container-nt {
  background-color: #f0fdf4;
  padding: 15px;
  border-radius: 10px;
  width: 100%;
  margin-top:20px;
  margin-bottom:20px;
}

.top-alert-success-icon-nt {
  color: #4ade80;
  margin-right: 10px;
  margin-left: 10px;
}
p.top-alert-success-text-nt {
  margin: 0;
  color: #16654c;
  font-weight: 500;
  font-size: small;
  display: flex;
  line-height: 30px;
}


.top-alert-danger-container-nt {
  background-color: rgb(254 242 242);
  padding: 15px;
  border-radius: 10px;
  width: 100%;
  margin-top:20px;
  margin-bottom:20px;
}

.top-alert-danger-icon-nt {
  color: #f87171;
  margin-right: 10px;
  margin-left: 10px;
}
p.top-alert-danger-text-nt {
margin: 0;
color: #651616;
font-weight: 500;
font-size: small;
display: flex;
line-height: 30px;
}

.top-alert-warning-container-nt {
  background-color: #fefce8;
  padding: 15px;
  border-radius: 10px;
  width: 100%;
  margin-top:20px;
  margin-bottom:20px;
}

.top-alert-warning-icon-nt {
  color: #facc15;
  margin-right: 10px;
  margin-left: 10px;
}
p.top-alert-warning-text-nt {
margin: 0;
color: rgb(109, 93, 2);
font-weight: 500;
font-size: small;
display: flex;
line-height: 30px;
}





.top-alert-info-container-nt {
  background-color: #eff6ff;
  padding: 15px;
  border-radius: 10px;
  width: 100%;
  margin-top:20px;
  margin-bottom:20px;
}

.top-alert-info-icon-nt {
  color: #60a5fa;
  margin-right: 10px;
  margin-left: 10px;
}
p.top-alert-info-text-nt {
margin: 0;
color: #1d68e4;
font-weight: 500;
font-size: small;
display: flex;
line-height: 30px;
}

td {
  font-weight: 300 !important;
  border-bottom: 1px solid #e0e3f1 !important;
}

tr{
  font-weight: 600 !important;
}






.radiobutton-custom {
  appearance: none; /* Remove default styling */
  width: 20px;
  height: 20px;
  border: 2px solid rgb(79 70 229);
  border-radius: 50%;
  outline: none;
  cursor: pointer;
}

.radiobutton-custom:checked {
  background-color: rgb(79 70 229); /* Change background when checked */
  border: 2px solid rgb(79 70 229);
}

.radiobutton-custom:checked::after {
  color: white;
  font-size: 16px;
  position: relative;
  left: 4px;
  top: -2px;
}


input[type="radio"] {

}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

.container:hover input ~ .checkmark {
  background-color: #ccc;
}

input:checked ~ .checkmark {
  background-color: rgb(79 70 229);
}

.radiobutton:after {
  content: "";
  position: absolute;
  display: none;
}

input[type='radio']:checked {
    background-image:url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
}




input:checked ~ .checkmark:after {
  display: block;
}

.radiobutton:after {
  left: 10px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}










.switch-nt {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 25px;
}

.switch-nt input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider-nt {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider-nt:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 3px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider-nt {
  background-color: rgb(79 70 229);
}

input:focus + .slider-nt {
  box-shadow: 0 0 1px rgb(79 70 229);
}

input:checked + .slider-nt:before {
  -webkit-transform: translateX(22px);
  -ms-transform: translateX(22px);
  transform: translateX(22px);
}

/* Rounded sliders */
.slider-nt.round {
  border-radius: 34px;
}

.slider-nt.round:before {
  border-radius: 50%;
}


.switch-nt *{
  margin:0 !important;
}



.total-due-today span:nth-of-type(2) {
  display: none !important;
}