/* ==========================================================================
   Upgrade Audio — Area account, download e conferma ordine
   Versione chiara: fondo bianco, testo nero, verde brand come accento.
   Caricato solo su my-account, checkout e order-received.
   ========================================================================== */

:root{
  --ua-green:#86FF14;
  --ua-green-dk:#4DC900;          /* verde leggibile su bianco */
  --ua-grad:linear-gradient(180deg,#CBFF5E 0%,#55FF06 100%);
  --ua-ink:#0A0A0A;
  --ua-body:#3A3A38;              /* testo secondario */
  --ua-muted:#6B6B66;
  --ua-paper:#FFFFFF;
  --ua-surface:#F5F5F1;           /* card / pannelli */
  --ua-surface-hi:#FBFFF2;        /* card in evidenza */
  --ua-line:#E4E4E0;
  --ua-display:'Archivo',system-ui,sans-serif;
  --ua-text:'DM Sans',system-ui,sans-serif;
  --ua-mono:'DM Mono',ui-monospace,monospace;
}

/* ---------- pagina ---------- */
.ua-account-page{background:var(--ua-paper)}
.ua-account-page .site-content,
.ua-account-page #primary,
.ua-account-page .ast-container{background:var(--ua-paper)}
.ua-account-page .entry-header,
.ua-account-page .woocommerce-notices-wrapper:empty{display:none}

.ua-account{font-family:var(--ua-text);color:var(--ua-ink);padding:8px 0 64px}
.ua-account *{box-sizing:border-box}
.ua-account img{display:block;max-width:100%;height:auto}
.ua-account a{text-decoration:none}

/* ---------- tipografia ---------- */
.ua-h1{margin:0;font-family:var(--ua-display);font-weight:800;font-size:clamp(34px,5vw,62px);line-height:.95;letter-spacing:-.04em;color:var(--ua-ink)}
.ua-h3{margin:0;font-family:var(--ua-display);font-weight:800;font-size:22px;letter-spacing:-.025em;color:var(--ua-ink)}
.ua-lead{margin:0;max-width:560px;font-size:17px;line-height:1.45;color:var(--ua-body);text-wrap:pretty}
.ua-kicker{display:block;font-family:var(--ua-mono);font-size:12px;letter-spacing:.16em;color:var(--ua-green-dk)}
.ua-kicker--sm{font-size:11px;letter-spacing:.14em}
.ua-mono{font-family:var(--ua-mono);font-size:13px;color:var(--ua-muted)}
.ua-note{margin:0;font-size:13px;line-height:1.5;color:var(--ua-muted)}
.ua-truncate{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- bottoni (min 52px: sicuri per il pollice) ---------- */
.ua-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:12px}
.ua-btn-primary,
.ua-btn-ghost,
.ua-btn-soft,
.ua-btn-dark{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:54px;padding:0 26px;border-radius:10px;border:0;cursor:pointer;
  font-family:var(--ua-display);font-size:15px;font-weight:800;letter-spacing:.06em;
  transition:background .18s,color .18s,border-color .18s;
}
.ua-btn-primary{background:var(--ua-green);color:var(--ua-ink)}
.ua-btn-primary:hover{background:var(--ua-ink);color:var(--ua-green)}
.ua-btn-ghost{background:transparent;border:1.5px solid var(--ua-line);color:var(--ua-ink);font-family:var(--ua-text);font-size:14px;font-weight:500;letter-spacing:.04em}
.ua-btn-ghost:hover{border-color:var(--ua-ink)}
.ua-btn-soft{background:rgba(134,255,20,.22);color:var(--ua-ink);font-size:13px}
.ua-btn-soft:hover{background:var(--ua-green)}
.ua-btn-dark{background:var(--ua-ink);color:#fff;font-size:13px;min-height:50px}
.ua-btn-dark:hover{background:#fff;color:var(--ua-ink);box-shadow:inset 0 0 0 1.5px var(--ua-ink)}
.ua-btn-play{width:0;height:0;border-left:13px solid currentColor;border-top:9px solid transparent;border-bottom:9px solid transparent}

/* ---------- layout account: sidebar + contenuto ----------
   Il markup di WooCommerce è <div class="woocommerce"> con due figli float.
   Selettori generosi + !important perché Astra e i plugin impostano width/float. */
.woocommerce-account .woocommerce,
.woocommerce-account .entry-content > .woocommerce,
.woocommerce-account .ast-container > .woocommerce{
  display:grid !important;
  grid-template-columns:300px minmax(0,1fr) !important;
  gap:56px;
  align-items:start;
  width:100%;
  max-width:1272px;
  margin:0 auto;
  padding:40px 20px 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation{
  grid-column:1;float:none !important;width:auto !important;max-width:none !important;margin:0 !important;
}
.woocommerce-account .woocommerce-MyAccount-content{
  grid-column:2;float:none !important;width:auto !important;max-width:none !important;margin:0 !important;min-width:0;
}
.woocommerce-account .woocommerce-notices-wrapper{grid-column:1 / -1}

/* ---------- navigazione ---------- */
.ua-account-nav{margin:0;padding:0}
.ua-account-nav ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.ua-account-nav li{margin:0;padding:0;border:0;background:none;list-style:none}
.ua-account-nav li::marker,
.ua-account-nav li::before{content:none;display:none}
.ua-account-nav a{
  display:flex;align-items:center;min-height:54px;padding:0 18px;border-radius:10px;
  font-family:var(--ua-text);font-size:15px;font-weight:500;color:var(--ua-ink);
  background:var(--ua-surface);border:1px solid var(--ua-line);
}
.ua-account-nav a:hover{background:#fff;border-color:var(--ua-ink)}
.ua-account-nav .is-active > a,
.ua-account-nav a[aria-current="page"]{
  background:var(--ua-green);border-color:var(--ua-green);color:var(--ua-ink);
  font-family:var(--ua-display);font-weight:800;letter-spacing:.03em;text-transform:uppercase;font-size:14px;
}
.ua-account-nav .woocommerce-MyAccount-navigation-link--customer-logout{margin-top:10px;padding-top:6px}
.ua-account-nav .woocommerce-MyAccount-navigation-link--customer-logout a{background:transparent;border-color:transparent;font-size:14px;color:var(--ua-muted)}
.ua-account-nav .woocommerce-MyAccount-navigation-link--customer-logout a:hover{color:var(--ua-ink)}

/* ---------- bacheca ---------- */
.ua-dashboard__head,
.ua-thankyou__head{display:flex;flex-direction:column;gap:10px;padding:8px 0 34px}
.ua-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:34px 0 16px}

/* ---------- card traccia ---------- */
.ua-tracklist{display:flex;flex-direction:column;gap:16px}
.ua-track{background:var(--ua-surface);border:1px solid var(--ua-line);border-radius:16px;padding:20px;display:flex;gap:22px;align-items:center}
.ua-track--hero{background:var(--ua-surface-hi);border-color:var(--ua-green)}
.ua-track img,
.ua-track__cover{width:150px;height:150px;object-fit:cover;border-radius:12px;flex:0 0 auto}
.ua-track__body{display:flex;flex-direction:column;gap:8px;min-width:0;flex:1}
.ua-track__title{margin:0;font-family:var(--ua-display);font-weight:800;font-size:clamp(19px,2.4vw,32px);line-height:1.04;letter-spacing:-.03em;color:var(--ua-ink)}
.ua-track__meta{font-family:var(--ua-mono);font-size:12px;color:var(--ua-muted)}

/* ---------- libreria a griglia ---------- */
.ua-library{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ua-card{background:var(--ua-surface);border:1px solid var(--ua-line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.ua-card img{width:100%;aspect-ratio:1;object-fit:cover}
.ua-card__body{padding:16px;display:flex;flex-direction:column;gap:10px;flex:1}
.ua-card__title{margin:0;font-family:var(--ua-display);font-weight:800;font-size:18px;line-height:1.1;letter-spacing:-.02em;color:var(--ua-ink)}
.ua-card__body .ua-btn-soft{margin-top:auto;min-height:46px}
.ua-card--more{border:1.5px dashed var(--ua-green-dk);background:transparent;align-items:center;justify-content:center;gap:12px;padding:26px;text-align:center}
.ua-card--more:hover{background:rgba(134,255,20,.1)}
.ua-card__plus{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--ua-green-dk);color:var(--ua-green-dk);display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1}
.ua-card__more-title{font-family:var(--ua-display);font-size:15px;font-weight:800;color:var(--ua-ink)}
.ua-card__more-sub{font-size:13px;line-height:1.4;color:var(--ua-muted)}

/* ---------- pannelli ---------- */
.ua-panel{background:var(--ua-surface);border:1px solid var(--ua-line);border-radius:14px;padding:26px;display:flex;flex-direction:column;gap:12px}
.ua-panel p{margin:0;font-size:16px;line-height:1.45;color:var(--ua-body)}
.ua-panel--warn{border-color:var(--ua-green);background:rgba(134,255,20,.12)}
.ua-panel--empty{align-items:flex-start;text-align:left;max-width:640px}

.ua-help{background:var(--ua-grad);border-radius:14px;padding:24px 28px;margin-top:34px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.ua-help>div{flex:1 1 320px;min-width:0}
.ua-help p{margin:0;font-size:16px;line-height:1.4;color:var(--ua-ink)}
.ua-help__kicker{display:block;margin-bottom:6px;font-family:var(--ua-display);font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--ua-ink)}

/* ---------- conferma ordine ---------- */
.ua-check{width:56px;height:56px;border-radius:50%;background:var(--ua-green);color:var(--ua-ink);display:flex;align-items:center;justify-content:center;font-family:var(--ua-display);font-size:28px;font-weight:800;line-height:1}
.ua-thankyou__grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:44px;align-items:start}
.ua-thankyou__main{display:flex;flex-direction:column;gap:34px;min-width:0}
.ua-thankyou__side{display:flex;flex-direction:column;gap:14px}

.ua-steps{display:flex;flex-direction:column;gap:18px}
.ua-steps__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ua-step{background:var(--ua-surface);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:10px}
.ua-step p{margin:0;font-size:15px;line-height:1.45;color:var(--ua-body)}
.ua-step__n{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--ua-green-dk);color:var(--ua-green-dk);display:flex;align-items:center;justify-content:center;font-family:var(--ua-mono);font-size:13px}

.ua-summary{background:var(--ua-surface);border:1px solid var(--ua-line);border-radius:14px;padding:22px 24px}
.ua-summary summary{font-family:var(--ua-display);font-weight:800;font-size:18px;letter-spacing:-.02em;color:var(--ua-ink);cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;padding-bottom:14px}
.ua-summary summary::-webkit-details-marker{display:none}
.ua-summary summary::after{content:"+";color:var(--ua-green-dk);font-size:18px}
.ua-summary[open] summary::after{content:"−"}
.ua-summary__row{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-top:1px solid var(--ua-line);font-size:14px;color:var(--ua-muted)}
.ua-summary__row>span:last-child{color:var(--ua-ink);text-align:right}
.ua-summary__row--total{border-top:1px solid var(--ua-ink);padding:14px 0 4px;font-family:var(--ua-display);font-size:19px;font-weight:800}
.ua-summary__row--total>span{color:var(--ua-ink)}

.ua-row-link{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 18px;background:var(--ua-surface);border:1px solid var(--ua-line);border-radius:11px;font-size:15px;font-weight:500;color:var(--ua-ink)}
.ua-row-link:hover{background:#fff;border-color:var(--ua-ink)}
.ua-row-link span{color:var(--ua-green-dk);font-size:18px}

/* ---------- tabelle e form nativi WooCommerce ---------- */
.ua-account-page .woocommerce table.shop_table{border:1px solid var(--ua-line);border-radius:12px;background:var(--ua-paper);color:var(--ua-ink);border-collapse:separate;overflow:hidden}
.ua-account-page .woocommerce table.shop_table th,
.ua-account-page .woocommerce table.shop_table td{border-color:var(--ua-line);color:var(--ua-ink);padding:14px 16px}
.ua-account-page .woocommerce table.shop_table thead th{background:var(--ua-surface);font-family:var(--ua-display);font-size:13px;letter-spacing:.04em}
.ua-account-page .woocommerce table.shop_table a{color:var(--ua-ink);text-decoration:underline;text-decoration-color:var(--ua-green)}
.ua-account-page .woocommerce table.shop_table a:hover{color:var(--ua-green-dk)}
.ua-account-page h2,
.ua-account-page h3,
.ua-account-page legend{color:var(--ua-ink);font-family:var(--ua-display);letter-spacing:-.02em}
.ua-account-page .woocommerce form .form-row label{color:var(--ua-body);font-size:14px}
.ua-account-page .woocommerce form .form-row input.input-text,
.ua-account-page .woocommerce form .form-row select,
.ua-account-page .woocommerce form .form-row textarea{
  background:#fff;border:1px solid var(--ua-line);color:var(--ua-ink);
  border-radius:9px;min-height:52px;padding:12px 14px;
}
.ua-account-page .woocommerce form .form-row input.input-text:focus{border-color:var(--ua-green-dk);outline:none}
.ua-account-page .woocommerce button.button,
.ua-account-page .woocommerce a.button,
.ua-account-page .woocommerce input.button{
  background:var(--ua-green);color:var(--ua-ink);border-radius:10px;min-height:54px;padding:0 26px;
  font-family:var(--ua-display);font-size:15px;font-weight:800;letter-spacing:.06em;
  display:inline-flex;align-items:center;justify-content:center;
}
.ua-account-page .woocommerce button.button:hover,
.ua-account-page .woocommerce a.button:hover{background:var(--ua-ink);color:var(--ua-green)}
.ua-account-page .woocommerce-message,
.ua-account-page .woocommerce-info{
  background:var(--ua-surface);border-top:3px solid var(--ua-green);color:var(--ua-ink);border-radius:10px;
}
.ua-account-page .woocommerce-message::before,
.ua-account-page .woocommerce-info::before{color:var(--ua-green-dk)}
.ua-account-page .woocommerce-error{background:#FFF4F1;border-top-color:#FF5C2B;color:var(--ua-ink);border-radius:10px}

/* ==========================================================================
   MOBILE — l'uso prevalente
   ========================================================================== */
@media (max-width:920px){
  .woocommerce-account .woocommerce,
  .woocommerce-account .entry-content > .woocommerce,
  .woocommerce-account .ast-container > .woocommerce{
    grid-template-columns:minmax(0,1fr) !important;gap:26px;padding:24px 20px 0;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content{grid-column:1}
  .ua-thankyou__grid{grid-template-columns:1fr;gap:26px}
  .ua-steps__grid{grid-template-columns:1fr}
  .ua-library{grid-template-columns:repeat(2,1fr)}

  /* la sidebar diventa una riga di chip scorrevoli */
  .ua-account-nav{margin:0 -20px;padding:0 20px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .ua-account-nav::-webkit-scrollbar{display:none}
  .ua-account-nav ul{flex-direction:row;gap:8px;width:max-content;padding-bottom:4px}
  .ua-account-nav a{
    min-height:44px;padding:0 16px;border-radius:999px;white-space:nowrap;
    border:1px solid var(--ua-line);background:#fff;color:var(--ua-ink);
    font-family:var(--ua-display);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  }
  .ua-account-nav .is-active > a,
  .ua-account-nav a[aria-current="page"]{background:var(--ua-green);border-color:var(--ua-green);color:var(--ua-ink);font-size:12px}
  .ua-account-nav .woocommerce-MyAccount-navigation-link--customer-logout{margin:0;border:0;padding:0}
}

@media (max-width:640px){
  .ua-account{padding:4px 0 48px}
  .ua-lead{font-size:15px}
  .ua-library{grid-template-columns:1fr}

  /* card traccia: copertina sopra, azioni a piena larghezza */
  .ua-track{flex-direction:column;align-items:stretch;gap:14px;padding:14px;border-radius:14px}
  .ua-track img,
  .ua-track__cover{width:100%;height:auto;aspect-ratio:1;border-radius:10px}
  .ua-track--hero .ua-track__title{font-size:22px}
  .ua-actions{flex-direction:column;align-items:stretch;gap:10px}
  .ua-actions>*{width:100%}
  .ua-btn-primary{min-height:56px;font-size:16px}

  .ua-help{flex-direction:column;align-items:flex-start;gap:16px;padding:22px 20px}
  .ua-help .ua-btn-dark{width:100%}
  .ua-panel{padding:20px}
  .ua-summary{padding:18px 18px 4px}
  .ua-check{width:52px;height:52px;font-size:26px}
  .ua-steps__grid{gap:12px}
  .ua-step{flex-direction:row;align-items:flex-start;gap:14px;background:transparent;padding:0}
  .ua-step__n{flex:0 0 auto;width:26px;height:26px;font-size:12px}

  /* tabelle native: righe leggibili senza scroll orizzontale */
  .ua-account-page .woocommerce table.shop_table tbody th,
  .ua-account-page .woocommerce table.shop_table td{padding:12px}
  .ua-account-page .woocommerce table.shop_table_responsive tr td::before{color:var(--ua-muted)}
}