/* ===========================================================
   Relay UI — "OpenLux" 灰黑 + 橙 主题
   =========================================================== */

html, html.dark, html.light, :root{
  color-scheme: dark;

  --radius: .7rem;
  --font-ui-sans: system-ui,-apple-system,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;

  --background: #0a0a0a;
  --foreground: #f4f4f4;

  --card: #121212;
  --card-foreground: #f4f4f4;
  --popover: #141414;
  --popover-foreground: #f4f4f4;

  --primary: #f89d2e;
  --primary-foreground: #1a0d02;

  --secondary: #1a1a1a;
  --secondary-foreground: #e6e6e6;

  --muted: #161616;
  --muted-foreground: #8a8a8a;

  --accent: color-mix(in oklch, var(--primary) 14%, var(--background));
  --accent-foreground: #ffd7a3;

  --destructive: #ef4444;
  --destructive-foreground: #fff;
  --success: #22c55e;
  --warning: #f89d2e;
  --info: #38bdf8;
  --neutral: #9a9a9a;

  --border: #242424;
  --input: #242424;
  --ring: #f89d2e;

  --chart-1: #f89d2e;
  --chart-2: #38bdf8;
  --chart-3: #eb642a;
  --chart-4: #a3a3a3;
  --chart-5: #ffd08a;
  --overview-accent-1: #f89d2e;
  --overview-accent-2: #38bdf8;
  --overview-accent-3: #eb642a;

  --sidebar: #0d0d0d;
  --sidebar-foreground: #dcdcdc;
  --sidebar-primary: #f89d2e;
  --sidebar-primary-foreground: #1a0d02;
  --sidebar-accent: #1a1a1a;
  --sidebar-accent-foreground: #ffcf92;
  --sidebar-border: #1f1f1f;
  --sidebar-ring: #f89d2e;

  --skeleton-base: #161616;
  --skeleton-highlight: #1f1f1f;
  --table-header: #111111;
  --table-header-hover: #181818;
  --table-disabled: #0f0f0f;
  --table-disabled-hover: #151515;
  --table-disabled-border: #2a2a2a;
}

html, body{
  background: var(--background) !important;
  color: var(--foreground);
  -webkit-font-smoothing: antialiased;
}

/* 顶部橙色光晕 */
body::after{
  content:"";
  position:fixed; left:0; right:0; top:0; height:360px;
  pointer-events:none; z-index:0;
  background:
    radial-gradient(55% 100% at 20% 0%, rgba(248,157,46,.10), transparent 72%),
    radial-gradient(45% 90% at 80% 0%, rgba(235,100,42,.07), transparent 72%);
  animation: glow 16s ease-in-out infinite alternate;
}
@keyframes glow{
  0%{opacity:.7;transform:translateX(-1.5%)}
  100%{opacity:1;transform:translateX(1.5%)}
}

/* 交互过渡 */
:where(a,button,[role="button"],input,select,textarea,.transition-all,.transition-colors){
  transition: background-color .18s ease, border-color .18s ease, color .14s ease,
              box-shadow .26s ease, transform .16s ease, opacity .2s ease !important;
}
:where(button,[role="button"]):active{ transform: scale(.975); }

:focus-visible{
  outline:none !important;
  box-shadow: 0 0 0 2px var(--background), 0 0 0 4px rgba(248,157,46,.55) !important;
}

/* 主按钮流光 */
:where(button,a)[class*="bg-primary"]{
  position:relative; overflow:hidden;
  animation: btn 5s ease-in-out infinite;
}
@keyframes btn{
  0%,100%{ box-shadow:0 4px 16px -8px rgba(248,157,46,.7); }
  50%    { box-shadow:0 8px 28px -8px rgba(248,157,46,1); }
}
:where(button,a)[class*="bg-primary"]::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.25) 48%,transparent 64%);
  transform:translateX(-140%);
  animation: sheen 6s ease-in-out infinite;
  pointer-events:none;
}
@keyframes sheen{
  0%,58%{transform:translateX(-140%)}
  78%{transform:translateX(140%)}
  100%{transform:translateX(140%)}
}

/* 卡片 */
:where([class*="bg-card"],[class*="bg-popover"]){
  backdrop-filter: blur(10px);
  transition: border-color .25s, box-shadow .3s, transform .25s !important;
}
:where([class*="bg-card"]:hover){
  border-color: rgba(248,157,46,.38) !important;
  box-shadow: 0 12px 34px -20px rgba(248,157,46,.75);
  transform: translateY(-2px);
}

/* 表格 */
tbody tr{ transition: background-color .16s, box-shadow .2s; }
tbody tr:hover{
  background: rgba(248,157,46,.055) !important;
  box-shadow: inset 3px 0 0 0 var(--primary);
}

/* 标题 */
h1, h2{ letter-spacing:-.02em; }
h1[class*="text-"]{
  background: linear-gradient(96deg,#fff 10%,#ffe0b8 40%,#f89d2e 62%,#fff 94%);
  background-size:220% auto;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
  animation: flow 11s linear infinite;
}
@keyframes flow{ 0%{background-position:0% center} 100%{background-position:220% center} }

/* 骨架 */
[class*="animate-pulse"]{
  background: linear-gradient(100deg,var(--skeleton-base) 30%,var(--skeleton-highlight) 48%,var(--skeleton-base) 66%) !important;
  background-size:220% 100% !important;
  animation: shimmer 1.6s linear infinite !important;
}
@keyframes shimmer{ 0%{background-position:120% 0} 100%{background-position:-20% 0} }

/* 滚动条 */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:8px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#3d3d3d;background-clip:content-box}

::selection{background:rgba(248,157,46,.3);color:#fff}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
}