/* ArenaItalia Modern: applied ONLY to signup pages using signup-arena.phtml */
body.am-page-arena-modern {
 --arena-ink:#18243b; --arena-muted:#64748b; --arena-line:#e4e9f0; --arena-primary:#2156e8;
 background:radial-gradient(ellipse at 15% 0%,#dfeaff 0%,transparent 42%),linear-gradient(130deg,#f6f9ff,#f3f6fc) !important;
 color:var(--arena-ink); font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}
body.am-page-arena-modern *, body.am-page-arena-modern *::before, body.am-page-arena-modern *::after { box-sizing:border-box; }
body.am-page-arena-modern .am-layout {background:transparent !important; max-width:none !important; width:100% !important; box-shadow:none !important; border:0 !important;}
body.am-page-arena-modern .am-header,body.am-page-arena-modern .am-header-line,body.am-page-arena-modern .am-footer {display:none !important;}
body.am-page-arena-modern .am-body,body.am-page-arena-modern .am-body-content-wrapper,body.am-page-arena-modern .am-main,body.am-page-arena-modern .am-body-content {width:100% !important; max-width:none !important; background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 !important; margin:0 !important;}
body.am-page-arena-modern .arena-modern-shell {width:min(1030px,calc(100% - 32px)); margin:44px auto; display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);background:#fff;border:1px solid var(--arena-line);border-radius:24px;overflow:hidden;box-shadow:0 22px 70px #172b521b;}
body.am-page-arena-modern .arena-modern-hero {min-width:0;background:linear-gradient(150deg,#0d2257,#173e93 62%,#245de0);color:white;padding:54px 44px;display:flex;flex-direction:column;justify-content:space-between;gap:50px;}
body.am-page-arena-modern .arena-modern-brand {display:flex;align-items:center;gap:12px;font-weight:800;font-size:20px;}
body.am-page-arena-modern .arena-modern-brand-icon {width:39px;height:39px;display:grid;place-items:center;border:1px solid #ffffff55;border-radius:12px;background:#ffffff1c;}
body.am-page-arena-modern .arena-modern-hero h1 {color:white;font-size:clamp(30px,3.7vw,46px);line-height:1.11;letter-spacing:-.035em;margin:35px 0 16px;font-weight:800;}
body.am-page-arena-modern .arena-modern-hero p {font-size:17px;color:#d9e5ff;line-height:1.65;margin:0;}
body.am-page-arena-modern .arena-modern-chips {display:flex;flex-wrap:wrap;gap:9px;margin-top:22px;}
body.am-page-arena-modern .arena-modern-chips span {background:#ffffff1c;border:1px solid #ffffff2c;padding:7px 11px;border-radius:100px;font-size:13px;}
body.am-page-arena-modern .arena-modern-hero small {color:#c9d8ff;font-size:12px;}
body.am-page-arena-modern .arena-modern-panel {min-width:0;padding:43px clamp(24px,4vw,54px);}
body.am-page-arena-modern .arena-modern-eyebrow {font-size:12px;font-weight:750;color:var(--arena-primary);letter-spacing:.09em;text-transform:uppercase;margin-bottom:7px;}
body.am-page-arena-modern .arena-modern-panel h2 {font-size:27px;letter-spacing:-.035em;line-height:1.2;margin:0 0 7px;color:var(--arena-ink);font-weight:750;}
body.am-page-arena-modern .arena-modern-subtitle {color:var(--arena-muted);margin:0 0 25px;font-size:14px;}
body.am-page-arena-modern .am-signup,body.am-page-arena-modern .am-form {width:100% !important;max-width:none !important;margin:0 !important;border:0 !important;box-shadow:none !important;background:transparent !important;padding:0 !important;}
body.am-page-arena-modern .am-form form {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:13px;row-gap:13px;min-width:0;}
body.am-page-arena-modern .am-form .am-row {min-width:0 !important;max-width:none !important;width:100% !important;display:block !important;padding:0 !important;margin:0 !important;background:none !important;border:0 !important;box-shadow:none !important;}
body.am-page-arena-modern .am-form .am-row > .am-element-title {width:100% !important;max-width:none !important;float:none !important;display:block !important;padding:0 !important;text-align:left !important;margin:0 0 5px !important;}
body.am-page-arena-modern .am-form .am-row > .am-element {width:100% !important;max-width:none !important;float:none !important;display:block !important;padding:0 !important;margin:0 !important;}
body.am-page-arena-modern .am-form label {font-size:12px;font-weight:700;color:#34435a;}
body.am-page-arena-modern .am-form .comment {font-size:11px;color:var(--arena-muted);margin:2px 0 5px;line-height:1.35;}
body.am-page-arena-modern .am-form input[type=text],body.am-page-arena-modern .am-form input[type=email],body.am-page-arena-modern .am-form input[type=password],body.am-page-arena-modern .am-form select {display:block;width:100% !important;max-width:none !important;min-width:0;min-height:43px;border:1px solid #d8e0eb !important;background:#f9fbfe !important;color:var(--arena-ink) !important;border-radius:9px !important;padding:10px 13px !important;box-shadow:none !important;font-size:14px;}
body.am-page-arena-modern .am-form input:focus-visible {outline:2px solid #79a0ff;outline-offset:1px;}
body.am-page-arena-modern #row-html1-0,body.am-page-arena-modern #row-product_id_page-0-0,body.am-page-arena-modern #row-name-0,body.am-page-arena-modern #row-email-0,body.am-page-arena-modern #row-login-0,body.am-page-arena-modern #row-_agreement-0,body.am-page-arena-modern #row-_i_agree-page-0-0-0,body.am-page-arena-modern #row-html2-0,body.am-page-arena-modern #row-buttons {grid-column:1 / -1;}
body.am-page-arena-modern #row-name-0 .am-element.group {display:grid !important;grid-template-columns:1fr 1fr;gap:13px;}
body.am-page-arena-modern .am-form .agreement {max-height:170px;overflow:auto;overflow-wrap:anywhere;border:1px solid var(--arena-line);border-radius:10px;padding:12px;font-size:12px;line-height:1.5;}
body.am-page-arena-modern .am-form input[type=checkbox] {width:17px;height:17px;vertical-align:middle;accent-color:var(--arena-primary);}
body.am-page-arena-modern .am-form input[type=submit] {width:100%;min-height:48px;background:var(--arena-primary) !important;border:0 !important;border-radius:11px !important;color:#fff !important;font-size:15px;font-weight:750;padding:12px 15px;cursor:pointer;box-shadow:0 9px 20px #2556e42c;}
body.am-page-arena-modern .am-login-text {font-size:13px;color:var(--arena-muted);margin:0 0 18px;}
body.am-page-arena-modern .am-signup a {color:var(--arena-primary);}
body.am-page-arena-modern .am-form .am-pass-indicator {max-width:100%;}
@media(max-width:770px){body.am-page-arena-modern .arena-modern-shell {margin:18px auto;display:block;}body.am-page-arena-modern .arena-modern-hero {padding:27px 26px;gap:0;}body.am-page-arena-modern .arena-modern-hero h1 {font-size:29px;margin:25px 0 11px;}body.am-page-arena-modern .arena-modern-hero p {font-size:14px;}body.am-page-arena-modern .arena-modern-hero small {display:none;}body.am-page-arena-modern .arena-modern-panel {padding:31px 25px;}}
@media(max-width:480px){body.am-page-arena-modern .am-form form {grid-template-columns:1fr;}body.am-page-arena-modern .am-form form > .am-row {grid-column:1/-1 !important;}body.am-page-arena-modern #row-name-0 .am-element.group {grid-template-columns:1fr;}}


/* ArenaItalia Modern v3: corrections after validation screenshots */
/* Keep this isolated to pages explicitly using signup-arena.phtml. */
body.am-page-arena-modern .am-form form.am-signup-form {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}
/* Full-row fields; password and confirmation remain side-by-side on desktop. */
body.am-page-arena-modern .am-form form > .am-row {
  grid-column: 1 / -1;
}
body.am-page-arena-modern .am-form form > #row-pass-0,
body.am-page-arena-modern .am-form form > #row-pass-confirm {
  grid-column: auto;
}
body.am-page-arena-modern #row-pass-0 input[type=password],
body.am-page-arena-modern #row-pass-confirm input[type=password],
body.am-page-arena-modern .am-form input[name="_email"],
body.am-page-arena-modern .am-form input[name="email_confirm"] {
  width: 100% !important;
  max-width: none !important;
}
/* Make input container groups and their nested controls respect grid sizing. */
body.am-page-arena-modern .am-form .am-element.group {
  min-width: 0 !important;
  max-width: none !important;
}
body.am-page-arena-modern #row-name-0 .am-element.group > input {
  width: 100% !important;
  min-width: 0 !important;
}
/* The form's HTML information block should be a quiet, compact plan summary. */
body.am-page-arena-modern .arena-plan-info {
  padding: 13px 15px;
  background: #f4f7fd;
  border: 1px solid #e2eaf6;
  border-radius: 12px;
  color: #30415c;
  font-size: 13px;
  line-height: 1.48;
}
body.am-page-arena-modern .arena-plan-info strong {display:block;margin-bottom:5px;color:#19346f;}
body.am-page-arena-modern .arena-plan-info p {margin:0;}
/* Preserve the product selection and validation, just reduce visual weight. */
body.am-page-arena-modern .am-form form > .am-row[id^="row-product_id_"] {
  padding: 2px 0 4px !important;
  font-size: 12px;
}
body.am-page-arena-modern .am-form form > .am-row[id^="row-product_id_"] .am-element-title {
  margin-bottom: 3px !important;
}
body.am-page-arena-modern .am-form form > .am-row[id^="row-product_id_"] label {
  font-size: 12px;
}
/* Validation must remain visible and adjacent to its field. */
body.am-page-arena-modern .am-form .error,
body.am-page-arena-modern .am-form .am-error {
  font-size: 12px;
  line-height: 1.35;
  margin-top: 4px;
}
/* Arrange checkbox before its consent label without changing form controls. */
body.am-page-arena-modern .am-form .am-row[id^="row-_i_agree-"] {
  display: flex !important;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 9px;
}
body.am-page-arena-modern .am-form .am-row[id^="row-_i_agree-"] > .am-element {
  order: -1;
  width: 18px !important;
  flex: 0 0 18px;
  margin: 1px 0 0 !important;
}
body.am-page-arena-modern .am-form .am-row[id^="row-_i_agree-"] > .am-element-title {
  width: auto !important;
  flex: 1 1 200px;
  margin: 0 !important;
}
body.am-page-arena-modern .am-form .am-row[id^="row-_i_agree-"] input[type=checkbox] {
  display: block;
  margin: 0 !important;
}  
  
/* ArenaItalia Modern — plan cards stacked vertically */

body.am-page-arena-modern .arena-modern-plan-comparison {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 30px;
    max-width: 390px;
}

body.am-page-arena-modern .arena-modern-plan-card {
    min-width: 0;
    padding: 22px 18px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 18px;
    background: rgba(255,255,255,.08);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

body.am-page-arena-modern .arena-modern-plan-card-premium {
    background: linear-gradient(180deg, rgba(72,118,255,.30), rgba(46,92,220,.24));
    border-color: rgba(255,255,255,.34);
    box-shadow: 0 10px 24px rgba(7, 20, 61, .18), inset 0 1px 0 rgba(255,255,255,.10);
}

body.am-page-arena-modern .arena-modern-plan-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}

body.am-page-arena-modern .arena-modern-plan-card-head strong {
    color: #fff;
    font-size: 29px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: -.03em;
}

body.am-page-arena-modern .arena-modern-plan-card-head span {
    color: #fff;
    font-size: 18px;
    line-height: 1.1;
    font-weight: 800;
    text-align: right;
    white-space: nowrap;
}

body.am-page-arena-modern .arena-modern-plan-card > p {
    color: #dbe7ff;
    font-size: 13px;
    line-height: 1.45;
    margin: 0 0 14px;
}

body.am-page-arena-modern .arena-modern-plan-card ul {
    margin: 0;
    padding-left: 18px;
    color: #fff;
    font-size: 14px;
    line-height: 1.5;
}

body.am-page-arena-modern .arena-modern-plan-card li {
    margin-bottom: 8px;
}

body.am-page-arena-modern .arena-modern-plan-card li:last-child {
    margin-bottom: 0;
}

/* ArenaItalia Modern — Typography */

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

body.am-page-arena-modern {
    font-family: 'Inter', sans-serif !important;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
}

body.am-page-arena-modern .arena-modern-hero h1 {
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    letter-spacing: -1.5px;
}

body.am-page-arena-modern .arena-modern-plan-card-head strong,
body.am-page-arena-modern .arena-modern-plan-card-head span {
    font-family: 'Inter', sans-serif;
    font-weight: 750;
    letter-spacing: -0.7px;
}

body.am-page-arena-modern .arena-modern-plan-card ul {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.7;
}

body.am-page-arena-modern .arena-modern-plan-card > p {
    font-size: 12px;
    line-height: 1.6;
}


/* ArenaItalia Modern - schede selezionabili */

body.am-page-arena-modern .arena-modern-plan-card {
    cursor: pointer;
    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}

body.am-page-arena-modern .arena-modern-plan-card:hover {
    border-color: rgba(255,255,255,.8);
    transform: translateY(-2px);
}

body.am-page-arena-modern
.arena-modern-plan-card.arena-plan-selected {
    border: 2px solid #ffffff;
    box-shadow: 0 0 0 3px rgba(255,255,255,.18);
}

body.am-page-arena-modern
.arena-modern-plan-card:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 4px;
}

body.am-page-arena-modern
.arena-modern-plan-card.arena-plan-selected::after {
    content: "✓ Selezionato";
    display: block;
    margin-top: 14px;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff;
}
