/* NOW ENJOY - delete-video page styles */
html,
body {
  background:#050307;
  color:#e2e8f0;
  font-family:'Outfit',sans-serif;
  margin:0;
  padding:0;
  min-height:100vh;
  overflow-x:hidden;
}

.aura-glow {
  box-shadow:0 0 25px #ff003373,inset 0 0 15px #ff003340;
  animation:auraPulse 3s infinite alternate ease-in-out;
}

@keyframes auraPulse {
0%{box-shadow:0 0 20px #ff003359,inset 0 0 10px #ff003333;border-color:#ff003399}100%{box-shadow:0 0 40px #ff0033bf,0 0 15px #ff003380,inset 0 0 25px #ff003366;border-color:#ff3250}
}

.gothic-frame {
  position:relative;
  background:linear-gradient(145deg,#120814f2,#08030afa);
  border:2px solid #ff0033;
  border-radius:18px;
  backdrop-filter:blur(12px);
}

.gothic-frame:before,
.gothic-frame:after {
  content:"";
  position:absolute;
  width:14px;
  height:14px;
  border:3px solid #ff2a55;
  pointer-events:none;
  z-index:2;
}

.gothic-frame:before {
  top:-5px;
  left:-5px;
  border-right:0;
  border-bottom:0;
}

.gothic-frame:after {
  bottom:-5px;
  right:-5px;
  border-left:0;
  border-top:0;
}

.shimmer-text {
  background:linear-gradient(90deg,#ff1a40 0%,#fff 50%,#ff1a40 100%);
  background-size:200% auto;
  color:transparent;
  -webkit-background-clip:text;
  background-clip:text;
  animation:textShimmer 3.5s linear infinite;
}

@keyframes textShimmer {
to{background-position:200% 0}
}

.btn-crimson {
  background:linear-gradient(135deg,#b30024,#ff0033 50%,#800014);
  background-size:200% 200%;
  transition:all .3s;
  box-shadow:0 0 15px #ff003380;
  color:white;
  font-weight:700;
}

.btn-crimson:hover {
  background-position:right center;
  box-shadow:0 0 30px #ff0033e6,0 0 10px #ffffff80;
  transform:translateY(-2px);
}

#particles-canvas {
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  pointer-events:none;
  z-index:1;
}

::-webkit-scrollbar {
  width:8px;
}

::-webkit-scrollbar-track {
  background:#050307;
}

::-webkit-scrollbar-thumb {
  background:#800014;
  border-radius:4px;
}

::-webkit-scrollbar-thumb:hover {
  background:#ff0033;
}

.alert {
  padding:.7rem;
  border-radius:.6rem;
  background:#4a000b99;
  border:1px solid #ff0033;
  color:#fecdd3;
  font-size:12px;
  margin-bottom:1rem;
}

.nav-btn {
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:.7rem .8rem;
  border-radius:.75rem;
  font:600 11px 'Orbitron',sans-serif;
  color:#9ca3af;
  transition:.2s;
  text-align:left;
}

.nav-btn i {
  color:#ff2a55;
}

.nav-btn:hover {
  color:white;
  background:#4a000b99;
  border:1px solid #ff003380;
}

.modal {
  position:fixed;
  inset:0;
  z-index:50;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1rem;
  background:#050307ed;
  backdrop-filter:blur(10px);
}

.modal.hidden {
  display:none;
}

.btn-secondary {
  padding:.65rem 1rem;
  border-radius:.75rem;
  background:#27272a;
  color:#d1d5db;
  font:600 11px 'Orbitron',sans-serif;
}

.btn-secondary:hover {
  background:#3f3f46;
  color:white;
}

.delete-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.75rem;
  background:#0d070f;
  border:1px solid #4a000b;
  border-radius:.75rem;
}

.delete-row img {
  width:3rem;
  height:2.5rem;
  object-fit:cover;
  border-radius:.3rem;
}

.delete-row .item-name {
  font-size:12px;
  font-weight:700;
  color:white;
  overflow-wrap:anywhere;
}

.delete-row button {
  color:#ff0033;
  padding:.5rem;
}

@media(prefers-reduced-motion:reduce) {
  *,
    *::before,
    *::after {
      animation-duration:.01ms!important;
      animation-iteration-count:1!important;
      scroll-behavior:auto!important;
      transition-duration:.01ms!important;
      }
}
