:root {
  --navy: #173b67;
  --navy-2: #0d2949;
  --blue: #2777bc;
  --sky: #eaf4fb;
  --red: #ef4658;
  --ink: #172331;
  --muted: #66788a;
  --line: #dfe7ee;
  --surface: #ffffff;
  --background: #f4f7fa;
  --green: #148564;
  --amber: #b86a0b;
  --shadow: 0 14px 40px rgba(29, 59, 90, 0.1);
  font-family: Inter, "Segoe UI", system-ui, sans-serif;
  color: var(--ink);
  background: var(--background);
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.eyebrow { margin: 0 0 7px; color: var(--blue); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.eyebrow.light { color: #a9d7f6; }

.login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(390px, .72fr) minmax(0, 1.28fr); }
.login-brand {
  min-height: 100vh;
  background-color: var(--navy);
  background-image: url("/assets/portada-apeucho.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.login-panel { display: grid; place-items: center; padding: 45px; background: #fbfcfd; }
.login-card { width: min(420px, 100%); }
.login-card h2 { margin: 0 0 8px; font-family: Georgia, serif; font-size: 2.2rem; color: var(--navy); }
.app-copyright { margin: 18px 0 0; color: var(--muted); font-size: .68rem; text-align: center; line-height: 1.45; }
label { display: grid; gap: 7px; margin: 18px 0; color: #344557; font-size: .85rem; font-weight: 700; }
input, select, textarea {
  width: 100%; padding: 12px 13px; border: 1px solid #ccd8e2; border-radius: 10px;
  color: var(--ink); background: white; outline: none; transition: .2s;
}
input:focus, select:focus, textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(39,119,188,.12); }
textarea { min-height: 90px; resize: vertical; }
.btn { border: 0; border-radius: 10px; padding: 11px 17px; font-weight: 750; color: var(--navy); background: #e8eef4; }
.btn.primary { color: white; background: linear-gradient(135deg, var(--navy), var(--blue)); box-shadow: 0 8px 20px rgba(23,59,103,.18); }
.btn.danger { color: #9d2533; background: #feecef; }
.btn.subtle { border: 1px solid var(--line); background: white; }
.btn.small { padding: 7px 10px; font-size: .78rem; }
.btn.wide { width: 100%; margin-top: 8px; padding: 13px; }
.forgot-link { display: block; margin: -7px 0 10px auto; padding: 3px 0; border: 0; color: var(--blue); background: transparent; font-size: .78rem; font-weight: 700; }
.forgot-link:hover { text-decoration: underline; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 250px 1fr; }
.sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; color: white; background: linear-gradient(180deg, var(--navy-2), #12355c); z-index: 5; }
.sidebar-brand { height: 105px; padding: 18px 20px; border-bottom: 1px solid rgba(255,255,255,.09); }
.sidebar-brand img { width: 165px; max-height: 48px; object-fit: contain; padding: 6px; background: white; border-radius: 10px; }
.sidebar-brand span { display: block; margin-top: 6px; color: #bcd5e8; font-size: .68rem; letter-spacing: .13em; text-transform: uppercase; }
#nav { flex: 1; overflow: auto; padding: 16px 10px; }
.nav-section { padding: 14px 12px 7px; color: #7599b9; font-size: .62rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.nav-item { width: 100%; display: flex; align-items: center; gap: 11px; margin: 3px 0; padding: 10px 12px; border: 0; border-radius: 9px; color: #c8dbea; background: transparent; text-align: left; font-size: .84rem; }
.nav-item:hover, .nav-item.active { color: white; background: rgba(255,255,255,.1); }
.nav-icon { width: 21px; text-align: center; font-size: 1rem; }
.sidebar-footer { display: flex; align-items: center; gap: 8px; padding: 16px; border-top: 1px solid rgba(255,255,255,.09); }
.user-mini { min-width: 0; flex: 1; display: flex; align-items: center; gap: 10px; }
.avatar { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--red); font-weight: 800; }
.avatar.has-photo { overflow: hidden; background: white; }
.avatar.has-photo img { width: 100%; height: 100%; object-fit: cover; }
.user-mini div:last-child { min-width: 0; }
.user-mini strong, .user-mini span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-mini strong { font-size: .76rem; }
.user-mini span { margin-top: 3px; color: #87a8c4; font-size: .66rem; }
.sidebar-copy { padding: 0 16px 16px; color: #87a8c4; font-size: .62rem; text-align: center; line-height: 1.4; }
.icon-button { display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 8px; color: inherit; background: rgba(255,255,255,.08); font-size: 1.2rem; }

.main-area { min-width: 0; }
.topbar { position: sticky; top: 0; min-height: 93px; display: flex; align-items: center; gap: 18px; padding: 18px 32px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.94); backdrop-filter: blur(14px); z-index: 4; }
.topbar h1 { margin: 0; font-family: Georgia, serif; color: var(--navy); font-size: 1.65rem; font-weight: 600; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.date-chip { padding: 9px 13px; border-radius: 9px; color: var(--muted); background: var(--background); font-size: .78rem; }
.menu-btn { display: none; border: 0; background: transparent; font-size: 1.3rem; }
.content { padding: 28px 32px 50px; }
.hero {
  position: relative; display: flex; justify-content: space-between; gap: 25px; padding: 27px 30px; margin-bottom: 23px;
  border-radius: 18px; color: white; background: linear-gradient(115deg, var(--navy), #256da7); overflow: hidden;
}
.profile-reminder { display: flex; align-items: center; gap: 17px; margin-bottom: 18px; padding: 15px 18px; border: 1px solid #f0d6a8; border-radius: 14px; background: #fff8e9; }
.profile-reminder > div:nth-child(2) { flex: 1; }
.profile-reminder strong { color: #76500d; }
.profile-reminder p { margin: 4px 0 0; color: #8b6a2d; font-size: .78rem; }
.profile-reminder.compact { display: block; }
.profile-ring { --profile: 0; width: 52px; height: 52px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--amber) calc(var(--profile) * 1%), #f0dfbd 0); position: relative; }
.profile-ring::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #fff8e9; }
.profile-ring span { position: relative; color: #76500d; font-size: .7rem; font-weight: 850; }
.profile-completion { display: grid; min-width: 120px; padding: 10px 14px; border-radius: 11px; color: var(--navy); background: var(--sky); text-align: right; }
.profile-completion strong { font-size: 1.25rem; }
.profile-completion span { color: var(--muted); font-size: .67rem; }
.profile-layout { display: grid; grid-template-columns: 230px 1fr; padding: 25px; gap: 28px; }
.profile-photo-panel { display: flex; align-items: center; flex-direction: column; padding-right: 25px; border-right: 1px solid var(--line); text-align: center; }
.profile-photo { width: 150px; height: 150px; display: grid; place-items: center; margin: 10px auto 18px; border: 5px solid white; border-radius: 50%; color: white; background: linear-gradient(135deg, var(--navy), var(--blue)); box-shadow: 0 0 0 1px var(--line), var(--shadow); font-size: 2.5rem; font-weight: 800; overflow: hidden; }
.profile-photo img { width: 100%; height: 100%; object-fit: cover; }
.photo-button { display: inline-block; }
.profile-photo-panel small { margin-top: 11px; color: var(--muted); font-size: .68rem; line-height: 1.5; }
.identity-box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; padding: 15px; border-radius: 11px; background: #f5f8fa; }
.identity-box span, .identity-box strong { display: block; }
.identity-box span { margin-bottom: 4px; color: var(--muted); font-size: .65rem; text-transform: uppercase; }
.identity-box strong { color: var(--navy); font-size: .82rem; }
.form-hint { padding: 12px 14px; border-radius: 9px; color: var(--muted); background: var(--sky); font-size: .75rem; line-height: 1.5; }
.member-create-form { display: grid; gap: 16px; padding-top: 15px; }
.member-form-section { padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: #fbfdff; }
.member-form-title { display: flex; align-items: center; gap: 11px; margin-bottom: 10px; }
.member-form-title > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--navy); font-weight: 800; }
.member-form-title strong, .member-form-title small { display: block; }
.member-form-title strong { color: var(--navy); }
.member-form-title small { margin-top: 2px; color: var(--muted); font-size: .68rem; }
.loan-calculation { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 13px 14px; border-radius: 10px; color: var(--navy); background: #eaf4fb; font-size: .76rem; }
.loan-calculation span { display: flex; justify-content: space-between; gap: 10px; }
.request-financial-context { padding: 14px; border: 1px solid #cfe1ee; border-radius: 11px; color: var(--navy); background: #f1f8fc; }
.context-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.context-grid > div { padding: 10px; border-radius: 8px; background: white; }
.context-grid span, .context-grid strong { display: block; }
.context-grid span { color: var(--muted); font-size: .65rem; }
.context-grid strong { margin-top: 4px; font-size: .85rem; }
.context-warning { margin: 10px 0 0; color: #a43442; font-size: .73rem; font-weight: 700; }
.context-information { margin: 10px 0 0; padding: 10px 12px; border-radius: 8px; color: #315b78; background: #deeff9; font-size: .72rem; line-height: 1.5; }
.document-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.document-card { display: grid; grid-template-columns: 64px 1fr; gap: 16px; padding: 20px; }
.document-inactive { opacity: .65; }
.document-type { width: 58px; height: 68px; display: grid; place-items: center; border-radius: 9px; color: white; background: linear-gradient(145deg, var(--navy), var(--blue)); font-size: .72rem; font-weight: 900; }
.document-content h3 { margin: 7px 0; color: var(--navy); font-family: Georgia, serif; }
.document-content p { margin: 0 0 13px; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.document-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--blue); font-size: .66rem; font-weight: 800; text-transform: uppercase; }
.document-file span, .document-file small { display: block; }
.document-file span { font-size: .72rem; font-weight: 700; }
.document-file small { margin-top: 3px; color: var(--muted); font-size: .65rem; }
.document-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
.form-divider { position: relative; margin: 13px 0 2px; border-top: 1px solid var(--line); }
.form-divider span { position: relative; top: -9px; padding-right: 10px; color: var(--navy); background: white; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.setting-current { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; padding: 16px; border-radius: 11px; color: var(--navy); background: var(--sky); }
.setting-current span { font-size: .75rem; font-weight: 700; }
.setting-current strong { font-family: Georgia, serif; font-size: 1.45rem; }
.statement-tabs { display: flex; gap: 9px; margin-bottom: 17px; }
.statement-table { min-width: 920px; }
.statement-table td:not(:nth-child(3)), .statement-table th:not(:nth-child(3)) { white-space: nowrap; }
.statement-table tfoot td { padding: 14px 15px; border-top: 2px solid var(--navy); color: var(--navy); background: #f8fafc; }
.provider-summary { padding: 18px 24px; border-top: 1px solid var(--line); }
.provider-summary h4 { margin: 0 0 10px; color: var(--navy); font-family: Georgia, serif; }
.provider-summary > div { display: flex; justify-content: space-between; gap: 15px; padding: 9px 0; border-bottom: 1px solid #edf1f4; font-size: .78rem; }
.collection-warning { margin-bottom: 17px; padding: 13px 16px; border: 1px solid #efd6a7; border-radius: 11px; color: #76500d; background: #fff8e9; font-size: .78rem; }
.collection-table input { min-width: 95px; padding: 8px 9px; text-align: right; }
.collection-table tr.collection-found { background: #f8fffc; }
.collection-table tr.collection-mismatch { background: #fff8e9; }
.collection-table tr.collection-mismatch input { border-color: #d69a2d; background: #fffdf8; }
.collection-table tr.collection-not-reported { background: #fffafb; }
.collection-actions { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 24px; border-top: 1px solid var(--line); }
.collection-actions p { margin: 0; color: var(--muted); font-size: .75rem; }
.already-applied { padding: 13px 24px; color: var(--green); background: #e8f6f1; font-size: .78rem; font-weight: 800; }
.collection-history-title { margin-top: 28px; }
.btn:disabled { cursor: not-allowed; opacity: .55; }
.provider-received-meta, .ledger-filters { display: flex; align-items: end; gap: 12px; padding: 17px 20px; border-bottom: 1px solid var(--line); }
.provider-received-meta label, .ledger-filters label { min-width: 175px; margin: 0; }
.collection-import-panel { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 20px; border-bottom: 1px solid var(--line); background: #f8fbff; }
.collection-import-panel strong { display: block; color: var(--navy); font-size: .9rem; }
.collection-import-panel span { display: block; margin-top: 4px; color: var(--muted); font-size: .76rem; line-height: 1.4; }
.collection-import-panel .btn { flex: 0 0 auto; }
.provider-entry-table input, .provider-entry-table select { min-width: 105px; padding: 8px; }
.provider-entry-table [data-field="description"] { min-width: 170px; }
.provider-entry-table .installment-inline { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.provider-entry-table .installment-inline input { min-width: 72px; width: 78px; }
.import-excel-button { display: inline-flex; align-items: center; justify-content: center; margin: 0; }
.import-errors { padding: 13px 20px; color: #8d2734; background: #feecef; font-size: .76rem; }
.import-errors ul { margin: 7px 0 0; padding-left: 20px; }
.import-success { padding: 13px 20px; color: var(--green); background: #e8f6f1; font-size: .78rem; font-weight: 800; }
.ledger-filters { margin-bottom: 17px; border: 1px solid var(--line); border-radius: 14px; background: white; }
.financial-report-filter { display: flex; align-items: end; gap: 15px; margin-top: 22px; }
.financial-report-filter > div { margin-right: auto; }
.financial-report-filter h3 { margin: 0; color: var(--navy); font-family: Georgia, serif; }
.financial-report-filter label { margin: 0; }
.checkbox-label { display: flex; align-items: center; grid-template-columns: auto 1fr; }
.checkbox-label input { width: auto; }
.kardex-table { table-layout: fixed; }
.kardex-table th:nth-child(1), .kardex-table td:nth-child(1) { width: 19%; }
.kardex-table th:nth-child(2), .kardex-table td:nth-child(2) { width: 32%; }
.kardex-table th:nth-child(3), .kardex-table td:nth-child(3),
.kardex-table th:nth-child(4), .kardex-table td:nth-child(4),
.kardex-table th:nth-child(5), .kardex-table td:nth-child(5) { width: 16.33%; text-align: right; }
.positive { color: var(--green); }
.negative { color: var(--red); }
@media (max-width: 780px) {
  .provider-received-meta, .ledger-filters { align-items: stretch; flex-direction: column; }
  .provider-received-meta label, .ledger-filters label { min-width: 0; }
  .financial-report-filter { align-items: stretch; flex-direction: column; }
  .context-grid { grid-template-columns: 1fr 1fr; }
  .document-grid { grid-template-columns: 1fr; }
}
.hero::after { content: ""; position: absolute; width: 270px; height: 270px; right: -100px; top: -130px; border: 35px solid rgba(255,255,255,.07); border-radius: 50%; }
.hero h2 { margin: 3px 0 8px; font-family: Georgia, serif; font-size: 1.7rem; font-weight: 500; }
.hero p { max-width: 650px; margin: 0; color: #d6e7f5; }
.hero .btn { position: relative; z-index: 1; align-self: center; white-space: nowrap; background: white; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 23px; }
.member-totals { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.metric { position: relative; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 7px 24px rgba(32,67,96,.04); }
.metric-icon { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 20px; border-radius: 10px; color: var(--blue); background: var(--sky); font-weight: 800; }
.metric.red .metric-icon { color: var(--red); background: #feeff1; }
.metric.green .metric-icon { color: var(--green); background: #e8f6f1; }
.metric.amber .metric-icon { color: var(--amber); background: #fff4df; }
.metric-label { display: block; color: var(--muted); font-size: .74rem; font-weight: 700; }
.metric-value { display: block; margin-top: 6px; color: var(--navy); font-family: Georgia, serif; font-size: 1.75rem; }
.metric-foot { display: block; margin-top: 8px; color: #8796a3; font-size: .68rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.card { border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 8px 25px rgba(32,67,96,.04); overflow: hidden; }
.card-pad { padding: 21px; }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 18px 20px; border-bottom: 1px solid var(--line); }
.card-head h3 { margin: 0; color: var(--navy); font-family: Georgia, serif; font-size: 1.15rem; }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin: 0 0 18px; }
.section-head h2 { margin: 0; color: var(--navy); font-family: Georgia, serif; }
.section-head p { margin: 5px 0 0; color: var(--muted); font-size: .84rem; }
.section-head.compact { margin-top: 24px; margin-bottom: 12px; }
.history-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.member-status-history { margin-top: 8px; padding-top: 14px; border-top: 1px solid var(--line); }
.member-status-history h3 { margin: 0 0 10px; color: var(--navy); font-family: Georgia, serif; }
.member-status-history table { font-size: .78rem; }
.profile-status-history { margin-top: 18px; }
.profile-status-history h3 { margin: 0 0 6px; color: var(--navy); font-family: Georgia, serif; }
.action-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 18px; }
.quick-action { padding: 15px 10px; border: 1px solid var(--line); border-radius: 10px; color: var(--navy); background: #fbfdff; text-align: center; font-size: .75rem; font-weight: 750; }
.quick-action span { display: block; margin-bottom: 8px; color: var(--blue); font-size: 1.25rem; }
.discount-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid #edf1f4; }
.discount-row:last-child { border: 0; }
.discount-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--blue); }
.discount-row div { flex: 1; }
.discount-row strong, .discount-row span { display: block; }
.discount-row span { margin-top: 3px; color: var(--muted); font-size: .7rem; }
.discount-total { display: flex; justify-content: space-between; margin-top: 12px; padding-top: 14px; border-top: 2px solid var(--navy); color: var(--navy); font-weight: 800; }

.toolbar { display: flex; align-items: center; gap: 10px; margin-bottom: 15px; }
.toolbar input, .toolbar select { max-width: 260px; margin: 0; }
.toolbar .btn:first-of-type { margin-left: auto; }
.report-filters { display: flex; align-items: end; gap: 14px; margin-bottom: 18px; padding: 17px 20px; }
.report-filters label { min-width: 220px; margin: 0; }
.monthly-report { overflow: hidden; }
.report-heading { display: flex; align-items: center; gap: 22px; padding: 22px 25px; border-bottom: 1px solid var(--line); }
.report-heading img { width: 190px; padding: 7px; border-radius: 10px; background: white; }
.report-heading h3 { margin: 0 0 5px; color: var(--navy); font-family: Georgia, serif; font-size: 1.35rem; text-transform: capitalize; }
.report-heading p:last-child { margin: 0; color: var(--muted); font-size: .78rem; text-transform: capitalize; }
.monthly-table th:nth-child(3), .monthly-table td:nth-child(3) { width: 90px; text-align: center; }
.monthly-table th:nth-child(4), .monthly-table th:nth-child(5),
.monthly-table td:nth-child(4), .monthly-table td:nth-child(5) { width: 130px; text-align: right; }
.monthly-table tfoot th, .monthly-table tfoot td { padding: 12px 15px; border-top: 1px solid var(--line); background: white; }
.monthly-table tfoot th { text-align: right; color: var(--ink); font-size: .76rem; text-transform: none; }
.monthly-table .report-total th, .monthly-table .report-total td { border-top: 2px solid var(--navy); color: var(--navy); font-size: .9rem; }
.report-note { margin: 0; padding: 13px 24px; color: var(--muted); background: #f8fafc; font-size: .72rem; }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; font-size: .79rem; }
th { padding: 12px 15px; color: #668096; background: #f6f9fb; text-align: left; font-size: .67rem; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
td { padding: 13px 15px; border-top: 1px solid #edf1f4; vertical-align: middle; }
tbody tr:hover { background: #fafcff; }
.money { color: var(--navy); font-weight: 800; white-space: nowrap; }
.badge { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; font-size: .65rem; font-weight: 800; text-transform: capitalize; }
.badge.active, .badge.paid, .badge.approved, .badge.liquidated { color: #0f7659; background: #e5f6ef; }
.badge.pending { color: #9b610c; background: #fff2d8; }
.badge.partial { color: #8b5909; background: #fff2d8; }
.badge.review { color: #286da5; background: #e7f3fc; }
.badge.rejected, .badge.inactive, .badge.cancelled, .badge.overdue { color: #a43442; background: #fee9ec; }
.empty { padding: 45px 20px; color: var(--muted); text-align: center; }
.agreement-card { padding: 20px; }
.provider-card { display: flex; flex-direction: column; align-items: flex-start; }
.provider-logo { width: 82px; height: 82px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; color: var(--navy); font-size: 1.35rem; font-weight: 800; box-shadow: 0 6px 18px rgba(20,55,90,.08); }
.provider-logo img { width: 100%; height: 100%; object-fit: contain; }
.provider-logo.large { width: 130px; height: 130px; margin-bottom: 10px; }
.provider-card-actions { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; }
.provider-form-logo { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 4px 0 18px; }
.provider-form-logo small { color: var(--muted); text-align: center; }
.provider-report-logos { display: flex; align-items: center; gap: 12px; }
.provider-report-logos img { width: 105px !important; height: 76px !important; object-fit: contain; border-radius: 12px; background: white; }
.agreement-card h3 { margin: 12px 0 3px; color: var(--navy); font-family: Georgia, serif; }
.agreement-meta { color: var(--muted); font-size: .76rem; }
.agreement-card p { color: #506274; font-size: .8rem; line-height: 1.55; }
.agreement-icon { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 12px; color: white; background: linear-gradient(135deg, var(--navy), var(--blue)); }
.progress { height: 7px; margin: 9px 0; border-radius: 999px; background: #e7edf2; overflow: hidden; }
.progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue), #52a7df); }
.loan-balance-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 15px 0; padding: 13px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.loan-balance-grid span, .loan-balance-grid strong, .loan-balance-grid small { display: block; }
.loan-balance-grid span { color: var(--muted); font-size: .67rem; }
.loan-balance-grid strong { margin-top: 3px; color: var(--navy); font-size: .92rem; }
.loan-balance-grid small { margin-top: 2px; color: var(--muted); font-size: .58rem; }
.loan-toolbar { display: flex; align-items: end; gap: 12px; margin-bottom: 16px; padding: 16px 18px; }
.loan-summary-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 4px 0 12px; }
.loan-summary-head h3 { margin: 2px 0 0; color: var(--navy); font-family: Georgia, serif; font-size: 1.25rem; }
.loan-summary-head p { margin: 0; }
.loan-summary-head > span { color: var(--muted); font-size: .75rem; font-weight: 700; }
.loan-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 22px; }
.loan-summary-grid .metric { padding: 17px 18px; }
.loan-summary-grid .metric-icon { margin-bottom: 13px; }
.loan-summary-grid .metric-value { font-size: 1.5rem; }
.loan-toolbar label { min-width: 220px; margin: 0; }
.loan-toolbar input, .loan-toolbar select { margin-bottom: 0; }
.loan-toolbar .loan-summary { margin-left: auto; padding-bottom: 13px; color: var(--muted); font-size: .76rem; font-weight: 700; white-space: nowrap; }
.loan-admin-table { min-width: 1250px; }
.loan-admin-table td:first-child { min-width: 230px; }
.collection-value-box { min-width: 135px; }
.collection-value-box input { margin-bottom: 4px; }
.collection-value-box small, .collection-difference { display: block; font-size: .61rem; white-space: nowrap; }
.collection-value-box small { color: var(--muted); }
.collection-difference { min-height: 14px; margin-top: 2px; font-weight: 750; }
.collection-difference.shortfall { color: #a43442; }
.collection-difference.excess { color: #286da5; }
.collection-summary-table { min-width: 760px; }
.collection-summary-table td small { display: block; margin-top: 4px; color: var(--muted); font-size: .62rem; font-weight: 500; }
.collection-summary-table input { min-width: 160px; margin: 0; }
.collection-received-meta { border-bottom: 1px solid var(--line); }
.immutable-amount { min-width: 190px; padding: 12px 15px; border-radius: 10px; background: #eef6fb; }
.immutable-amount span, .immutable-amount strong, .immutable-amount small { display: block; }
.immutable-amount span, .immutable-amount small { color: var(--muted); font-size: .65rem; }
.immutable-amount strong { margin: 4px 0; color: var(--navy); font-size: 1.15rem; }
.provider-payment-status { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 22px; border-bottom: 1px solid var(--line); }
.provider-payment-status.pending { color: #82550d; background: #fff8e9; }
.provider-payment-status.paid { color: #116c51; background: #eaf8f3; }
.provider-payment-status strong, .provider-payment-status span { display: block; }
.provider-payment-status span { margin-top: 4px; font-size: .72rem; }
.provider-movement-heading { margin-top: 4px; }
.provider-movement-summary { margin-bottom: 16px; }
.provider-movement-filters { display: flex; align-items: end; gap: 12px; margin-bottom: 16px; padding: 16px 18px; }
.provider-movement-filters label { min-width: 170px; margin: 0; }
.provider-movement-filters select, .provider-movement-filters input { margin: 0; }
.provider-movement-table { min-width: 1350px; }
.collection-pending-total.negative { color: #a43442; }
.apu-summary-table { max-width: 980px; margin: 0 auto; font-size: .88rem; }
.apu-summary-table th:last-child, .apu-summary-table td:last-child { text-align: right; }
.print-only { display: none; }
.request-actions { display: flex; gap: 7px; flex-wrap: wrap; }
.request-kardex-title { margin-top: 28px; }
.request-history-filters { display: flex; align-items: end; gap: 12px; margin-bottom: 16px; padding: 16px 18px; }
.request-history-filters label { min-width: 170px; margin: 0; }
.request-history-filters select { margin: 0; }
.request-history-table { min-width: 1050px; }
.document-inline-link { color: var(--blue); font-size: .72rem; font-weight: 750; text-decoration: underline; }
.interest-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.disbursement-alert { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.disbursement-receipt { padding: 20px 4px; color: var(--ink); }
.receipt-brand { display: flex; align-items: center; gap: 18px; padding-bottom: 18px; border-bottom: 2px solid var(--navy); }
.receipt-brand img { width: 180px; }
.receipt-brand h2 { margin: 3px 0 0; color: var(--navy); font-family: Georgia, serif; }
.receipt-table { margin-top: 24px; }
.receipt-table th { width: 18%; color: var(--navy); background: #f3f7fa; text-transform: none; }
.signature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; margin-top: 80px; text-align: center; }
.signature-grid div span { display: block; border-top: 1px solid #26394b; }
.signature-grid strong, .signature-grid small { display: block; margin-top: 7px; }
.signature-grid small { color: var(--muted); }
.pagination { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 18px 0 4px; color: var(--muted); font-size: .76rem; font-weight: 700; }
.pagination .btn:disabled { opacity: .45; cursor: not-allowed; }
.savings-history-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; padding: 16px 18px; }
.savings-history-filters label { min-width: 180px; margin: 0; }
.savings-history-filters input, .savings-history-filters select { margin: 0; }
.ledger-kardex-table { min-width: 1150px; }
.ledger-kardex-table th:nth-last-child(-n+4), .ledger-kardex-table td:nth-last-child(-n+4) { text-align: right; }

dialog { width: min(660px, calc(100% - 30px)); max-height: 90vh; padding: 0; border: 0; border-radius: 16px; box-shadow: 0 30px 90px rgba(0,0,0,.25); overflow: auto; }
dialog::backdrop { background: rgba(11,31,50,.62); backdrop-filter: blur(3px); }
.modal-head { position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; padding: 19px 22px; border-bottom: 1px solid var(--line); background: white; z-index: 1; }
.modal-head h2 { margin: 0; color: var(--navy); font-family: Georgia, serif; }
.modal-head .icon-button { color: var(--navy); background: #eef3f7; }
#modal-body { padding: 7px 22px 24px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.form-grid .full { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 22px; }
.password-dialog { width: min(460px, calc(100% - 30px)); }
.password-dialog form { padding: 30px; }
.toast { position: fixed; right: 22px; bottom: 22px; z-index: 9999; max-width: min(460px, calc(100vw - 32px)); padding: 15px 18px; border-radius: 12px; color: white; background: var(--navy); box-shadow: 0 18px 48px rgba(5, 25, 54, .28); opacity: 0; pointer-events: none; transform: translateY(12px); transition: .25s; font-size: .95rem; font-weight: 800; line-height: 1.45; }
.toast.show { opacity: 1; transform: translateY(0); }
.toast.error { color: #7f1d2d; background: #fff0f2; border: 1px solid #ef9fac; box-shadow: 0 18px 48px rgba(127,29,45,.24); }
.modal-toast { margin: 12px 0 16px; padding: 14px 16px; border-radius: 12px; font-size: .9rem; font-weight: 800; line-height: 1.45; }
.modal-toast.error { color: #7f1d2d; background: #fff0f2; border: 1px solid #ef9fac; box-shadow: 0 10px 28px rgba(127,29,45,.14); }
.modal-toast.success { color: #075e45; background: #eaf8f3; border: 1px solid #a8ddcb; box-shadow: 0 10px 28px rgba(7,94,69,.12); }
.form-message { grid-column: 1 / -1; margin: 0 0 12px; padding: 12px 14px; border-radius: 9px; font-size: .78rem; font-weight: 700; line-height: 1.45; }
.form-message-error { color: #8f2332; border: 1px solid #efb6be; background: #fff0f2; }
.form-message-success { color: #116c51; border: 1px solid #a8ddcb; background: #eaf8f3; }
select option:disabled { color: #9aa6b0; }
.authority-grid { margin-top: 16px; }
.authority-title { margin: 0 0 18px; color: var(--navy); font-family: Georgia, serif; }
.email-configuration-warning { color: #82550d; border-color: #efd59a; background: #fff8e9; }
.collection-warning span { display: block; margin-top: 4px; }

@media (max-width: 1050px) {
  .metric-grid { grid-template-columns: repeat(2, 1fr); }
  .login-shell { grid-template-columns: minmax(350px, .85fr) 1.15fr; }
}
@media (max-width: 780px) {
  .login-shell { display: grid; grid-template-columns: 1fr; grid-template-rows: 34vh auto; background: var(--background); }
  .login-brand { grid-row: 1; min-height: 34vh; background-position: center; }
  .login-panel { grid-row: 2; min-height: 66vh; padding: 32px 25px; }
  .app-shell { display: block; }
  .sidebar { position: fixed; left: -270px; width: 250px; transition: left .25s; box-shadow: 15px 0 45px rgba(0,0,0,.2); }
  .sidebar.open { left: 0; }
  .menu-btn { display: block; }
  .topbar { padding: 15px 18px; }
  .date-chip, #print-btn { display: none; }
  .content { padding: 20px 16px 40px; }
  .hero { display: block; padding: 23px; }
  .hero .btn { margin-top: 18px; }
  .grid-2, .grid-3 { grid-template-columns: 1fr; }
  .member-totals { grid-template-columns: 1fr; }
  .toolbar { flex-wrap: wrap; }
  .toolbar .btn:first-of-type { margin-left: 0; }
  .report-filters { align-items: stretch; flex-direction: column; }
  .report-filters label { min-width: 0; }
  .report-heading { align-items: flex-start; flex-direction: column; }
  .profile-layout { grid-template-columns: 1fr; }
  .profile-photo-panel { padding-right: 0; padding-bottom: 22px; border-right: 0; border-bottom: 1px solid var(--line); }
  .identity-box { grid-template-columns: 1fr; }
  .profile-reminder { align-items: flex-start; flex-wrap: wrap; }
  .loan-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .loan-toolbar { align-items: stretch; flex-direction: column; }
  .loan-toolbar label { min-width: 0; }
  .loan-toolbar .loan-summary { margin-left: 0; padding: 0; }
  .request-history-filters { align-items: stretch; flex-direction: column; }
  .request-history-filters label { min-width: 0; }
  .provider-movement-filters { align-items: stretch; flex-direction: column; }
  .provider-movement-filters label { min-width: 0; }
  .savings-history-filters { align-items: stretch; flex-direction: column; }
  .savings-history-filters label { min-width: 0; }
}
@media (max-width: 480px) {
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .metric { padding: 15px; }
  .metric-value { font-size: 1.35rem; }
  .metric-icon { margin-bottom: 12px; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .full { grid-column: auto; }
  .action-list { grid-template-columns: 1fr 1fr; }
  .loan-summary-head { align-items: flex-start; flex-direction: column; }
  .loan-summary-grid { grid-template-columns: 1fr; }
}
@media print {
  @page { size: A4; margin: 14mm 10mm 16mm; }
  thead { display: table-header-group; }
  tfoot { display: table-footer-group; }
  tr, .signature-grid, .report-heading { break-inside: avoid; page-break-inside: avoid; }
  .monthly-report { width: 100% !important; max-width: none !important; overflow: visible !important; box-shadow: none !important; border: 0 !important; }
  .verification-code { overflow-wrap: anywhere; font-size: 8pt; }
  .sidebar, .topbar, .toolbar, .btn, .quick-action { display: none !important; }
  .app-shell { display: block; }
  .content { padding: 0; }
  .table-wrap { width: 100% !important; max-width: 100% !important; overflow: visible !important; }
  .statement-table, .apu-summary-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed;
    font-size: 8.5pt;
  }
  .apu-summary-table th, .apu-summary-table td {
    box-sizing: border-box;
    padding: 9px 7px;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
  .apu-summary-table th:nth-child(1), .apu-summary-table td:nth-child(1) { width: 7%; text-align: center; }
  .apu-summary-table th:nth-child(2), .apu-summary-table td:nth-child(2) { width: 21%; }
  .apu-summary-table th:nth-child(3), .apu-summary-table td:nth-child(3) { width: 49%; }
  .apu-summary-table th:nth-child(4), .apu-summary-table td:nth-child(4) { width: 23%; text-align: right; white-space: nowrap !important; }
  .apu-summary-table tfoot td:first-child { width: 77%; }
  .apu-summary-table tfoot td:last-child { width: 23%; }
  .provider-print-table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed;
    font-size: 7.2pt;
  }
  .provider-print-table th, .provider-print-table td {
    box-sizing: border-box;
    padding: 8px 5px;
    white-space: normal !important;
    overflow-wrap: anywhere;
    vertical-align: top;
  }
  .provider-print-table th:nth-child(1), .provider-print-table td:nth-child(1) { width: 27%; }
  .provider-print-table th:nth-child(2), .provider-print-table td:nth-child(2) { width: 16%; }
  .provider-print-table th:nth-child(3), .provider-print-table td:nth-child(3) { width: 15%; }
  .provider-print-table th:nth-child(4), .provider-print-table td:nth-child(4) { width: 13%; }
  .provider-print-table th:nth-child(5), .provider-print-table td:nth-child(5) { width: 9%; text-align: center; white-space: nowrap !important; }
  .provider-print-table th:nth-child(6), .provider-print-table td:nth-child(6) { width: 12%; text-align: right; white-space: nowrap !important; }
  .provider-print-table th:nth-child(7), .provider-print-table td:nth-child(7) { width: 8%; }
  .provider-print-table th:nth-child(8), .provider-print-table td:nth-child(8) { display: none !important; }
  .provider-print-table tfoot td { font-size: 8pt; }
  .provider-print-table tfoot td:nth-child(6) { display: table-cell !important; width: 12%; }
  .provider-payment-status { break-inside: avoid; page-break-inside: avoid; }
  .provider-payment-status .btn, .collection-actions { display: none !important; }
  .provider-movement-table, .ledger-kardex-table, .loan-admin-table, .request-history-table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed;
    font-size: 6.3pt;
  }
  .provider-movement-table th, .provider-movement-table td,
  .ledger-kardex-table th, .ledger-kardex-table td,
  .loan-admin-table th, .loan-admin-table td,
  .request-history-table th, .request-history-table td {
    padding: 6px 4px;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
  .provider-movement-table th:last-child, .provider-movement-table td:last-child,
  .ledger-kardex-table th:last-child, .ledger-kardex-table td:last-child,
  .loan-admin-table th:last-child, .loan-admin-table td:last-child { display: none !important; }
  .card, .metric { box-shadow: none; break-inside: avoid; }
  body { background: white; }
  .report-filters { display: none !important; }
  .monthly-report { border: 0; }
  .no-print { display: none !important; }
  .print-only { display: block !important; }
  dialog[open] { position: static; width: 100%; max-height: none; overflow: visible; box-shadow: none; }
  dialog[open] .modal-head { display: none; }
  dialog[open] #modal-body { padding: 0; }
  body:has(dialog[open]) #app-view { display: none !important; }
  .signature-grid.print-only { display: grid !important; }
  .apu-signatures { margin-top: 90px; }
}