/*
 * Valve Gestionale 1.7.0 — Mockup UI
 * Tema visivo ricostruito sul concept approvato: hero compatto, navigazione
 * flottante, card leggere, dashboard operativa e interfaccia senza sidebar.
 */
:root{
  --vm-green-950:#075632;
  --vm-green-900:#087043;
  --vm-green-800:#0b7f4c;
  --vm-green-700:#168f59;
  --vm-green-600:#2da86f;
  --vm-green-100:#e9f7ef;
  --vm-green-50:#f4fbf7;
  --vm-bg:#f7f9f8;
  --vm-card:#ffffff;
  --vm-text:#202b25;
  --vm-muted:#718078;
  --vm-border:#e4ebe7;
  --vm-danger:#dc3340;
  --vm-danger-bg:#fff1f2;
  --vm-warning:#ed8a00;
  --vm-warning-bg:#fff6e7;
  --vm-shadow:0 10px 28px rgba(28,64,45,.07);
  --vm-shadow-lg:0 20px 54px rgba(19,75,45,.11);
}

/* Reset sicuro e contenitore centrale */
body.vsg-standalone-app,
body.vfa-standalone-app{
  background:var(--vm-bg)!important;
}
body.vsg-standalone-app .vsg-sidebar{display:none!important}
body.vsg-standalone-app .vsg-app-shell,
body.vsg-standalone-app .vsg-app-stage,
body.vsg-standalone-app .vsg-wrap,
body.vsg-standalone-app .vsg-main{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  transform:none!important;
  inset:auto!important;
}
body.vsg-standalone-app .vsg-app-stage{padding:22px 24px 56px!important}
body.vsg-standalone-app .vsg-wrap{
  max-width:1480px!important;
  margin-inline:auto!important;
}
body.vsg-standalone-app .vsg-main{display:block!important;padding:0!important}
body.vsg-standalone-app #wpadminbar{display:none!important}
html:has(body.vsg-standalone-app){margin-top:0!important}

/* Hero come nel mockup approvato */
body.vsg-standalone-app .vsg-header{
  min-height:166px!important;
  display:grid!important;
  grid-template-columns:142px minmax(0,1fr) 155px!important;
  gap:24px!important;
  align-items:center!important;
  margin:0!important;
  padding:20px 34px!important;
  border-radius:28px!important;
  background:linear-gradient(115deg,#075d38 0%,#0b7a49 55%,#43a871 100%)!important;
  box-shadow:var(--vm-shadow-lg)!important;
}
body.vsg-standalone-app .vsg-header:before{
  width:330px!important;height:330px!important;right:1%!important;top:-145px!important;
  border-width:34px!important;opacity:.75!important
}
body.vsg-standalone-app .vsg-header:after{display:none!important}
body.vsg-standalone-app .vsg-header-brand img{
  width:126px!important;height:126px!important;object-fit:contain!important
}
body.vsg-standalone-app .vsg-header-copy>span{
  margin-bottom:4px!important;font-size:11px!important;letter-spacing:.11em!important
}
body.vsg-standalone-app .vsg-header h1{
  margin:0 0 7px!important;
  font-size:clamp(34px,3.2vw,50px)!important;
  line-height:1.02!important;
  letter-spacing:-.045em!important;
}
body.vsg-standalone-app .vsg-header p{font-size:14px!important;line-height:1.45!important}
body.vsg-standalone-app .vsg-header-copy>small{margin-top:10px!important;font-size:11px!important}
body.vsg-standalone-app .vsg-header-side{height:100%!important;padding:5px 0!important}
body.vsg-standalone-app .vsg-today{font-size:11px!important}
body.vsg-standalone-app .vsg-logout{
  min-height:46px!important;padding:0 18px!important;border-radius:14px!important;
  box-shadow:0 8px 20px rgba(0,0,0,.10)!important
}

/* Navigazione flottante, pulita e compatta */
body.vsg-standalone-app .vsg-nav{
  position:relative!important;top:auto!important;z-index:20!important;
  display:grid!important;
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
  width:calc(100% - 86px)!important;
  margin:-18px auto 30px!important;
  padding:7px!important;
  gap:3px!important;
  border:1px solid var(--vm-border)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.98)!important;
  box-shadow:0 14px 34px rgba(27,65,45,.10)!important;
  overflow:visible!important;
}
body.vsg-standalone-app .vsg-nav a{
  min-width:0!important;min-height:48px!important;
  padding:8px 8px!important;
  border-radius:13px!important;
  gap:8px!important;
  white-space:nowrap!important;
  font-size:12px!important;
  color:#55645c!important;
}
body.vsg-standalone-app .vsg-nav a b{font-size:12px!important;white-space:nowrap!important}
body.vsg-standalone-app .vsg-nav a.is-active{
  background:var(--vm-green-50)!important;color:var(--vm-green-900)!important
}

