
/* admin_upload_file.css 
 Estratto e consolidato da admin_upload_file.php 
 Autore: generato da M365 Copilot 
 Data: 2025-10-03 
*/ 
/* Reset & basi */ 
*, *::before, *::after { box-sizing: border-box; } 
html, body { max-width:100%; overflow-x:hidden; } 
body{ 
 font-family: system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif; 
 line-height:1.45; 
 margin:0; 
 background:#f5f7fb; 
 color:#0f172a; 
} 
/* Layout */ 
header{ background:#5e86c1; color:#fff; padding:1rem 1.25rem; border-bottom: 4px solid #808080;} 
header h1{ font-size:1.25rem; margin:0 } 
header .who{ opacity:.95; font-size:.95rem; margin-top:.25rem } 
.topbar{ display:flex; justify-content:space-between; align-items:center; gap:1rem; position:relative; z-index:1 } 

/* Header navigation buttons */ 
.header-actions{ display:flex; gap:.5rem; align-items:center } 
.nav-btn{ 
 display:inline-flex; align-items:center; gap:.35rem; 
 background:#334155; color:#fff; border:0; border-radius:8px; 
 padding:.5rem .9rem; text-decoration:none; font-weight:600; 
 transition:background .2s ease; 
} 
.nav-btn:hover{ background:#1f2937 } 
.nav-btn:focus{ outline:3px solid rgba(51,65,85,.35); outline-offset:2px } 
main{ max-width:860px; margin:1.25rem auto; padding:0 1rem } 
.grid{ display:grid; grid-template-columns:1fr; gap:1rem } 
/* Card */ 
.card, .card-upload{ 
 border:1px solid #808080; 
 border-radius:12px; 
 box-shadow:0 4px 16px rgba(0,0,0,.06); 
 padding:1rem; 
 overflow:hidden; 
 background:#fff; 
} 
.card-upload{ 
 background:#f3f4f6; 
 border-color:#f3f4f6; 
 border:1px solid #808080; 
} 
/* Tipografia */ 
h1{ font-size:1.25rem; margin:.25rem 0 1rem } 
h2{ font-size:1.1rem; margin:.2rem 0 .8rem } 
label{ display:block; margin:.6rem 0 .3rem } 
a{ color:#0ea5e9; text-decoration:none } 
/* Form */ 
input[type=text], input[type=password], input[type=file]{ 
 display:block; width:100%; max-width:100%; 
 padding:.6rem .7rem; border:1px solid #cbd5e1; border-radius:8px; background:#fff; 
} 
button{ 
 margin-top:.9rem; background:#5e86c1; color:#fff; border:0; border-radius:8px; 
 padding:.6rem 1rem; cursor:pointer; width:100%; 
} 

.button-elimina{ 
 background-color:#5e86c1; color:#fff; border:0; border-radius:8px; padding:0.3rem 1rem; margin-left:20px; font-size: 0.75rem; cursor:pointer; width: fit-content;
}
.button-elimina:hover{ background:#fa3c4c} 

.button-modifica {
 background-color:#4CAF50; color:#fff; border:0; border-radius:8px; padding:0.3rem 1rem; margin-left:20px; font-size: 0.75rem; cursor:pointer; width: fit-content;
}
.button-modifica:hover {background-color: #388E3C;}

.button-upload{ 
 margin-top:.9rem; background:#5f9ea0; color:#fff; border:0; border-radius:8px; padding:.6rem 1rem; cursor:pointer;
} 

.azioni-socio {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.3rem;
    width: 100%;
    border: 1px solid black;
    background-color: #f0f0f0;
    border-radius: 8px;
    padding: 0.5rem;
}

/* Messaggi */ 
.msg{ margin:.6rem 0; padding:.6rem .8rem; border-radius:8px; overflow-wrap:anywhere } 
.ok{ background:#dcfce7; border:1px solid #bbf7d0; color:#14532d } 
.err, .error{ background:#fee2e2; border:1px solid #fecaca; color:#991b1b } 
/* Varie */ 
.muted{ color:#475569; font-size:.9rem; overflow-wrap:anywhere } 
.foot{ margin-top:1rem } 
code.kbd{ background:#f1f5f9; border:1px solid #e2e8f0; padding:.1rem .3rem; border-radius:6px; word-break: break-all } 
/* Pulsante Logout */ 
.logout-btn{ 
 display:inline-flex; align-items:center; gap:.5rem; 
 background:#ef4444 !important; color:#fff !important; border:0; border-radius:8px; 
 padding:.5rem 1rem; text-decoration:none; font-weight:600; 
 transition:background .2s ease; cursor:pointer; 
 box-shadow:0 1px 2px rgba(0,0,0,.15); position:relative; z-index:2; 
} 
.logout-btn:hover{ background:#dc2626 !important } 
.logout-btn:focus{ outline:3px solid rgba(239,68,68,.35); outline-offset:2px } 
.logout-ico{ width:16px; height:16px; display:inline-block } 
/* Debug */ 
.debug{ 
 margin:.5rem 1rem 0; background:#fff5f5; color:#8b0000; 
 border:1px solid #f2b8b5; border-radius:8px; padding:.4rem .6rem; font-size:.85rem 
} 
/* Login page helper (opzionale): se aggiungi class="login" al <body> della pagina di login */ 
body.login .card{ max-width:520px; margin:0 auto; padding:1.25rem }


/* --- OVERRIDE: allineamento header + nav più chiari + bordo card-upload nero + bottone Carica verde (2025-10-03) --- */
/* Allineamento verticale tra link e pulsante Logout */
.header-actions{ display:flex; align-items:center; gap:.6rem }
.header-actions form{ margin:0; display:flex; align-items:center }

/* Stessa altezza/padding per nav e logout */
.header-actions .nav-btn, .header-actions .logout-btn{
  height:38px; padding:0 .9rem; line-height:1; display:inline-flex; align-items:center;
  border-radius:8px; font-weight:600;
}

/* Nav più chiari */
.header-actions .nav-btn{ background:#696969 !important; color:#fff !important; } /* slate-500 */
.header-actions .nav-btn:hover{ background:#2F4F4F !important } /* slate-600 */
.header-actions .nav-btn:focus{ outline:3px solid rgba(100,116,139,.35); outline-offset:2px }

/* Riquadro upload: bordo nero sottile */
.card-upload{ border:1px solid #000 !important; background:#f3f4f6; }

/* Bottone "Carica" verde con hover/focus */
.button-upload{
  background:#5f9ea0 !important; /* verde */
  color:#fff !important;
}
.button-upload:hover{ background:#15803d !important }
.button-upload:focus{ outline:3px solid rgba(22,163,74,.35); outline-offset:2px }


/* Compattazione elenco soci */
.card ul.elenco-soci li { font-size: 0.85rem; line-height: 1.2; }
.card ul.elenco-soci li strong { font-size: 0.9rem; }
.card ul.elenco-soci form button.button-elimina { font-size: 0.75rem; padding: 0.3rem 0.6rem; width: auto; margin-left: 1rem; }

.card.elenco-soci li {
    background-color: #f0f0f0;      /* grigio chiaro */
    border: 1px solid #cc0000;      /* bordo rosso sottile */
    padding: 8px;                   /* spazio interno */
    margin-bottom: 6px;             /* spazio tra gli elementi */
    border-radius: 4px;             /* angoli leggermente arrotondati */
}


.card ul.elenco-soci li div:last-child {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}
