/* La Flora 2.0 — un sistema visual para trabajo diario y lectura de datos. */
:root {
  --navy: #172238;
  --ink: #1c293b;
  --muted: #52647a;
  --line: #c9d1dc;
  --bg: #dfe3ea;
  --surface: #f9fafc;
  --surface-soft: #edf1f6;
  --blue: #3158d6;
  --blue-soft: #e7ecfd;
  --accent: #c44c2a;
  --green: #156a4e;
  --green-soft: #e1f2e9;
  --red: #a33643;
  --red-soft: #fbe9ec;
  --amber: #775516;
  --amber-soft: #fbf0d9;
  --focus: #f5bb57;
  --shadow: 0 12px 32px #26344c12;
}

body { background: var(--bg); color: var(--ink); font-family: Inter, "Segoe UI", Arial, sans-serif; }
.main-area { background: radial-gradient(circle at 82% -14%,#d1daf3 0,transparent 37%),linear-gradient(135deg,#e6e9ef,#dce1e9 65%,#d8dee8); }
.sidebar { width: 232px; padding: 22px 11px 16px; background: linear-gradient(168deg,#1b2944 0%,#162037 52%,#111a2e 100%); box-shadow: 10px 0 30px #0b1b3424; }
.main-area { width: calc(100% - 232px); margin-left: 232px; }
.brand { gap: 10px; padding: 3px 9px 23px; border-bottom: 1px solid #ffffff22; margin-bottom: 20px; }
.brand-mark { width: 39px; height: 39px; border-radius: 11px; background: linear-gradient(145deg,#eb8059,#b8432a); box-shadow: 0 8px 18px #070f224d; }
.brand strong { font-size: 15px; color: #fff; letter-spacing: -.3px; }
.brand span { color: #aebdd3; font-size: 9px; letter-spacing: .95px; }
.nav-caption { color: #8fa6c4; font-size: 9px; letter-spacing: 1.45px; padding-left: 12px; }
.secondary-caption { margin-top: 17px; }
.sidebar .nav-item { min-height: 37px; height: auto; color: #c4d1e3; border-radius: 9px; font-size: 12px; font-weight: 580; margin: 1px 0; padding: 8px 11px; gap: 10px; }
.sidebar .nav-item:hover { background: #ffffff15; color: #fff; transform: translateX(2px); }
.sidebar .nav-item.active { color: #122448; background: #e9efff; box-shadow: inset 3px 0 #5275f0,0 4px 12px #070f222b; }
.sidebar .nav-item.active .nav-icon { color: #3158d6; }
.sidebar .nav-icon { color: #a5b7cf; }
.sidebar .nav-count { background: #334469; color: #eaf0ff; }
.sidebar .secure-note { border-color: #ffffff22; }
.sidebar .secure-note small { color: #aebed4; }
.sidebar #cloudControls .text-link { color: #d6e3ff; min-height: 34px; }
.sidebar #cloudControls .text-link:hover { color: #fff; }

.topbar { height: 62px; background: #f4f6fbe8; border-bottom: 1px solid #c9d2e1; box-shadow: 0 4px 18px #1c2a4510; backdrop-filter: blur(14px); }
.breadcrumb,.breadcrumb .breadcrumb-home,.breadcrumb .breadcrumb-sep { color: #5c6e88; }
.breadcrumb b { color: #20395c; font-weight: 750; }
.user-chip { border-color: #c7d1df; }
.user-chip b { color: #203650; }
.user-chip small { color: #5b6d83; }
.avatar { background: #dce6ff; color: #244cc7; }
.period-control,.global-search-trigger { background: #fff; border: 1px solid #bcc8dc; color: #345078; border-radius: 9px; }
.period-control select { color: #243a5d; }
.global-search-trigger:hover,.global-search-trigger:focus-visible { border-color: #3158d6; box-shadow: 0 0 0 3px #3158d627; }
.global-search-trigger>span:first-child { color: #3158d6; }
.global-search-trigger kbd { background: #e8edfa; border-color: #cdd7ed; color: #4a6090; }
.icon-button { border-color: #bac8dc; color: #263f6b; }
.content { max-width: 1460px; padding: 26px 30px 40px; }

.page-heading { position: relative; overflow: hidden; min-height: 126px; display: flex; align-items: center; padding: 25px 29px; margin-bottom: 17px; border: 1px solid #24365e; border-left: 0; border-radius: 17px; background: linear-gradient(106deg,#1b2842 0%,#244289 70%,#2f57ba 100%); box-shadow: 0 19px 34px #233f8529; }
.page-heading::before { content: ""; position: absolute; right: 14%; top: -96px; width: 260px; height: 260px; border: 1px solid #ffffff25; border-radius: 50%; pointer-events: none; }
.page-heading::after { content: ""; position: absolute; right: 10%; top: -61px; width: 175px; height: 175px; display: block; border: 1px solid #ffffff23; border-radius: 50%; pointer-events: none; }
.page-heading>div { position: relative; z-index: 1; }
.page-heading h1 { font-size: clamp(27px,2.25vw,36px); line-height: 1.06; letter-spacing: -1.1px; color: #fff; }
.page-heading p { color: #d8e3ff; font-size: 13px; margin-top: 9px; }
.page-heading .heading-actions { flex-wrap: wrap; justify-content: flex-end; }
.page-heading .btn { min-height: 42px; border-radius: 9px; background: #f4f7ff; border-color: #fff; color: #213d7c; font-size: 12px; box-shadow: 0 4px 12px #0a193a24; }
.page-heading .btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.page-heading .btn-primary:hover { background: #a73c1f; border-color: #a73c1f; }

.btn { min-height: 38px; border-radius: 9px; border-color: #bdc9de; background: #fff; color: #264784; font-size: 11.5px; font-weight: 700; }
.btn:hover { border-color: #748de0; background: #f3f6ff; }
.btn-primary,.scope-switch .btn-primary { background: #3158d6; border-color: #3158d6; color: #fff; box-shadow: 0 6px 14px #244cc52b; }
.btn-primary:hover { background: #2347bd; border-color: #2347bd; color: #fff; }
.btn-light { background: #e8edfe; border-color: #d2dcfc; color: #2149bd; }
.text-link,.table-wrap .text-link { display: inline-flex; align-items: center; min-height: 30px; padding: 4px 6px; color: #244cb8; font-size: 11.5px; }
.text-link:hover { color: #183f9e; text-decoration: underline; }
.mini-action { display: inline-grid; place-items: center; min-width: 30px; min-height: 30px; border-radius: 6px; }
.mini-action:hover { background: #e9effb; color: #244cb8; }
.stat-card,.panel,.info-card,.aging-card { background: var(--surface); border: 1px solid #cad3e1; border-radius: 13px; box-shadow: var(--shadow); }
.panel-header { background: #eff2f8; border-bottom: 1px solid #d6ddea; padding: 15px 18px; }
.panel-header h2 { color: #203454; font-size: 15px; letter-spacing: -.25px; }
.panel-header p { color: #5c6d83; font-size: 11px; }
.panel-body { padding: 18px 20px; }
.content-grid { gap: 16px; }

.dashboard-stats { gap: 13px; margin-bottom: 15px; }
.dashboard-stats .stat-card { min-height: 126px; padding: 18px 20px; border: 1px solid #2d4ca0; border-top: 0; background: linear-gradient(130deg,#263e7c,#3459bb); box-shadow: 0 13px 28px #26468b2b; }
.dashboard-stats .stat-card:nth-child(2) { background: linear-gradient(130deg,#fbf1ed,#f9e5dd); border-color: #e7bbaa; box-shadow: var(--shadow); }
.dashboard-stats .stat-card:nth-child(3) { background: #f1f3fa; border-color: #c7d1e4; box-shadow: var(--shadow); }
.dashboard-stats .stat-card:nth-child(4) { background: #f9ebed; border-color: #e2c4ca; box-shadow: var(--shadow); }
.dashboard-stats .stat-card:first-child .stat-top,.dashboard-stats .stat-card:first-child .stat-value,.dashboard-stats .stat-card:first-child .stat-foot,.dashboard-stats .stat-card:first-child .stat-foot::after { color: #fff; }
.dashboard-stats .stat-card:not(:first-child) .stat-top { color: #5d6275; }
.dashboard-stats .stat-card:not(:first-child) .stat-value { color: #25334b; }
.dashboard-stats .stat-value { font-size: clamp(22px,2vw,30px); letter-spacing: -.8px; margin-top: 11px; }
.dashboard-stats .stat-foot { color: #55667f; font-size: 11px; }
.dashboard-stats .stat-icon { background: #ffffff2b; color: #fff; }
.dashboard-stats .stat-card:not(:first-child) .stat-icon { background: #ffffffb8; color: #b2492d; }
.stat-link:hover,.stat-link:focus-visible { transform: translateY(-3px); border-color: #5377dc; box-shadow: 0 18px 32px #2c4a852b; }
.stat-link .stat-foot::after { color: #3158d6; }

.setup-panel { background: #f9fafc; border: 1px solid #d0d9e8; border-left: 4px solid #486be0; border-radius: 12px; box-shadow: 0 6px 18px #26344c0e; }
.setup-kicker { color: #3158c0; }
.setup-copy h2 { color: #243653; }
.setup-copy p { color: #5e7086; }
.priority-panel { background: #f3f5fa; }
.priority-kicker { color: #3f5fb0; }
.priority-header h2 { color: #243b62; }
.priority-header h2 span { color: #3158bd; background: #e0e8fc; }
.priority-row { background: #fff; border-color: #d9e0ec; border-left-color: #d0804e; }
.priority-copy strong { color: #26364f; }
.priority-copy>span { color: #5e718b; }
.priority-action { color: #254cb5; }

.flow-panel { background: #1e2e4b; border-color: #283f6d; }
.flow-panel .panel-header { background: #233657; border-color: #ffffff24; }
.flow-panel .panel-body { background: #1e2e4b; }
.flow-panel .panel-header h2,.flow-panel .panel-header .text-link { color: #fff; }
.flow-panel .panel-header p { color: #becbeb; }
.flow-panel .flow-primary { border-bottom-color: #ffffff30; }
.flow-panel .flow-primary span,.flow-panel .flow-breakdown span,.flow-panel .flow-note { color: #c7d2e8; }
.flow-panel .flow-primary strong { color: #fff; font-size: clamp(28px,2.5vw,37px); }
.flow-panel .flow-breakdown b,.flow-panel .flow-breakdown .positive { color: #e8efff; }
.flow-panel .flow-breakdown .negative { color: #ffb8be; }
.donut { background: conic-gradient(#3158d6 0 var(--ratio),#e4e9f2 var(--ratio) 100%); }
.donut:before { background: var(--surface); }
.donut-center b { color: #263b66; }
.legend-row { color: #50627a; }
.legend-row i,.legend-row:nth-child(2) i { background: #3158d6; }
.legend-row:nth-child(3) i { background: #c8643d; }
.legend-row b { color: #223b64; }

.table-wrap th { background: #e9eef8; color: #38517b; border-bottom: 1px solid #cdd9e9; font-size: 10px; letter-spacing: .65px; padding: 12px 14px; }
.table-wrap th:first-child { background: #e9eef8; }
.table-wrap td { color: #34445d; border-bottom-color: #e1e6ef; font-size: 12px; padding: 12px 14px; }
.table-wrap td:first-child { background: transparent; }
.table-wrap tbody tr:nth-child(even) { background: #f5f7fb; }
.table-wrap tbody tr:hover,.table-wrap tbody tr:hover td:first-child,.table-wrap tbody tr:focus-within { background: #e9effd; }
.unit-name,.money { color: #233758; }
.subtext { color: #607089; font-size: 10.5px; }
.summary-strip { background: #edf1f8; border-color: #d5dce8; color: #526883; }
.summary-strip b { color: #24375c; }
.table-footer { color: #5a6c83; border-color: #d4deec; }
.badge-paid { color: #125d42; background: #dcf1e5; }
.badge-overdue { color: #a33643; background: #fbe7e9; }
.badge-pending { color: #725010; background: #fbefd5; }
.info-card h3,.detail-row b { color: #253b60; }
.info-card p,.info-card .card-foot,.detail-row { color: #5d6f88; }
.info-card .big { color: #234896; }
.field label { color: #344c72; font-size: 11px; }
.field input,.field select,.field textarea,.search-box,.filter-select { color: #233957; border-color: #b8c8df; background: #fff; }
.field input:focus,.field select:focus,.field textarea:focus,.search-box:focus-within { border-color: #3158d6; box-shadow: 0 0 0 3px #3158d626; }
.modal,.search-dialog { background: #fafbfe; border: 1px solid #c7d2e3; }
.modal-head,.modal-foot { background: #eef2f8; border-color: #d4ddeb; }
.modal-head h2,.search-dialog h2 { color: #213858; }
.modal-body { background: #fafbfe; }
.search-backdrop { background: #101c35b8; }
.search-overline,.search-section-label { color: #3158c0; }
.search-input-wrap { border-color: #b9c9e4; }
.search-input-wrap>span { color: #3158d6; }
.search-input-wrap:focus-within { border-color: #3158d6; box-shadow: 0 0 0 3px #3158d626; }
.search-result:hover,.search-result:focus-visible,.search-shortcuts button:hover { background: #eaf0ff; border-color: #c5d3f7; }
.search-result-kind,.search-result-arrow { color: #3158bd; }
.search-shortcuts button { color: #254994; background: #edf2ff; border-color: #d6e0fa; }
.notice-inline,.empty-state { color: #576c85; }
.empty-state { background: #f5f7fb; }
.empty-state b { color: #263a60; }
.mobile-dock { background: #f2f5fb; border-color: #bfcee6; }
.mobile-dock .dock-item.active { color: #254ab8; background: #e1e9fd; }

.resident-mode #content>.summary-strip { background: #f9fafe; border: 1px solid #cbd7e9; }
.resident-mode #content>.summary-strip>span { background: #e8eefe; border-left: 3px solid #3158d6; }
.resident-mode #content>.summary-strip>span:nth-child(2) { background: #f9e9e3; border-left-color: #c44c2a; }
.resident-mode #content>.summary-strip>span:nth-child(3) { background: #fbeaec; border-left-color: #a33643; }
.resident-mode #content>.summary-strip>.balance-total { background: #f9e9e3; border-left-color: #c44c2a; }
.resident-mode #content>.summary-strip>.payments-unapplied { background: #fbeaec; border-left-color: #a33643; }
.resident-mode #content>.summary-strip:has(>span:only-child) { display: grid; grid-template-columns: 1fr; }
.resident-mode .summary-strip b { color: #24375b; }
.resident-mode .resident-panel-count { background: #e0eee7; color: #155e45; }
.resident-mode #content>.table-panel .text-link { color: #244db9; }
.resident-mode .resident-grid { align-items: start; }
.resident-mode .resident-grid.single { grid-template-columns: minmax(0,1fr); }
.resident-ticket-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:flex-end; }
.resident-tickets .panel-header { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.resident-mode .resident-tickets .empty-state { min-height: 110px; }
#content[data-view="dashboard"]>.flow-panel { margin-bottom: 16px; }
.units-table .table-footer:empty { display: none; }
@media (min-width: 701px) {
  #content[data-view="dashboard"]>.flow-panel .panel-body { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: center; gap: 9px 20px; }
  #content[data-view="dashboard"]>.flow-panel .flow-primary { border-bottom: 0; padding: 0; }
  #content[data-view="dashboard"]>.flow-panel .flow-breakdown { display: contents; }
  #content[data-view="dashboard"]>.flow-panel .flow-breakdown>div { border-left: 1px solid #ffffff30; padding-left: 18px; }
  #content[data-view="dashboard"]>.flow-panel .flow-note { grid-column: 1/-1; margin: 0; }
}

#authGate { background: radial-gradient(circle at 15% 18%,#cfd9f3,transparent 35%),linear-gradient(140deg,#dee3ed,#e9ebf1 60%,#d5deee); }
.auth-card { border-color: #bbc9df; border-top-color: #c44c2a; background: #fbfcff; box-shadow: 0 26px 70px #15244a30; }
.auth-card h1 { color: #233b65; }
.auth-card p,.auth-card label { color: #536783; }
.auth-card input,.auth-card select { color: #223b62; border-color: #b8c8e0; background: #fff; }
.auth-card input:focus,.auth-card select:focus { border-color: #3158d6; box-shadow: 0 0 0 3px #3158d627; }
.auth-links { border-color: #d7dfec; }
.auth-card .btn-primary { background: #3158d6; border-color: #3158d6; }
.auth-card .brand-mark { background: linear-gradient(145deg,#eb8059,#b8432a); }

:where(button,a,input,select,textarea,summary):focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }

@media (min-width: 851px) and (max-width: 1100px) {
  .sidebar { width: min(290px,84vw); transform: translateX(-100%); }
  .sidebar.open { transform: translateX(0); }
  .main-area { width: 100%; margin-left: 0; }
}
@media (max-width: 850px) {
  .sidebar { width: min(290px,84vw); }
  .main-area { width: 100%; margin-left: 0; }
}
@media (max-width: 700px) {
  .content { padding: 13px 12px calc(82px + env(safe-area-inset-bottom)); }
  .page-heading { min-height: 0; display: block; padding: 20px 18px 17px; margin-bottom: 13px; }
  .page-heading h1 { font-size: 26px; }
  .page-heading p { font-size: 12px; }
  .page-heading .heading-actions { width: 100%; margin-top: 16px; }
  .page-heading .heading-actions .btn { min-height: 42px; }
  .dashboard-stats { gap: 9px; }
  .dashboard-stats .stat-card { min-height: 108px; padding: 13px; }
  .dashboard-stats .stat-value { font-size: clamp(17px,5vw,23px); white-space: normal; }
  .dashboard-stats .stat-top { font-size: 10px; }
  .dashboard-stats .stat-foot { font-size: 9.5px; }
  .panel-header { padding: 13px 14px; }
  .panel-body { padding: 14px; }
  .resident-mode #content>.table-panel tbody tr { background: #fff; }
  .resident-mode #content>.table-panel tbody tr:nth-child(even) { background: #f2f5fb; }
  .resident-mode #content>.table-panel .text-link { background: #e5ecff; }
}
@media (max-width: 390px) {
  .page-heading .heading-actions { grid-template-columns: 1fr; }
  .dashboard-stats .stat-card { padding: 11px; }
  .dashboard-stats .stat-value { font-size: 18px; }
}

/* Comparación presupuestal y preparación del informe. */
.budget-panel,.closing-panel{margin-top:16px}
.budget-panel .panel-header,.closing-panel .panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.budget-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.budget-metrics>div{display:grid;gap:4px;padding:15px;border:1px solid #cfdaea;border-radius:10px;background:#f0f4fb}
.budget-metrics span{color:#526984;font-size:11px;font-weight:700}.budget-metrics b{color:#233f69;font-size:22px}.budget-metrics small{color:#546980;font-size:11px}
.budget-panel .negative{color:#aa3e3e;font-weight:700}
.closing-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:15px}
.closing-item{display:flex;align-items:center;gap:9px;min-height:43px;padding:8px 11px;border:1px solid #d4dfeb;border-radius:9px;background:#f8fafd;color:#2a405e;font-size:12px}
.closing-item>span:nth-child(2){flex:1}.closing-item .text-link{white-space:nowrap}
.closing-mark{display:grid;place-items:center;flex:none;width:23px;height:23px;border-radius:50%;background:#f5e7db;color:#99512c;font-weight:800}
.closing-mark.is-ready{background:#e1f2e9;color:#1d7651}
.closing-panel>.notice-inline{margin:0 15px 15px}
@media(max-width:700px){.budget-metrics,.closing-list{grid-template-columns:1fr}.budget-metrics b{font-size:19px}.closing-list{padding:12px}.budget-panel .panel-header,.closing-panel .panel-header{align-items:flex-start}}
@media print{.budget-panel .panel-header .btn,.closing-item .text-link{display:none!important}}
/* Comunidad, expediente y asistencia de asamblea */
.content[data-view="comunidad"] .event-card,.resident-mode .content .event-card{border-bottom:1px solid #dce5e8;padding:12px 0}
.content[data-view="comunidad"] .event-card:last-child,.resident-mode .content .event-card:last-child{border-bottom:0}
.content[data-view="comunidad"] .event-card b,.resident-mode .content .event-card b{display:block;color:#173f45;font-size:13px;margin:5px 0}
.content[data-view="comunidad"] .event-card p,.resident-mode .content .event-card p{line-height:1.55;margin:5px 0 9px;white-space:pre-wrap}
.content[data-view="comunidad"] .row-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.attendance-table{max-height:min(46vh,430px);overflow:auto;border:1px solid #dce5e8;border-radius:10px;margin:12px 0}
.attendance-table table{min-width:520px}
.attendance-table input[type="text"],.attendance-table input:not([type]){width:100%;min-width:180px;border:1px solid #cbd8dc;border-radius:7px;padding:8px;background:#fff}
.attendance-table input[type="checkbox"]{width:18px;height:18px;vertical-align:middle}
.modal.modal-wide{width:min(850px,calc(100vw - 28px));max-width:850px}
.unit-checks[hidden]{display:none!important}
@media(max-width:700px){.content[data-view="comunidad"] .content-grid,.resident-mode .resident-grid{grid-template-columns:1fr}.content[data-view="comunidad"] .heading-actions{flex-wrap:wrap;justify-content:flex-start}.attendance-table{max-height:44vh}}
.ticket-extra,.vote-extra{grid-column:1/-1;border:1px solid var(--line);border-radius:10px;background:#f7faf9;padding:10px 13px}
.ticket-extra summary,.vote-extra summary{cursor:pointer;font-weight:700;color:#24534d;padding:4px 0}
.ticket-extra[open] summary,.vote-extra[open] summary{margin-bottom:14px}
.facility-grid{margin-top:16px;align-items:start}
.facility-panel .panel-body,.reception-panel .panel-body{padding-top:6px;padding-bottom:7px}
.facility-row{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 0;border-bottom:1px solid #dce5e8}
.facility-row:last-child,.reception-entry:last-child{border-bottom:0}
.facility-row>span:first-child{flex:1;min-width:0}
.facility-row b,.facility-row small,.reception-entry b,.reception-entry small{display:block}
.facility-row b,.reception-entry b{color:#173f45;font-size:13px}
.facility-row small,.reception-entry small{color:#647b79;font-size:11px;margin-top:3px}
.facility-state{font-size:11px;font-weight:750;border-radius:999px;padding:5px 9px;background:#edf1f0;color:#596d6b;white-space:nowrap}
.facility-state.is-open{background:#e4f3e9;color:#246e48}
.facility-state.is-maintenance{background:#fff1d7;color:#8b5b17}
.facility-state.is-closed{background:#f8e8e5;color:#964b43}
.reception-entry{padding:11px 0;border-bottom:1px solid #dce5e8}
.reception-entry p{font-size:12px;line-height:1.5;color:#49605e;margin:6px 0;overflow-wrap:anywhere}
.reception-entry .row-actions{display:flex;gap:14px}
.reception-history{border-top:1px solid #dce5e8;padding-top:10px}.reception-history summary{cursor:pointer;color:#1f655c;font-size:12px;font-weight:750;margin-bottom:8px}
.monthly-report-panel{margin-top:16px}.report-summary-preview{white-space:pre-line;line-height:1.7;font-size:12px;color:#304e4d;margin:0 0 10px}
.resident-mode .facility-panel{margin:16px 0}
@media(max-width:700px){.facility-grid{grid-template-columns:1fr}.facility-row{flex-wrap:wrap}.facility-row .text-link{min-height:36px}.reception-panel .panel-header,.monthly-report-panel .panel-header{align-items:flex-start;gap:12px;flex-wrap:wrap}.reception-panel .panel-header .btn,.monthly-report-panel .panel-header .btn{width:100%}}
@media print{.facility-panel .text-link,.reception-panel .row-actions,.reception-panel .panel-header .btn,.monthly-report-panel .panel-header .btn{display:none!important}}