/* =========================================================================
   VINTY ACCOUNT — BASE STYLING
   Scoped to body.woocommerce-account on pages under /my-account/.
   Consumes tokens from vinty-tokens.css.
   ========================================================================= */

/* --- Scope + layout ---------------------------------------------------- */
body.woocommerce-account .woocommerce {
  background: var(--bg-page);
  color: var(--fg-1);
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
}

body.woocommerce-account .woocommerce-MyAccount-content,
body.woocommerce-account .vnty-account-content {
  background: transparent;
}

/* Greeting strip ------------------------------------------------------- */
.vnty-greeting {
  padding: var(--space-10) var(--space-8);
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border-default);
}
.vnty-greeting-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-8);
  flex-wrap: wrap;
}
.vnty-crumbs {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-2xs);
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  color: var(--fg-3);
  margin-bottom: var(--space-3);
}
.vnty-crumbs a {
  color: inherit;
  text-decoration: none;
}
.vnty-crumbs a:hover {
  color: var(--fg-accent);
}
.vnty-greeting h1 {
  font-family: var(--font-action);
  font-weight: 800;
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  text-transform: uppercase;
  color: var(--fg-1);
  margin: 0;
}
.vnty-greeting h1 .vnty-name {
  color: var(--fg-accent);
}
.vnty-greeting-meta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}
.vnty-avatar {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-pill);
  background: var(--bg-wash);
  color: var(--fg-assurance);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-sm);
  letter-spacing: 0.5px;
}
.vnty-meta-name {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-sm);
  color: var(--fg-1);
  line-height: 1.2;
}
.vnty-meta-since {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--fg-3);
}

