/* ===================== SMC PerpDesk — Mobile-first Swiggy-style ===================== */

* { -webkit-tap-highlight-color: transparent; }

html, body {
  background: #0b0b0f;
  color: #fff;
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
}

/* Scrollbar — minimal */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-thumb { background: #2a2a38; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

/* Hide scrollbar on horizontal carousels */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Snap carousels (Swiggy-like) */
.snap-x-mandatory { scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.snap-start { scroll-snap-align: start; }

/* Glass cards */
.glass {
  background: linear-gradient(180deg, rgba(28,28,40,.75) 0%, rgba(20,20,28,.85) 100%);
  border: 1px solid rgba(255,255,255,0.06);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

/* Brand gradient text */
.brand-text {
  background: linear-gradient(90deg, #ff7b41 0%, #fc6212 60%, #ff9a6e 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Skeleton shimmer */
.shimmer {
  background: linear-gradient(90deg, #1a1a26 0%, #232333 40%, #1a1a26 80%);
  background-size: 200% 100%;
  animation: shimmer 1.4s linear infinite;
}
@keyframes shimmer { 0%{background-position: 200% 0;} 100%{background-position: -200% 0;} }

/* Pulse ring for live status */
.live-dot::before {
  content: ''; position: absolute; inset: -4px; border-radius: 9999px;
  background: rgba(34,197,94,.4); animation: ping 1.4s cubic-bezier(0,0,.2,1) infinite;
}
@keyframes ping { 75%,100%{ transform: scale(1.8); opacity: 0; } }

/* Long / Short pill */
.pill-long { background: linear-gradient(90deg,#16a34a,#22c55e); color:#fff; }
.pill-short { background: linear-gradient(90deg,#dc2626,#ef4444); color:#fff; }
.pill-flat { background: linear-gradient(90deg,#52525b,#3f3f46); color:#fff; }

/* Trade card glow */
.trade-glow-long { box-shadow: 0 0 0 1px rgba(34,197,94,.35), 0 12px 40px -12px rgba(34,197,94,.45); }
.trade-glow-short { box-shadow: 0 0 0 1px rgba(239,68,68,.35), 0 12px 40px -12px rgba(239,68,68,.45); }
.trade-glow-flat { box-shadow: 0 0 0 1px rgba(255,255,255,.06); }

/* Tap state */
.tap { transition: transform .08s ease, opacity .15s ease; }
.tap:active { transform: scale(0.97); opacity: .85; }

/* Bottom nav safe area */
.bottom-nav {
  padding-bottom: env(safe-area-inset-bottom);
}

/* Sticky search bar */
.sticky-blur {
  background: linear-gradient(180deg, rgba(11,11,15,.95), rgba(11,11,15,0.85));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Number ticker animation */
.tick { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum'; }

/* Lock screen blur */
.app-locked {
  filter: blur(28px) saturate(1.1);
  pointer-events: none;
  user-select: none;
}

/* Generic input focus */
input:focus { outline: none; box-shadow: 0 0 0 2px rgba(252,98,18,.5); }

/* Hide horizontal tap callouts on iOS */
a, button { -webkit-touch-callout: none; }

/* Card tilt on press */
.press-tilt:active { transform: scale(0.985) rotate(-0.15deg); }

/* Typewriter caret for Lock screen */
.caret::after { content: '|'; animation: caret 1s steps(1) infinite; margin-left: 2px; }
@keyframes caret { 50% { opacity: 0; } }

/* Trade level rows */
.level-row { display:flex; align-items:center; justify-content:space-between; padding:.6rem .85rem; border-radius:.85rem; }