/* ONEDEV custom styles (complements Tailwind CDN) */

:root {
  --onedev-primary: #087CFF;
  --onedev-secondary: #00D96F;
  --onedev-dark: #06182B;
  --onedev-darknavy: #03111F;
}

html, body {
  min-height: 100dvh;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth;
}

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: #F5F7FB;
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.drag-scroll { cursor: grab; user-select: none; }
.drag-scroll.dragging { cursor: grabbing; scroll-behavior: auto; }

.safe-bottom {
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

.gradient-brand {
  background: linear-gradient(135deg, var(--onedev-primary) 0%, var(--onedev-secondary) 100%);
}

.gradient-text {
  background: linear-gradient(135deg, var(--onedev-primary) 0%, var(--onedev-secondary) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.circuit-pattern {
  background-image:
    radial-gradient(circle at 2px 2px, rgba(255,255,255,0.08) 1px, transparent 0);
  background-size: 22px 22px;
}

.card-tap {
  transition: transform .15s ease, box-shadow .15s ease;
}
.card-tap:active {
  transform: scale(0.97);
}

.btn-tap {
  transition: transform .12s ease, opacity .12s ease, filter .12s ease;
}
.btn-tap:active:not(:disabled) {
  transform: scale(0.97);
  filter: brightness(0.95);
}
.btn-tap:disabled {
  opacity: .6;
  cursor: not-allowed;
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-up { animation: fadeInUp .35s ease both; }

@keyframes skeleton-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: .55; }
}
.skeleton {
  animation: skeleton-pulse 1.4s ease-in-out infinite;
  background-color: #E5EAF2;
  border-radius: 10px;
}

@keyframes toastIn {
  from { opacity: 0; transform: translate(-50%, 12px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}
#toast-container {
  position: fixed;
  bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  width: calc(100% - 32px);
  max-width: 420px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}
.toast-item {
  animation: toastIn .25s ease both;
  pointer-events: auto;
}

.radio-card.selected {
  border-color: var(--onedev-primary);
  background-color: #EAF3FF;
}

::selection {
  background: var(--onedev-primary);
  color: #fff;
}