/*
 * Forja do Mago — Minha Conta
 * Estilo: Taverna RPG Épica + Dashboard Fantasy-Tech (v2.0)
 * Arquivo: assets/css/fsc-account.css
 *
 * Mantém a estratégia original:
 *   body.fsc-my-account ... para vencer temas
 *   !important apenas onde necessário (fundo e cor)
 *   .fsc-my-account isola todos os estilos nesta página
 */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&display=swap');

/* ── TOKENS GLOBAIS ────────────────────────────────────────────────────── */
body.fsc-my-account{
  --fsc-gold:        #b89947;
  --fsc-gold-bright: #f3d37b; /* um pouco mais “nobre” */
  --fsc-gold-dim:    rgba(184,153,71,0.25);
  --fsc-bronze:      #8b6914;

  --fsc-parchment:   #d9caa6; /* mais suave, menos “amarelo estranho” */
  --fsc-parchment-dim:rgba(217,202,166,0.48);

  --fsc-bg-dark:     #0d0b07;
  --fsc-bg-nav:      #100d06;
  --fsc-bg-card:     #130f08;

  --fsc-border:      rgba(184,153,71,0.22);
  --fsc-border-h:    rgba(243,211,123,0.62);

  --fsc-font-epic:   'Cinzel', 'Palatino Linotype', Georgia, serif;
  --fsc-ease:        cubic-bezier(.25,.8,.25,1);

  /* brilho “AAA” porém contido */
  --fsc-glow:        0 0 18px rgba(184,153,71,0.14), 0 0 55px rgba(184,153,71,0.06);

  background-color: var(--fsc-bg-dark) !important;
  color:            var(--fsc-parchment) !important;
}

/* ── COBERTURA DE WRAPPERS (igual ao seu, mantida) ─────────────────────── */
body.fsc-my-account .site-content,
body.fsc-my-account main,
body.fsc-my-account #main,
body.fsc-my-account #primary,
body.fsc-my-account .primary,
body.fsc-my-account .entry-content,
body.fsc-my-account .page-content,
body.fsc-my-account #content,
body.fsc-my-account .content-area,
body.fsc-my-account .woocommerce-account,
body.fsc-my-account .woocommerce,
body.fsc-my-account .woocommerce-page,
body.fsc-my-account #et-main-area,
body.fsc-my-account .et_pb_section,
body.fsc-my-account .et_pb_row,
body.fsc-my-account .et_pb_column,
body.fsc-my-account #wrapper,
body.fsc-my-account .fusion-page-content-wrap,
body.fsc-my-account .fusion-row,
body.fsc-my-account .page-wrapper,
body.fsc-my-account .ast-container,
body.fsc-my-account .site-primary,
body.fsc-my-account .ast-article-single,
body.fsc-my-account #wrap,
body.fsc-my-account .content-wrap,
body.fsc-my-account .inside-article,
body.fsc-my-account .content,
body.fsc-my-account .elementor-section-wrap,
body.fsc-my-account .e-container,
body.fsc-my-account .main-page-wrapper,
body.fsc-my-account .wp-site-blocks{
  background: var(--fsc-bg-dark) !important;
  color:      var(--fsc-parchment) !important;
}

/* Container principal da My Account */
body.fsc-my-account .woocommerce-MyAccount-navigation,
body.fsc-my-account .woocommerce-MyAccount-content{
  background: transparent !important;
}
body.fsc-my-account .woocommerce{ color: var(--fsc-parchment); }

/* ═══════════════════════════════════════════════════════════════════════════
   “SALÃO DO HERÓI” — CONTEÚDO (CONTENT) COM MOLDURA E TEXTURA
   ═══════════════════════════════════════════════════════════════════════════ */
body.fsc-my-account .woocommerce-MyAccount-content{
  position: relative;
  border-radius: 10px;
  padding: 22px 22px 26px;
  color: var(--fsc-parchment) !important;

  background:
    radial-gradient(ellipse at 20% 20%, rgba(184,153,71,0.08) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 35%, rgba(120,50,160,0.07) 0%, transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,0.03), rgba(0,0,0,0.30)) !important;

  border: 2px solid rgba(184,153,71,0.18);
  box-shadow:
    inset 0 0 22px rgba(0,0,0,0.55),
    0 10px 35px rgba(0,0,0,0.55),
    var(--fsc-glow);
  overflow: hidden;
}

