/* Loan comparison – shared styles for the standalone page (.lc-full) and quote page (.lc-compact).
   Rendered by includes/loan_comparison.cfm. Bootstrap 4 / Porto. */

.lc-wrap {
  --lc-brand: #80014F; --lc-brand-soft: #F7EEF3; --lc-border: #eadbe3;
  --lc-yes: #1E8C3A; --lc-yes-bg: #E3F4E7; --lc-no: #C62828; --lc-no-bg: #FBE7E7;
  --lc-part: #404040; --lc-text: #1A1A1A; --lc-grid: #dee2e6;
}
.lc-wrap .lc-yes  { color: var(--lc-yes); }
.lc-wrap .lc-no   { color: var(--lc-no); }
.lc-wrap .lc-part { color: var(--lc-part); }
.lc-wrap strong   { color: var(--lc-text); }

/* ---------- Intro (full mode) ---------- */
.lc-wrap .lc-title { color: var(--lc-brand); font-weight: 700; margin-bottom: .5rem; }
.lc-wrap .lc-intro { margin-bottom: 1rem; }
.lc-wrap .lc-intro .lead { margin-bottom: 0; }

/* ---------- Key ---------- */
.lc-wrap .lc-key { margin-bottom: .75rem; }
.lc-wrap .lc-key i { font-size: 1.1em; }