/* Content row ---------------------------------------------------------- */
body.woocommerce-account .vnty-account-shell {
  max-width: 1360px;
  margin: 0 auto;
  padding: 16px 24px 48px;
  display: grid !important;
  grid-template-columns: 240px 1fr !important;
  gap: 32px !important;
  align-items: flex-start;
}
@media (min-width: 1360px) {
  body.woocommerce-account .vnty-account-shell {
    max-width: min(1600px, calc(100vw - 48px)) !important;
  }
  body.woocommerce-account .vnty-greeting-inner {
    max-width: min(1600px, calc(100vw - 48px)) !important;
  }
}
/* Kill all top whitespace between site nav and the greeting strip */
body.woocommerce-account .site-content,
body.woocommerce-account #primary,
body.woocommerce-account .ast-container,
body.woocommerce-account main.site-main,
body.woocommerce-account .entry-content,
body.woocommerce-account article.post-41 {
  padding-top: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
body.woocommerce-account .vnty-greeting { padding: 20px 24px !important; }
body.woocommerce-account .elementor-element-79db6ca5,
body.woocommerce-account .elementor-section-boxed > .elementor-container {
  padding-top: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Sidebar nav ---------------------------------------------------------- */
/* Belt-and-braces: starve Astra Pro's my-account injections if any PHP
   hooks sneak through (the template intentionally doesn't fire
   woocommerce_before/after_account_navigation). */
body.woocommerce-account .vnty-account-shell > :not(nav):not(main):not(.woocommerce-MyAccount-navigation):not(.vnty-account-content):not(.woocommerce-MyAccount-content) {
  display: none !important;
}

.woocommerce-MyAccount-navigation {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: var(--space-2);
  width: 100% !important;
  max-width: 240px !important;
  min-width: 0 !important;
}
/* Aggressive purge of anything inside the nav element that isn't the <ul> */
body.woocommerce-account .woocommerce-MyAccount-navigation > *:not(ul) {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  position: absolute !important;
  left: -9999px !important;
}
body.woocommerce-account .woocommerce-MyAccount-navigation .avatar,
body.woocommerce-account .woocommerce-MyAccount-navigation img,
body.woocommerce-account .woocommerce-MyAccount-navigation [class*="ast-my-account-user"],
body.woocommerce-account .woocommerce-MyAccount-navigation [class*="ast-woocommerce-user"],
body.woocommerce-account .woocommerce-MyAccount-navigation [class*="astra-addon-my-account"] {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.woocommerce-MyAccount-navigation li {
  margin: 0 0 2px;
}
.woocommerce-MyAccount-navigation li a {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  padding: 12px 14px !important;
  gap: 0 !important;
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  color: var(--fg-1) !important;
  text-decoration: none !important;
  border-radius: var(--radius-sm) !important;
  box-sizing: border-box !important;
  transition: background-color 120ms, color 120ms;
}
/* Strip Astra-injected icon containers and empty placeholders inside the link.
   IMPORTANT: do NOT use [class*="ast-"] — that's too broad and hides label
   spans like .ast-label. Target known icon class fragments only. */
.woocommerce-MyAccount-navigation li a > span:empty,
.woocommerce-MyAccount-navigation li a > div,
.woocommerce-MyAccount-navigation li a > i,
.woocommerce-MyAccount-navigation li a > svg,
.woocommerce-MyAccount-navigation li a > img,
.woocommerce-MyAccount-navigation li a > [class*="ast-icon"],
.woocommerce-MyAccount-navigation li a > [class*="ast-myaccount-icon"],
.woocommerce-MyAccount-navigation li a > [class*="dashicon"],
.woocommerce-MyAccount-navigation li a::before,
.woocommerce-MyAccount-navigation li a::after,
.woocommerce-MyAccount-navigation li a .avatar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  content: none !important;
  position: absolute !important;
  left: -9999px !important;
}
/* The visible label */
.woocommerce-MyAccount-navigation li a > span:not(:empty) {
  flex: 1 1 auto !important;
  display: block !important;
  color: inherit !important;
}
/* Hover (non-active) */
.woocommerce-MyAccount-navigation li:not(.is-active):not(.vnty-active) a:hover {
  background: var(--bg-wash) !important;
  color: var(--fg-1) !important;
}
/* Active state: black bg + white label, full link width */
.woocommerce-MyAccount-navigation li.is-active > a,
.woocommerce-MyAccount-navigation li.vnty-active > a,
.woocommerce-MyAccount-navigation li[class*="--is-active"] > a {
  background: var(--bg-ink) !important;
  background-color: var(--bg-ink) !important;
  color: var(--fg-inverse) !important;
}
.woocommerce-MyAccount-navigation li.is-active > a > span,
.woocommerce-MyAccount-navigation li.vnty-active > a > span,
.woocommerce-MyAccount-navigation li[class*="--is-active"] > a > span {
  color: var(--fg-inverse) !important;
}
/* Logout: burgundy text, divided */
.woocommerce-MyAccount-navigation li.vnty-nav-logout {
  border-top: 1px solid var(--border-default);
  margin-top: var(--space-2);
  padding-top: var(--space-2);
}
.woocommerce-MyAccount-navigation li.vnty-nav-logout > a,
.woocommerce-MyAccount-navigation li.vnty-nav-logout > a > span {
  color: var(--fg-assurance) !important;
}
.woocommerce-MyAccount-navigation li.vnty-nav-logout > a:hover {
  background: var(--bg-wash) !important;
  color: var(--fg-assurance) !important;
}
/* External-link arrow on items linking off-account (Wishlist) */
.woocommerce-MyAccount-navigation li.vnty-nav-external > a::after {
  content: '\2197' !important; /* ↗ */
  display: inline-block !important;
  position: static !important;
  width: auto !important;
  height: auto !important;
  font-size: 12px;
  opacity: 0.6;
  margin-left: 6px;
  left: auto !important;
}

/* Style Nextend "Social accounts" section embedded in account-details */
body.woocommerce-account .nsl-providers-container h2,
body.woocommerce-account .nsl-providers-container h3 {
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: var(--fg-accent) !important;
  margin: 0 0 12px !important;
}
body.woocommerce-account .nsl-providers-container {
  margin-bottom: 24px !important;
}

/* Buttons -------------------------------------------------------------- */
.vnty-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-sm);
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  padding: 15px 24px;
  border-radius: var(--radius-sm);
  border: 0;
  cursor: pointer;
  text-decoration: none;
  line-height: 1;
  transition: background-color 120ms, color 120ms, border-color 120ms;
  white-space: nowrap;
}
.vnty-btn.vnty-btn-sm {
  font-size: 12px;
  padding: 10px 16px;
}
.vnty-btn.vnty-btn-full {
  width: 100%;
}
.vnty-btn-primary {
  background: var(--bg-accent);
  color: var(--fg-inverse);
}
.vnty-btn-primary:hover { background: var(--vinty-red-hover); color: var(--fg-inverse); }
.vnty-btn-assurance {
  background: var(--bg-assurance);
  color: var(--fg-inverse);
}
.vnty-btn-assurance:hover { background: var(--vinty-burgundy-hover); color: var(--fg-inverse); }
.vnty-btn-secondary {
  background: transparent;
  color: var(--fg-1);
  border: 1.5px solid var(--fg-1);
  padding: 13.5px 22.5px;
}
.vnty-btn-secondary:hover { background: var(--fg-1); color: var(--fg-inverse); }
.vnty-btn-ghost {
  background: transparent;
  color: var(--fg-1);
  border: 1px solid var(--border-default);
}
.vnty-btn-ghost:hover { background: var(--bg-wash); }
.vnty-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(206, 2, 3, 0.25);
}

