/* PrimePay brand colours for every checkout page. Loaded after checkout.css and pay-by-code.css.
   Ink #09000D for text, buttons and the dark panel. Yellow #EBCC00 only on ink (marks, bars, links on the dark panel):
   never as text on white, it is too faint to read. Light #EFEFEF for fields and soft fills. */
:root {
    --pp-brand-ink: #09000D;
    --pp-brand-ink-2: #2A2130;
    --pp-brand-yellow: #EBCC00;
    --pp-brand-light: #EFEFEF;

    --pp-ink: #09000D;
    --pp-ink-2: #3A3340;
    --pp-muted: #5F5866;
    --pp-line: #DCDADF;
    --pp-line-soft: #E8E6EA;
    --pp-bg: #F5F5F5;
    --pp-field: #EFEFEF;
    --pp-navy: #09000D;
    --pp-navy-line: #2A2130;
    --pp-navy-text: #EFEFEF;
    --pp-navy-muted: #A39DA8;
    --pp-navy-link: #D6D2D9;
    --pp-accent: #09000D;
    --pp-accent-hover: #2A2130;
    --pp-accent-soft: #F3F2F4;
    --pp-focus: rgba(235, 204, 0, 0.45);
}

/* Logo images in place of the old text wordmark */
.pp-logo { display: inline-block; height: 16px; width: auto; vertical-align: -3px; }
.pp-secure .pp-logo { height: 15px; }
.pb-brand .pp-logo { height: 24px; vertical-align: middle; }

/* PrimePay Wallet badges: yellow mark on ink */
.pp-provider__badge--prime { box-shadow: none; }
.pp-provider__badge--prime img { width: 60%; height: auto; display: block; }
.pb-minimark { background: var(--pp-brand-ink); }
.pb-minimark img { width: 72%; height: auto; display: block; }

/* Yellow accents on the dark panel */
.pp-powered a:hover { color: var(--pp-brand-yellow); }
.pb-shell .pp-powered a { color: var(--pp-brand-yellow); }

/* Soft fills that were blue */
.pp-wallet-note { border-color: #DCDADF; color: var(--pp-brand-ink); }
.pp-wallet-note div { color: var(--pp-brand-ink-2); }
.pp-icon--info { background: var(--pp-brand-light); }
.pp-btn--primary:disabled { background: #D9D6DC; color: #5F5866; }

/* Merchant initial on the dark panel: ink letter on yellow (ink on ink would vanish) */
.pp-merchant__logo--initial { background: var(--pp-brand-yellow); color: var(--pp-brand-ink); }

/* Airtel Money and TNM Mpamba: their own logos on a white tile */
.pp-provider__badge--airtel,
.pp-provider__badge--tnm { background: #FFFFFF; border: 1px solid var(--pp-line); padding: 3px; overflow: hidden; }
.pp-provider__badge--airtel img,
.pp-provider__badge--tnm img { width: 100%; height: 100%; object-fit: contain; display: block; }