:root{--brand:#0F766E;--brand-d:#0b5a54;--bg:#f6f8f8;--card:#fff;--text:#1f2937;--muted:#6b7280;--line:#e5e7eb;--err:#b91c1c}
*{box-sizing:border-box}
body{margin:0;font-family:"Cairo",sans-serif;background:var(--bg);color:var(--text);direction:rtl;line-height:1.7}
a{color:var(--brand)}
.container{max-width:960px;margin:0 auto;padding:16px}
header.top{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
header.top .container{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px}
.brand{display:flex;align-items:center;gap:8px;font-weight:800;font-size:1.25rem;color:var(--brand);text-decoration:none}
.brand img{width:36px;height:36px}
nav a{margin-inline-start:10px;text-decoration:none;font-weight:600;color:var(--text);padding:6px 10px;border-radius:8px}
nav a.active,nav a:hover{background:#e6f3f2;color:var(--brand)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px;margin:14px 0}
h1,h2,h3{margin:.2em 0 .5em}
label{display:block;font-weight:600;margin:10px 0 4px}
input,textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff}
input:focus{outline:2px solid #99d5cf;border-color:var(--brand)}
.btn{display:inline-block;background:var(--brand);color:#fff;border:0;border-radius:10px;padding:10px 18px;font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--brand-d)}
.btn.ghost{background:#fff;color:var(--brand);border:1px solid var(--brand)}
.btn.danger{background:#fff;color:var(--err);border:1px solid var(--err)}
.btn.sm{padding:6px 12px;font-size:.9rem}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:640px){.row{grid-template-columns:1fr}nav a{margin-inline-start:2px;padding:6px}}
.msg{padding:10px 12px;border-radius:10px;margin:10px 0}
.msg.ok{background:#e6f3f2;color:var(--brand-d)}
.msg.err{background:#fde8e8;color:var(--err)}
.hint{color:var(--muted);font-size:.9rem}
table{width:100%;border-collapse:collapse}
th,td{border-bottom:1px solid var(--line);padding:8px;text-align:right;vertical-align:middle}
th{background:#f1f5f5;font-weight:700}
td input{padding:6px 8px}
.totals{max-width:340px;margin-inline-start:auto}
.totals div{display:flex;justify-content:space-between;padding:4px 0}
.totals .grand{font-weight:800;font-size:1.15rem;border-top:2px solid var(--brand);margin-top:6px;padding-top:8px}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.logo-prev{max-height:70px;margin-top:8px}
footer.foot{text-align:center;color:var(--muted);padding:24px 0;font-size:.9rem}
/* invoice A4 */
.invoice{background:#fff;max-width:794px;margin:14px auto;padding:32px;border:1px solid var(--line);border-radius:6px}
.inv-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;border-bottom:3px solid var(--brand);padding-bottom:12px}
.inv-head img{max-height:80px;max-width:160px}
.inv-title{color:var(--brand);font-size:1.5rem;font-weight:800;margin:0}
.inv-meta{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:14px 0}
.inv-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-top:16px}
#qr{width:150px;height:150px}
#qr img,#qr canvas{width:150px!important;height:150px!important}
/* landing */
.hero{text-align:center;padding:48px 16px}
.hero h1{font-size:2.2rem;color:var(--brand)}
.hero p{max-width:640px;margin:0 auto 20px;font-size:1.1rem;color:#374151}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
@media(max-width:720px){.grid3,.grid2{grid-template-columns:1fr}.hero h1{font-size:1.7rem}}
.step-n{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;align-items:center;justify-content:center;font-weight:800}
.price{font-size:1.6rem;font-weight:800;color:var(--brand)}
section{padding:12px 0}
@media print{
 header.top,nav,.no-print,footer.foot{display:none!important}
 body{background:#fff}
 .invoice{border:0;margin:0;max-width:none;padding:0}
 @page{size:A4;margin:14mm}
}
html[dir=ltr] body{direction:ltr}
th,td{text-align:start}
nav a.lang{border:1px solid var(--line);border-radius:999px;padding:2px 10px}
select{width:100%;padding:10px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff}

/* auth + dashboard */
select{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff}
.auth{max-width:420px;margin:30px auto}.auth .card{padding:26px}.auth-logo{text-align:center}.auth-logo img{width:64px;height:64px}.auth h2{text-align:center}.auth .hint{text-align:center}
.btn.wide{width:100%}.btn:disabled{opacity:.6;cursor:wait}
.dash-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:12px 0}@media(max-width:760px){.stats{grid-template-columns:1fr 1fr}}
.stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:4px}.stat span{color:var(--muted);font-size:.9rem}.stat b{font-size:1.3rem;color:var(--brand-d)}.stat small{color:var(--muted);font-size:.85rem}.stat a{font-size:.85rem}
.bars{display:flex;align-items:flex-end;gap:10px;height:170px;padding-top:10px}.bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}.bv{width:100%;max-width:38px;background:var(--brand);border-radius:6px 6px 0 0;min-height:2px}.bar span{font-size:.75rem;color:var(--muted);margin-top:4px}
.kv{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);gap:12px}.kv span{color:var(--muted)}.kv select{width:auto}
.meter{height:8px;background:#e5e7eb;border-radius:8px;overflow:hidden;margin-top:10px}.meter div{height:100%;background:var(--brand)}
.sync{font-size:.85rem}.sync.saving{color:var(--muted)}.sync.err{color:var(--err)}.sync.ok{color:var(--brand)}
nav{display:flex;flex-wrap:wrap;justify-content:flex-end}
.or{display:flex;align-items:center;gap:10px;color:var(--muted);margin:14px 0}.or:before,.or:after{content:'';flex:1;height:1px;background:var(--line)}.gbtn{display:flex;align-items:center;justify-content:center;gap:8px;color:var(--text);border-color:var(--line)}

.pdf-ov{position:fixed;inset:0;z-index:9999;background:#525659;display:flex;flex-direction:column}
.pdf-bar{display:flex;align-items:center;gap:10px;padding:calc(10px + env(safe-area-inset-top)) 12px 10px;background:#fff;box-shadow:0 1px 6px rgba(0,0,0,.15)}
.pdf-x{width:40px;height:40px;border-radius:50%;border:0;background:#eef2f1;font-size:20px;line-height:40px;cursor:pointer;flex:none}
.pdf-name{flex:1;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:center}
.pdf-dl{flex:none}
.pdf-body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}
.pdf-frame{width:100%;height:100%;border:0;background:#fff}