/* ============================================================
   ACCOUNT.CSS — My Account premium (dashboard + sidebar)
   Hanya di-enqueue di is_account_page(). Dimuat SETELAH
   woocommerce.css agar override layout nav lama.
   ============================================================ */

/* ── Layout: sidebar lebih lega + konten ──────────────────── */
/* Catatan: WooCommerce menyisipkan <div.woocommerce-notices-wrapper> kosong
   sebagai anak pertama grid. Tanpa penempatan eksplisit, node itu merebut
   kolom-1 sehingga nav & konten salah kolom. Maka nav & konten ditempatkan
   eksplisit, dan wrapper notices dipaksa span penuh di baris atas. */
body.woocommerce-account.logged-in .fs-page__content > .woocommerce{
  display:grid;
  grid-template-columns:264px minmax(0,1fr);
  gap:var(--fs-s6);
  align-items:start;
}
body.woocommerce-account.logged-in .fs-page__content > .woocommerce > .woocommerce-notices-wrapper{
  grid-column:1 / -1;
}
body.woocommerce-account.logged-in .fs-page__content > .woocommerce > .woocommerce-notices-wrapper:empty{
  display:none;
}
body.woocommerce-account.logged-in .fs-page__content > .woocommerce > .woocommerce-MyAccount-navigation{
  grid-column:1;
}
body.woocommerce-account.logged-in .fs-page__content > .woocommerce > .woocommerce-MyAccount-content{
  grid-column:2;min-width:0;float:none;width:auto;margin:0;
}

/* ── Sidebar nav (kartu + menu vertikal berikon) ──────────── */
.fs-page--account .fs-acct-nav,
.woocommerce-account .fs-acct-nav{
  position:sticky;top:96px;
  background:#fff;
  border:1px solid var(--fs-line);
  border-radius:var(--fs-radius-lg);
  padding:var(--fs-s4);
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}