/* Status pills --------------------------------------------------------- */
.vnty-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: 5px 10px;
  border-radius: var(--radius-pill);
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-2xs);
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.vnty-pill-dot {
  width: 6px; height: 6px; border-radius: var(--radius-pill);
}
.vnty-pill-processing { background: #FFF8E5; color: #8A6D00; }
.vnty-pill-processing .vnty-pill-dot { background: #F0C102; }
.vnty-pill-completed { background: #E8F3EA; color: #1F6B2E; }
.vnty-pill-completed .vnty-pill-dot { background: #2F7D32; }
.vnty-pill-delivered { background: #D5EFDF; color: #0E7F4E; }
.vnty-pill-delivered .vnty-pill-dot { background: #0E7F4E; }
.vnty-pill-cancelled { background: #F2F1ED; color: #3A3A3A; }
.vnty-pill-cancelled .vnty-pill-dot { background: #6B6B6B; }
.vnty-pill-refunded { background: #FCE5E5; color: #890018; }
.vnty-pill-refunded .vnty-pill-dot { background: #890018; }

/* Cards ---------------------------------------------------------------- */
.vnty-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: var(--space-8);
}
.vnty-card + .vnty-card { margin-top: var(--space-6); }
.vnty-card-pad-sm { padding: var(--space-5); }
.vnty-card-inline { display: flex; gap: var(--space-6); align-items: center; }

/* Typography atoms ----------------------------------------------------- */
.vnty-eyebrow {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-xs);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--fg-accent);
  margin-bottom: var(--space-2);
}
.vnty-eyebrow-assurance { color: var(--fg-assurance); }
.vnty-h2 {
  font-family: var(--font-action);
  font-weight: 800;
  font-size: var(--text-3xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  text-transform: uppercase;
  color: var(--fg-1);
  margin: 0 0 var(--space-4);
}
.vnty-h3 {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-2xl);
  line-height: var(--leading-snug);
  color: var(--fg-1);
  margin: 0 0 var(--space-3);
}
.vnty-h4 {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-xl);
  color: var(--fg-1);
  margin: 0 0 var(--space-2);
}
.vnty-body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--fg-2);
}
.vnty-body-sm {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--fg-2);
}
.vnty-caption {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--fg-3);
}

/* Rand amount ---------------------------------------------------------- */
.vnty-rand {
  font-family: var(--font-action);
  font-weight: 800;
  color: var(--fg-1);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.vnty-rand.vnty-rand-big { font-size: var(--text-2xl); }
.vnty-rand.vnty-rand-strike {
  text-decoration: line-through;
  color: var(--fg-mute);
  font-weight: 500;
}

/* Dashboard hero ------------------------------------------------------- */
.vnty-hero {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.vnty-hero-strip {
  background: var(--bg-ink);
  color: var(--fg-inverse);
  padding: var(--space-3) var(--space-8);
  font-family: var(--font-action);
  font-weight: 700;
  font-size: var(--text-2xs);
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
}
.vnty-hero-body {
  padding: var(--space-8);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-8);
  align-items: center;
}
.vnty-hero-body h2 {
  font-family: var(--font-action);
  font-weight: 800;
  font-size: var(--text-2xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  text-transform: none;
  color: var(--fg-1);
  margin: 0 0 var(--space-3);
}
.vnty-hero-body p {
  color: var(--fg-2);
  margin: 0 0 var(--space-5);
  max-width: 60ch;
}
.vnty-hero-actions {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.vnty-hero-thumbs {
  display: flex;
  gap: var(--space-3);
}
.vnty-hero-thumbs img {
  width: 80px;
  height: 110px;
  object-fit: cover;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--bg-wash);
}

/* Stats strip ---------------------------------------------------------- */
.vnty-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  margin-top: var(--space-6);
}
.vnty-stat {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: var(--space-5);
}
.vnty-stat-eyebrow {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  color: var(--fg-accent);
  margin-bottom: var(--space-2);
}
.vnty-stat-value {
  font-family: var(--font-action);
  font-weight: 800;
  font-size: var(--text-2xl);
  color: var(--fg-1);
  line-height: 1;
  margin-bottom: var(--space-1);
}
.vnty-stat-sub {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--fg-3);
}

/* Two-column dashboard row --------------------------------------------- */
.vnty-dash-row {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: var(--space-6);
  margin-top: var(--space-6);
}
@media (max-width: 1200px) {
  .vnty-dash-row { grid-template-columns: 1fr; }
}

/* Orders table --------------------------------------------------------- */
.vnty-orders-table {
  width: 100%;
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  border-collapse: collapse;
  overflow: hidden;
}
.vnty-orders-table thead th {
  background: var(--bg-wash);
  text-align: left;
  padding: 14px 24px;
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--fg-2);
  border-bottom: 1px solid var(--border-default);
}
.vnty-orders-table td {
  padding: 18px 24px;
  border-bottom: 1px solid var(--border-default);
  font-size: var(--text-sm);
  color: var(--fg-2);
  vertical-align: middle;
}
.vnty-orders-table tr:last-child td { border-bottom: 0; }
.vnty-orders-table .vnty-order-id {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  color: var(--fg-1);
  letter-spacing: 0.3px;
}
.vnty-orders-table .vnty-order-count {
  font-size: 13px;
  color: var(--fg-3);
}
.vnty-orders-table .vnty-row-actions {
  text-align: right;
  white-space: nowrap;
}
.vnty-orders-table .vnty-row-actions .vnty-btn + .vnty-btn { margin-left: var(--space-2); }
/* Force single-line content in critical columns */
.vnty-orders-table td:first-child {
  white-space: nowrap;
  min-width: 100px;
}
.vnty-orders-table .vnty-order-id,
.vnty-orders-table .vnty-order-count,
.vnty-orders-table .vnty-rand,
.vnty-orders-table td .vnty-pill {
  white-space: nowrap;
}

/* Order detail --------------------------------------------------------- */
.vnty-detail-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-5);
  margin-bottom: var(--space-6);
  flex-wrap: wrap;
}
.vnty-back-link {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  color: var(--fg-2);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: var(--space-3);
}
.vnty-back-link:hover { color: var(--fg-1); }
.vnty-detail-layout {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: var(--space-6);
}
.vnty-item-row {
  display: grid;
  grid-template-columns: 80px 1fr auto auto;
  gap: var(--space-4);
  align-items: center;
  padding: var(--space-5) 0;
  border-bottom: 1px solid var(--border-default);
}
.vnty-item-row:last-child { border-bottom: 0; padding-bottom: 0; }
.vnty-item-thumb {
  width: 80px; height: 100px; object-fit: cover;
  border: 1px solid var(--border-default);
  background: var(--bg-wash);
}
.vnty-summary-row {
  display: flex;
  justify-content: space-between;
  padding: var(--space-2) 0;
  font-size: var(--text-sm);
  color: var(--fg-2);
}
.vnty-summary-row.vnty-summary-total {
  font-weight: 700;
  font-size: var(--text-base);
  color: var(--fg-1);
  border-top: 1px solid var(--border-default);
  padding-top: var(--space-3);
  margin-top: var(--space-3);
}
.vnty-summary-discount { color: var(--fg-assurance); }

