/* Arab Raiders tweaks (keeps Tailwind layout, only fixes the missing bits) */

/* Background: subtle, interactive (base only) */
body{
  background:
    radial-gradient(900px 500px at 20% 10%, rgba(255, 198, 0, 0.10), transparent 60%),
    radial-gradient(800px 450px at 80% 0%, rgba(34, 211, 238, 0.10), transparent 55%),
    radial-gradient(700px 500px at 60% 90%, rgba(168, 85, 247, 0.10), transparent 60%),
    linear-gradient(180deg, #05060a 0%, #060814 40%, #04040a 100%);
  background-attachment: fixed;
}

body::before{
  content:"";
  position: fixed;
  inset: -30vh -20vw;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.045), transparent 55%),
    radial-gradient(circle at 70% 60%, rgba(255,255,255,0.035), transparent 55%),
    radial-gradient(circle at 50% 90%, rgba(255,255,255,0.025), transparent 55%);
  filter: blur(30px);
  pointer-events: none;
  z-index: -1;
  animation: arFloat 10s ease-in-out infinite alternate;
}

@keyframes arFloat{
  from{ transform: translate3d(-1%, -1%, 0); }
  to{ transform: translate3d(1%, 1%, 0); }
}

/* Selects: dark + consistent (fixes "white select") */
.top-select{
  -webkit-appearance: none;
  appearance: none;
  background-color: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  color: #fff;
  padding: 8px 34px 8px 12px;
  border-radius: 10px;
  font-size: 0.9rem;
  outline: none;
  cursor: pointer;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23cdd6f4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
}

.top-select:hover{ border-color: rgba(255,255,255,0.22); }
.top-select:focus{ box-shadow: 0 0 0 3px rgba(255,255,255,0.08); }
.top-select option{ background-color: #0b0d14; color:#fff; }

/* Cards: fixed size so they match */
.bp-card{
  height: 430px; /* adjust if you want */
}

.bp-desc{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
