/* Rental Office v1.6.2 - Required customer guidance */

.ro-required-details-attention {
  position: relative;
  z-index: 1;
  font-weight: 800 !important;
  border-color: #d39a00 !important;
  background: #fff2a8 !important;
  color: #5b4300 !important;
  animation: ro-required-details-pulse 1.05s ease-in-out infinite;
}

.ro-required-details-attention::before {
  content: "⚠ ";
  font-weight: 900;
}

@keyframes ro-required-details-pulse {
  0%, 100% {
    background: #fff7c7 !important;
    box-shadow: 0 0 0 0 rgba(211, 154, 0, 0.18);
    transform: translateZ(0) scale(1);
  }
  50% {
    background: #ffd95a !important;
    box-shadow: 0 0 0 7px rgba(211, 154, 0, 0.22);
    transform: translateZ(0) scale(1.025);
  }
}

.ro-required-missing {
  background: #fff7cc !important;
  border-color: #d6a700 !important;
  box-shadow: 0 0 0 2px rgba(214, 167, 0, 0.13) !important;
}

.ro-required-missing:focus {
  background: #fff2ad !important;
  border-color: #ad7800 !important;
  box-shadow: 0 0 0 3px rgba(214, 167, 0, 0.22) !important;
}

.ro-required-missing-wrap {
  border-radius: 6px;
  background: rgba(255, 247, 204, 0.55);
}

.ro-required-guidance-note {
  margin: 0 0 14px;
  padding: 10px 12px;
  border: 1px solid #e0ba32;
  border-radius: 8px;
  background: #fff9da;
  color: #5b4300;
  font-weight: 700;
}

.ro-required-guidance-note[hidden] {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .ro-required-details-attention {
    animation: none;
    outline: 4px solid rgba(211, 154, 0, 0.28);
  }
}