/* Modulo soci del gestionale: elenco, scheda, nuovo/modifica, importazione, privacy (e la conferma nell'app). */
.gx .sf-back { margin: 0 0 6px !important; font-size: 14px }
.gx .sf-back a { color: var(--ink-3); font-weight: 600 }
.gx .sf-more { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 6px }
.gx .sf-more summary { cursor: pointer; color: var(--ink-2); font-weight: 600; padding: 10px 0; min-height: 44px; display: flex; align-items: center }
.gx .sf-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 22px }
@media (max-width: 899px) { .gx .sf-actions .btn { flex: 1 } }

/* list: the wall of «Associati» (viste/app/soci.php; chips in app-base.css, the cards in app-tessera.css) */
.gx .sl-actions { display: flex; gap: 10px; flex-wrap: wrap }
.gx .sl-actions .btn svg { margin-left: -4px }
.gx .db-find { position: relative; display: flex; align-items: center }
.gx .db-find svg { position: absolute; left: 12px; color: var(--ink-3); pointer-events: none }
.gx .db-find input { padding-left: 38px }
.gx .sl-find { display: flex; gap: 10px 14px; align-items: center; flex-wrap: wrap; margin: 0 }
.gx .sl-find .db-find { flex: 0 1 22rem; min-width: 0 }
.gx .sl-find .db-find input { width: 100% }
.gx .sl-find .sl-chips { width: 100% }
.gx .sl-empty { display: grid; justify-items: center; gap: 4px }
.gx .sl-empty h2 { margin: 0; color: var(--ink) }
.gx .sl-empty .sl-actions { justify-content: center; margin-top: 12px }
@media (max-width: 47.99rem) {
  .gx .sl-actions { width: 100% } .gx .sl-actions .btn { flex: 1 }
  .gx .sl-find .db-find { flex: 1 1 100% }
}

/* member */
.gx .sc-head { align-items: center }
.gx .sc-id { display: flex; align-items: center; gap: 14px }
.gx .sc-avatar { width: 52px; height: 52px; font-size: 18px }
.gx .sc-contacts { display: flex; gap: 6px 16px; flex-wrap: wrap; margin: 4px 0 0 !important }
.gx .sc-contacts a { color: var(--ink-2) }
.gx .sc-noemail { color: var(--warn); font-weight: 600 }
.gx .sc-actions { display: flex; gap: 8px; flex-wrap: wrap }
.gx .sc-cols { margin-top: 16px }
.gx .sc-cols > .card + .card { margin-top: 0 }
.gx .sc-data b { font-weight: 600 }
.gx .sc-note { margin: 14px 0 0; padding: 12px 14px; border-radius: 10px; background: var(--bg); color: var(--ink-2); font-size: 14px; white-space: normal }
@media (max-width: 899px) { .gx .sc-actions { width: 100% } .gx .sc-actions > form, .gx .sc-actions > .btn { flex: 1 } .gx .sc-actions .btn { width: 100% } }

/* import */
.gx .im-drop { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 44px 20px; text-align: center; border-style: dashed; border-width: 2px }
.gx .im-drop svg { color: var(--ink-3) }
.gx .im-drop label.btn { margin: 0; cursor: pointer; color: var(--brand-on-primary) }
.gx .im-drop p { margin: 0 }
.gx .im-sum { display: grid; gap: 16px }
.gx .im-file b { display: block; font-size: 16px; word-break: break-all }
.gx .im-file small { color: var(--ink-3) }
.gx .im-counts { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; flex-wrap: wrap }
.gx .im-counts li { min-width: 120px; padding: 12px 14px; border-radius: 12px; background: var(--bg); display: flex; flex-direction: column }
.gx .im-counts b { font: 700 25.6px/1 var(--font) }
.gx .im-counts span { color: var(--ink-3); font-size: 13.5px }
.gx .im-counts .is-new { background: var(--ok-soft) } .gx .im-counts .is-new b { color: var(--ok) }
.gx .im-counts .is-warn { background: var(--warn-soft) } .gx .im-counts .is-warn b { color: var(--warn) }
.gx .im-go { display: flex; gap: 10px; flex-wrap: wrap }
.gx .im-note { margin: 0; font-size: 14px }
.gx .im-table tr.is-off { opacity: .55 }
.gx .im-warn { display: block; color: var(--warn); font-size: 13px; font-weight: 500 }
.gx .im-table td:first-child { color: var(--ink-3); width: 60px }
@media (max-width: 899px) { .gx .im-go .btn { flex: 1 } }

