
/* =========================================================
   LEFT PREMIUM METAL THEME
   Modern metallic premium look
   ========================================================= */

:root{
  --left-bg-1:#0f1114;
  --left-bg-2:#171a1f;
  --left-bg-3:#23272f;
  --left-metal:#2e333b;
  --left-metal-2:#3a404a;
  --left-border:rgba(255,184,0,.18);
  --left-border-strong:rgba(255,184,0,.38);
  --left-text:#f3f5f7;
  --left-text-soft:#c6ccd3;
  --left-accent:#ffbf00;
  --left-accent-2:#ff8a00;
  --left-accent-3:#ffd65a;
  --left-shadow:0 12px 40px rgba(0,0,0,.35);
  --left-shadow-strong:0 18px 60px rgba(0,0,0,.48);
  --left-radius:18px;
}

html{
  scroll-behavior:smooth;
}

body.left-premium{
  color:var(--left-text) !important;
  background:
    radial-gradient(circle at top right, rgba(255,166,0,.16), transparent 28%),
    radial-gradient(circle at top left, rgba(255,191,0,.08), transparent 22%),
    linear-gradient(135deg, #0d0f12 0%, #151920 40%, #0f1114 100%) !important;
  min-height:100vh;
  position:relative;
}

body.left-premium::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(115deg, rgba(255,255,255,.03) 0%, transparent 18%, transparent 82%, rgba(255,255,255,.02) 100%),
    repeating-linear-gradient(
      135deg,
      rgba(255,255,255,.015) 0px,
      rgba(255,255,255,.015) 2px,
      transparent 2px,
      transparent 10px
    );
  opacity:.55;
  z-index:0;
}

body.left-premium > *{
  position:relative;
  z-index:1;
}

body.left-premium,
body.left-premium p,
body.left-premium span,
body.left-premium div,
body.left-premium li,
body.left-premium label,
body.left-premium td,
body.left-premium th{
  color:var(--left-text);
}

body.left-premium h1,
body.left-premium h2,
body.left-premium h3,
body.left-premium h4,
body.left-premium h5,
body.left-premium h6{
  color:#fff !important;
  letter-spacing:.2px;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}

body.left-premium a{
  color:var(--left-accent-3);
  text-decoration:none;
}
body.left-premium a:hover{
  color:#fff0ad;
}

/* ===== headers / nav / top bars ===== */
body.left-premium header,
body.left-premium nav,
body.left-premium .navbar,
body.left-premium .topbar,
body.left-premium .header,
body.left-premium .main-header,
body.left-premium .sidebar,
body.left-premium .footer,
body.left-premium .bottom-nav{
  background:
    linear-gradient(180deg, rgba(55,61,71,.90), rgba(18,21,26,.92)) !important;
  border:1px solid rgba(255,191,0,.12) !important;
  box-shadow:var(--left-shadow) !important;
  backdrop-filter:blur(12px);
}

/* ===== generic containers ===== */
body.left-premium .card,
body.left-premium .box,
body.left-premium .panel,
body.left-premium .modal-content,
body.left-premium .table-container,
body.left-premium .content-box,
body.left-premium .product-card,
body.left-premium .game-card,
body.left-premium .category-card,
body.left-premium .item-card,
body.left-premium .wallet-card,
body.left-premium .deposit-card,
body.left-premium .stat-card,
body.left-premium .method-card,
body.left-premium .order-card,
body.left-premium .api-card,
body.left-premium .feature-card,
body.left-premium .login-card,
body.left-premium .register-card,
body.left-premium [class*="card"],
body.left-premium [class*="panel"],
body.left-premium [class*="box"]{
  background:
    linear-gradient(160deg, rgba(54,60,69,.94) 0%, rgba(24,28,34,.96) 68%, rgba(17,20,25,.98) 100%) !important;
  border:1px solid var(--left-border) !important;
  border-radius:var(--left-radius) !important;
  box-shadow:var(--left-shadow) !important;
  overflow:hidden;
}

/* shine */
body.left-premium .card::before,
body.left-premium .box::before,
body.left-premium .panel::before,
body.left-premium .product-card::before,
body.left-premium .game-card::before,
body.left-premium .category-card::before,
body.left-premium [class*="card"]::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  height:1px;
  width:100%;
  background:linear-gradient(90deg, transparent, rgba(255,210,90,.4), transparent);
  opacity:.9;
  pointer-events:none;
}

body.left-premium .card:hover,
body.left-premium .box:hover,
body.left-premium .panel:hover,
body.left-premium .product-card:hover,
body.left-premium .game-card:hover,
body.left-premium .category-card:hover,
body.left-premium [class*="card"]:hover{
  transform:translateY(-4px);
  box-shadow:var(--left-shadow-strong) !important;
  border-color:var(--left-border-strong) !important;
  transition:all .25s ease;
}

/* ===== buttons ===== */
body.left-premium button,
body.left-premium .btn,
body.left-premium input[type="submit"],
body.left-premium input[type="button"],
body.left-premium a.btn{
  background:
    linear-gradient(135deg, var(--left-accent-3) 0%, var(--left-accent) 42%, var(--left-accent-2) 100%) !important;
  color:#181818 !important;
  border:none !important;
  border-radius:14px !important;
  font-weight:800 !important;
  box-shadow:
    0 10px 24px rgba(255,166,0,.28),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
  transition:all .22s ease;
}

