.time-picker:hover {
  border-color: #c4c7ca;
}

.time-picker:active, .time-picker:focus, .time-picker:focus-visible, .time-picker:focus-within {
  border-color: #BAF400 !important;
  box-shadow: none;
}

.time-picker svg {
  color: #1A2B4D;
}

.time-picker  input::placeholder {
  color: #828C9E !important;
}

.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner {
  color: #606B83 !important;
  padding-left: 5px !important;
  margin-left: 5px !important;
  width: 30px !important;
}

.ant-picker-time-panel-cell .ant-picker-time-panel-cell-inner:hover {
  background: #E2E8F0 !important;
}

.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner, .ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner:hover {
  background-color: #E9FCAE52 !important;
  border: 1px solid #BAF400 !important;
  color: #1A2B4D !important;
}

.ant-picker-status-error {
  border: 1px solid #BF443A !important;
}

.ant-picker-footer .ant-picker-ok .ant-btn.ant-btn-primary.ant-btn-sm {
  background-color: #BAF400 !important;
  border: 1px solid #AEE503 !important;
  border-radius: 8px !important;
  color: #1A2B4D !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 6px 8px !important;
  height: 32px !important;
}

.ant-picker-footer .ant-picker-ok .ant-btn.ant-btn-primary.ant-btn-sm:hover, .ant-picker-footer .ant-picker-ok .ant-btn.ant-btn-primary.ant-btn-sm:focus {
  background-color: #AEE503 !important;
}

/* 1. Bottom Layer: Border */
.border-layer {
  background: linear-gradient(270deg, rgba(35, 115, 217, 0.8), rgba(37, 209, 186, 0.8) ,rgba(35, 115, 217, 0.8));
  background-size: 400% 100%;
  animation: borderAnimation 6s ease-in-out forwards;
  padding: 3px;
  margin: -16px;
  border-radius: 8px;
  display: inline-block;
}

/* 2. Mid Layer: Static Background */
.static-bg {
  background: linear-gradient(90deg,#1C3465, #1D366B);
  border-radius: 6px; 
  position: relative;
  overflow: hidden;  
  padding: 12px;
  z-index: 1;
  animation: staticBgAnimation 6s ease-in-out forwards;
}

/* 3. Top Layer: Animated Light Overlay (via pseudo-element) */
.static-bg::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  right: 0; bottom: 0;
  background: linear-gradient(270deg, rgba(83, 173, 255, 0.4),rgba(64, 255, 115, 0.4),rgba(83, 173, 255, 0.4));
  background-size: 400% 100%;
  animation: overlayAnimation 6s ease-in-out forwards;

  z-index: 0;
  pointer-events: none; /* Allow clicks to pass through */
}

.static-bg p {
  position: relative;
  z-index: 1;
}

/* Border gradient animation (position shift) */
@keyframes borderAnimation {
  0%   { background-position: 0% 50%; opacity: 0;}
  5%   {background-position: 20% 50%; opacity: 1;}
  25%  { background-position: 100% 50%; }
  50%  { background-position: 200% 50%; }
  75%  { background-position: 300% 50%; }
  95%  { background-position: 400% 50%; opacity: 1;}
  100% { background-position: 400% 50%; opacity: 0;}
}

/* Overlay gradient animation (position shift) */
@keyframes overlayAnimation {
  0%   { background-position: 0% 50%; opacity: 0;}
  5%   {background-position: 20% 50%; opacity: 1;}
  25%  { background-position: 100% 50%; }
  50%  { background-position: 200% 50%; }
  75%  { background-position: 300% 50%; }
  95%  { background-position: 400% 50%; opacity: 1;}
  100% { background-position: 400% 50%; opacity: 0;}
}

@keyframes staticBgAnimation {
  0%   { background: linear-gradient(90deg,#1C3465, #1D366B); }
  95%  { background: linear-gradient(90deg,#1C3465, #1D366B);}
  100% { background: transparent; }
}