/* Addresses ------------------------------------------------------------ */
.vnty-address-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-5);
}
.vnty-address-card {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: var(--space-6);
}
.vnty-address-card-header {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
.vnty-address-label {
  font-family: var(--font-action);
  font-weight: 800;
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--fg-1);
}
.vnty-default-badge {
  background: var(--bg-wash);
  color: var(--fg-assurance);
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.vnty-address-lines {
  font-size: var(--text-sm);
  color: var(--fg-2);
  line-height: 1.55;
  margin-bottom: var(--space-4);
}
.vnty-address-lines .vnty-address-phone { color: var(--fg-3); }
.vnty-address-actions {
  display: flex; gap: var(--space-2); flex-wrap: wrap;
}
.vnty-address-addnew {
  border: 1.5px dashed #C5C5C5;
  border-radius: var(--radius-sm);
  padding: var(--space-8);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--fg-3);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms, color 120ms, border-color 120ms;
}
.vnty-address-addnew:hover {
  background: var(--bg-wash);
  border-color: var(--fg-1);
  color: var(--fg-1);
}

/* Form fields (AField) ------------------------------------------------- */
.vnty-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: var(--space-4);
  text-align: left;
}
.vnty-field label {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: var(--tracking-button);
  text-transform: uppercase;
  color: var(--fg-2);
}
.vnty-field .vnty-input-wrap {
  position: relative;
  display: flex;
  align-items: center;
  background: var(--bg-surface);
  border: 1.5px solid var(--border-default);
  border-radius: var(--radius-sm);
  transition: border-color 120ms, box-shadow 120ms;
}
.vnty-field .vnty-input-wrap:focus-within {
  border-color: var(--fg-1);
  box-shadow: 0 0 0 3px rgba(206, 2, 3, 0.12);
}
.vnty-field input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  padding: 13px 14px;
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--fg-1);
  width: 100%;
}
.vnty-field .vnty-input-icon {
  padding-left: 14px;
  color: var(--fg-3);
  display: inline-flex;
}
.vnty-field .vnty-password-toggle {
  background: transparent;
  border: 0;
  cursor: pointer;
  padding: 0 14px;
  color: var(--fg-3);
}
.vnty-field-hint {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--fg-3);
  margin-top: 4px;
}
.vnty-field-error {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--fg-accent);
  margin-top: 4px;
}

