/* ============================================
   优享商城 - 商业版样式
   ============================================ */

/* Base Reset & Typography */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:'Inter','Noto Sans SC','PingFang SC',system-ui,-apple-system,sans-serif;background:#f8fafc;color:#1e293b;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* Scrollbar */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:#94a3b8}

/* Selection */
::selection{background:rgba(59,130,246,0.2);color:#1e40af}

/* Smooth Scroll */
html{scroll-behavior:smooth}

/* Focus Ring */
*:focus-visible{outline:2px solid #3b82f6;outline-offset:2px;border-radius:4px}

/* Custom Animations */
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse-soft{0%,100%{opacity:1}50%{opacity:.7}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}

.animate-fade-in-up{animation:fadeInUp .5s ease-out both}
.animate-fade-in{animation:fadeIn .3s ease-out both}
.animate-slide-down{animation:slideDown .3s ease-out both}
.animate-pulse-soft{animation:pulse-soft 2s ease-in-out infinite}

/* Stagger children */
.stagger-children > *:nth-child(1){animation-delay:.05s}
.stagger-children > *:nth-child(2){animation-delay:.1s}
.stagger-children > *:nth-child(3){animation-delay:.15s}
.stagger-children > *:nth-child(4){animation-delay:.2s}
.stagger-children > *:nth-child(5){animation-delay:.25s}
.stagger-children > *:nth-child(6){animation-delay:.3s}
.stagger-children > *:nth-child(7){animation-delay:.35s}
.stagger-children > *:nth-child(8){animation-delay:.4s}

/* Glass Effect */
.glass{background:rgba(255,255,255,.7);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2)}

/* Card Shadows */
.shadow-card{box-shadow:0 1px 3px rgba(0,0,0,.04),0 4px 24px rgba(0,0,0,.06)}
.shadow-card-hover{box-shadow:0 4px 12px rgba(0,0,0,.05),0 12px 40px rgba(0,0,0,.1)}

/* Line Clamp */
.line-clamp-1{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Table Styles */
.admin-table{width:100%;border-collapse:collapse}
.admin-table th{font-weight:500;color:#64748b;text-align:left;padding:12px 16px;border-bottom:1px solid #f1f5f9;background:#f8fafc;font-size:13px}
.admin-table td{padding:12px 16px;border-bottom:1px solid #f1f5f9;font-size:14px}
.admin-table tr:hover td{background:#f8fafc}
.admin-table tr:last-child td{border-bottom:none}

/* Status Badges */
.badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:9999px;font-size:12px;font-weight:500;line-height:20px}
.badge-pending{background:#fef3c7;color:#92400e}
.badge-success{background:#d1fae5;color:#065f46}
.badge-danger{background:#fee2e2;color:#991b1b}
.badge-info{background:#dbeafe;color:#1e40af}
.badge-purple{background:#f3e8ff;color:#6b21a8}

/* Toast Notification */
.toast{position:fixed;top:24px;right:24px;z-index:9999;padding:14px 20px;border-radius:12px;font-size:14px;font-weight:500;box-shadow:0 8px 32px rgba(0,0,0,.15);transform:translateX(120%);transition:transform .3s ease;max-width:360px}
.toast.show{transform:translateX(0)}
.toast-success{background:#059669;color:white}
.toast-error{background:#dc2626;color:white}
.toast-info{background:#2563eb;color:white}

/* Skeleton Loader */
.skeleton{background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:8px}

/* Responsive Helpers */
@media(max-width:640px){
  .hide-mobile{display:none!important}
  .stack-mobile{flex-direction:column}
}

/* Print Styles */
@media print{
  nav,footer,.no-print{display:none!important}
  body{background:white}
  .shadow-card,.shadow-card-hover{box-shadow:none}
}
