/* Partner earning pages (/fares/{program}/partners/...). Light and dark (body.dark-mode). */
.pe-crumbs { font-size: 13px; margin: 0 0 8px; }
.pe-head { display: flex; align-items: center; gap: 12px; }
.pe-head img { flex: 0 0 auto; border-radius: 6px; }
.pe-sub { color: #555; margin: 4px 0 14px; font-size: 14px; }
.pe-calc { border: 1px solid #cfe3f3; border-radius: 10px; padding: 14px; background: #f5faff; margin: 0 0 18px; }
.pe-calc h2 { margin: 0 0 10px; }
.pe-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; align-items: end; }
.pe-grid label { display: block; font-size: 13px; font-weight: 600; color: #003a70; }
.pe-grid label small { font-weight: 400; }
.pe-grid input, .pe-grid select { display: block; width: 100%; box-sizing: border-box; margin-top: 4px; padding: 8px; font-size: 15px; border: 1px solid #b8c7d6; border-radius: 6px; background: #fff; color: #111; }
.pe-go { margin-top: 10px; padding: 9px 18px; font-size: 15px; border: 0; border-radius: 6px; background: #1078b3; color: #fff; cursor: pointer; }
.pe-go:hover { background: #0d6aa0; }
.pe-result { margin-top: 12px; }
.pe-result p { margin: 2px 0; }
.pe-big { font-size: 24px; font-weight: 700; color: #003a70; }
.pe-explain { color: #555; font-size: 13px; }
.pe-error { color: #b00020; }
.pe-nocalc { border: 1px dashed #b8c7d6; border-radius: 10px; padding: 12px; margin: 0 0 18px; }
.pe-section { margin: 18px 0; }
.pe-table td.pe-classes { font-weight: 600; letter-spacing: 1px; }
.pe-checked { color: #555; font-size: 13px; margin-top: 22px; word-break: break-word; }
@media (max-width: 767px) {
  .pe-grid { grid-template-columns: 1fr 1fr; }
}
body.dark-mode .pe-calc { background: #1d2733; border-color: #2f4256; }
body.dark-mode .pe-grid label, body.dark-mode .pe-big { color: #4da6ff; }
body.dark-mode .pe-grid input, body.dark-mode .pe-grid select { background: #111a24; color: #eee; border-color: #3a4d61; }
body.dark-mode .pe-sub, body.dark-mode .pe-explain, body.dark-mode .pe-checked { color: #bbb; }
body.dark-mode .pe-error { color: #ff8a80; }
body.dark-mode .pe-nocalc { border-color: #3a4d61; }
/* Size set here: the site-wide img rules (width:auto, display:block) would otherwise ignore the width/height attributes. */
.pe-table td .pe-logo { display: inline-block; width: 28px; height: 28px; vertical-align: middle; margin-right: 8px; border-radius: 4px; }
@media (max-width: 767px) { .pe-table td .pe-logo { width: 22px; height: 22px; margin-right: 6px; } }