/* Table helpers (orders filter row) ----------------------------------- */
.vnty-orders-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-5);
  flex-wrap: wrap;
  margin-bottom: var(--space-6);
}
.vnty-orders-filters {
  display: flex;
  gap: var(--space-3);
}
.vnty-orders-filters select {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  padding: 10px 14px;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--bg-surface);
  color: var(--fg-1);
}

/* Accessibility helpers ------------------------------------------------ */
.screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Wishlist (YITH shortcode) ------------------------------------------- */
.vnty-wishlist-wrap .wishlist-title,
.vnty-wishlist-wrap .hidden-title-form,
.vnty-wishlist-wrap .yith-wcwl-share,
.vnty-wishlist-wrap .wishlist-search-form,
.vnty-wishlist-wrap .wishlist_manage_table {
  display: none !important;
}
.vnty-wishlist-wrap .yith-wcwl-wishlist-search-form { display: none !important; }
.vnty-wishlist-yith {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.vnty-wishlist-yith .wishlist_table,
.vnty-wishlist-yith table.shop_table {
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-collapse: collapse !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.vnty-wishlist-yith .wishlist_table thead th,
.vnty-wishlist-yith table.shop_table thead th {
  background: var(--bg-wash) !important;
  text-align: left !important;
  padding: 14px 24px !important;
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  color: var(--fg-2) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border-default) !important;
}
.vnty-wishlist-yith .wishlist_table tbody td,
.vnty-wishlist-yith table.shop_table tbody td {
  padding: 18px 24px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--border-default) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-sm) !important;
  color: var(--fg-2) !important;
  vertical-align: middle !important;
  background: transparent !important;
}
.vnty-wishlist-yith .wishlist_table tbody tr:last-child td,
.vnty-wishlist-yith table.shop_table tbody tr:last-child td { border-bottom: 0 !important; }
.vnty-wishlist-yith .wishlist_table .product-name a,
.vnty-wishlist-yith table.shop_table .product-name a {
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.3px !important;
  color: var(--fg-1) !important;
  text-decoration: none !important;
}
.vnty-wishlist-yith .wishlist_table .product-name a:hover,
.vnty-wishlist-yith table.shop_table .product-name a:hover {
  color: var(--fg-accent) !important;
}
.vnty-wishlist-yith .wishlist_table .product-price,
.vnty-wishlist-yith table.shop_table .product-price {
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  color: var(--fg-1) !important;
}
.vnty-wishlist-yith .wishlist_table .product-price del {
  color: var(--fg-3) !important;
  font-weight: 400 !important;
  margin-right: 6px !important;
}
.vnty-wishlist-yith .wishlist_table .product-stock-status .wishlist-in-stock {
  color: var(--fg-assurance) !important;
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}
.vnty-wishlist-yith .wishlist_table .product-stock-status .wishlist-out-of-stock {
  color: var(--fg-3) !important;
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}
.vnty-wishlist-yith .wishlist_table .product-remove a,
.vnty-wishlist-yith table.shop_table .product-remove a {
  color: var(--fg-3) !important;
  font-size: 20px !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
.vnty-wishlist-yith .wishlist_table .product-remove a:hover {
  color: var(--fg-accent) !important;
}
.vnty-wishlist-yith .wishlist_table .product-add-to-cart a,
.vnty-wishlist-yith .wishlist_table .product-add-to-cart button,
.vnty-wishlist-yith table.shop_table .product-add-to-cart a,
.vnty-wishlist-yith table.shop_table .product-add-to-cart button {
  display: inline-flex !important;
  align-items: center !important;
  gap: var(--space-2) !important;
  padding: 10px 18px !important;
  background: var(--bg-accent) !important;
  color: var(--fg-inverse) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  cursor: pointer !important;
}
.vnty-wishlist-yith .wishlist_table .product-add-to-cart a:hover,
.vnty-wishlist-yith .wishlist_table .product-add-to-cart button:hover {
  background: var(--vinty-red-hover) !important;
  color: var(--fg-inverse) !important;
}
.vnty-wishlist-yith .wishlist_table:has(.wishlist-empty) thead,
.vnty-wishlist-yith table.shop_table:has(.wishlist-empty) thead {
  display: none !important;
}
.vnty-wishlist-yith .wishlist-empty,
.vnty-wishlist-yith td.wishlist-empty {
  padding: var(--space-6) var(--space-6) !important;
  text-align: left !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-sm) !important;
  color: var(--fg-3) !important;
  font-style: italic !important;
  background: var(--bg-surface) !important;
  border: 0 !important;
}
.vnty-wishlist-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  margin-top: var(--space-6);
  padding: var(--space-5) var(--space-6);
  background: var(--bg-wash);
  border-radius: var(--radius-sm);
  flex-wrap: wrap;
}
.vnty-wishlist-foot .vnty-caption {
  margin: 0;
  color: var(--fg-2);
}
.vnty-wishlist-empty {
  padding: var(--space-10) var(--space-6);
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  text-align: center;
}
.vnty-wishlist-empty .vnty-body { margin-bottom: var(--space-5); }

