/* Application identities. All overrides stay inside non-wallet surfaces. */

/* Merchant: warm amber canvas, terracotta chrome, white shopping cards. */
.ph.shop {
  --primary: #78350f;
  --primary-deep: #572608;
  --muted: #63462d;
  background: #f0a23b;
  color: #3b240f;
}

.ph.shop > .ph-bar,
.ph.shop .sh-top {
  background: #78350f;
  color: #fff;
  flex-shrink: 0;
}

.ph.shop .sh-top { border-bottom-color: #a45c23; }
.ph.shop .sh-top small { color: #ffe3b9; }
.ph.shop .sh-logo { background: #fff5df; color: #78350f; }
.ph.shop .ph-h { color: #3b240f; }

.ph.shop .choice-i {
  background: #fff;
  border-color: #fff;
  color: #3b240f;
}

.ph.shop .choice-i small { color: #63462d; }
.ph.shop .choice-i i { border-color: #9d866d; }
.ph.shop .choice-i.on { background: #fff3d9; border-color: #78350f; }
.ph.shop .choice-i.on i { border-color: #78350f; }

.ph.shop .ph-body > div:has(> .ph-row) {
  background: #fff;
  border-radius: 20px;
  padding: 0 20px;
}

.ph.shop .ph-row { border-bottom-color: #e6dacb; }
.ph.shop .ph-row:last-child { border-bottom: 0; }
.ph.shop .ph-row span:first-child { color: #63462d; }
.ph.shop .ph-row span:last-child { color: #3b240f; }
.ph.shop .ph-note {
  padding: 14px 18px;
  border-radius: 16px;
  background: #fff3d9;
  color: #583817;
}

.ph.shop .ph-cta {
  background: #78350f;
  color: #fff;
  border: 2px solid #78350f;
}

.ph.shop button:focus-visible { outline: 5px solid #3b240f; outline-offset: 5px; }

/* Keep the scan and cancellation inside the merchant phone without scrolling. */
.commerce-qr-request .ph-body { min-height: 0; }
.commerce-qr-request .ph-body > * { flex-shrink: 0; }
.commerce-qr-request .ph-h { margin: 8px 0 14px; font-size: 32px; }
.commerce-qr-context { padding: 14px 18px; border-radius: 18px; background: #fff3d9; color: #3b240f; }
.commerce-qr-context > strong { display: block; font-size: 24px; line-height: 1.25; }
.commerce-qr-context > span { display: block; margin-top: 5px; color: #63462d; font-size: 20px; line-height: 1.2; }
.commerce-qr-request .iphone-qr-scan { width: 100%; margin: 12px auto 6px; }
.commerce-qr-request .ph.shop .ph-note { margin-top: 12px; padding: 10px 14px; font-size: 19px; }
.commerce-qr-request .qr-request-cancel { margin-top: auto; padding: 16px 22px; border-color: #78350f; color: #78350f; font-size: 26px; line-height: 1.2; }

/* Bank: navy app chrome with light, readable account and offer panels. */
.ph.bank {
  --bank: #164b88;
  --bank-soft: #e1edfc;
  --primary: #164b88;
  --primary-deep: #123765;
  --muted: #455b76;
  background: #123b70;
  color: #fff;
}

.ph.bank > .ph-bar,
.ph.bank .bk-top,
.ph.bank .bk-tabs { flex-shrink: 0; }

.ph.bank > .ph-bar,
.ph.bank .bk-top { background: #123b70; color: #fff; }
.ph.bank .bk-logo { background: #fff; color: #123b70; }
.ph.bank .bk-tools { background: #24558f; color: #fff; box-shadow: none; }

/* A long account list scrolls inside the phone; chrome and tabs stay visible. */
.ph.bank .bk-body {
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: 18px;
  scrollbar-width: thin;
  scrollbar-color: #a9c5e7 #123b70;
}

.ph.bank .bk-body > * { flex-shrink: 0; }
.ph.bank .bk-total span { color: #d6e5f7; }
.ph.bank .bk-total b { color: #fff; }
.ph.bank .bk-actions { color: #edf5ff; }
.ph.bank .bk-actions i { background: #e1edfc; color: #123b70; }
.ph.bank .bk-actions .hl { color: #fff; }
.ph.bank .bk-actions .hl i { background: #ffd06a; color: #16345b; }

.ph.bank .bk-card,
.ph.bank .bk-promo { background: #fff; color: #152f51; box-shadow: none; }
.ph.bank .bk-promo { border-color: #aec8eb; }
.ph.bank .bk-card-h,
.ph.bank .bk-promo-h { color: #152f51; }
.ph.bank .bk-acc { border-top-color: #dce5f0; }
.ph.bank .bk-acc span { color: #455b76; min-width: 0; overflow-wrap: anywhere; }
.ph.bank .bk-acc b { color: #152f51; }
.ph.bank .bk-tag { background: #164b88; color: #fff; }
.ph.bank .ph-note { color: #455b76; }
.ph.bank .ph-cta { background: #164b88; color: #fff; }
.ph.bank .bk-tabs { background: #edf3fc; border-top-color: #bdcfe6; color: #465b75; }
.ph.bank .bk-tabs .on { color: #123b70; }
.ph.bank button:focus-visible { outline: 5px solid #123b70; outline-offset: 5px; }

/* The bank's separate review screen uses the same identity, not gateway styling. */
.kiosk-bank-check { background: #123b70; border-color: #123b70; color: #fff; }
.kiosk-bank-check .kiosk-bank-eyebrow { color: #c0dbff; }
.kiosk-bank-check h3 { color: #fff; }
.kiosk-bank-check > p { color: #dae7f8; }
.kiosk-bank-check dl { background: #fff; border: 0; border-radius: 22px; padding: 0 24px; }
.kiosk-bank-check dl > div { border-bottom-color: #dce5f0; color: #152f51; }
.kiosk-bank-check dl > div:last-child { border-bottom: 0; }
.kiosk-bank-check dt { color: #455b76; }
.kiosk-bank-check dd { min-width: 0; overflow-wrap: anywhere; }
.kiosk-bank-check .kiosk-bank-decision { background: #fff2d8; color: #57360d; border-color: #e7c480; }
.kiosk-bank-check .kiosk-bank-assumption { background: #e6effb; color: #173e6a; border-color: #aec9e8; }
.kiosk-bank-check :is(.kiosk-bank-decision, .kiosk-bank-assumption) p { color: inherit; }

/* Authority, HR and reception portals: violet heading on a lavender canvas. */
.terminal {
  --primary: #623c92;
  --primary-deep: #43215f;
  --text: #2c1d40;
  --muted: #544165;
  background: #2e1b45;
  color: #2c1d40;
}

.terminal .term-screen { background: #d7c6f4; }
.terminal .term-screen > .ph-app {
  margin: -34px -40px 16px;
  padding: 18px 30px;
  border-radius: 20px 20px 0 0;
  background: #43215f;
  color: #fff;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.terminal .ph-h { color: #321a4b; }
.terminal .term-screen > div:has(> .ph-row),
.terminal .term-qr > div:has(> .ph-row) {
  background: #fff;
  border-radius: 18px;
  padding: 0 18px;
}

.terminal .ph-row { border-bottom-color: #e4daef; }
.terminal .ph-row:last-child { border-bottom: 0; }
.terminal .ph-row span:first-child { color: #544165; }
.terminal .ph-row span:last-child { color: #2c1d40; min-width: 0; overflow-wrap: anywhere; }
.terminal .ph-note { color: #4c3563; }
.terminal .field > span { color: #4c3563; }
.terminal .field-box { background: #fff; border-color: #623c92; color: #2c1d40; }
.terminal .field-ok { color: #145c41; }
.terminal .ph-cta { background: #43215f; color: #fff; }
.terminal .term-qr { gap: 28px; }

/* Preserve the QR pattern and its white quiet zone on the colored canvas. */
.terminal .qr {
  background-color: #fff;
  border-color: #fff;
  outline-color: #43215f;
  box-shadow: 0 0 0 8px #fff;
}

.terminal .verdict { background: #e5f5ed; }
.terminal .verdict span { color: #145c41; }
.terminal .verdict small { color: #365c4d; }
.terminal button:focus-visible { outline: 5px solid #43215f; outline-offset: 5px; }

/* Login portal only. The d-you wallet and shared verification view have no overrides. */
:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) {
  background: #34204f;
  border-color: #34204f;
  color: #fff;
}

:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-portal-top {
  background: #241438;
  border: 1px solid #74558d;
  border-radius: 20px;
  padding: 18px 22px;
}

:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-portal-mark {
  background: #e9def8;
  color: #43215f;
}

:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-portal-top strong,
:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) h3 { color: #fff; }
:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-portal-top div > span { color: #dccce9; }
:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) :is(.dyou-card-copy, .dyou-mini-note, .dyou-data-note, .dyou-request-meta) { color: #e6dcf1; }

.dyou-start-card .dyou-start-symbol { background: #e9def8; color: #43215f; }
.dyou-start-card .dyou-device-choice legend { color: #f4edfc; }
.dyou-start-card .dyou-device-options button { background: #fff; border-color: #baa8cc; color: #39264d; }
.dyou-start-card .dyou-device-options .dyou-selected {
  background: #d6bbf8;
  border-color: #5b327c;
  color: #32164b;
  box-shadow: 0 0 0 2px #e2cfff;
}

:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-button {
  background: #ffd06a;
  border-color: #ffd06a;
  color: #302041;
}

:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-button.dyou-secondary {
  background: #4d346b;
  border-color: #b59ad7;
  color: #fff;
}

:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) .dyou-button.dyou-quiet {
  background: transparent;
  border-color: transparent;
  color: #f1e7ff;
}

.dyou-request-card .dyou-countdown { background: #ebe1fc; color: #332050; padding: 8px 12px; border-radius: 999px; }
.dyou-request-card .dyou-open-app .dyou-icon { color: #e4d3ff; }
.dyou-request-card .dyou-open-app img { background: #fff; padding: 10px; }
.dyou-status-card .dyou-status-symbol { background: #def4eb; color: #146848; }
.dyou-status-card.dyou-warning .dyou-status-symbol { background: #ffe4a9; color: #683c05; }
.dyou-status-card .dyou-session { background: #fff; color: #2c1d40; border-color: #c4b3de; }
.dyou-status-card .dyou-session > div { border-bottom-color: #e0d5ee; }
.dyou-status-card .dyou-session dt { color: #625170; }
.dyou-status-card .dyou-session dd { color: #2c1d40; }
:is(.dyou-start-card, .dyou-request-card, .dyou-status-card) button:focus-visible { outline: 5px solid #fff; outline-offset: 7px; }