.fs-acct-nav__card{
  display:flex;align-items:center;gap:12px;
  padding:4px 6px var(--fs-s4);
  margin-bottom:var(--fs-s3);
  border-bottom:1px solid var(--fs-line);
}
.fs-acct-nav__avatar{
  flex:0 0 auto;display:grid;place-items:center;
  width:44px;height:44px;border-radius:var(--fs-radius-pill);
  background:var(--fs-grad-hero);color:#fff;
  font-family:var(--fs-font-display);font-weight:700;font-size:1.15rem;
  box-shadow:0 4px 12px rgba(214,0,1,.28);
}
.fs-acct-nav__id{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.fs-acct-nav__hi{font-size:.74rem;color:var(--fs-gray-500)}
.fs-acct-nav__name{
  font-family:var(--fs-font-display);font-weight:700;font-size:1rem;color:var(--fs-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* Override aturan nav lama (pill horizontal) → list vertikal */
.fs-page--account .fs-acct-nav ul,
.woocommerce-account .fs-acct-nav ul{
  display:flex;flex-direction:column;gap:2px;
  list-style:none;margin:0;padding:0;
}
.fs-page--account .fs-acct-nav li,
.woocommerce-account .fs-acct-nav li{margin:0;width:100%}

.fs-page--account .fs-acct-nav ul a,
.woocommerce-account .fs-acct-nav ul a{
  display:flex;align-items:center;gap:12px;width:100%;
  padding:11px 12px;border:0;border-radius:var(--fs-radius-md);
  background:transparent;
  font-family:var(--fs-font-display);font-weight:600;font-size:.92rem;
  color:var(--fs-gray-700);text-decoration:none;
  transition:background .15s,color .15s;
}
.fs-acct-nav__ic{flex:0 0 auto;opacity:.9}
.fs-acct-nav ul a > span{flex:1 1 auto;min-width:0}
.fs-acct-nav__chev{flex:0 0 auto;opacity:0;transform:translateX(-4px);transition:opacity .15s,transform .15s}

.fs-page--account .fs-acct-nav ul a:hover,
.woocommerce-account .fs-acct-nav ul a:hover{
  background:var(--fs-cream);color:var(--fs-red);border-color:transparent;
}
.fs-acct-nav ul a:hover .fs-acct-nav__chev{opacity:.6;transform:translateX(0)}

.fs-page--account .fs-acct-nav li.is-active a,
.fs-page--account .fs-acct-nav li.woocommerce-MyAccount-navigation-link--active a,
.woocommerce-account .fs-acct-nav li.is-active a,
.woocommerce-account .fs-acct-nav li.woocommerce-MyAccount-navigation-link--active a{
  background:var(--fs-grad-hero);color:#fff;
  box-shadow:0 4px 14px rgba(214,0,1,.22);
}
.fs-acct-nav li.is-active .fs-acct-nav__chev,
.fs-acct-nav li.woocommerce-MyAccount-navigation-link--active .fs-acct-nav__chev{opacity:.85;transform:translateX(0)}
.fs-acct-nav li.customer-logout a{color:var(--fs-gray-500)}
.fs-acct-nav li.customer-logout a:hover{color:var(--fs-red)}

/* ============================================================
   DASHBOARD
   ============================================================ */
.fs-dash{display:flex;flex-direction:column;gap:var(--fs-s6)}

/* Hero sambutan */
.fs-dash__hero{
  position:relative;overflow:hidden;
  border-radius:var(--fs-radius-lg);
  background:var(--fs-grad-hero);
  color:#fff;
  padding:clamp(24px,4vw,40px);
  box-shadow:0 18px 40px -18px rgba(214,0,1,.55);
}
.fs-dash__hero-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 45%),
    radial-gradient(80% 120% at 0% 100%, rgba(0,0,0,.12) 0%, rgba(0,0,0,0) 50%);
}
/* Pola awan brand halus */
.fs-dash__hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:url("../img/patterns/clouds.png") right -40px top -30px/420px auto no-repeat;
  opacity:.07;mix-blend-mode:screen;
}
/* Ilustrasi keranjang besar (kanan) */
.fs-dash__hero-art{
  position:absolute;right:-22px;bottom:-34px;width:230px;height:230px;
  color:rgba(255,255,255,.16);pointer-events:none;z-index:0;
}
.fs-dash__hero-in{position:relative;z-index:1;max-width:560px}
.fs-dash__eyebrow{
  text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:700;
  color:#fff;opacity:.85;margin:0 0 8px;
}
/* Pastikan teks hero tetap putih (menang atas rule prosa .MyAccount-content p) */
.fs-dash__hero .fs-dash__lead{color:rgba(255,255,255,.94)}
.fs-dash__greet{
  font-family:var(--fs-font-display);font-weight:800;letter-spacing:-.02em;
  font-size:clamp(1.6rem,3.4vw,2.4rem);line-height:1.1;margin:0 0 10px;color:#fff;
}
.fs-dash__greet span{color:#fff}
.fs-dash__lead{font-size:1rem;line-height:1.6;opacity:.94;margin:0 0 20px;max-width:46ch}
.fs-dash__hero-cta.fs-btn{
  background:#fff;color:var(--fs-red);
  display:inline-flex;align-items:center;gap:8px;
}
.fs-dash__hero-cta.fs-btn:hover{background:#fff;color:var(--fs-red-dark);box-shadow:0 8px 20px rgba(0,0,0,.18);transform:translateY(-1px)}

/* Statistik mini */
.fs-dash__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--fs-s4)}
.fs-dash__stat{
  background:#fff;border:1px solid var(--fs-line);border-radius:var(--fs-radius-lg);
  padding:16px 18px;display:flex;align-items:center;gap:14px;
  transition:border-color .16s,box-shadow .16s;
}
.fs-dash__stat:hover{border-color:#d6dae1;box-shadow:0 6px 16px -12px rgba(15,23,42,.3)}
.fs-dash__stat-ic{
  flex:0 0 auto;display:grid;place-items:center;width:46px;height:46px;
  border-radius:var(--fs-radius-md);background:var(--fs-cream);color:var(--fs-red);
}
.fs-dash__stat--ok .fs-dash__stat-ic{background:#EAF7EE;color:#16a34a}
.fs-dash__stat-body{display:flex;flex-direction:column;gap:2px;min-width:0}
.fs-dash__stat-num{
  font-family:var(--fs-font-display);font-weight:800;font-size:1.4rem;line-height:1.05;
  color:var(--fs-ink);white-space:nowrap;
}
.fs-dash__stat-unit{font-size:.82rem;font-weight:700;color:var(--fs-gray-500)}
.fs-dash__stat--ok .fs-dash__stat-num{color:#16a34a}
.fs-dash__stat-label{font-size:.8rem;color:var(--fs-gray-500);line-height:1.3}

/* Tombol terang (di atas latar gelap/merah) */
.fs-btn--light{background:#fff;color:var(--fs-red)}
.fs-btn--light:hover{background:#fff;color:var(--fs-red-dark);box-shadow:0 8px 20px rgba(0,0,0,.16)}

/* Band reseller */
.fs-dash__reseller{
  display:flex;align-items:center;gap:var(--fs-s4);
  background:var(--fs-cream);border:1px solid var(--fs-line);
  border-radius:var(--fs-radius-lg);padding:20px 22px;
}
.fs-dash__reseller-ic{
  flex:0 0 auto;display:grid;place-items:center;width:52px;height:52px;
  border-radius:var(--fs-radius-md);background:#fff;color:var(--fs-red);
  border:1px solid var(--fs-line);
}
.fs-dash__reseller-txt{flex:1 1 auto;min-width:0}
.fs-dash__reseller-txt h3{
  font-family:var(--fs-font-display);font-weight:700;font-size:1.05rem;margin:0 0 4px;color:var(--fs-ink);
}
.fs-dash__reseller-txt p{font-size:.9rem;line-height:1.55;color:var(--fs-gray-700);margin:0}
.fs-dash__reseller-cta{flex:0 0 auto;white-space:nowrap}

/* Aturan harga grosir otomatis sudah dihentikan. */
.fs-dash__stats > .fs-dash__stat:nth-child(2),
.fs-dash__reseller{display:none}

/* Section title */
.fs-dash__sec-title{
  font-family:var(--fs-font-display);font-weight:700;font-size:1.15rem;
  letter-spacing:-.01em;margin:0;color:var(--fs-ink);
}

/* Grid aksi cepat */
.fs-dash__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--fs-s4);margin-top:calc(-1 * var(--fs-s3))}
.fs-dash__card{
  display:flex;flex-direction:column;gap:6px;
  padding:20px;border:1px solid var(--fs-line);border-radius:var(--fs-radius-lg);
  background:#fff;text-decoration:none;
  transition:transform .16s,box-shadow .16s,border-color .16s;
}
.fs-dash__card:hover{
  transform:translateY(-3px);border-color:transparent;
  box-shadow:0 14px 30px -16px rgba(15,23,42,.35);
}
.fs-dash__card-ic{
  display:grid;place-items:center;width:44px;height:44px;margin-bottom:6px;
  border-radius:var(--fs-radius-md);background:var(--fs-cream);color:var(--fs-red);
  transition:background .16s,color .16s;
}
.fs-dash__card:hover .fs-dash__card-ic{background:var(--fs-grad-hero);color:#fff}
.fs-dash__card-tt{font-family:var(--fs-font-display);font-weight:700;font-size:1rem;color:var(--fs-ink)}
.fs-dash__card-sub{font-size:.84rem;line-height:1.45;color:var(--fs-gray-500)}

/* Pesanan terakhir */
.fs-dash__recent{display:flex;flex-direction:column;gap:var(--fs-s4)}
.fs-dash__recent-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.fs-dash__seeall{font-size:.86rem;font-weight:600;color:var(--fs-red);text-decoration:none}
.fs-dash__seeall:hover{text-decoration:underline}
.fs-dash__orders{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.fs-dash__order{
  display:flex;align-items:center;gap:14px;
  padding:12px 16px;background:#fff;
  border:1px solid var(--fs-line);border-radius:var(--fs-radius-md);
  transition:border-color .15s,box-shadow .15s;
}
.fs-dash__order:hover{border-color:#cdd3db;box-shadow:0 6px 16px -10px rgba(15,23,42,.3)}

/* Thumbnail bertumpuk */
.fs-dash__order-thumbs{flex:0 0 auto;display:inline-flex;align-items:center}
.fs-dash__order-thumbs img{
  width:44px;height:44px;border-radius:var(--fs-radius-sm);object-fit:cover;
  border:2px solid #fff;box-shadow:0 1px 3px rgba(15,23,42,.18);
  background:var(--fs-cream);margin-left:-12px;
}
.fs-dash__order-thumbs img:first-child{margin-left:0}
.fs-dash__order-more{
  display:grid;place-items:center;width:30px;height:44px;margin-left:6px;
  font-size:.74rem;font-weight:700;color:var(--fs-gray-500);
}
.fs-dash__order-info{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.fs-dash__order-id{font-family:var(--fs-font-display);font-weight:700;color:var(--fs-ink);font-size:.95rem}
.fs-dash__order-meta{font-size:.82rem;color:var(--fs-gray-500);min-width:0}
.fs-dash__order-status,.fs-dash__order-total,.fs-dash__order-link{flex:0 0 auto}

/* Badge jumlah pesanan di nav */
.fs-acct-nav__badge{
  flex:0 0 auto;display:inline-grid;place-items:center;
  min-width:22px;height:22px;padding:0 7px;border-radius:var(--fs-radius-pill);
  background:var(--fs-red);color:#fff;
  font-family:var(--fs-font-display);font-weight:700;font-size:.72rem;line-height:1;
}
.fs-acct-nav li.is-active .fs-acct-nav__badge,
.fs-acct-nav li.woocommerce-MyAccount-navigation-link--active .fs-acct-nav__badge{
  background:rgba(255,255,255,.25);color:#fff;
}
.fs-dash__order-status{
  font-size:.74rem;font-weight:700;padding:4px 11px;border-radius:var(--fs-radius-pill);
  background:var(--fs-cream);color:var(--fs-gray-700);white-space:nowrap;
}
.fs-dash__order-status.status-completed{background:#EAF7EE;color:#16794a}
.fs-dash__order-status.status-processing,
.fs-dash__order-status.status-on-hold{background:#FFF4DA;color:#9a6a00}
.fs-dash__order-status.status-cancelled,
.fs-dash__order-status.status-failed{background:#FBE7E7;color:#b3261e}
.fs-dash__order-total{font-family:var(--fs-font-display);font-weight:700;color:var(--fs-ink);white-space:nowrap}
.fs-dash__order-total .amount{font-weight:700}
.fs-dash__order-link{
  display:grid;place-items:center;width:34px;height:34px;border-radius:var(--fs-radius-md);
  color:var(--fs-gray-500);transition:background .15s,color .15s;
}
.fs-dash__order-link:hover{background:var(--fs-cream);color:var(--fs-red)}

/* Empty state */
.fs-dash__empty{
  text-align:center;padding:48px 24px;background:#fff;
  border:1px dashed var(--fs-line);border-radius:var(--fs-radius-lg);
  display:flex;flex-direction:column;align-items:center;gap:6px;
}
.fs-dash__empty svg{color:var(--fs-line);margin-bottom:6px}
.fs-dash__empty-tt{font-family:var(--fs-font-display);font-weight:700;font-size:1.1rem;color:var(--fs-ink);margin:0}
.fs-dash__empty-sub{font-size:.9rem;color:var(--fs-gray-500);margin:0 0 14px;max-width:38ch}

/* ── Responsive ───────────────────────────────────────────── */
@media(max-width:880px){
  body.woocommerce-account.logged-in .fs-page__content > .woocommerce{grid-template-columns:1fr}
  body.woocommerce-account.logged-in .fs-page__content > .woocommerce > .woocommerce-MyAccount-navigation,
  body.woocommerce-account.logged-in .fs-page__content > .woocommerce > .woocommerce-MyAccount-content{grid-column:1}
  .fs-page--account .fs-acct-nav,.woocommerce-account .fs-acct-nav{position:static;top:auto}
  .fs-page--account .fs-acct-nav ul,.woocommerce-account .fs-acct-nav ul{
    flex-direction:row;flex-wrap:wrap;gap:6px;
  }
  .fs-page--account .fs-acct-nav li,.woocommerce-account .fs-acct-nav li{width:auto}
  .fs-page--account .fs-acct-nav ul a,.woocommerce-account .fs-acct-nav ul a{
    padding:9px 14px;border:1.5px solid var(--fs-line);border-radius:var(--fs-radius-pill);font-size:.84rem;
  }
  .fs-acct-nav ul a > span{flex:0 0 auto}
  .fs-acct-nav__chev{display:none}
}
@media(max-width:620px){
  .fs-dash__stats{grid-template-columns:1fr;gap:10px}
  .fs-dash__reseller{flex-direction:column;align-items:flex-start;text-align:left}
  .fs-dash__reseller-cta{width:100%;text-align:center}
  .fs-dash__grid{grid-template-columns:1fr}
  .fs-dash__hero-art{display:none}
  .fs-dash__order{flex-wrap:wrap;gap:8px 12px}
  .fs-dash__order-thumbs{display:none}
  .fs-dash__order-info{flex:1 1 auto;order:1}
  .fs-dash__order-total{order:2}
  .fs-dash__order-link{order:3;margin-left:auto}
  .fs-dash__order-status{order:4;flex-basis:100%}
}

/* ── Entrance reveal (fade-up bertahap, CSS murni) ────────── */
@keyframes fs-dash-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.fs-acct-nav,.fs-dash > *{animation:fs-dash-in .55s cubic-bezier(.2,.7,.3,1) both}
.fs-acct-nav{animation-delay:.02s}
.fs-dash > *:nth-child(1){animation-delay:.04s}
.fs-dash > *:nth-child(2){animation-delay:.1s}
.fs-dash > *:nth-child(3){animation-delay:.16s}
.fs-dash > *:nth-child(4){animation-delay:.22s}
.fs-dash > *:nth-child(5){animation-delay:.28s}
.fs-dash > *:nth-child(n+6){animation-delay:.34s}

@media(prefers-reduced-motion:reduce){
  .fs-dash__card,.fs-dash__hero-cta.fs-btn,.fs-acct-nav__chev,.fs-dash__order{transition:none}
  .fs-acct-nav,.fs-dash > *{animation:none}
}