/* Coupons (Smart Coupons shortcode) ----------------------------------- */
/* Hide Smart Coupons' own heading + intro copy — Vinty shell owns those. */
.vnty-coupons-yith h2,
.vnty-coupons-yith h3,
.vnty-coupons-yith .wc-sc-available-coupons-heading,
.vnty-coupons-yith .smart-coupon-heading {
  display: none !important;
}
.vnty-coupons-yith > p:first-of-type,
.vnty-coupons-yith .wc-sc-available-coupons-wrap > p:first-of-type,
.vnty-coupons-yith .wc-sc-available-coupons-description,
.vnty-coupons-yith .wc-sc-coupons-list-description {
  display: none !important;
}
.vnty-coupons-yith {
  background: var(--bg-surface);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  padding: var(--space-6);
}
.vnty-coupons-yith .smart-coupon-message-wrap,
.vnty-coupons-yith .wc-sc-available-coupons-wrap {
  margin: 0 !important;
}
.vnty-coupons-yith .sc-no-coupons,
.vnty-coupons-yith .wc-smart-coupons-no-available-coupons,
.vnty-coupons-yith .smart-coupon-message-wrap p {
  padding: var(--space-5) var(--space-6) !important;
  background: var(--bg-wash) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-sm) !important;
  color: var(--fg-3) !important;
  font-style: italic !important;
  margin: 0 !important;
}
.vnty-coupons-yith .sc-coupon {
  border: 1px solid var(--border-default) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--bg-surface) !important;
  padding: var(--space-5) !important;
  margin-bottom: var(--space-3) !important;
}
.vnty-coupons-yith .sc-coupon-code,
.vnty-coupons-yith .coupon-code {
  font-family: var(--font-action) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: var(--fg-accent) !important;
  font-size: 14px !important;
}
.vnty-coupons-yith .sc-coupon-action a,
.vnty-coupons-yith .sc-coupon-action button,
.vnty-coupons-yith .apply_coupon {
  background: var(--bg-accent) !important;
  color: var(--fg-inverse) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  padding: 10px 18px !important;
  font-family: var(--font-action) !important;
  font-weight: 700 !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}
.vnty-coupons-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  margin-top: var(--space-6);
  padding: var(--space-5) var(--space-6);
  background: var(--bg-wash);
  border-radius: var(--radius-sm);
  flex-wrap: wrap;
}
.vnty-coupons-foot .vnty-caption {
  margin: 0;
  color: var(--fg-2);
}

