:root {
    --wave1: #d7eef4;
	--wave2: #a9d3e1;
	--wave3: #76b8d2;
	--wave4: #4380ac;
	--wave5: #225d96;
	--wave6: #0e4a7e;	
}
.btn.text-white-important{color:#fff !important;}
.bg-wave1{background-color:var(--wave1);}
.bg-wave2{background-color:var(--wave2);}
.bg-wave3{background-color:var(--wave3);}
.bg-wave4{background-color:var(--wave4);color:#fff;}
.bg-wave5{background-color:var(--wave5);color:#fff;}
.bg-wave6{background-color:var(--wave6);color:#fff;}
.card-footer {
    background-color: rgba(0, 0, 0, .1);
    border-top: 1px solid rgba(0, 0, 0, .075);
}
.trclass-yellow{background:#ffe9a7;}
.trclass-red{background:#ffc3c8;}
.trclass-blue{background:#ddeeff;}
.trclass-gray{background:#efefef;}

html, body {height: 10vh !important;margin: 0;padding: 0;}
body {background: linear-gradient(25deg, #76d2bd, #225d96);background-attachment: fixed;background-repeat: no-repeat;background-size: cover;}
.display-1{font-size: 4.5rem;}
.display-2{font-size: 4.25rem;}
.display-3{font-size: 4rem;}
.display-4{font-size: 3.75rem;}
.display-5{font-size: 3.5rem;}
.display-6{font-size: 3rem;}
.display-7{font-size: 2.75rem;}
.display-8{font-size: 2.5rem;}
.display-9{font-size: 2.25rem;}
.display-10{font-size: 2rem;}
.display-11{font-size: 1.75rem;}
.display-12{font-size: 1.5rem;}
.display-13{font-size: 1.3rem;}
.display-14{font-size: 1.1rem;}
[class$="fw-100"]{font-weight:100;}
[class$="fw-200"]{font-weight:200;}
[class$="fw-300"]{font-weight:300;}
[class$="fw-400"]{font-weight:400;}
[class$="fw-500"]{font-weight:500;}
[class$="fw-600"]{font-weight:600;}
[class$="fw-700"]{font-weight:700;}
[class$="fw-800"]{font-weight:800;}
[class$="fw-900"]{font-weight:900;}
.transparent-wrap {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
backdrop-filter: blur(8px);
padding: 10px;
max-width: 500px;
height: 100%;
margin: 0 auto;
position: relative;
}
.transparent-wrap-lg {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
backdrop-filter: blur(8px);
padding: 20px;
max-width: 1600px;
margin: 0 auto;
position: relative;
}
.transparent-wrap-login {
background: rgba(255, 255, 255, 0.04);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 20px;
backdrop-filter: blur(8px);
padding: 20px;
max-width: 500px;
margin: 0 auto;
position: relative;
}
.inner-wrap {
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 10px;
}
/*desktop*/
@media (min-width: 768px) {
body {
padding: 10px 0;
}
.no-desktop{display:none;}
}
/*mobile*/
@media (max-width: 767px) {
body {
padding: 0;
}
.transparent-wrap {
background: rgba(255, 255, 255, 0.06);
border-radius: 0;
border: none;
}
.inner-wrap {
background: transparent;
border: none;
border-radius: 0;
}
.no-mobile{display:none;}
}
/*waves animation by Valentin Zaraf (valentin@zaraf.com)*/
.waves {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
pointer-events: none;
}
.wave {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background-repeat: repeat-x;
background-size: contain;
animation: moveWave infinite linear;
}
.wave-1 {
height: 50px;
background-image: url('/assets/abex/images/wave1.png');
animation: moveWave 37s linear infinite;
z-index: 6;
}
.wave-2 {
height: 75px;
background-image: url('/assets/abex/images/wave2.png');
animation: moveWave 21s linear infinite;
z-index: 5;
}
.wave-3 {
height: 104.5px;
background-image: url('/assets/abex/images/wave3.png');
animation: moveWave 58s linear infinite;
z-index: 4;
}
.wave-4 {
height: 143.5px;
background-image: url('/assets/abex/images/wave4.png');
animation: moveWave 42s linear infinite;
z-index: 3;
}
.wave-5 {
height: 171.5px;
background-image: url('/assets/abex/images/wave5.png');
animation: moveWave 27s linear infinite;
z-index: 2;
}
.wave-6 {
height: 181.5px;
background-image: url('/assets/abex/images/wave6.png');
animation: moveWave 51s linear infinite;
z-index: 1;
}
@keyframes moveWave {
0% { background-position: 0 0; }
100% { background-position: -500px 0; }
}
@keyframes fadeInUp {
    0% {
        opacity: 0; /* Start invisible */
        transform: translateY(-50px); /* Start from 50px above */
    }
    100% {
        opacity: 1; /* End fully visible */
        transform: translateY(0); /* End at the normal position */
    }
}
.button-animate {
    opacity: 0; /* Start with the buttons invisible */
    transform: translateX(-50px); /* Start the buttons off the left */
    animation: fadeInFromLeft 0.8s ease-out forwards; /* Apply the animation */
}
@keyframes fadeInFromLeft {
    0% {
        opacity: 0;
        transform: translateX(-50px); /* Start from the left */
    }
    100% {
        opacity: 1;
        transform: translateX(0); /* End at the normal position */
    }
}
.square-icon {
  position: relative;
}
.square-icon::after {
  content: "";
  position: absolute;
  top: 20%;
  left: 20%;
  width: 60%;
  height: 60%;
  background: white; /* same as your page bg */
  border: 2px solid black; /* outline of the inner square */
  border-radius: 15%; /* roundness */
}
/* Animation overlay */
#square-animation {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  z-index: 9999;
}
.animation-square {
  width: 30px;
  height: 30px;
  background: rgba(255,255,255,0.1);
  border: 2px solid rgba(255,255,255,0.3);
  border-radius: 10px;
  animation: riseSquare 0.6s ease-out forwards, growSquare 0.4s ease-out forwards 0.6s;
  transform-origin: top center; /* grow downward from top edge */
}
/* Rise from bottom to 10px from top */
@keyframes riseSquare {
  0%   { transform: translateY(100vh); opacity: 0; }
  30%  { opacity: 1; }
  100% { transform: translateY(10px); opacity: 1; }
}
/* Grow after reaching the top */
@keyframes growSquare {
  0%   { width: 30px; height: 30px; }
  100% { width: 500px; height: 290px; }
}
#website{display:none;}
.nav-pills .nav-link{color:#fff;}
.nav-pills .nav-link:not(.active):hover{color:#d7eef4;}
.transparent-wrap,
.transparent-wrap-lg,
.transparent-wrap-login {
    position: relative; 
    /* z-index: 10;  <-- remove this line */
}
.modal-backdrop {
    z-index: 1040 !important;
}
.modal {
    z-index: 9050 !important;
}
.cursor-pointer{cursor:pointer;}
select#category_id {
    width: auto;          /* shrink to fit content */
    min-width: 150px;     /* optional: prevent it from being too small */
    display: inline-block; /* ensures it doesn't expand */
}
.tr-task-completed{background:#ececec;}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
    color: #0e4a7e;
    background-color: #d7eef4;
}
.nav-item:hover{background:rgba(215,238,244,0.2);}
.custom-checkbox-lg .custom-control-label::before,
.custom-checkbox-lg .custom-control-label::after {
  width: 1.5rem;
  height: 1.5rem;
}
.custom-checkbox-lg .custom-control-label {
  padding-left: 2rem;
  line-height: 1.5rem;
}
.user-location-checkbox {
  width: 15px;
  height: 15px;
  transform: scale(1.5);
  accent-color: #007bff; /* matches AdminLTE primary color */
  cursor: pointer;
}