/* ---------- Table ---------- */
.lc-wrap .lc-table { min-width: 680px; margin-bottom: 0; }
.lc-wrap .lc-table th, .lc-wrap .lc-table td { border-color: var(--lc-grid); }
.lc-wrap .lc-table thead th { background: var(--lc-brand); color: #fff; font-weight: 700; text-align: center; vertical-align: middle; border-color: var(--lc-brand); border-bottom-width: 1px; }
.lc-wrap .lc-table thead th:first-child,
.lc-wrap .lc-table th[scope="row"],
.lc-wrap .lc-table .lc-group th { text-align: left; }
.lc-wrap .lc-table th[scope="row"] { font-weight: 400; color: var(--lc-text); vertical-align: middle; width: 32%; background: #fff; }
.lc-wrap .lc-table td { text-align: center; vertical-align: middle; width: 17%; font-size: 1.15rem; }
.lc-wrap .lc-table td.lc-c-y { background: var(--lc-yes-bg); }
.lc-wrap .lc-table td.lc-c-n { background: var(--lc-no-bg); }
.lc-wrap .lc-table td.lc-c-t { font-size: inherit; color: var(--lc-text); }
.lc-wrap .lc-table .lc-group th { background: var(--lc-brand-soft); color: var(--lc-brand); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; font-size: .85em; }

/* Keep the feature column visible when the table scrolls on phones */
@media (max-width: 767.98px) {
  .lc-wrap .lc-table th[scope="row"],
  .lc-wrap .lc-table thead th:first-child { position: sticky; left: 0; z-index: 1; box-shadow: 2px 0 0 var(--lc-grid); }
  .lc-wrap .lc-table thead th:first-child { background: var(--lc-brand); }
  .lc-wrap .lc-table .lc-group th { position: static; }
}

/* ---------- Why choose ---------- */
.lc-wrap .lc-why { background: var(--lc-brand-soft); border-top: 3px solid var(--lc-brand); padding: 2rem; margin: 2.5rem 0; }
.lc-wrap .lc-why h2 { color: var(--lc-brand); font-weight: 700; font-size: 1.5rem; margin: 0 0 1.25rem; }
.lc-wrap .lc-why ul { list-style: none; padding: 0; margin: 0 0 1rem; }
.lc-wrap .lc-why li { position: relative; padding-left: 1.6rem; margin-bottom: .75rem; }
.lc-wrap .lc-why li > i { position: absolute; left: 0; top: .3em; color: var(--lc-brand); }

/* ---------- Notes ---------- */
.lc-wrap .lc-notes h3 { color: var(--lc-brand); font-weight: 700; font-size: 1.25rem; margin: 0 0 .75rem; }
.lc-wrap .lc-notes ol { padding-left: 1.25rem; }
.lc-wrap .lc-notes li { margin-bottom: .6rem; }
.lc-wrap .lc-notes li::marker { color: var(--lc-brand); font-weight: 700; }
.lc-wrap .lc-small { font-style: italic; margin: 0; }

/* ---------- "More info" note badges ---------- */
.lc-wrap .lc-info { position: relative; overflow: hidden; padding: 0; border: 0; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center;
  width: 1.35em; height: 1.35em; margin-left: .3em; border-radius: 50%; background: var(--lc-brand); color: #fff !important; font-size: .72em; font-weight: 700; line-height: 1;
  text-decoration: none !important; vertical-align: .15em; cursor: help; transition: transform .15s, box-shadow .15s; }
.lc-wrap .lc-info:hover, .lc-wrap .lc-info:focus, .lc-wrap .lc-info[aria-expanded="true"] { transform: scale(1.12); box-shadow: 0 0 0 3px var(--lc-brand-soft); outline: none; }

/* ---------- Popup (appended to <body>, so not scoped) ---------- */
.lc-pop { position: absolute; z-index: 1080; max-width: 340px; width: max-content; background: #fff; color: #1A1A1A; border: 1px solid #e3cfd9; border-top: 3px solid #80014F;
  border-radius: 6px; box-shadow: 0 10px 30px rgba(0,0,0,.15); padding: .8rem 1rem .9rem; font-size: .875rem; line-height: 1.5;
  opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .15s, transform .15s, visibility .15s; }
.lc-pop.show { opacity: 1; visibility: visible; transform: none; }
.lc-pop strong { color: #1A1A1A; }
.lc-pop-title { display: flex; align-items: center; color: #80014F; font-weight: 700; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; margin-bottom: .35rem; }
.lc-pop-title i { margin-right: .4rem; }
.lc-pop-arrow { position: absolute; width: 12px; height: 12px; background: #fff; border: 1px solid #e3cfd9; transform: rotate(45deg); }
.lc-pop[data-place="below"] .lc-pop-arrow { top: -8px; border-right: 0; border-bottom: 0; background: #80014F; border-color: #80014F; }
.lc-pop[data-place="above"] .lc-pop-arrow { bottom: -7px; border-left: 0; border-top: 0; }
@media (max-width: 575.98px) { .lc-pop { max-width: calc(100vw - 24px); } }

/* =========================================================
   Compact mode (quote page): summary strip + expandable body
   ========================================================= */
.lc-compact { border: 1px solid var(--lc-border); border-left: 4px solid var(--lc-brand); background: #fff; border-radius: 4px; margin: 0 0 2rem; font-size: .85rem; }
.lc-compact .lc-head { padding: 1rem 1.25rem; }
.lc-compact .lc-head h4 { color: var(--lc-brand); font-size: 1.25rem; font-weight: 700; margin: 0 0 .5rem; letter-spacing: 0; }
.lc-compact .lc-summary-intro { margin: 0 0 .5rem; color: var(--lc-text); }
.lc-compact .lc-points { list-style: none; padding: 0; margin: 0 0 .75rem; display: flex; flex-wrap: wrap; }
.lc-compact .lc-points li { position: relative; padding-left: 1.3rem; margin: 0 1.25rem .3rem 0; color: var(--lc-text); }
.lc-compact .lc-points i { position: absolute; left: 0; top: .2em; color: var(--lc-yes); }
.lc-compact .lc-toggle, .lc-compact .lc-hide { background: var(--lc-brand-soft); color: var(--lc-brand); border: 1px solid #e3cfd9; border-radius: 3px; padding: .35rem .8rem; font-size: .8rem; font-weight: 700; cursor: pointer; }
.lc-compact .lc-toggle:hover, .lc-compact .lc-toggle:focus, .lc-compact .lc-hide:hover, .lc-compact .lc-hide:focus { background: var(--lc-brand); color: #fff; outline: none; }
.lc-compact .lc-hide i { margin-left: .4rem; }
.lc-compact .lc-foot { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #f0e6eb; text-align: center; }
.lc-compact .lc-toggle i { transition: transform .2s; margin-left: .4rem; }
.lc-compact .lc-toggle[aria-expanded="true"] i { transform: rotate(180deg); }

.lc-compact .lc-body { overflow: hidden; transition: height .3s ease; }
.lc-compact .lc-body[hidden] { display: block; height: 0; visibility: hidden; }
.lc-compact .lc-inner { padding: 1rem 1.25rem 1.25rem; border-top: 1px solid #f0e6eb; }

.lc-compact .lc-key { font-size: .8rem; margin-bottom: .5rem; }
.lc-compact .lc-table { min-width: 600px; font-size: .8rem; }
.lc-compact .lc-table th, .lc-compact .lc-table td { padding: .4rem .6rem; }
.lc-compact .lc-table th[scope="row"] { width: 36%; }
.lc-compact .lc-table td { width: 16%; font-size: .95rem; }
.lc-compact .lc-table td.lc-c-t { font-size: .8rem; }
.lc-compact .lc-table .lc-group th { font-size: .72rem; padding: .3rem .6rem; }
.lc-compact .lc-why { border-top: 0; border-radius: 3px; padding: 1rem 1.25rem; margin: 1.25rem 0; }
.lc-compact .lc-why h2 { font-size: .9rem; margin-bottom: .6rem; }
.lc-compact .lc-why li { padding-left: 1.4rem; margin-bottom: .45rem; }
.lc-compact .lc-why li > i { top: .2em; }
.lc-compact .lc-notes h3 { font-size: .85rem; margin-bottom: .4rem; }
.lc-compact .lc-notes ol { font-size: .78rem; padding-left: 1.2rem; margin-bottom: .6rem; }
.lc-compact .lc-notes li { margin-bottom: .35rem; }
.lc-compact .lc-small { font-size: .75rem; }
.lc-compact .lc-info { font-size: .7rem; width: 1.4em; height: 1.4em; vertical-align: .1em; }
.lc-pop.lc-pop-compact { font-size: .8rem; }

/* Always print the full comparison */
@media print {
  .lc-compact .lc-body, .lc-compact .lc-body[hidden] { height: auto !important; visibility: visible !important; display: block !important; }
  .lc-compact .lc-toggle, .lc-compact .lc-foot { display: none; }
}