/* Moldura dupla interna + vinheta */
body.fsc-my-account .woocommerce-MyAccount-content::before{
  content:'';
  position:absolute;
  inset: 6px;
  border-radius: 7px;
  border: 1px solid rgba(184,153,71,0.12);
  pointer-events:none;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03);
}
body.fsc-my-account .woocommerce-MyAccount-content::after{
  content:'';
  position:absolute;
  inset:-2px;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 35%, transparent 0%, rgba(0,0,0,0.35) 58%, rgba(0,0,0,0.75) 100%),
    repeating-linear-gradient(135deg, rgba(255,255,255,0.015) 0 1px, transparent 1px 7px);
  opacity:.9;
}

/* “Acima” do overlay */
body.fsc-my-account .woocommerce-MyAccount-content > *{ position: relative; z-index: 1; }

/* Headings WC */
body.fsc-my-account .woocommerce-MyAccount-content h2,
body.fsc-my-account .woocommerce-MyAccount-content h3{
  font-family: var(--fsc-font-epic) !important;
  color:       var(--fsc-gold-bright) !important;
  text-shadow: 2px 2px 6px rgba(0,0,0,0.65) !important;
  letter-spacing: .4px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   MENU LATERAL — TAVERNA “PLACA DE MADEIRA + METAL”
   ═══════════════════════════════════════════════════════════════════════════ */
body.fsc-my-account .fsc-nav-wrapper{ position: relative; }

/* Container principal do nav */
body.fsc-my-account .woocommerce-MyAccount-navigation{
  background:
    radial-gradient(ellipse at 18% 20%, rgba(184,153,71,0.10) 0%, transparent 55%),
    linear-gradient(175deg, #1b1408 0%, #110d05 52%, #0d0905 100%) !important;

  border: 2px solid var(--fsc-gold) !important;
  border-radius: 10px !important;
  padding: 0 !important;
  overflow: hidden !important;

  box-shadow:
    inset 0 0 22px rgba(0,0,0,0.65),
    0 12px 34px rgba(0,0,0,0.55),
    0 0 0 1px rgba(184,153,71,0.10) !important;
  position: relative;
}

/* Top bar (ouro) + “entalhe” */
body.fsc-my-account .woocommerce-MyAccount-navigation::before{
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height: 4px;
  background: linear-gradient(90deg, transparent, var(--fsc-gold), var(--fsc-gold-bright), var(--fsc-gold), transparent);
  box-shadow: 0 0 18px rgba(184,153,71,0.25);
}
body.fsc-my-account .woocommerce-MyAccount-navigation::after{
  content:'⚔  FORJA DO MAGO  ⚔';
  display:block;
  font-family: var(--fsc-font-epic);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 2.6px;
  color: rgba(184,153,71,0.55);
  text-align:center;
  padding: 18px 12px 10px;
  border-bottom: 1px solid rgba(184,153,71,0.14);
  text-shadow: 2px 2px 6px rgba(0,0,0,0.75);
}

/* Filigrana sutil no fundo do nav */
body.fsc-my-account .woocommerce-MyAccount-navigation .fsc-nav-filigrana{
  display:none;
}
body.fsc-my-account .woocommerce-MyAccount-navigation ul{
  list-style:none !important;
  margin: 8px 0 0 !important;
  padding: 0 !important;
}
body.fsc-my-account .woocommerce-MyAccount-navigation ul li{
  margin:0 !important;
  padding:0 !important;
  position: relative;
}

/* Links */
body.fsc-my-account .woocommerce-MyAccount-navigation ul li a{
  display:flex !important;
  align-items:center !important;
  gap: 11px !important;

  padding: 12px 18px 12px 20px !important;

  color: var(--fsc-parchment) !important;
  text-decoration:none !important;

  font-size: 13.5px !important;
  font-weight: 600 !important;
  font-family: var(--fsc-font-epic) !important;
  letter-spacing: .55px !important;

  border-left: 3px solid transparent !important;
  position: relative;
  line-height: 1.35 !important;

  transition:
    color .22s var(--fsc-ease),
    background .22s var(--fsc-ease),
    border-color .22s var(--fsc-ease),
    transform .22s var(--fsc-ease),
    padding-left .22s var(--fsc-ease) !important;
}

/* Ícone */
body.fsc-my-account .woocommerce-MyAccount-navigation ul li a::before{
  content:'◈';
  font-size: 15px;
  flex-shrink:0;
  width: 22px;
  text-align:center;
  opacity: .55;
  transition: opacity .22s ease, transform .22s ease, color .22s ease;
  display:inline-block;
}

/* Ícones por página (mantidos) */
body.fsc-my-account .woocommerce-MyAccount-navigation-link--dashboard a::before{ content:"⚡"; opacity:.75; }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--orders a::before{ content:"📦"; opacity:.75; }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--downloads a::before{ content:"⬇"; opacity:.75; }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--edit-address a::before{ content:"📍"; opacity:.75; }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--payment-methods a::before{ content:"💳"; opacity:.75; }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--edit-account a::before{ content:"⚙"; opacity:.75; }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--meus-selos a::before{ content:"⚔"; opacity:.95; color: var(--fsc-gold-bright); }
body.fsc-my-account .woocommerce-MyAccount-navigation-link--customer-logout a::before{ content:"🚪"; opacity:.55; }

/* Glow lateral (ativo/hover) */
body.fsc-my-account .woocommerce-MyAccount-navigation ul li a::after{
  content:'';
  position:absolute;
  left:0; top:0; bottom:0;
  width: 0;
  opacity: 0;
  background: linear-gradient(to bottom, var(--fsc-gold-bright), var(--fsc-gold));
  box-shadow: 0 0 12px rgba(184,153,71,0.35);
  transition: width .22s ease, opacity .22s ease;
}

/* Hover */
@media (hover:hover){
  body.fsc-my-account .woocommerce-MyAccount-navigation ul li a:hover{
    color: var(--fsc-gold-bright) !important;
    background: rgba(184,153,71,0.07) !important;
    border-left-color: rgba(184,153,71,0.55) !important;
    padding-left: 24px !important;
    transform: translateY(-1px);
  }
  body.fsc-my-account .woocommerce-MyAccount-navigation ul li a:hover::before{
    opacity: 1;
    transform: scale(1.12) rotate(-3deg);
    color: var(--fsc-gold-bright);
  }
  body.fsc-my-account .woocommerce-MyAccount-navigation ul li a:hover::after{
    width: 3px;
    opacity: .70;
  }
}

/* Ativo */
body.fsc-my-account .woocommerce-MyAccount-navigation ul li.is-active a,
body.fsc-my-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--current a{
  color: var(--fsc-gold-bright) !important;
  background: linear-gradient(90deg, rgba(184,153,71,0.18) 0%, rgba(184,153,71,0.05) 100%) !important;
  border-left-color: var(--fsc-gold) !important;
  padding-left: 24px !important;
  font-weight: 900 !important;
}
body.fsc-my-account .woocommerce-MyAccount-navigation ul li.is-active a::before,
body.fsc-my-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--current a::before{
  opacity: 1;
  color: var(--fsc-gold-bright);
}
body.fsc-my-account .woocommerce-MyAccount-navigation ul li.is-active a::after,
body.fsc-my-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--current a::after{
  width: 3px;
  opacity: 1;
}

/* Meus Selos ativo — “reliquia” */
body.fsc-my-account .woocommerce-MyAccount-navigation-link--meus-selos.is-active a,
body.fsc-my-account .woocommerce-MyAccount-navigation-link--meus-selos.woocommerce-MyAccount-navigation-link--current a{
  background: linear-gradient(90deg, rgba(184,153,71,0.26) 0%, rgba(184,153,71,0.06) 100%) !important;
  box-shadow: inset 0 0 22px rgba(184,153,71,0.08) !important;
}

/* Logout */
body.fsc-my-account .woocommerce-MyAccount-navigation-link--customer-logout a{
  color: rgba(217,202,166,0.32) !important;
  font-size: 12px !important;
  border-top: 1px solid rgba(184,153,71,0.12) !important;
  margin-top: 8px !important;
}
body.fsc-my-account .woocommerce-MyAccount-navigation-link--customer-logout a:hover{
  color: #ff8a8a !important;
  background: rgba(255,80,80,0.06) !important;
  border-left-color: rgba(255,120,120,0.45) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   DASHBOARD HERO — MAIS “AAA” SEM SAIR DA TAVERNA
   ═══════════════════════════════════════════════════════════════════════════ */
.fsc-dash{
  font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  margin-bottom: 28px;
  color: var(--fsc-parchment);
}

/* HERO */
.fsc-dash__hero{
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 22px;
  border: 2px solid var(--fsc-gold);
  box-shadow:
    inset 0 0 24px rgba(0,0,0,0.65),
    0 12px 34px rgba(0,0,0,0.45),
    var(--fsc-glow);
}

/* Fundo do hero com “profundidade” */
.fsc-dash__hero-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 18% 55%, rgba(184,153,71,0.12) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 22%, rgba(123,45,139,0.08) 0%, transparent 45%),
    linear-gradient(140deg, #1f1609 0%, #130e05 52%, #0d0905 100%);
  z-index:0;
}

/* Ornamento superior do hero (linha + runas sutis) */
.fsc-dash__hero-bg::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, transparent, rgba(243,211,123,0.22), transparent) 0 0/100% 1px no-repeat,
    repeating-linear-gradient(90deg, transparent 0 56px, rgba(184,153,71,0.025) 56px 57px);
  opacity:.9;
  pointer-events:none;
}

