/* CraftersBots Hosting — shared custom styles
   Tailwind utility classes handle most of the layout; this file only holds
   things Tailwind's CDN build can't express (keyframes, fine-grained states). */

body {
  background-color: #0F1218;
}

/* ---------- index.html: hero background + console mock ---------- */

.strata {
  background-image:
    linear-gradient(180deg, rgba(255, 122, 69, 0.05) 0px, transparent 1px),
    linear-gradient(180deg, rgba(79, 224, 208, 0.04) 0px, transparent 1px);
  background-size: 100% 3px, 100% 7px;
}

.console-line {
  opacity: 0;
  animation: reveal 0.4s ease forwards;
}
.console-line:nth-child(1) { animation-delay: 0.1s; }
.console-line:nth-child(2) { animation-delay: 0.5s; }
.console-line:nth-child(3) { animation-delay: 0.9s; }
.console-line:nth-child(4) { animation-delay: 1.3s; }
.console-line:nth-child(5) { animation-delay: 1.7s; }

@keyframes reveal {
  to { opacity: 1; }
}

.cursor-blink {
  animation: blink 1s steps(1) infinite;
}
@keyframes blink {
  50% { opacity: 0; }
}

.pulse-dot::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 9999px;
  background: currentColor;
  animation: pulse-ring 2s ease-out infinite;
}
@keyframes pulse-ring {
  0% { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(2.6); opacity: 0; }
}

/* ---------- products.html: billing tabs + coming-soon cards ---------- */

.tab-btn[data-active="true"] {
  background-color: #1F2530;
  color: #E9ECF2;
}
.tab-btn[data-active="false"] {
  color: #8B93A6;
}

.coming-soon {
  opacity: 0.55;
  transition: opacity 0.2s ease;
}
.coming-soon:hover {
  opacity: 0.8;
}

/* ---------- login.html / register.html: form validation states ---------- */

.field-error {
  display: none;
}
.field-invalid .field-error {
  display: block;
}
.field-invalid input {
  border-color: #FF3B3B;
}

/* ---------- accessibility ---------- */

@media (prefers-reduced-motion: reduce) {
  .console-line,
  .cursor-blink,
  .pulse-dot::before {
    animation: none !important;
    opacity: 1 !important;
  }
}