/* DATATRANS PAY | public/assets/css/datatrans-pay.css | v2026.10.15
   Feladat: a korábbi narancs Datatrans arculat és reszponzív sticky footer. */
:root { --datatrans-orange: #ff6a00; }
body { color: #212529; background: #fff; }
.site-header { border-bottom: 3px solid #ef5809; }
.brand-logo { max-width: min(100%, 310px); height: auto; max-height: 105px; }
.bg-datatrans { background-color: var(--datatrans-orange) !important; }
.text-narancs { color: #ff6b00; }
a.urlap { color: #d95400; }
a.urlap:hover { color: #283262; }
.footer { border-top: 3px solid #333; }
.footer a { color: #c6f1ff; }
.footer a:hover { color: #fff; text-decoration: underline; }
.card-brands { width: 100%; max-width: 600px; height: auto; }
.result-icon { max-height: 180px; }
.payment-result-card { max-width: 820px; margin-left: auto; margin-right: auto; overflow: hidden; border: 0; border-radius: 1rem; box-shadow: 0 .5rem 1.5rem rgb(33 37 41 / 8%); }
.payment-result-card .card-header { border: 0; }
.payment-result-success { border: 1px solid #b7dfc7; }
.payment-result-success .card-body { background: #f1faf4; }
.payment-result-success .payment-result-details > div { border: 1px solid #d9eee0; background: #fff; }
.payment-result-danger { border: 1px solid #f0c1c5; }
.payment-result-danger .card-body { background: #fff5f5; }
.payment-result-danger .payment-result-details > div { border: 1px solid #f5d7da; background: #fff; }
.payment-result-icon { width: 2.5rem; height: 2.5rem; flex: 0 0 auto; padding: .25rem; border-radius: 50%; background: #fff; }
.payment-result-description { margin-bottom: 1.25rem; line-height: 1.65; }
.payment-result-message { margin-bottom: 1.25rem; padding: 1.1rem 1.25rem; border-left: 5px solid; border-radius: .65rem; font-size: 1.08rem; line-height: 1.6; }
.payment-result-message-success { border-color: #198754; background: #e8f5ec; color: #14532d; }
.payment-result-message-danger { border-color: #c73542; background: #fff0f1; color: #842029; }
.payment-result-code-advice { margin: 0 0 1.25rem; padding: 1rem 1.15rem; border: 1px solid #f0c1c5; border-radius: .65rem; background: #fff; line-height: 1.6; }
.payment-time-limit { margin: 0 0 1.25rem; padding: 1rem; border-left: 4px solid #e7a900; border-radius: .5rem; background: #fff8e9; line-height: 1.6; }
.payment-result-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.payment-result-details > div { min-width: 0; padding: .9rem 1rem; border-radius: .75rem; background: #f6f7f9; }
.payment-result-details dt { margin-bottom: .25rem; color: #5b6470; font-size: .85rem; font-weight: 400; }
.payment-result-details dd { margin: 0; font-weight: 700; overflow-wrap: anywhere; }
.online-code-title { font-size: clamp(1.35rem, 1rem + 1.5vw, 2rem); line-height: 1.25; }
.online-code-prompt { font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem); line-height: 1.4; }
.online-code-card { border: 0; border-radius: 1rem; overflow: hidden; box-shadow: 0 .5rem 1.5rem rgb(33 37 41 / 8%); }
.online-code-input { min-height: 3.5rem; border-radius: .75rem; font-size: clamp(1.2rem, 1rem + 1vw, 1.6rem); font-weight: 600; letter-spacing: .06em; }
.online-code-input::placeholder { color: #adb5bd; opacity: 1; font-weight: 400; }
.online-code-button {
  --bs-btn-color: #ffffff;
  --bs-btn-bg: var(--datatrans-orange);
  --bs-btn-border-color: var(--datatrans-orange);
  --bs-btn-hover-color: #212529;
  --bs-btn-hover-bg: #f06000;
  --bs-btn-hover-border-color: #f06000;
  --bs-btn-active-color: #212529;
  --bs-btn-active-bg: #e65c00;
  --bs-btn-active-border-color: #e65c00;
  --bs-btn-focus-shadow-rgb: 255, 106, 0;
  padding: 0.9rem 1.75rem;
  border-radius: .75rem;
  font-weight: 700;
  box-shadow: 0 .25rem .75rem rgb(240 96 0 / 20%);
  margin-top: 0.75rem;
}
.online-code-invoice-image { width: 100%; max-width: 320px; height: auto; }
.cib-information { line-height: 1.7; }
.invoice-payment-logos { padding-top: 1rem; }
.invoice-summary-table .invoice-summary-accent > * {
  --bs-table-bg: var(--datatrans-orange);
  --bs-table-color: #fff;
  --bs-table-border-color: var(--datatrans-orange);
  color: #fff;
  background-color: var(--datatrans-orange);
}
.invoice-payment-card { border: 1px solid #e5e7eb; border-radius: 1rem; box-shadow: 0 .5rem 1.5rem rgb(33 37 41 / 6%); }
.invoice-payment-card .small { line-height: 1.7; overflow-wrap: anywhere; }
.invoice-notice { max-width: 760px; margin: 2rem auto; padding: clamp(1.5rem, 5vw, 3rem); text-align: center; border: 1px solid #e5e7eb; border-top: 4px solid; border-radius: 1rem; background: #fff; box-shadow: 0 .5rem 2rem rgb(33 37 41 / 6%); }
.invoice-notice-paid { border-top-color: #198754; }
.invoice-notice-minimum { border-top-color: #e7a900; }
.invoice-notice-maintenance { border-top-color: var(--datatrans-orange); }
.invoice-notice-icon { width: 80px; height: 80px; margin-bottom: 1.25rem; }
.invoice-notice-label { margin: 0 0 .75rem; font-size: .8rem; font-weight: 700; letter-spacing: .1em; }
.invoice-notice-paid .invoice-notice-label { color: #146c43; }
.invoice-notice-minimum .invoice-notice-label { color: #805a00; }
.invoice-notice-maintenance .invoice-notice-label { color: #a84100; }
.invoice-notice h1, .invoice-notice h2 { margin: 0; font-size: clamp(1.5rem, 4vw, 2rem); line-height: 1.3; font-weight: 700; }
.invoice-notice-description { max-width: 34rem; margin: 1rem auto 1.5rem; color: #5b6470; line-height: 1.7; }
.invoice-notice-details { margin: 0 auto 1.5rem; padding: 1rem 1.25rem; text-align: left; background: #f6f7f9; border-radius: .75rem; }
.invoice-notice-details > div { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; }
.invoice-notice-details dt { color: #5b6470; font-weight: 400; }
.invoice-notice-details dd { margin: 0; font-weight: 600; text-align: right; overflow-wrap: anywhere; min-width: 0; }
.invoice-notice-button { background: #c64b00; border-color: #c64b00; }
.invoice-notice-help { margin: 1.5rem 0 0; font-size: .9rem; line-height: 1.7; color: #5b6470; overflow-wrap: anywhere; }
.invoice-notice-help a { color: #a84100; }
.invoice-query-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; }
.invoice-query-actions .online-code-button { margin-top: 0; }
.invoice-query-secondary { padding: .9rem 1.75rem; border-radius: .75rem; font-weight: 700; }
.invoice-api-response { max-height: 24rem; margin: .75rem 0; padding: 1rem; border: 1px solid #edcb87; border-radius: .5rem; background: #fff; white-space: pre-wrap; overflow-wrap: anywhere; overflow: auto; }
@media (max-width: 576px) {
  .invoice-notice-details > div { flex-direction: column; gap: .25rem; }
  .invoice-notice-details dd { text-align: left; }
  .invoice-notice-button { width: 100%; }
  .invoice-query-actions { display: grid; }
}
@media (max-width: 576px) { .brand-logo { max-width: 230px; } }

/* Indulási hibaoldal: hibás konfiguráció és hiányzó Bootstrap mellett is használható. */
.startup-page { margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: #f6f7f9; font-family: system-ui, sans-serif; }
.startup-header { padding: 1rem clamp(1rem, 5vw, 4rem); background: #fff; }
.startup-main { width: min(100% - 2rem, 760px); margin: auto; padding: 3rem 0; flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 1.5rem; }
.startup-card { padding: clamp(1.5rem, 5vw, 3rem); text-align: center; background: #fff; border: 1px solid #e5e7eb; border-top: 4px solid var(--datatrans-orange); border-radius: 1rem; box-shadow: 0 .5rem 2rem rgb(33 37 41 / 6%); }
.startup-icon { width: 80px; height: 80px; margin-bottom: 1.25rem; }
.startup-eyebrow { margin: 0 0 .75rem; color: #a84100; font-size: .8rem; font-weight: 700; letter-spacing: .1em; }
.startup-card h1 { margin: 0; font-size: clamp(1.5rem, 4vw, 2.1rem); line-height: 1.3; font-weight: 700; }
.startup-description { margin: 1.25rem auto; max-width: 32rem; color: #5b6470; line-height: 1.7; }
.startup-retry { display: inline-block; padding: .9rem 1.75rem; color: #fff; background: var(--datatrans-orange); border: 1px solid var(--datatrans-orange); border-radius: .75rem; text-decoration: none; font-weight: 700; }
.startup-retry:hover { color: #fff; background: #b74700; }
.startup-retry:focus-visible, .startup-footer a:focus-visible { outline: 3px solid #283262; outline-offset: 4px; }
.startup-status { margin: 1.5rem 0 0; color: #66717e; font-size: .8rem; }
.startup-debug { padding: 1.5rem; border: 1px solid #edcb87; border-radius: .75rem; background: #fff8e9; overflow-wrap: anywhere; }
.startup-debug h2 { margin: 0 0 .75rem; font-size: 1.15rem; }
.startup-debug p, .startup-debug li { line-height: 1.6; }
.startup-debug ul { padding-left: 1.5rem; }
.payment-bank-dump { margin-top: .5rem; }
.payment-bank-dump summary { cursor: pointer; font-weight: 600; }
.payment-bank-dump pre { max-height: 20rem; margin: .5rem 0; padding: .75rem; overflow: auto; border: 1px solid #e5e7eb; border-radius: .5rem; background: #fff; font-size: .8rem; }
.startup-debug-note { margin: 1rem 0 0; font-size: .85rem; color: #665333; }
.startup-footer { padding: 1.5rem 1rem; text-align: center; border-top: 1px solid #e5e7eb; background: #fff; font-size: .9rem; }
.startup-footer p { margin: .5rem 0 0; line-height: 1.8; }
.startup-footer a { color: #a84100; overflow-wrap: anywhere; }
@media (max-width: 576px) {
  .payment-result-details { grid-template-columns: 1fr; }
  .startup-main { padding: 1.5rem 0; }
  .startup-contact-divider { display: block; font-size: 0; }
}