/* Frontend form styles to match the provided screenshot */
.emd-form { max-width: 800px; margin: 20px auto; padding: 16px; border: 1px solid #e5e7eb; border-radius: 8px; background:#fff; }
.emd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.emd-span-2 { grid-column: span 2 / span 2; }
.emd-field label { display:block; font-weight:600; margin-bottom:6px; }
.emd-field input { width:100%; padding:10px; border:1px solid #d1d5db; border-radius:6px; }
.emd-help { color:#6b7280; display:block; margin-top:4px; }
.emd-upload { border:2px dashed #d1d5db; border-radius:10px; padding:18px; margin:12px 0; text-align:center; }
.emd-upload input[type=file] { width:100%; }
.emd-upload-hint { font-size: 12px; color:#6b7280; margin-top:6px; }
.emd-card { background:#eaf7ea; border:1px solid #a7d7a7; border-radius:8px; padding:14px; margin:12px 0; }
.emd-card ul { margin:8px 0 0 18px; }
.emd-btn-primary { display:block; width:100%; background:#15803d; color:#fff; border:none; padding:12px 16px; border-radius:8px; font-size:16px; cursor:pointer; }
.emd-btn-primary:hover { background:#166534; }
@media(max-width:640px){
  .emd-grid { grid-template-columns: 1fr; }
  .emd-span-2 { grid-column: auto; }
}


/* --- Members Grid Styles (matches screenshot layout) --- */
.emd-members-grid{display:grid;gap:40px;margin:20px 0}
.emd-members-grid.columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.emd-members-grid.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.emd-members-grid.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.emd-member-card{position:relative;padding:16px 16px 16px 16px;border-radius:12px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.emd-badge{position:absolute;left:16px;top:-12px;background:#e9fff2;color:#2da86b;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:600;border:1px solid #c6f3da}
.emd-avatar{width:84px;height:84px;border-radius:50%;overflow:hidden}
.emd-avatar img{width:100%;height:100%;object-fit:cover}
.emd-info{margin-top:8px}
.emd-name{margin:4px 0;font-size:20px;font-weight:700}
.emd-role{color:#1f8e4d;font-weight:700;margin-bottom:8px}
.emd-phone,.emd-email{color:#555;margin-top:4px}
@media (max-width:768px){.emd-members-grid{grid-template-columns:1fr}}


/* Members container centered and 3 columns by default */
.emd-members-wrap{max-width:1100px;margin:0 auto;padding:20px}
.emd-members-grid{display:grid;gap:36px;margin:20px 0;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.emd-member-card{position:relative;padding:24px 20px;border-radius:12px;background:#fff;box-shadow:0 6px 18px rgba(16,46,45,0.06);min-height:180px;display:flex;gap:16px;align-items:center}
.emd-badge{position:absolute;left:16px;top:-14px;background:#e9fff2;color:#1e9a58;padding:8px 14px;border-radius:18px;font-size:13px;font-weight:700;border:1px solid #dff6e8}
.emd-avatar{width:84px;height:84px;border-radius:50%;overflow:hidden;flex:0 0 84px;box-shadow:0 4px 12px rgba(0,0,0,0.06)}
.emd-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.emd-info{margin-top:0}
.emd-name{margin:0;font-size:20px;font-weight:700;color:#202b2b}
.emd-role{color:#1aa054;font-weight:700;margin-top:4px}
.emd-phone,.emd-email{color:#6b6b6b;margin-top:10px;font-size:14px}
/* responsive */
@media (max-width:980px){.emd-members-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.emd-members-grid{grid-template-columns:repeat(1,minmax(0,1fr))}.emd-member-card{flex-direction:row;align-items:flex-start}}


/* --- Frontend members_display styles (screenshot-like) --- */
.emd-members-wrap.emd-members-display{max-width:1100px;margin:0 auto;padding:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.emd-member-card--front{background:#ffffff;border-radius:12px;padding:18px 16px;box-shadow:0 8px 24px rgba(34,60,80,0.06);position:relative;overflow:visible;min-height:140px}
.emd-member-inner{display:flex;gap:16px;align-items:center}
.emd-avatar{width:88px;height:88px;border-radius:50%;overflow:hidden;flex:0 0 88px;border:4px solid #f6f9f7;box-shadow:0 6px 18px rgba(16,46,45,0.06)}
.emd-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.emd-avatar-placeholder{width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#eef7f0;color:#1f8e4d;font-weight:700;font-size:32px}
.emd-name{margin:0;font-size:18px;font-weight:800;color:#1f2a2a}
.emd-role{margin-top:6px;color:#1aa054;font-weight:700;font-size:13px}
.emd-contact{margin-top:8px;display:flex;flex-direction:column;}
.emd-phone,.emd-email{font-size:14px;color:#6b6b6b}
.emd-badge{position:absolute;left:18px;top:-12px;background:#e9fff2;color:#107a3f;padding:7px 12px;border-radius:20px;font-weight:800;font-size:12px;border:1px solid #dff6e8}
.emd-no-members{color:#666;text-align:center;padding:20px}

/* responsive columns */
@media (max-width:980px){.emd-members-wrap.emd-members-display{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.emd-members-wrap.emd-members-display{grid-template-columns:repeat(1,1fr)}}