/* Card, pulsanti, campi e tabelle coerenti */
body.vsg-standalone-app :is(.vsg-card,.vsg-stat-card,.vui-status-card,.vsg-notification,.vsg-clothing-order-card,.vsg-privacy-document-card),
body.vfa-standalone-app :is(.vrr-card,.vds-card,.vfa-overview-card,.vfa-photo-family-card,.vfa-privacy-family-section,.valve-box){
  border:1px solid var(--vm-border)!important;
  border-radius:20px!important;
  background:var(--vm-card)!important;
  box-shadow:var(--vm-shadow)!important;
}
body.vsg-standalone-app :is(input,select,textarea),
body.vfa-standalone-app :is(input,select,textarea){
  border:1px solid #dce5df!important;
  border-radius:11px!important;
  background:#fff!important;
  box-shadow:none!important;
  font-size:13px!important;
}
body.vsg-standalone-app :is(input,select){min-height:42px!important}
body.vsg-standalone-app .vsg-btn,
body.vfa-standalone-app :is(.vrr-button,.vds-button,.valve-btn){
  min-height:42px!important;
  padding:8px 15px!important;
  border-radius:11px!important;
  background:var(--vm-green-800)!important;
  border-color:var(--vm-green-800)!important;
  color:#fff!important;
  box-shadow:none!important;
  font-size:12px!important;
  font-weight:600!important;
}
body.vsg-standalone-app .vsg-btn.vsg-secondary,
body.vfa-standalone-app :is(.vrr-button.vrr-dark,.valve-btn.valve-secondary){
  background:#fff!important;color:var(--vm-green-800)!important
}

/* Dashboard identica nella logica al concept */
.vsg-view-dashboard .vsg-header-copy>small{display:none!important}
.vsg-mockup-metrics{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:13px;
  margin:0 0 18px;
}
.vsg-mockup-metric{
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-height:118px;
  padding:15px;
  border:1px solid var(--vm-border);
  border-radius:18px;
  background:#fff;
  color:var(--vm-text)!important;
  text-decoration:none!important;
  box-shadow:var(--vm-shadow);
  transition:transform .16s ease,box-shadow .16s ease;
}
.vsg-mockup-metric:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(28,64,45,.10)}
.vsg-mockup-metric-icon{
  display:grid;place-items:center;width:52px;height:52px;border-radius:17px;
  background:var(--vm-green-100);font-size:25px
}
.vsg-mockup-metric-copy{display:grid;min-width:0;gap:3px}
.vsg-mockup-metric-copy strong{font-size:27px;line-height:1;color:var(--vm-green-800)!important}
.vsg-mockup-metric-copy b{font-size:11px;line-height:1.28;color:var(--vm-text)!important}
.vsg-mockup-metric-copy small{font-size:9px!important;color:var(--vm-muted)!important}
.vsg-mockup-metric.is-danger .vsg-mockup-metric-icon{background:var(--vm-danger-bg)}
.vsg-mockup-metric.is-danger .vsg-mockup-metric-copy strong{color:var(--vm-danger)!important}
.vsg-mockup-metric.is-warning .vsg-mockup-metric-icon{background:var(--vm-warning-bg)}
.vsg-mockup-metric.is-warning .vsg-mockup-metric-copy strong{color:var(--vm-warning)!important}