body.left-premium button:hover,
body.left-premium .btn:hover,
body.left-premium input[type="submit"]:hover,
body.left-premium input[type="button"]:hover,
body.left-premium a.btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.04);
  box-shadow:
    0 14px 32px rgba(255,166,0,.34),
    inset 0 1px 0 rgba(255,255,255,.35) !important;
}

/* ===== inputs ===== */
body.left-premium input,
body.left-premium select,
body.left-premium textarea{
  background:rgba(255,255,255,.05) !important;
  color:#fff !important;
  border:1px solid rgba(255,191,0,.18) !important;
  border-radius:14px !important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.03), 0 4px 14px rgba(0,0,0,.18);
}

body.left-premium input::placeholder,
body.left-premium textarea::placeholder{
  color:#b7bec7 !important;
}

body.left-premium input:focus,
body.left-premium select:focus,
body.left-premium textarea:focus{
  outline:none !important;
  border-color:rgba(255,191,0,.45) !important;
  box-shadow:
    0 0 0 3px rgba(255,191,0,.12),
    0 10px 26px rgba(0,0,0,.25) !important;
}

/* ===== tables ===== */
body.left-premium table{
  background:transparent !important;
  color:#fff !important;
}
body.left-premium thead,
body.left-premium th{
  background:linear-gradient(180deg, rgba(255,191,0,.16), rgba(255,138,0,.08)) !important;
  color:#fff !important;
}
body.left-premium tr{
  border-color:rgba(255,255,255,.06) !important;
}
body.left-premium tbody tr:hover{
  background:rgba(255,191,0,.06) !important;
}

/* ===== badges / status ===== */
body.left-premium .badge,
body.left-premium .status,
body.left-premium .tag,
body.left-premium .chip{
  background:linear-gradient(135deg, rgba(255,191,0,.18), rgba(255,138,0,.12)) !important;
  color:#ffe8a6 !important;
  border:1px solid rgba(255,191,0,.25) !important;
  border-radius:999px !important;
}

/* ===== icons ===== */
body.left-premium i,
body.left-premium svg,
body.left-premium .icon,
body.left-premium .feature-icon,
body.left-premium [class*="icon"]{
  transition:all .22s ease;
}

body.left-premium i[class*="fa"],
body.left-premium i[class*="bi"],
body.left-premium .icon-circle,
body.left-premium .feature-icon,
body.left-premium .card-icon,
body.left-premium .stat-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  min-height:42px;
  border-radius:14px;
  background:
    linear-gradient(145deg, var(--left-accent-3) 0%, var(--left-accent) 50%, var(--left-accent-2) 100%) !important;
  color:#1a1a1a !important;
  box-shadow:
    0 8px 18px rgba(255,166,0,.22),
    inset 0 1px 0 rgba(255,255,255,.35);
}

body.left-premium .card:hover i[class*="fa"],
body.left-premium .box:hover i[class*="fa"],
body.left-premium .panel:hover i[class*="fa"],
body.left-premium [class*="card"]:hover i[class*="fa"]{
  transform:scale(1.06) rotate(-2deg);
}

/* ===== images ===== */
body.left-premium img{
  border-radius:14px;
}
body.left-premium .product-card img,
body.left-premium .game-card img,
body.left-premium .category-card img,
body.left-premium .store-product img,
body.left-premium .store-game img{
  box-shadow:0 10px 26px rgba(0,0,0,.28);
}

/* ===== store page extra premium ===== */
body.store-premium-page{
  background:
    radial-gradient(circle at 85% 10%, rgba(255,191,0,.18), transparent 20%),
    radial-gradient(circle at 15% 12%, rgba(255,138,0,.12), transparent 18%),
    linear-gradient(135deg, #0d0f12 0%, #1a1f26 35%, #121417 100%) !important;
}

body.store-premium-page::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,191,0,.03), transparent 20%),
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.014) 0px,
      rgba(255,255,255,.014) 1px,
      transparent 1px,
      transparent 14px
    );
  mix-blend-mode:screen;
  opacity:.45;
}

body.store-premium-page .hero,
body.store-premium-page .banner,
body.store-premium-page .top-hero,
body.store-premium-page .store-hero,
body.store-premium-page .main-banner{
  background:
    linear-gradient(135deg, rgba(62,68,78,.94), rgba(18,22,27,.97)) !important;
  border:1px solid rgba(255,191,0,.2) !important;
  border-radius:24px !important;
  box-shadow:0 18px 50px rgba(0,0,0,.35) !important;
}

body.store-premium-page .product-card,
body.store-premium-page .game-card,
body.store-premium-page .category-card,
body.store-premium-page [class*="product"],
body.store-premium-page [class*="game"]{
  border-radius:20px !important;
}

body.store-premium-page .product-card:hover,
body.store-premium-page .game-card:hover,
body.store-premium-page .category-card:hover{
  transform:translateY(-6px) scale(1.01);
}

body.store-premium-page .section-title,
body.store-premium-page .title,
body.store-premium-page h1,
body.store-premium-page h2{
  background:linear-gradient(135deg, #fff 0%, #ffe08a 35%, #ffbe2e 70%, #ff9100 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
}

/* mobile */
@media (max-width: 768px){
  body.left-premium .card,
  body.left-premium .box,
  body.left-premium .panel,
  body.left-premium [class*="card"]{
    border-radius:16px !important;
  }

  body.left-premium button,
  body.left-premium .btn{
    border-radius:12px !important;
  }
}
