.shalom-panel,
.shalom-panel-login,
.shalom-panel-denied {
  --panel-navy: #102f4b;
  --panel-deep: #0a2339;
  --panel-gold: #d3a45f;
  --panel-green: #2e7d62;
  --panel-red: #b44a47;
  --panel-ivory: #f7f3eb;
  width: min(1240px,calc(100% - 32px));
  margin: 0 auto;
  color: var(--panel-navy);
  font-family: Arial,sans-serif;
}

.shalom-panel { padding: 64px 0 100px; }
.shalom-panel-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.shalom-panel-kicker { margin: 0 0 10px; color: var(--panel-gold); font-size: 10px; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.shalom-panel-header h1 { margin: 0 0 9px; font: 400 clamp(42px,6vw,66px)/1 Georgia,serif; letter-spacing: -.045em; }
.shalom-panel-header span { color: #6d7d88; }
.shalom-panel-header > div:last-child { display: flex; flex-wrap: wrap; gap: 10px; }
.shalom-panel-header a { min-height: 42px; padding: 0 18px; display: inline-flex; align-items: center; color: var(--panel-navy); border: 1px solid rgba(16,47,75,.2); border-radius: 99px; font-size: 11px; font-weight: 800; text-decoration: none; }

.shalom-panel-nav { margin: 38px 0 28px; padding: 7px; display: flex; gap: 5px; overflow-x: auto; background: #ebe5da; border-radius: 12px; }
.shalom-panel-nav a { min-height: 42px; padding: 0 19px; display: inline-flex; align-items: center; justify-content: center; color: #637582; border-radius: 8px; font-size: 12px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.shalom-panel-nav a.is-active { color: #fff; background: var(--panel-navy); box-shadow: 0 7px 16px rgba(10,35,57,.18); }

.shalom-panel-notice { margin: 0 0 20px; padding: 15px 18px; border-radius: 10px; font-size: 13px; font-weight: 700; }
.shalom-panel-notice.is-success { color: #245e4c; background: #e3f1eb; border: 1px solid #c8e4d8; }
.shalom-panel-notice.is-error { color: #8c3835; background: #f7e5e3; border: 1px solid #edcbc8; }

.shalom-panel-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px; }
.shalom-panel-kpis > a,
.shalom-panel-kpis > div { padding: 23px; display: block; color: var(--panel-navy); background: #fffdf8; border: 1px solid rgba(16,47,75,.12); border-radius: 14px; box-shadow: 0 10px 25px rgba(10,35,57,.05); text-decoration: none; }
.shalom-panel-kpis span,.shalom-panel-kpis small { display: block; color: #71818b; }
.shalom-panel-kpis strong { display: block; margin: 13px 0 7px; font-size: clamp(22px,3vw,29px); }
.shalom-panel-kpis small { font-size: 11px; }
.shalom-panel-kpis > a:hover { border-color: var(--panel-gold); transform: translateY(-2px); }
.shalom-panel-kpis .is-overdue { color: #8d3633; border-top: 4px solid var(--panel-red); background: #fff8f7; }

.shalom-overdue-alert { margin-top: 18px; padding: 17px 20px; display: grid; grid-template-columns: 38px 1fr auto; gap: 15px; align-items: center; color: #7b302d; background: #f9e8e6; border: 1px solid #ecc9c6; border-radius: 12px; text-decoration: none; }
.shalom-overdue-alert > span { width: 34px; height: 34px; display: grid; place-items: center; color: #fff; background: var(--panel-red); border-radius: 50%; font-weight: 900; }
.shalom-overdue-alert strong,.shalom-overdue-alert small { display: block; }
.shalom-overdue-alert small { margin-top: 4px; color: #a35b58; }
.shalom-overdue-alert b { font-size: 12px; }

.shalom-panel-welcome { margin-top: 18px; padding: 54px; display: flex; align-items: center; justify-content: space-between; gap: 40px; color: #fff; background: var(--panel-navy); border-radius: 18px 80px 18px 18px; }
.shalom-panel-welcome > div { max-width: 720px; }
.shalom-panel-welcome h2,.shalom-panel-section-title h2 { margin: 0; font: 400 clamp(28px,4vw,42px)/1.08 Georgia,serif; letter-spacing: -.03em; }
.shalom-panel-welcome > div > p:last-child { max-width: 620px; color: rgba(255,255,255,.68); line-height: 1.65; }
.shalom-panel-primary { min-height: 48px; padding: 0 24px; display: inline-flex; align-items: center; justify-content: center; color: #fff!important; background: var(--panel-gold); border: 0; border-radius: 99px; font-size: 12px; font-weight: 800; text-decoration: none!important; cursor: pointer; white-space: nowrap; }

.shalom-panel-card { padding: 30px; background: #fffdf8; border: 1px solid rgba(16,47,75,.12); border-radius: 16px; box-shadow: 0 10px 25px rgba(10,35,57,.04); }
.shalom-panel-section-title { margin-bottom: 25px; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.shalom-panel-section-title h2 { font-size: 31px; }
.shalom-panel-section-title > a,.shalom-panel-section-title > span { color: #71818b; font-size: 11px; font-weight: 700; text-decoration: none; }
.shalom-panel-split { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 18px; align-items: start; }
.shalom-panel-finance-split { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); margin-top: 18px; }

.shalom-panel-form label { margin-bottom: 17px; display: block; }
.shalom-panel-form label > span { margin-bottom: 7px; display: block; color: #526876; font-size: 11px; font-weight: 800; }
.shalom-panel-form input:not([type="file"]),.shalom-panel-form textarea,.shalom-panel-form select { width: 100%; min-height: 47px; padding: 10px 12px; color: var(--panel-navy); background: #fff; border: 1px solid rgba(16,47,75,.18); border-radius: 8px; box-sizing: border-box; font: 14px/1.4 Arial,sans-serif; }
.shalom-panel-form textarea { resize: vertical; }
.shalom-panel-form input:focus,.shalom-panel-form textarea:focus,.shalom-panel-form select:focus { outline: 2px solid rgba(211,164,95,.35); border-color: var(--panel-gold); }
.shalom-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 15px; }
.shalom-form-grid .is-wide { grid-column: 1/-1; }
.shalom-panel-form > .shalom-panel-primary { margin-top: 8px; }
.shalom-panel-help { margin: 0 0 22px; padding: 14px; color: #657985; background: #f1eee7; border-radius: 8px; font-size: 12px; line-height: 1.55; }

.shalom-panel-media-title { margin-top: 35px; padding-top: 28px; border-top: 1px solid rgba(16,47,75,.12); }
.shalom-image-fields { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.shalom-image-fields label { padding: 12px; background: #f4f0e8; border-radius: 10px; }
.shalom-image-fields img { width: 100%; height: 110px; margin: 0 0 9px; display: block; object-fit: cover; border-radius: 7px; }
.shalom-image-fields input { max-width: 100%; font-size: 10px; }
.shalom-image-fields small { margin-top: 7px; display: block; color: #85929a; font-size: 9px; }

.shalom-panel-list > a,.shalom-panel-list > div { padding: 15px 2px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--panel-navy); border-bottom: 1px solid rgba(16,47,75,.1); text-decoration: none; }
.shalom-panel-list > a:last-child,.shalom-panel-list > div:last-child { border-bottom: 0; }
.shalom-panel-list span strong,.shalom-panel-list span small { display: block; }
.shalom-panel-list span small { margin-top: 5px; color: #7f8e96; font-size: 11px; }
.shalom-panel-list b { font-size: 11px; white-space: nowrap; }
.shalom-panel-list a:hover strong { color: #ad7931; }
.shalom-panel-list a.is-overdue { margin-inline: -10px; padding-inline: 12px; color: #8d3633; background: #fff0ee; border-radius: 8px; }
.shalom-panel-empty { padding: 45px 20px!important; justify-content: center!important; color: #788993; background: #f1eee7; border: 0!important; border-radius: 10px; text-align: center; }
.shalom-member-list > div { justify-content: flex-start; }
.shalom-member-list > div > b { margin-left: auto; padding: 6px 9px; color: #32644f; background: #e4f0ea; border-radius: 99px; }
.shalom-member-avatar { width: 36px; height: 36px; display: grid!important; place-items: center; color: #fff; background: var(--panel-navy); border-radius: 50%; font-weight: 800; }

.shalom-front-chart { margin-bottom: 32px; }
.shalom-front-chart > div { display: grid; grid-template-columns: 125px 1fr 88px; gap: 12px; align-items: center; margin: 16px 0; font-size: 11px; }
.shalom-front-chart > div > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.shalom-front-chart i { height: 15px; display: flex; overflow: hidden; background: #ecf0f1; border-radius: 99px; }
.shalom-front-chart i b { display: block; background: var(--panel-green); }
.shalom-front-chart i em { display: block; background: var(--panel-gold); }
.shalom-front-chart > div > strong { text-align: right; }
.shalom-payments-title { margin-top: 30px; padding-top: 24px; border-top: 1px solid rgba(16,47,75,.1); }

.shalom-panel-login,.shalom-panel-denied { max-width: 520px; min-height: 60vh; padding: 80px 0; }
.shalom-panel-login h1,.shalom-panel-denied h1 { font: 400 48px/1 Georgia,serif; }
.shalom-panel-login form { padding: 30px; background: #fff; border-radius: 15px; }
.shalom-panel-login label { display: block; font-weight: 700; }
.shalom-panel-login input[type="text"],.shalom-panel-login input[type="password"] { width: 100%; min-height: 46px; box-sizing: border-box; }
.shalom-panel-login .button,.shalom-panel-denied a { padding: 13px 22px; color: #fff; background: var(--panel-navy); border: 0; border-radius: 99px; text-decoration: none; }

@media (max-width: 960px) {
  .shalom-panel-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .shalom-panel-split,.shalom-panel-finance-split { grid-template-columns: 1fr; }
  .shalom-image-fields { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 650px) {
  .shalom-panel { padding: 45px 0 75px; }
  .shalom-panel-header { align-items: flex-start; flex-direction: column; }
  .shalom-panel-kpis { grid-template-columns: 1fr; }
  .shalom-panel-welcome { padding: 34px 25px; align-items: flex-start; flex-direction: column; border-radius: 16px 55px 16px 16px; }
  .shalom-panel-card { padding: 24px 19px; }
  .shalom-form-grid { grid-template-columns: 1fr; }
  .shalom-image-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .shalom-front-chart > div { grid-template-columns: 90px 1fr; }
  .shalom-front-chart > div > strong { display: none; }
  .shalom-overdue-alert { grid-template-columns: 34px 1fr; }
  .shalom-overdue-alert > b { display: none; }
}