/* Conteúdo */
.fsc-dash__hero-content{
  position: relative;
  z-index: 1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap: 16px;
  padding: 28px 28px;
}

/* Saudação */
.fsc-dash__hi{
  font-size: 20px;
  font-weight: 400;
  color: var(--fsc-parchment);
  margin: 0 0 10px;
  line-height: 1.3;
}
.fsc-dash__hi strong{
  color:#fff;
  font-weight: 800;
  text-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

/* Badge tier */
.fsc-dash__tier-badge{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  font-size: 11px;
  font-weight: 900;
  font-family: var(--fsc-font-epic);
  color: var(--fsc-gold-bright);

  background: rgba(184,153,71,0.10);
  border: 1px solid rgba(184,153,71,0.38);
  border-radius: 999px;
  padding: 5px 14px;
  letter-spacing: .6px;

  box-shadow: 0 0 14px rgba(184,153,71,0.12);
}

/* Stats */
.fsc-dash__hero-stats{
  display:flex;
  align-items:center;
  gap: 20px;
  background: rgba(0,0,0,0.35);
  border: 2px solid rgba(184,153,71,0.22);
  border-radius: 12px;
  padding: 14px 22px;
  box-shadow: inset 0 0 14px rgba(0,0,0,0.45);
}
.fsc-dash__stat{ text-align:center; }
.fsc-dash__stat-val{
  display:block;
  font-family: var(--fsc-font-epic);
  font-size: 26px;
  font-weight: 900;
  color: var(--fsc-gold-bright);
  line-height:1;
  text-shadow: 2px 2px 6px #000;
}
.fsc-dash__stat-lbl{
  font-size: 10px;
  color: var(--fsc-parchment-dim);
  text-transform: uppercase;
  letter-spacing: 1px;
  display:block;
  margin-top: 5px;
  font-family: var(--fsc-font-epic);
}
.fsc-dash__stat-sep{
  width: 1px;
  height: 38px;
  background: linear-gradient(to bottom, transparent, var(--fsc-gold-dim), transparent);
}

/* Títulos de seção */
.fsc-dash__section-title{
  font-family: var(--fsc-font-epic) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.6px !important;
  color: rgba(184,153,71,0.68) !important;
  margin: 0 0 14px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(184,153,71,0.16) !important;
}

/* Atalhos — mais “reliquia” */
.fsc-dash__shortcut{
  background: rgba(0,0,0,0.32);
  border: 2px solid rgba(184,153,71,0.16);
  border-radius: 10px;
  box-shadow: inset 0 0 12px rgba(0,0,0,0.35);
}
@media (hover:hover){
  .fsc-dash__shortcut:hover{
    background: rgba(184,153,71,0.08) !important;
    border-color: rgba(184,153,71,0.48) !important;
    box-shadow:
      0 10px 28px rgba(0,0,0,0.45),
      0 0 22px rgba(184,153,71,0.14),
      inset 0 0 12px rgba(0,0,0,0.35);
    color: var(--fsc-gold-bright) !important;
  }
}

/* Pedidos recentes */
.fsc-dash__order{
  background: rgba(0,0,0,0.32);
  border: 2px solid rgba(184,153,71,0.14);
  border-radius: 9px;
}
@media (hover:hover){
  .fsc-dash__order:hover{
    background: rgba(184,153,71,0.07) !important;
    border-color: rgba(184,153,71,0.42) !important;
  }
}

/* Divisor */
.fsc-dash__divider{
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(184,153,71,0.24), transparent);
  margin: 0 0 24px;
}

/* ═══════════════════════════════════════════════════════════════════════════
   RESPONSIVO
   ═══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px){
  .fsc-dash__hero-content{ flex-direction: column; align-items: flex-start; }
  .fsc-dash__hero-stats{ width: 100%; justify-content: center; }
  .fsc-dash__shortcut-grid{ grid-template-columns: 1fr 1fr; }
  .fsc-dash__order-total{ margin-left: 0; }
}
@media (max-width: 480px){
  .fsc-dash__shortcut-grid{ grid-template-columns: 1fr; }
  .fsc-dash__order{ gap: 5px 10px; }
}