/* Password strength meter --------------------------------------------- */
.vnty-pw-meter { margin-top: 8px; }
.vnty-pw-meter .vnty-pw-bar {
  height: 4px;
  background: var(--bg-wash);
  border-radius: var(--radius-pill);
  overflow: hidden;
}
.vnty-pw-meter .vnty-pw-bar span {
  display: block;
  height: 100%;
  width: 0;
  background: var(--border-default);
  transition: width 220ms ease, background 220ms ease;
}
.vnty-pw-meter .vnty-pw-label {
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--fg-3);
  margin-top: 4px;
}
.vnty-pw-0 .vnty-pw-bar span { width: 0; background: var(--border-default); }
.vnty-pw-1 .vnty-pw-bar span { width: 20%; background: var(--fg-accent); }
.vnty-pw-2 .vnty-pw-bar span { width: 40%; background: #d97706; }
.vnty-pw-3 .vnty-pw-bar span { width: 60%; background: #ca8a04; }
.vnty-pw-4 .vnty-pw-bar span { width: 80%; background: var(--fg-assurance); }
.vnty-pw-5 .vnty-pw-bar span { width: 100%; background: var(--fg-assurance); }
.vnty-pw-1 .vnty-pw-label { color: var(--fg-accent); }
.vnty-pw-4 .vnty-pw-label,
.vnty-pw-5 .vnty-pw-label { color: var(--fg-assurance); }
.vnty-pw-match-ok { color: var(--fg-assurance) !important; }
.vnty-pw-match-err { color: var(--fg-accent) !important; }

/* Pending email change banner ----------------------------------------- */
.vnty-pending-email-banner {
  display: flex;
  align-items: center;
  gap: var(--space-4);
  background: #FFF8E1;
  border: 1px solid #F5D57B;
  border-radius: var(--radius-sm);
  padding: var(--space-4) var(--space-5);
  margin-bottom: var(--space-6);
}
.vnty-pending-email-icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: var(--radius-pill);
  background: #F5D57B;
  color: #7A5A00;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vnty-pending-email-body { flex: 1; min-width: 0; }
.vnty-pending-email-headline {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #7A5A00;
  margin-bottom: 4px;
}
.vnty-pending-email-copy {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--fg-1);
  line-height: 1.45;
}
.vnty-pending-email-copy strong { color: var(--fg-1); }

/* Connected social accounts card -------------------------------------- */
.vnty-social-card { margin-bottom: var(--space-6); }
.vnty-social-list {
  list-style: none;
  padding: 0;
  margin: 0;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.vnty-social-row {
  display: grid;
  grid-template-columns: 24px 1fr auto auto;
  gap: var(--space-3);
  align-items: center;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border-default);
  background: var(--bg-surface);
}
.vnty-social-row:last-child { border-bottom: 0; }
.vnty-social-logo {
  width: 24px;
  height: 24px;
  border-radius: var(--radius-pill);
  background-position: center;
  background-size: 16px 16px;
  background-repeat: no-repeat;
}
.vnty-social-logo-facebook {
  background-color: #1877F2;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'><path d='M22 12a10 10 0 1 0-11.56 9.88v-6.99H7.9V12h2.54V9.8c0-2.51 1.49-3.9 3.78-3.9 1.09 0 2.24.2 2.24.2v2.46h-1.26c-1.24 0-1.63.77-1.63 1.56V12h2.77l-.44 2.89h-2.33v6.99A10 10 0 0 0 22 12z'/></svg>");
}
.vnty-social-logo-google {
  background-color: #FFFFFF;
  border: 1px solid var(--border-default);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'><path fill='%234285F4' d='M45.12 24.5c0-1.56-.14-3.06-.4-4.5H24v8.51h11.84c-.51 2.75-2.06 5.08-4.39 6.64v5.52h7.11c4.16-3.83 6.56-9.47 6.56-16.17z'/><path fill='%2334A853' d='M24 46c5.94 0 10.92-1.97 14.56-5.33l-7.11-5.52c-1.97 1.32-4.49 2.1-7.45 2.1-5.73 0-10.58-3.87-12.31-9.07H4.34v5.7A21.99 21.99 0 0 0 24 46z'/><path fill='%23FBBC05' d='M11.69 28.18C11.25 26.86 11 25.45 11 24s.25-2.86.69-4.18v-5.7H4.34A21.99 21.99 0 0 0 2 24c0 3.55.85 6.91 2.34 9.88l7.35-5.7z'/><path fill='%23EA4335' d='M24 10.75c3.23 0 6.13 1.11 8.41 3.29l6.31-6.31C34.91 4.18 29.93 2 24 2 15.4 2 7.96 6.94 4.34 14.12l7.35 5.7C13.42 14.62 18.27 10.75 24 10.75z'/></svg>");
  background-size: 18px 18px;
}
.vnty-social-label {
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--fg-1);
  font-weight: 600;
}
.vnty-social-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: var(--radius-pill);
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 10px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  white-space: nowrap;
}
.vnty-social-pill-connected { background: var(--bg-wash); color: var(--fg-assurance); }
.vnty-social-pill-connected::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--fg-assurance); }
.vnty-social-pill-off { background: var(--bg-wash); color: var(--fg-3); }
.vnty-social-action {
  font-family: var(--font-action);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--fg-accent);
  text-decoration: none;
}
.vnty-social-action:hover { text-decoration: underline; }
.vnty-social-action-hint {
  font-family: var(--font-body);
  font-size: 11px;
  color: var(--fg-3);
  font-style: italic;
}

/* Privacy / data rights card ------------------------------------------ */
.vnty-privacy-card .vnty-body { margin-bottom: var(--space-5); color: var(--fg-2); }
.vnty-privacy-actions {
  display: flex;
  gap: var(--space-3);
  flex-wrap: wrap;
}
.vnty-privacy-delete {
  color: var(--fg-3) !important;
}
.vnty-privacy-delete:hover {
  color: var(--fg-accent) !important;
  background: transparent !important;
}

