/* Shared Hakmar Express design. Keep identical across all three sites. */
:root{--bg:#f3f5f8;--surface:#fff;--text:#172b20;--muted:#64748b;--border:#dfe7e1;--brand:#157c36;--brand-hover:#115d29;--orange:#ea580c;--yellow:#facc15;--radius:16px}
html,body{background:#f3f5f8;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:15px;line-height:1.5}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0%,#157c360c,transparent 55%)}
[hidden]{display:none!important}
.page{width:100%;max-width:1040px;margin:0 auto;padding:24px 20px 36px}
.page>.topbar{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--border);border-top:3px solid var(--brand);border-radius:16px;padding:14px 16px;margin:0 0 20px;box-shadow:0 2px 8px #173b2307;backdrop-filter:none}
.topbar .brand{display:flex;align-items:center;gap:12px;min-width:0;text-decoration:none;color:var(--text)}
.topbar .brand img{width:48px;height:48px;object-fit:contain;flex-shrink:0;border:1px solid #e7eee8;border-radius:14px;background:#fff;box-shadow:none}
.topbar .brand small{display:block;font-size:10px;font-weight:750;line-height:1.3;letter-spacing:1.2px;color:var(--brand);margin:0}
.topbar .brand small b{color:#cf5910;font-size:inherit;display:inline;letter-spacing:inherit;font-style:normal}
.topbar .brand strong{display:block;font-family:inherit;font-size:20px;font-weight:700;line-height:1.3;letter-spacing:-.4px;margin:3px 0 0;color:var(--text);white-space:nowrap}
.topbar-actions{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;flex-shrink:0;width:auto}
.topbar .install-button,.topbar .btn-install{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:11px;min-width:44px;min-height:44px;padding:10px 14px;font:600 13px/1.2 inherit;box-shadow:none;margin:0;cursor:pointer}
.topbar .install-button:hover,.topbar .btn-install:hover{background:var(--brand-hover)}
.install-button svg,.btn-install svg,.portal-link svg{width:21px;height:21px;flex-shrink:0}
.search-area,.page .hero,.page .card,.links .link,.product{border-radius:16px;border:1px solid var(--border);background:#fff;box-shadow:0 2px 8px #173b2307}
.tabs{padding:7px;background:#f0f5f1;gap:6px}.tabs button{border-radius:10px;font-size:14px}.tabs button[aria-selected=true]{background:var(--brand)}.tabs button[data-mode=competitor][aria-selected=true]{background:#b6490d}
#search-panel{padding:22px}.search-box input{border-radius:10px;background:#fff}.search-box button,#camera-start{border-radius:10px}
.page>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--border);margin:24px 0 0;padding:18px 0 0;font-size:12px;color:var(--muted)}
.page>footer p{margin:0}
.portal-link{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 12px;background:#edf7f0;border:1px solid #d2e6d8;border-radius:11px;color:#176134;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.portal-link:hover{background:#dfeee4}
.links{margin-top:0;gap:16px}.links .link{padding:24px;gap:20px;border-top:3px solid var(--brand)}.links .label{border-top-color:var(--orange)}.links .whatsapp{border-top-color:#28a05b}
.links .icon{width:46px;height:46px;border-radius:12px;background:#edf7f0;color:var(--brand)}.links .label .icon{background:#fff4e9;color:#c6530f}.links .whatsapp .icon{background:#edf7f0;color:#21804a}
.links h2{font-size:20px;letter-spacing:-.4px;color:var(--text)}.links .category{font-size:10px;letter-spacing:1px;color:var(--muted)}
.links .action{color:var(--brand)}.links .label .action{color:#b6490d}.links .whatsapp .action{color:#21804a}
.connection-notice,.install-help{padding:14px 16px;margin:0 0 18px;border:1px solid #f3d994;border-radius:12px;background:#fff9e8;color:#754b12;font-size:14px}
@media(max-width:700px){.page{padding:12px 12px 28px}.page>.topbar{padding:11px 12px;gap:8px;margin-bottom:16px}.topbar .brand{gap:9px}.topbar .brand img{width:42px;height:42px;border-radius:12px}.topbar .brand strong{font-size:17px}.topbar .brand small{font-size:9px;letter-spacing:1px}.topbar .install-label{display:none}.topbar .install-button,.topbar .btn-install{width:44px;height:44px;padding:10px}.topbar-actions{width:auto}.topbar-actions>*{flex:none}#search-panel{padding:18px 14px}.links{grid-template-columns:1fr;gap:12px}.links .link{flex-direction:row;padding:20px;gap:16px}.links .icon{flex-shrink:0}.page>footer{font-size:11px}.portal-link{font-size:12px}.results{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.link{transition:none}}
.page>footer{flex-direction:column;justify-content:center;text-align:center;gap:14px}
.page>footer .site-notice{max-width:480px;margin:0;color:#64748b;font-size:12px;line-height:1.6;font-weight:400}
.search-box{display:grid;grid-template-columns:minmax(0,1fr) auto 46px;gap:8px}
.search-box input{width:100%}
.search-box #scan-open{display:flex;align-items:center;justify-content:center;width:46px;min-height:46px;padding:10px;border:1px solid #e7cf77;border-radius:10px;background:#fff9df;color:#806013}
#scan-open svg{width:23px;height:23px}
.scanner-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scanner-actions button{min-height:48px;padding:12px;border:1px solid #cce1d2;border-radius:10px;font-size:14px;font-weight:600}
#gallery-open{background:#edf7f0;color:#176134}
#scanner{max-height:90dvh;overflow-y:auto}
#scan-video{margin-top:16px;object-fit:contain;max-height:40dvh}
@media(max-width:400px){.search-box{grid-template-columns:minmax(0,1fr) auto 44px;gap:6px}.search-box button[type=submit]{width:auto;padding:10px;font-size:14px}.search-box #scan-open{width:44px}.search-box input{padding:12px 9px}}