.vsg-mockup-dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0,2.35fr) minmax(290px,.9fr);
  gap:16px;
  align-items:stretch;
}
.vsg-mockup-dashboard-grid>.vsg-card{padding:17px!important;margin:0!important}
.vsg-mockup-card-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.vsg-mockup-card-head>div{display:flex;align-items:center;gap:10px}
.vsg-mockup-card-head h2{margin:0!important;font-size:17px!important;line-height:1.2!important;color:var(--vm-text)!important}
.vsg-mockup-card-head p{margin:2px 0 0!important;font-size:9px!important;color:var(--vm-muted)!important}
.vsg-mockup-head-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:var(--vm-green-100);color:var(--vm-green-800);font-size:17px}
.vsg-mockup-head-icon svg{width:18px;height:18px}.vsg-mockup-head-icon.is-neutral{background:#f1f4f2;color:#56655d}
.vsg-mockup-filter-row{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:8px;margin-bottom:11px}
.vsg-mockup-filter-row span{display:flex;align-items:center;gap:7px;min-height:37px;padding:8px 11px;border:1px solid var(--vm-border);border-radius:10px;color:#77837d;font-size:9px;background:#fff}
.vsg-mockup-filter-row svg{width:14px;height:14px}
.vsg-mockup-table-wrap{overflow-x:auto;border:1px solid #edf1ee;border-radius:12px}
.vsg-mockup-table{width:100%;border-collapse:collapse;min-width:810px;background:#fff}
.vsg-mockup-table th{padding:8px 9px;background:#fafcfb;color:#77837d;font-size:8px;text-transform:uppercase;letter-spacing:.025em;text-align:left;border-bottom:1px solid #edf1ee}
.vsg-mockup-table td{padding:8px 9px;color:#59665f;font-size:9px;border-bottom:1px solid #f0f3f1;vertical-align:middle}
.vsg-mockup-table tr:last-child td{border-bottom:0}
.vsg-mockup-table td small{display:block;margin-top:2px;font-size:7px!important}
.vsg-mockup-athlete{display:flex;align-items:center;gap:8px;text-decoration:none!important;color:var(--vm-text)!important;white-space:nowrap}
.vsg-mockup-athlete img,.vsg-mockup-athlete>span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;object-fit:cover;background:var(--vm-green-100);font-size:14px}
.vsg-mockup-athlete b{font-size:9px!important}
.vsg-mockup-more{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--vm-border);border-radius:9px;text-decoration:none!important;color:#69766f!important}
.vsg-mockup-view-all{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;margin-top:5px;border-top:1px solid #eef2ef;text-decoration:none!important;color:var(--vm-green-800)!important;font-size:10px;font-weight:600}
.vsg-mockup-view-all svg{width:15px;height:15px}
.vsg-mockup-activity-card .vsg-list,.vsg-mockup-activity-card .vsg-notification-list{display:grid;gap:4px}
.vsg-mockup-activity-card .vsg-notification{box-shadow:none!important;border:0!important;border-bottom:1px solid #eef2ef!important;border-radius:0!important;padding:9px 2px!important}
.vsg-mockup-activity-card .vsg-notification:last-child{border-bottom:0!important}

/* Le pagine operative mantengono il look del mockup */
body.vsg-standalone-app .vsg-section-head{margin:16px 0 14px!important}
body.vsg-standalone-app .vsg-section-head>div>span{font-size:10px!important;letter-spacing:.13em!important}
body.vsg-standalone-app .vsg-section-head h2{margin:4px 0!important;font-size:30px!important;letter-spacing:-.035em!important;color:var(--vm-text)!important}
body.vsg-standalone-app .vsg-section-head p{margin:0!important;font-size:11px!important;color:var(--vm-muted)!important}
body.vsg-standalone-app .vsg-card{padding:18px!important}
body.vsg-standalone-app .vsg-table-wrap{border:1px solid var(--vm-border)!important;border-radius:16px!important;background:#fff!important;box-shadow:var(--vm-shadow)!important}
body.vsg-standalone-app .vsg-table th{background:#fafcfb!important;color:#748078!important;font-size:9px!important}
body.vsg-standalone-app .vsg-table td{font-size:10px!important}
body.vsg-standalone-app .vsg-badge{font-size:8px!important;border-radius:999px!important;padding:5px 8px!important}

/* Crescita: card meno pesanti e leggibili */
.vsg-view-andamento .vsg-growth-summary-138,
.vsg-view-andamento .vsg-growth-summary-141{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
.vsg-view-andamento .vsg-growth-summary-card-138,
.vsg-view-andamento .vsg-growth-summary-card-141{min-height:132px!important;padding:17px!important;border-radius:18px!important;box-shadow:var(--vm-shadow)!important}
.vsg-view-andamento .vsg-growth-chart-grid-138,
.vsg-view-andamento .vsg-growth-chart-grid-141{gap:15px!important}
.vsg-view-andamento .vsg-growth-chart-card-138,
.vsg-view-andamento .vsg-growth-chart-card-141{padding:18px!important;border-radius:20px!important}

/* Area Famiglie nello stesso linguaggio visivo */
body.vfa-standalone-app #wpadminbar{display:none!important}
html:has(body.vfa-standalone-app){margin-top:0!important}
body.vfa-standalone-app .vfa-native-layout{padding:22px 24px 58px!important}
body.vfa-standalone-app :is(.vds-family-top,.vds-quick-nav,.vfa-overview,.vrr-wrap,.vds-wrap,.valve-wrap,.vsg-family-messages,.valve-proprietary-footer){max-width:1480px!important}
body.vfa-standalone-app .vds-family-top{
  min-height:166px!important;
  grid-template-columns:142px minmax(0,1fr) 145px!important;
  padding:20px 34px!important;
  border-radius:28px!important;
  box-shadow:var(--vm-shadow-lg)!important;
}
body.vfa-standalone-app .vds-family-brand img{width:126px!important;height:126px!important}
body.vfa-standalone-app .vds-family-copy h2{font-size:clamp(34px,3.2vw,50px)!important}
body.vfa-standalone-app .vds-family-copy p{font-size:14px!important}
body.vfa-standalone-app .vds-quick-nav{
  width:calc(100% - 86px)!important;
  margin:-18px auto 28px!important;
  border-radius:20px!important;
}
body.vfa-standalone-app .vds-quick-nav a{min-height:48px!important;font-size:12px!important}
body.vfa-standalone-app .vfa-overview{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:13px!important}
body.vfa-standalone-app .vfa-overview-card{min-height:112px!important;padding:15px!important}
body.vfa-standalone-app .vfa-overview-icon{width:50px!important;height:50px!important;flex-basis:50px!important}
body.vfa-standalone-app .vfa-overview-copy>strong{font-size:27px!important}
body.vfa-standalone-app .vrr-card,body.vfa-standalone-app .vds-card{padding:18px!important}

/* Responsive */
@media(max-width:1280px){
  body.vsg-standalone-app .vsg-nav{grid-template-columns:repeat(8,minmax(max-content,1fr))!important;overflow-x:auto!important}
  .vsg-mockup-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vsg-mockup-dashboard-grid{grid-template-columns:1fr}
}
@media(max-width:900px){
  body.vsg-standalone-app .vsg-app-stage,body.vfa-standalone-app .vfa-native-layout{padding:10px 10px 42px!important}
  body.vsg-standalone-app .vsg-header,body.vfa-standalone-app .vds-family-top{
    grid-template-columns:82px minmax(0,1fr)!important;min-height:180px!important;padding:20px 18px 48px!important
  }
  body.vsg-standalone-app .vsg-header-brand img,body.vfa-standalone-app .vds-family-brand img{width:76px!important;height:76px!important}
  body.vsg-standalone-app .vsg-header-side,body.vfa-standalone-app .vds-logout{position:absolute!important;right:16px!important;top:16px!important}
  body.vsg-standalone-app .vsg-today{display:none!important}
  body.vsg-standalone-app .vsg-nav,body.vfa-standalone-app .vds-quick-nav{width:calc(100% - 24px)!important;margin:-22px 12px 24px!important;overflow-x:auto!important}
  body.vsg-standalone-app .vsg-nav{display:flex!important}
  body.vsg-standalone-app .vsg-nav a{flex:0 0 auto!important;min-width:124px!important}
  .vsg-mockup-filter-row{grid-template-columns:1fr 1fr}
  body.vfa-standalone-app .vfa-overview{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  body.vsg-standalone-app .vsg-header,body.vfa-standalone-app .vds-family-top{
    grid-template-columns:1fr!important;min-height:220px!important;padding:20px 17px 54px!important;border-radius:0 0 24px 24px!important
  }
  body.vsg-standalone-app .vsg-header-brand,body.vfa-standalone-app .vds-family-brand{justify-content:start!important}
  body.vsg-standalone-app .vsg-header-brand img,body.vfa-standalone-app .vds-family-brand img{width:66px!important;height:66px!important}
  body.vsg-standalone-app .vsg-header h1,body.vfa-standalone-app .vds-family-copy h2{font-size:29px!important}
  .vsg-mockup-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .vsg-mockup-metric{grid-template-columns:42px minmax(0,1fr);min-height:100px;padding:12px;gap:9px}
  .vsg-mockup-metric-icon{width:42px;height:42px;border-radius:14px;font-size:20px}
  .vsg-mockup-metric-copy strong{font-size:23px}
  .vsg-mockup-filter-row{display:none}
  body.vfa-standalone-app .vfa-overview{grid-template-columns:1fr!important}
}