:root {
  --green: #0f5b2f;
  --green-dark: #07391f;
  --green-soft: #e9f6ef;
  --gray: #5f6b7a;
  --bg: #f5f7fb;
  --card: #ffffff;
  --danger: #b42318;
  --border: #e5e7eb;
  --field-border: #667b70;
  --field-focus: #08713b;
  --field-focus-ring: rgba(8, 113, 59, .24);
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, system-ui, -apple-system, Segoe UI, sans-serif; background: var(--bg); color: #17202a; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 280px 1fr; }
.sidebar { background: linear-gradient(180deg, var(--green-dark), var(--green)); color: white; padding: 22px; display: flex; flex-direction: column; gap: 24px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand-mark { width: 48px; height: 48px; border-radius: 16px; background: white; color: var(--green); display: grid; place-items: center; font-weight: 900; }
.brand span { display: block; opacity: .8; font-size: 13px; margin-top: 4px; }
.nav { display: grid; gap: 10px; }
.nav button, .sidebar button { border: 0; border-radius: 12px; padding: 12px 14px; background: rgba(255,255,255,.12); color: white; text-align: left; cursor: pointer; font-weight: 700; }
.nav button.active, .nav button:hover { background: white; color: var(--green); }
.socket-card { margin-top: auto; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); padding: 14px; border-radius: 16px; }
.socket-card small { opacity: .8; display: block; }
.socket-card button { margin-top:10px; width:100%; color:var(--green-dark); text-align:center; }
.wa-session-modal { position:fixed; z-index:3500; inset:0; display:grid; place-items:center; padding:16px; background:rgba(7,25,16,.68); }
.wa-session-card { width:min(540px,100%); max-height:94vh; overflow:auto; padding:22px; border:1px solid #79a78a; border-radius:24px; background:linear-gradient(180deg,#fff,#f4f9f6); box-shadow:0 30px 100px rgba(0,0,0,.48); animation:detail-modal-in .2s ease-out; }
.wa-session-card header { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; }
.wa-session-card h2 { margin:0 0 5px; color:var(--green-dark); }
.wa-session-card .dialog-close { flex:0 0 44px; color:var(--green-dark); border-color:#789487; }
.wa-session-state { margin:16px 0; padding:13px; border-radius:10px; background:#edf5f0; text-align:center; }
.wa-qr { display:block; width:min(320px,100%); margin:10px auto; border:3px solid var(--green); border-radius:12px; }
.wa-session-card > p { text-align:center; }
.main { padding: 28px; }
.hidden { display: none !important; }
.login-card { max-width: 460px; margin: 80px auto; background: var(--card); padding: 32px; border-radius: 24px; box-shadow: 0 20px 60px rgba(0,0,0,.08); }
h1 { margin: 0 0 6px; } p { color: var(--gray); margin-top: 0; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 22px; }
button, input, select, textarea { font: inherit; }
button { border: 1px solid var(--border); background: white; padding: 10px 14px; border-radius: 12px; cursor: pointer; font-weight: 700; }
button.primary { background: var(--green); color: white; border-color: var(--green); }
.form-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; align-items: end; }
.form-grid.one { grid-template-columns: 1fr; }
label { display: grid; gap: 6px; font-size: 13px; font-weight: 700; color: #344054; }
input, select, textarea { border: 2px solid var(--field-border); border-radius: 12px; padding: 11px 12px; background: white; color: #111b16; min-width: 0; transition: border-color .15s ease, box-shadow .15s ease, outline-color .15s ease; }
input:hover, select:hover, textarea:hover { border-color: #385c49; }
input:focus, select:focus, textarea:focus,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  border-color: var(--field-focus);
  outline: 3px solid var(--field-focus-ring);
  outline-offset: 1px;
  box-shadow: 0 0 0 1px var(--field-focus), 0 4px 12px rgba(7, 57, 31, .12);
}
input:disabled, select:disabled, textarea:disabled { border-color: #aebbb4; background: #edf1ef; color: #66736c; cursor: not-allowed; }
input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; padding: 0; border: 2px solid var(--field-border); accent-color: var(--green); box-shadow: none; }
.panel { background: white; border: 1px solid var(--border); border-radius: 18px; padding: 16px; margin-bottom: 18px; }
.cards { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 16px; }
.card { background: white; border: 1px solid var(--border); padding: 18px; border-radius: 18px; box-shadow: 0 10px 24px rgba(16,24,40,.05); }
.card span { color: var(--gray); font-size: 13px; }
.card strong { display: block; font-size: 30px; margin-top: 8px; }
.toolbar, .action-grid { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 16px; }
.toolbar input { min-width: 280px; }
.check { display: flex; align-items: center; grid-auto-flow: column; gap: 8px; }
.table-wrap { overflow: auto; background: white; border: 1px solid var(--border); border-radius: 18px; }
table { width: 100%; border-collapse: collapse; min-width: 860px; }
th, td { padding: 13px 14px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: top; }
th { font-size: 12px; text-transform: uppercase; color: var(--gray); background: #fafafa; }
.badge { display: inline-flex; padding: 5px 9px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.badge.ok { color: #05603a; background: #d1fadf; }
.badge.pending { color: #93370d; background: #fef0c7; }
.preview { background: #101828; color: #e7eef8; padding: 18px; border-radius: 18px; overflow: auto; min-height: 300px; white-space: pre-wrap; }
.toast { position: fixed; z-index: 3000; right: 22px; bottom: 22px; background: #101828; color: white; padding: 14px 16px; border-radius: 14px; box-shadow: 0 18px 40px rgba(0,0,0,.2); }
@media (max-width: 920px) { .app-shell { grid-template-columns: 1fr; } .sidebar { position: static; } .cards { grid-template-columns: repeat(2, 1fr); } .form-grid { grid-template-columns: 1fr; } }
.small-panel { padding: 12px; }
th[data-sort] { cursor: pointer; user-select: none; }
th[data-sort]::after { content: ' ↕'; opacity: .45; }
.badge.neutral { color: #344054; background: #eef2f6; }
.row-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.row-actions button { padding: 7px 9px; font-size: 12px; }
.import-grid { display: grid; grid-template-columns: 1.5fr auto 1.5fr auto; gap: 12px; align-items: end; }
.mini-preview { grid-column: 1 / -1; background: #f8fafc; border: 1px solid var(--border); border-radius: 12px; padding: 12px; max-height: 180px; overflow: auto; white-space: pre-wrap; }
.table-wrap table th, .table-wrap table td { min-width: 110px; }
@media (max-width: 920px) { .import-grid { grid-template-columns: 1fr; } .toolbar input { min-width: 100%; } }
.section-title { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 12px; }
.section-title h2 { margin: 0 0 4px; }
.safety-note { background: var(--green-soft); border-color: #b7e4c7; }
.safety-note p { margin: 6px 0; }

.wa-btn { background: #25d366; color: #0b2d17; border-color: #25d366; white-space: nowrap; }
.wa-btn:hover { filter: brightness(.95); }
.member-wa-actions { display:grid; gap:6px; min-width:92px; }
.member-wa-actions .wa-btn { width:100%; padding:8px 10px; }
.wa-btn-fidelization { background:#dcf8e6; border-color:#25a55b; color:#075b34; }
.signature-box { grid-column: 1 / -1; display: grid; gap: 8px; }
.signature-box canvas { width: 100%; max-width: 640px; height: 170px; background: #fff; border: 1px dashed var(--green); border-radius: 12px; touch-action: none; }
.full-row { grid-column: 1 / -1; }
.affiliation-form { display: grid; gap: 18px; max-width: 1100px; }
.fidelization-notice { padding: 14px 16px; border: 2px solid #d59a16; border-radius: 12px; background: #fff7d6; color: #503800; font-weight: 800; }
.fidelize-btn { background: #f4b400; color: #2b2100; border-color: #c58e00; }
.dialog-open { overflow: hidden; }
.nested-detail-dialog {
  position: fixed;
  z-index: 2200;
  inset: 3vh 2vw;
  margin: 0;
  padding: 0 18px 20px;
  overflow: auto;
  background: linear-gradient(180deg,#f9fcfa,#f2f7f4);
  border: 1px solid #7aa98b;
  border-radius: 24px;
  box-shadow: 0 30px 100px rgba(0, 25, 12, .48);
  animation:detail-modal-in .2s ease-out;
}
.nested-detail-dialog::before {
  content: '';
  position: fixed;
  z-index: -1;
  inset: 0;
  background: rgba(7, 25, 16, .62);
}
.nested-detail-header {
  position: sticky;
  z-index: 8;
  top: 0;
  margin: 0 -18px 16px;
  padding: 15px 18px;
  color: #fff;
  background: linear-gradient(135deg, var(--green-dark), var(--green));
  border-radius: 23px 23px 0 0;
  box-shadow:0 5px 16px rgba(7,57,31,.18);
}
.nested-detail-header h2 { color: #fff; }
.nested-detail-header p { margin: 3px 0 0; color: rgba(255,255,255,.82); }
.nested-detail-header .dialog-close { border-color: rgba(255,255,255,.55); color:#fff; }
@keyframes detail-modal-in { from { opacity:0; transform:translateY(12px) scale(.99); } }
.create-record-form {
  position:fixed;
  z-index:4200;
  top:4vh;
  left:50%;
  width:min(1120px,calc(100vw - 40px));
  max-height:92vh;
  margin:0;
  padding:0 24px 26px;
  overflow:auto;
  align-content:start;
  background:linear-gradient(180deg,#f9fcfa 0%,#f3f8f5 100%);
  border:1px solid #86ad95;
  border-radius:24px;
  box-shadow:0 32px 110px rgba(0,25,12,.5),0 0 0 1px rgba(255,255,255,.65) inset;
  transform:translateX(-50%);
  isolation:isolate;
  animation:record-modal-in .2s ease-out;
}
.create-record-form--compact { width:min(680px,calc(100vw - 40px)); }
.create-record-form::before { content:''; position:fixed; z-index:-1; inset:0; background:rgba(3,18,10,.72); backdrop-filter:blur(3px); }
.create-form-header { position:sticky; z-index:5; top:0; display:flex; justify-content:space-between; align-items:center; gap:16px; margin:0 -24px 22px; padding:17px 22px; color:#fff; background:linear-gradient(120deg,#062f1a 0%,#0b5e32 72%,#148349 100%); border-radius:23px 23px 0 0; box-shadow:0 5px 16px rgba(7,57,31,.18); }
.create-form-heading { display:flex; align-items:center; gap:13px; min-width:0; }
.create-form-icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.45); border-radius:13px; background:rgba(255,255,255,.13); font-size:25px; font-weight:400; }
.create-form-header h2 { margin:0 0 3px; color:#fff; font-size:21px; line-height:1.2; }
.create-form-header p { margin:0; color:rgba(255,255,255,.82); }
.create-form-header .dialog-close { color:#fff; border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.1); transition:background .15s ease,transform .15s ease; }
.create-form-header .dialog-close:hover { background:rgba(255,255,255,.22); transform:rotate(4deg); }
.create-record-form > label { min-height:84px; padding:11px 12px; border:1px solid #d0ded5; border-radius:13px; background:#fff; box-shadow:0 2px 8px rgba(10,55,31,.045); }
.create-record-form > label:focus-within { border-color:#69a47e; background:#fbfffc; box-shadow:0 0 0 3px rgba(8,113,59,.1); }
.create-record-form > label.check { min-height:58px; align-self:stretch; justify-content:flex-start; padding:15px; }
.create-record-form > button[type="submit"],.create-record-form > button.primary:last-child { grid-column:1/-1; min-height:50px; margin-top:6px; font-size:16px; box-shadow:0 8px 18px rgba(15,91,47,.2); }
.create-record-form .college-coverage-summary { margin-bottom:2px; }
@keyframes record-modal-in { from { opacity:0; transform:translate(-50%,14px) scale(.985); } to { opacity:1; transform:translate(-50%,0) scale(1); } }
.direction-members-dialog {
  position: fixed;
  z-index: 2000;
  inset: 3vh 2vw;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  background: #f7faf8;
  border: 1px solid #7aa98b;
  border-radius: 24px;
  box-shadow: 0 28px 90px rgba(0, 25, 12, .35);
  overflow: hidden;
  animation:detail-modal-in .2s ease-out;
}
.direction-members-dialog::before { content: ''; position: fixed; z-index: -1; inset: 0; background: rgba(7, 25, 16, .58); }
.direction-members-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; color: #fff; background: linear-gradient(135deg, var(--green-dark), var(--green)); }
.direction-members-header h2 { margin: 0 0 3px; font-size: 22px; }
.direction-members-header p { margin: 0; color: rgba(255,255,255,.82); }
.dialog-close { width: 46px; height: 46px; padding: 0; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; background: rgba(255,255,255,.14); color: #fff; font-size: 30px; line-height: 1; }
.direction-members-filters { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; padding: 14px 18px; border-bottom: 1px solid #cbd8d0; background: #fff; }
.direction-members-filters label { min-width: 175px; }
.direction-members-filters .check { min-width: auto; min-height: 43px; }
.direction-members-table-wrap { margin: 14px 18px 18px; border-radius: 12px; overflow: auto; }
.direction-members-table-wrap thead { position: sticky; top: 0; z-index: 2; }
.direction-members-table-wrap th { background: #e9f2ed; color: #193426; }
.form-section { margin: 0; padding: 18px; border: 2px solid #b7d7c4; border-radius: 16px; background: #fbfffc; }
.form-section legend { padding: 0 10px; color: var(--green-dark); font-size: 18px; font-weight: 900; }
.affiliation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.affiliation-grid .wide { grid-column: 1 / -1; }
.affiliation-form label { color: #172b21; font-size: 14px; font-weight: 800; }
.affiliation-form input, .affiliation-form select {
  min-height: 48px;
  border: 2px solid #71867a;
  border-radius: 10px;
  background: #fff;
  color: #111b16;
  font-size: 16px;
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .08);
}
.affiliation-form input:focus, .affiliation-form select:focus {
  outline: 3px solid rgba(15, 91, 47, .22);
  border-color: var(--green);
}
.birth-fields { display: grid; grid-template-columns: 1fr 1.4fr 1.2fr; gap: 12px; }
.optional-fields { border: 2px solid #90bda1; border-radius: 16px; overflow: hidden; background: #f3faf6; }
.optional-fields summary { padding: 16px 18px; color: #fff; background: var(--green); cursor: pointer; font-size: 17px; font-weight: 900; list-style-position: inside; }
.optional-fields summary span { float: right; font-size: 13px; font-weight: 600; opacity: .9; }
.optional-content { padding: 18px; }
.check-card { min-height: 50px; padding: 12px; display: flex !important; flex-direction: row; align-items: center; gap: 10px; border: 2px solid #71867a; border-radius: 10px; background: #fff; }
.check-card input { min-height: 22px; width: 22px; margin: 0; box-shadow: none; accent-color: var(--green); }
@media (max-width: 600px) {
  .main { padding: 14px 10px; }
  .topbar { margin-bottom: 12px; }
  .topbar h1 { font-size: 24px; }
  .affiliation-form { padding: 10px; gap: 14px; border-radius: 12px; }
  .form-section { padding: 14px 10px; border-radius: 12px; }
  .form-section legend { font-size: 17px; }
  .affiliation-grid { grid-template-columns: 1fr; gap: 13px; }
  .affiliation-grid .wide { grid-column: auto; }
  .birth-fields { grid-template-columns: 1fr 1.25fr 1.1fr !important; gap: 7px; }
  .birth-fields label { font-size: 12px; }
  .birth-fields input, .birth-fields select { padding: 10px 7px; }
  .optional-fields summary span { display: none; }
  .optional-content { padding: 12px 10px; }
  .signature-box canvas { height: 145px; }
  .affiliation-form .row-actions.full-row { display: grid; grid-template-columns: 1fr; }
  .affiliation-form .row-actions.full-row button { width: 100%; min-height: 48px; font-size: 15px; }
  .direction-members-dialog { inset: 0; border: 0; border-radius: 0; }
  .nested-detail-dialog { inset: 0; padding: 0 10px 14px; border: 0; border-radius: 0; }
  .nested-detail-header { margin: 0 -10px 12px; padding: 12px 10px; border-radius: 0; }
  .nested-detail-header h2 { font-size: 18px; }
  .nested-detail-header p { font-size: 12px; }
  .create-record-form,.create-record-form--compact { top:0; left:0; width:100%; max-height:100dvh; min-height:100dvh; padding:0 10px 20px; border:0; border-radius:0; transform:none; animation:record-modal-mobile-in .18s ease-out; }
  .create-form-header { margin:0 -10px 14px; padding:12px 10px; border-radius:0; }
  .create-form-icon { width:38px; height:38px; flex-basis:38px; border-radius:11px; }
  .create-form-header h2 { font-size:18px; }
  .create-form-header p { font-size:12px; }
  .create-record-form > label { min-height:78px; }
  @keyframes record-modal-mobile-in { from { opacity:0; transform:translateY(18px); } }
  .direction-members-header { padding: 13px 12px; }
  .direction-members-header h2 { font-size: 18px; }
  .direction-members-header p { font-size: 12px; }
  .dialog-close { width: 42px; height: 42px; flex: 0 0 42px; }
  .direction-members-filters { padding: 10px; display: grid; grid-template-columns: 1fr 1fr; }
  .direction-members-filters label { min-width: 0; }
  .direction-members-filters button { min-height: 44px; }
  .direction-members-table-wrap { margin: 8px; }
}
@media print { .sidebar, .topbar, .toolbar, .row-actions, .toast { display: none !important; } }
.electoral-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; position:sticky; top:8px; z-index:10; }
.electoral-tabs button.active { background:var(--green); color:#fff; }
.electoral-tab { animation: electoral-in .18s ease-out; }
.electoral-alert { display:inline-block; padding:5px 9px; border-radius:999px; background:#ffe1df; color:#9f2017; font-weight:900; }
.electoral-ok { display:inline-block; padding:5px 9px; border-radius:999px; background:#d9f4e3; color:#075b34; font-weight:900; }
.electoral-team-list { display:grid; gap:5px; margin-top:8px; padding-top:7px; border-top:1px solid #cbd8d0; }
.electoral-team-list button { padding:3px 7px; font-size:11px; }
.electoral-matrix-panel { margin-top:18px; border:2px solid #7aa98b; }
.electoral-matrix-wrap { max-height:72vh; border-radius:10px; }
.electoral-matrix-wrap table { min-width:1250px; }
.electoral-matrix-wrap thead { position:sticky; top:0; z-index:3; }
.electoral-matrix-wrap th { text-align:center; color:#fff; background:#075b34; border-color:#397b58; }
.electoral-matrix-wrap td { text-align:center; vertical-align:middle; border-right:1px solid #c3d2ca; }
.electoral-matrix-wrap tr:nth-child(even) td { background:#f4f9f6; }
.electoral-matrix-wrap .matrix-total { background:#e1f0e7; font-weight:900; }
.electoral-matrix-wrap .matrix-target { background:#fff2bd; color:#503800; font-weight:900; }
.electoral-matrix-wrap tfoot th { position:sticky; bottom:0; background:#063d25; font-size:14px; }
.electoral-summary-table { min-width:1050px; }
.electoral-summary-table td { vertical-align:middle; }
.row-summary-title { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:5px; }
.row-summary-chips { display:flex; flex-wrap:wrap; gap:6px; max-width:390px; }
.row-summary-chips span { padding:6px 8px; border:1px solid #b8cbbf; border-radius:8px; background:#f2f8f4; color:#294636; font-size:12px; white-space:nowrap; }
.summary-progress { min-width:145px; display:grid; gap:6px; }
.summary-progress div { display:flex; justify-content:space-between; align-items:baseline; gap:8px; }
.summary-progress strong { color:var(--green); font-size:18px; }
.summary-progress small { color:var(--gray); }
.summary-progress progress { width:100%; height:12px; accent-color:var(--green); }
.electoral-dependent-selects label { min-width:220px; }
.electoral-dependent-selects select { width:100%; }
.selected-college-row td { background:#fff1ad !important; box-shadow:inset 0 2px #d59a16,inset 0 -2px #d59a16; }
.mini-coverage { display:grid; gap:3px; min-width:90px; }
.mini-coverage progress { width:100%; accent-color:var(--green); }
.college-coverage-summary { display:flex; flex-wrap:wrap; align-items:center; gap:7px; padding:12px; border:2px solid #8db59c; border-radius:12px; background:#edf8f1; }
.college-coverage-summary span { padding:5px 8px; border-radius:7px; background:#fff; border:1px solid #bdd2c5; font-size:12px; }
.college-coverage-summary .coverage-gap { background:#ffe1df; border-color:#ef9c95; color:#8c1d18; font-weight:900; }
.college-coverage-summary .coverage-complete { background:#d9f4e3; border-color:#8ac9a2; color:#075b34; font-weight:900; }
.electoral-team-form { margin-top:16px; padding:14px; border:2px solid #b7d7c4; border-radius:14px; background:#fbfffc; }
@keyframes electoral-in { from { opacity:0; transform:translateY(5px) } }
.activity-stats { margin: 12px 0; }
.activity-attendance-form { padding:14px; border:2px solid #b7d7c4; border-radius:14px; background:#fbfffc; }
.elector-cards{margin-bottom:16px}.electors-table{min-width:1050px}.elector-pagination{display:flex;align-items:center;justify-content:center;gap:14px;margin:16px 0}.elector-detail-content{display:grid;grid-template-columns:220px 1fr;gap:22px;padding:18px}.elector-photo,.elector-photo-placeholder{width:220px;height:270px;border-radius:14px;object-fit:cover;background:#e5ece8}.elector-photo-placeholder{display:grid;place-items:center;color:#607168;font-weight:800}.elector-detail-content dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0}.elector-detail-content dl div{padding:10px;border:1px solid #cbd8d0;border-radius:10px;background:#f8fbf9}.elector-detail-content dt{color:#607168;font-size:12px;font-weight:800;text-transform:uppercase}.elector-detail-content dd{margin:4px 0 0;font-weight:800}.elector-pagination button:disabled{opacity:.45}
.elector-person{display:flex;align-items:center;gap:10px;min-width:230px}.elector-avatar{width:46px;height:46px;flex:0 0 46px;border:2px solid #9abaaa;border-radius:50%;object-fit:cover;background:#e5ece8}.elector-avatar-placeholder{display:grid;place-items:center;color:#075b34;font-weight:900}
.elector-link-badge{margin-top:5px;padding:4px 7px;border:0;border-radius:999px;background:#d9f4e3;color:#075b34;font-size:11px;font-weight:900}.elector-not-linked{display:inline-block;margin-top:5px;color:#9f2017}
.elector-member-badge{display:inline-block;margin-top:4px;padding:3px 7px;border-radius:999px;background:#d9f4e3;color:#075b34;font-size:10px;font-weight:900}
.member-identity{display:inline-flex;align-items:center;gap:9px;min-width:150px}.member-padron-avatar{width:42px;height:42px;flex:0 0 42px;border:2px solid #9abaaa;border-radius:50%;object-fit:cover;background:#e5ece8}.member-padron-avatar--empty{display:grid;place-items:center;color:#075b34;font-size:11px;font-weight:900}.electoral-team-list .member-identity{min-width:0}.electoral-team-list .member-padron-avatar{width:32px;height:32px;flex-basis:32px}
.college-member-counts{display:flex;flex-wrap:wrap;gap:5px;min-width:150px}.college-member-counts button{padding:5px 8px;border:1px solid #8db59c;border-radius:999px;background:#edf8f1;color:#075b34;font-size:11px;font-weight:900}.college-member-counts button:hover{background:#075b34;color:#fff}#collegeMembersModal table{min-width:850px}
.election-day-table{min-width:1100px}.election-day-personal{margin:16px 0;border:2px solid #16834b;background:linear-gradient(145deg,#f4fff8,#e4f5eb)}.election-day-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:15px}.election-day-card{padding:18px;border:1px solid #a9c9b6;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(7,91,52,.1)}.election-day-card header{display:flex;align-items:center;justify-content:space-between;gap:12px}.election-day-card h3{margin:15px 0 6px;color:#075b34}.election-day-responsibility{font-size:17px;font-weight:800;color:#172d21}.election-day-instructions{padding:12px;border-left:4px solid #d59a16;border-radius:8px;background:#fff7d6}.election-day-instructions p{margin:5px 0;white-space:pre-wrap}.election-day-card dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.election-day-card dl div{padding:8px;border-radius:8px;background:#edf6f0}.election-day-card dt{font-size:11px;font-weight:900;text-transform:uppercase;color:#607168}.election-day-card dd{margin:3px 0 0;font-weight:800}.election-day-card .row-actions{display:flex;flex-wrap:wrap;gap:7px}
@media(max-width:600px){.election-day-cards{grid-template-columns:1fr}.election-day-card dl{grid-template-columns:1fr}.election-day-card .row-actions button{flex:1 1 45%}}
.button-link{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border:1px solid #789787;border-radius:9px;background:#fff;color:#075b34;font-weight:900;text-decoration:none}.button-link.primary{border-color:#075b34;background:#075b34;color:#fff}.donafp-hero{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:24px;padding:28px;background:linear-gradient(135deg,#063d25,#087344);color:#fff}.donafp-logo{font-size:38px;font-weight:900;letter-spacing:-2px}.donafp-logo span{color:#8bd6a8}.donafp-hero h2{margin:9px 0 5px;font-size:28px}.donafp-hero p{margin:0;color:#d9eee2}.donafp-actions{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0}.donafp-member-result{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-top:16px;padding:16px;border:2px solid #9bc5aa;border-radius:14px;background:#f1faf4}.donafp-member-result p{margin:5px 0;color:#607168;font-size:12px}
@media(max-width:650px){.donafp-hero{grid-template-columns:1fr;padding:20px}.donafp-member-result{grid-template-columns:1fr}.donafp-actions .button-link{width:100%}}
@media(max-width:650px){.elector-detail-content{grid-template-columns:1fr;padding:10px}.elector-photo,.elector-photo-placeholder{width:160px;height:200px;margin:auto}.elector-detail-content dl{grid-template-columns:1fr}}
.attendance-status { display:inline-block; padding:5px 9px; border-radius:999px; font-size:12px; font-weight:900; }
.attendance-status.present { background:#d9f4e3; color:#075b34; }
.attendance-status.absent { background:#ffe1df; color:#9f2017; }
@media (max-width:600px){.electoral-tabs{display:grid;grid-template-columns:1fr 1fr;top:0}.electoral-tabs button{min-height:46px}.electoral-tab .form-grid{grid-template-columns:1fr}.electoral-tab .table-wrap{max-height:65vh}.electoral-tab table{min-width:720px}}

/* FP Conecta */
.chat-view{margin:-28px;min-height:100vh;background:#f0f2f5}.chat-topbar{height:76px;margin:0;padding:12px 18px;background:#fff;border-bottom:1px solid #d8dfdc}.chat-topbar p{margin:2px 0}.chat-shell{height:calc(100vh - 76px);display:grid;grid-template-columns:360px 1fr;overflow:hidden}.chat-list-panel{background:#fff;border-right:1px solid #d7dedb;overflow:hidden}.chat-search{padding:10px;background:#f0f2f5}.chat-search input{width:100%;border:0;border-radius:9px;background:#fff}.conversation-list{height:calc(100% - 66px);overflow:auto}.conversation-item{width:100%;display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:10px;padding:12px;border:0;border-bottom:1px solid #edf0ef;border-radius:0;text-align:left}.conversation-item:hover,.conversation-item.active{background:#e9edef}.chat-avatar{width:45px;height:45px;display:grid;place-items:center;flex:0 0 45px;border-radius:50%;background:#d7eee0;color:#075b34;font-weight:900}.conversation-copy{min-width:0}.conversation-copy strong,.conversation-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.conversation-copy small{margin-top:4px;color:#66736c;font-weight:500}.conversation-meta{align-self:stretch;display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;color:#66736c}.conversation-meta b{min-width:21px;padding:3px 6px;border-radius:50%;background:#25d366;color:#07391f;text-align:center;font-size:11px}.chat-room{position:relative;min-width:0;background:#efeae2;background-image:radial-gradient(rgba(10,70,35,.045) 1px,transparent 1px);background-size:18px 18px}.chat-empty{height:100%;display:grid;place-content:center;justify-items:center;text-align:center}.chat-empty-logo{width:90px;height:90px;display:grid;place-items:center;border-radius:50%;background:#075b34;color:#fff;font-size:32px;font-weight:900}.chat-active{height:100%;display:grid;grid-template-rows:64px 1fr auto auto}.chat-room-header{display:flex;align-items:center;gap:10px;padding:9px 16px;background:#f0f2f5;border-bottom:1px solid #d7dedb}.chat-room-header strong,.chat-room-header small{display:block}.chat-room-header small{color:#66736c}.chat-back{display:none;border:0;background:transparent;font-size:23px}.message-list{padding:20px 6%;overflow:auto}.message-row{display:flex;margin:3px 0}.message-row.mine{justify-content:flex-end}.message-bubble{max-width:min(72%,620px);padding:7px 9px;border-radius:9px;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.08)}.message-row.mine .message-bubble{background:#d9fdd3}.message-bubble>b{display:block;margin-bottom:3px;color:#075b34;font-size:12px}.message-bubble p{margin:0;color:#17202a;white-space:pre-wrap;overflow-wrap:anywhere}.message-bubble footer{text-align:right;color:#66736c;font-size:10px;margin-top:3px}.message-image{display:block;max-width:100%;max-height:320px;border-radius:7px}.message-file{display:block;padding:10px;border-radius:7px;background:rgba(255,255,255,.55);color:#075b34}.message-composer{display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:8px;padding:9px 14px;background:#f0f2f5}.message-composer textarea{max-height:120px;resize:vertical;border:0;border-radius:20px}.attach-button,.send-button{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:50%;font-size:24px}.send-button{background:#075b34;color:#fff}.attachment-preview{padding:6px 18px;background:#fff5c7;color:#503800;font-size:12px}.chat-list-empty{padding:28px;text-align:center;color:#66736c}#newChatForm select[multiple]{min-height:240px}
@media(max-width:700px){.chat-view{margin:-14px -10px;min-height:calc(100vh - 0px)}.chat-topbar{height:68px;padding:9px 10px}.chat-topbar p{display:none}.chat-topbar h1{font-size:21px}.chat-shell{height:calc(100dvh - 68px);grid-template-columns:1fr}.chat-room{display:none}.chat-shell.room-open .chat-list-panel{display:none}.chat-shell.room-open .chat-room{display:block}.chat-active{height:100%;grid-template-rows:60px 1fr auto auto}.chat-back{display:block}.message-list{padding:12px 3%}.message-bubble{max-width:86%}}

/* Navegación de aplicación: menú oculto y superpuesto */
.app-shell{display:block;min-height:100vh}.main{min-height:100vh}.sidebar{position:fixed;z-index:5000;inset:0 auto 0 0;width:min(330px,88vw);padding:22px;transform:translateX(-105%);transition:transform .22s ease;box-shadow:18px 0 55px rgba(0,0,0,.32);overflow-y:auto}.sidebar.open{transform:translateX(0)}.app-menu-overlay{position:fixed;z-index:4900;inset:0;background:rgba(3,18,10,.58);backdrop-filter:blur(3px)}.app-menu-toggle{position:fixed;z-index:4800;top:14px;left:14px;width:48px;height:48px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:#075b34;color:#fff;font-size:24px;box-shadow:0 8px 25px rgba(0,0,0,.28)}.menu-close-btn{margin-left:auto!important;width:40px!important;height:40px!important;padding:0!important;border-radius:50%!important;text-align:center!important;font-size:26px!important;background:rgba(255,255,255,.18)!important}.sidebar .nav{margin-top:8px}.sidebar .socket-card{margin-top:24px}.view:not(.chat-view){padding-top:52px}.chat-view{margin:-28px;min-height:100vh}.chat-topbar{padding-left:76px}
@media(max-width:920px){.sidebar{position:fixed}.main{padding:14px 10px}.chat-view{margin:-14px -10px}.chat-topbar{padding-left:70px}}

@media(max-width:600px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  .main{width:100%;padding:6px 4px 18px}
  .view:not(.chat-view){padding-top:58px}
  .topbar{align-items:flex-start;padding:0 6px;margin-bottom:8px}
  .topbar h1{font-size:22px;line-height:1.1}
  .topbar p{font-size:12px;margin-bottom:4px}
  .panel,.card{border-radius:10px;margin-bottom:8px;padding:10px 7px}
  .cards{grid-template-columns:1fr 1fr;gap:6px}
  .card strong{font-size:24px}
  input,select,textarea{width:100%;min-height:54px;padding:13px 12px;font-size:16px;border-radius:12px}
  label{gap:7px;font-size:14px}
  button{min-height:46px}
  .toolbar,.action-grid{display:grid;grid-template-columns:1fr;width:100%;gap:7px}
  .toolbar input,.toolbar select,.toolbar button{width:100%;min-width:0}
  .table-wrap{width:calc(100% + 8px);margin-left:-4px;margin-right:-4px;border-radius:0;max-height:72dvh}
  .affiliation-form{width:100%;max-width:none;padding:4px 2px;gap:8px}
  .form-section{padding:10px 6px;border-radius:9px}
  .affiliation-grid{gap:9px}
  .optional-content{padding:8px 5px}
  .create-record-form,.create-record-form--compact{width:100%;padding:0 6px 16px}
  .create-record-form>label{min-height:74px;padding:8px}
  .app-menu-toggle{top:8px;left:8px}
  .member-wa-actions{grid-template-columns:1fr;min-width:100px}
}

/* Formulario de afiliación por pasos */
.affiliation-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;position:relative}.affiliation-steps button{display:flex;align-items:center;justify-content:flex-start;gap:9px;min-height:58px;padding:9px;border:2px solid #cbd8d0;background:#fff;color:#53645a;text-align:left}.affiliation-steps button b{width:32px;height:32px;display:grid;place-items:center;flex:0 0 32px;border-radius:50%;background:#e5ece8;color:#42554a}.affiliation-steps button.active{border-color:#08713b;background:#e9f6ef;color:#07391f;box-shadow:0 0 0 3px rgba(8,113,59,.1)}.affiliation-steps button.active b{background:#08713b;color:#fff}.affiliation-steps button.completed{border-color:#8cc3a2;color:#075b34}.affiliation-steps button.completed b{background:#25a55b;color:#fff}.affiliation-steps button.completed b::after{content:'✓';font-size:0}.affiliation-steps button:disabled{opacity:.6;cursor:not-allowed}.affiliation-step-heading{padding:12px 2px 0}.affiliation-step-heading small{color:#08713b;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.affiliation-step-heading h2{margin:3px 0 0;color:#07391f}.affiliation-step{animation:affiliation-step-in .2s ease-out}.affiliation-step-actions{position:sticky;z-index:5;bottom:8px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:12px;border:1px solid #a9c5b4;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 9px 28px rgba(7,57,31,.14);backdrop-filter:blur(8px)}.affiliation-step-actions span{text-align:center;color:#53645a;font-size:13px}.affiliation-step-actions button{min-width:130px}.affiliation-step-actions button:disabled{opacity:.45;cursor:not-allowed}@keyframes affiliation-step-in{from{opacity:0;transform:translateX(12px)}}
@media(max-width:700px){.affiliation-steps{grid-template-columns:repeat(4,1fr);gap:5px}.affiliation-steps button{justify-content:center;min-height:48px;padding:6px}.affiliation-steps button b{width:30px;height:30px;flex-basis:30px}.affiliation-steps button span{display:none}.affiliation-step-actions{grid-template-columns:1fr 1fr;bottom:4px;padding:8px}.affiliation-step-actions span{display:none}.affiliation-step-actions button{min-width:0;min-height:46px}}

/* Avatares */
.chat-avatar,.message-avatar,.list-avatar,.profile-avatar-button span{overflow:hidden}.chat-avatar img,.message-avatar img,.list-avatar img,.profile-avatar-button img{width:100%;height:100%;display:block;object-fit:cover}.profile-avatar-button{width:44px;height:44px;padding:0;border:2px solid #89ae97;border-radius:50%;overflow:hidden;background:#d7eee0}.profile-avatar-button span{width:100%;height:100%;display:grid;place-items:center;color:#075b34;font-weight:900}.message-avatar{width:38px;height:38px;display:grid;place-items:center;align-self:flex-start;flex:0 0 38px;margin:1px 7px 0 0;border:2px solid #fff;border-radius:50%;background:#d7eee0;color:#075b34;font-size:12px;font-weight:900;box-shadow:0 1px 4px rgba(0,0,0,.16)}.list-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:#d7eee0;color:#075b34;font-weight:900}.message-row{align-items:flex-start}.message-row.mine{flex-direction:row;justify-content:flex-end}.message-row.mine .message-avatar{order:0}.message-row.mine .message-bubble{order:1}