/* Responsive ----------------------------------------------------------- */
@media (max-width: 1023px) {
  .vnty-account-shell {
    grid-template-columns: 1fr;
    gap: var(--space-6);
    padding: var(--space-5);
  }
  /* Release the desktop sidebar's 240px cap so the tab strip uses full width.
     Strip the card chrome (bg/border/padding) — pills carry their own visual
     definition and a single bottom rule reads as a tab row, not a boxed list. */
  body.woocommerce-account .woocommerce-MyAccount-navigation {
    max-width: none !important;
    background: var(--bg-surface) !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-bottom: 1px solid var(--border-default) !important;
    padding: 0 !important;
  }
  .woocommerce-MyAccount-navigation ul {
    display: flex;
    gap: var(--space-2);
    overflow-x: auto;
    padding: var(--space-3) var(--space-4);
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
  .woocommerce-MyAccount-navigation li {
    flex: 0 0 auto;
    margin: 0;
    scroll-snap-align: start;
  }
  .woocommerce-MyAccount-navigation li a {
    padding: 10px 14px;
    white-space: nowrap;
  }
  .woocommerce-MyAccount-navigation li.vnty-nav-logout {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
    border-left: 1px solid var(--border-default);
    margin-left: var(--space-2);
    padding-left: var(--space-2);
  }
}
@media (max-width: 767px) {
  .vnty-greeting { padding: var(--space-6) var(--space-5); }
  .vnty-greeting h1 { font-size: var(--text-2xl); }
  .vnty-greeting-meta { width: 100%; justify-content: flex-start; }
  .vnty-hero-body {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }
  .vnty-hero-thumbs { display: none; }
  .vnty-hero-actions .vnty-btn { flex: 1; }
  .vnty-stats { grid-template-columns: 1fr; }
  .vnty-dash-row,
  .vnty-detail-layout,
  .vnty-address-grid {
    grid-template-columns: 1fr;
  }
  .vnty-orders-table thead { display: none; }
  .vnty-orders-table,
  .vnty-orders-table tbody,
  .vnty-orders-table tr,
  .vnty-orders-table td {
    display: block;
    width: 100%;
  }
  .vnty-orders-table tr {
    border-bottom: 1px solid var(--border-default);
    padding: var(--space-4) var(--space-5);
  }
  .vnty-orders-table td { padding: 4px 0; border: 0; }
  .vnty-orders-table .vnty-row-actions { text-align: left; padding-top: var(--space-3); }
  .vnty-wishlist-yith .wishlist_table thead,
  .vnty-wishlist-yith table.shop_table thead { display: none !important; }
  .vnty-wishlist-yith .wishlist_table,
  .vnty-wishlist-yith .wishlist_table tbody,
  .vnty-wishlist-yith .wishlist_table tr,
  .vnty-wishlist-yith .wishlist_table td,
  .vnty-wishlist-yith table.shop_table,
  .vnty-wishlist-yith table.shop_table tbody,
  .vnty-wishlist-yith table.shop_table tr,
  .vnty-wishlist-yith table.shop_table td {
    display: block !important;
    width: 100% !important;
  }
  .vnty-wishlist-yith .wishlist_table tr,
  .vnty-wishlist-yith table.shop_table tr {
    padding: var(--space-5) !important;
    border-bottom: 1px solid var(--border-default) !important;
  }
  .vnty-wishlist-yith .wishlist_table td,
  .vnty-wishlist-yith table.shop_table td {
    padding: 6px 0 !important;
    border: 0 !important;
  }
  .vnty-wishlist-foot,
  .vnty-coupons-foot {
    flex-direction: column;
    align-items: flex-start;
  }
  .vnty-wishlist-foot .vnty-btn,
  .vnty-coupons-foot .vnty-btn { width: 100%; text-align: center; }
  .vnty-privacy-actions .vnty-btn { width: 100%; text-align: center; }
  .vnty-pending-email-banner {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-3);
  }
  .vnty-pending-email-banner .vnty-btn { width: 100%; text-align: center; }
  .vnty-social-row {
    grid-template-columns: 24px 1fr;
    grid-auto-rows: auto;
    gap: var(--space-2) var(--space-3);
  }
  .vnty-social-row .vnty-social-pill { grid-column: 2; justify-self: start; }
  .vnty-social-row .vnty-social-action,
  .vnty-social-row .vnty-social-action-hint { grid-column: 2; }
}

/* Reduced motion ------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .vnty-btn, .vnty-field .vnty-input-wrap, .woocommerce-MyAccount-navigation li a {
    transition: none;
  }
}