/* privacy, the owner */
.gx .pv-stats { display: flex; align-items: center; gap: 16px; margin-bottom: 16px }
.gx .pv-stats b { display: block; font-size: 16px }
.gx .pv-stats small { color: var(--ink-3) }
.pv-pop { max-height: 86vh; overflow-y: auto }
.pv-text h3 { font-size: 15px; margin: 16px 0 4px }
.pv-text p { margin: 0 0 8px; line-height: 1.55 }
.pv-text .pv-ver { color: var(--ink-3, #6b7480); font-size: 13px; margin-top: 14px }

/* privacy, the member (dark door) */
.ma .pv-lead { margin: 0; color: #d9dbe6; font-size: 15px; line-height: 1.5 }
.ma .pv-read { padding: 4px 0; color: var(--acc); font-weight: 700 }
.ma .pv-check { display: flex; align-items: flex-start; gap: 12px; margin: 0; padding: 14px 16px; border-radius: 14px; background: rgba(28,31,43,.92); border: 1.5px solid var(--riga);
  color: var(--testo); font: 500 15px/1.35 'Archivo', sans-serif; cursor: pointer }
.ma .pv-check.is-main { border-color: var(--acc) }
.ma .pv-check input { width: 22px; height: 22px; margin: 0; flex: none; accent-color: var(--acc) }
.ma .pv-check small { display: block; color: var(--tenue); font-size: 13px; margin-top: 2px }
.ma .pv-pop .pv-text h3 { color: var(--testo) }
.ma .pv-pop .pv-text p { color: #d9dbe6 }

/* the complete record: required fields first, the rest in sections that open on request */
.gx .sf-main { margin-bottom: 4px }
.gx .sf-hint { margin: 18px 0 8px; color: var(--ink-3); font-size: 14px }
.gx .sf-sec { border: 1px solid var(--line); border-radius: 12px; margin-top: 10px; background: #fff }
.gx .sf-sec > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 0 16px; cursor: pointer; font-weight: 600; color: var(--ink); list-style: none }
.gx .sf-sec > summary::-webkit-details-marker { display: none }
.gx .sf-sec > summary::after { content: '+'; font: 400 22px/1 var(--font); color: var(--ink-3); margin-left: 8px }
.gx .sf-sec[open] > summary::after { content: '−' }
.gx .sf-sec > summary small { margin-left: auto; color: var(--ink-3); font-weight: 500; font-size: 13px }
.gx .sf-sec.is-filled > summary small { color: var(--ok) }
.gx .sf-sec > .form-grid { padding: 0 16px 16px; border-top: 1px solid var(--line) }
.gx .sf-sec .form-grid > div { margin-top: 12px }
.gx .sf-cf { margin: 6px 0 0; font-size: 13px; color: var(--ink-3) }
.gx .sf-cf[data-stato=ok] { color: var(--ok) }
.gx .sf-cf[data-stato=ko] { color: var(--ko) }
.gx .sf-note { margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--warn-soft); color: var(--warn); font-weight: 600; font-size: 14px }
.gx .sf-sec textarea { width: 100% }

/* «Invia l'app» from the member page */
.gx .sc-app .sc-app-act { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 10px }
.gx .sc-app .sc-app-act .btn { display: inline-flex; align-items: center; gap: 8px }
.gx .sc-app .sc-app-wa { background: #128C4B; border-color: #128C4B; color: #fff }
.gx .sc-app .sc-app-msg { width: 100%; box-sizing: border-box; font: inherit; font-size: .88rem; line-height: 1.45; color: var(--ink-2); background: var(--bg); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; resize: none }
@media (max-width: 560px) { .gx .sc-app .sc-app-act .btn { flex: 1 1 100%; justify-content: center } }
/* the manual entry with more than one subscription: the select beside the button, on one row when it fits */
.gx .sc-ingresso { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 0 }
.gx .sc-ingresso select { min-height: 44px; max-width: min(360px, 100%) }