/* Website palette verified from sffr.sa: primary #268263, black, white, #e6e6e6.
   This stylesheet affects the interface only; saved QR artwork is unchanged. */
:root{--brand:#268263;--brand-dark:#1c624b;--ink:#000;--line:#e6e6e6;--muted:#626b67}
body{background:#f7f8f7;color:var(--ink)}
header{border-color:var(--line)}
.brand,.eyebrow,.qrmark,.back,.download-link{color:var(--brand)}
.brand span{color:var(--muted);border-color:var(--line)}
p,.hint,small,.color-field span,.code-list th,footer{color:var(--muted)}
.panel{border-color:var(--line);box-shadow:0 10px 30px #00000004}
.stat,.pill{background:#e9f3ee;color:var(--brand-dark)}
.stat strong{color:var(--brand)}
.action,button{background:var(--brand);border-color:var(--brand);color:#fff}
button:hover,.action:hover{background:var(--brand-dark);border-color:var(--brand-dark);color:#fff}
.outline{background:#fff;color:var(--brand)}
.quiet{background:transparent;border-color:transparent;color:var(--muted)}
input{background:#fff;border-color:#d8dfda}
input:focus{outline-color:var(--brand)}
button:focus-visible,a:focus-visible{outline-color:var(--brand)}
.check input{accent-color:var(--brand)}
.notice{background:#e9f3ee;border-color:#b9d6c9;color:var(--brand-dark)}
.code-list th,.code-list td{border-color:var(--line)}
.just-added{background:#f0f7f3}
.just-added .pill{background:#deeee4;color:var(--brand-dark)}
select{width:100%;min-height:48px;padding:12px 14px;border:1px solid #d8dfda;border-radius:12px;font:inherit;background:white;color:var(--ink)}
select:focus{outline:2px solid var(--brand);outline-offset:2px}
input[type=file]{font-size:13px;max-width:100%;overflow:hidden}
.brand{display:inline-flex;align-items:center;flex-shrink:0;line-height:1}
.brand-logo{display:block;width:96px;height:55px;object-fit:contain}
@media(max-width:700px){.brand-logo{width:74px;height:43px}}