/* my.tabora.co.tz: same design tokens as the guide (main-site/assets/css/site.css), app layout. */
:root{
  --bg:#f6f1e8; --paper:#fffdf8; --ink:#1f1a14; --muted:#6b6257; --line:#e3dacc;
  --brown:#4a2c1a; --honey:#d9a441; --honey-dark:#b8862c; --green:#2f5d3a; --earth:#b5532b; --red:#a33a2a;
  --display:"Fraunces",Georgia,serif; --sans:"Source Sans 3",system-ui,sans-serif;
  --w:960px; --gutter:16px; --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.55;min-height:100vh;display:flex;flex-direction:column}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.1;margin:0}
h1{font-size:clamp(30px,4.5vw,44px);letter-spacing:-.015em}
h2{font-size:clamp(22px,3vw,30px)}
h3{font-size:20px}
p{margin:0}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--gutter);width:100%}
main{flex:1;padding:32px 0 64px}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--earth)}
.lead{font-size:19px;color:var(--muted);max-width:60ch;margin-top:10px}
.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:999px;font-weight:600;text-decoration:none;font-size:16px;border:2px solid transparent;cursor:pointer;font-family:inherit;line-height:1.2}
.btn-honey{background:var(--honey);color:var(--brown);border-color:var(--honey)}
.btn-dark{background:var(--brown);color:#fff;border-color:var(--brown)}
.btn-ghost{background:transparent;color:var(--brown);border-color:var(--brown)}
.btn.small{padding:7px 14px;font-size:14px}
.btn-wa{background:#25d366;color:#fff;border-color:#25d366}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-weight:600;color:var(--ink);cursor:pointer}

/* header */
.site-header{position:sticky;top:0;z-index:20;background:rgba(246,241,232,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:18px;min-height:62px;flex-wrap:wrap}
.brand{font-family:var(--display);font-weight:700;font-size:24px;text-decoration:none;display:inline-flex;align-items:baseline;gap:2px}
.brand small{font-family:var(--sans);font-weight:600;font-size:13px;color:var(--muted)}
.brand i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--honey);margin-left:3px;transform:translateY(-1px)}
.tag{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-left:1px solid var(--line);padding-left:14px}
.links{display:flex;gap:18px;align-items:center;margin-left:auto;font-weight:600;font-size:15px}
.links a{text-decoration:none}
.lang{display:flex;border:1.5px solid var(--brown);border-radius:999px;overflow:hidden;font-size:13px;font-weight:700;margin:0}
.lang button{background:none;border:0;padding:6px 11px;color:var(--brown);font:inherit;font-weight:700;cursor:pointer}
.lang button.on{background:var(--brown);color:#fff}

/* cards, forms */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.card + .card{margin-top:16px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.auth{max-width:460px;margin:24px auto 0}
.auth h1{margin-bottom:6px}
form.f{display:grid;gap:18px;margin-top:22px}
.field label{display:block;font-weight:700;margin-bottom:6px}
.field input[type=text],.field input[type=tel],.field input[type=email],.field input[type=password],.field input[type=url],.field select,.field textarea{width:100%;font:inherit;font-size:17px;padding:12px 14px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--honey);box-shadow:0 0 0 3px rgba(217,164,65,.25)}
.field .help{font-size:14px;color:var(--muted);margin-top:5px}
.field .err,.errs{color:var(--red);font-size:15px;margin-top:5px;font-weight:600}
.errs{background:#fbe9e5;border:1px solid #f0c7bf;border-radius:10px;padding:10px 14px}
.field .radios{display:grid;gap:8px}
.field .radios label{font-weight:500;display:flex;gap:10px;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer}
.field .radios label:has(input:checked){border-color:var(--honey);background:#fff8e8}
.field .radios input{accent-color:var(--brown)}
.field input[type=file]{font:inherit;font-size:15px}
.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:6px}

/* dashboard */
.pagehead{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.biz{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
.biz h3{margin-bottom:2px}
.biz .meta{font-size:15px;color:var(--muted)}
table.reqs{width:100%;border-collapse:collapse;font-size:16px;background:var(--paper);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-top:16px}
.reqs th,.reqs td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.reqs th{background:#efe7d8;color:var(--brown);font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.reqs tr:last-child td{border-bottom:0}
.reqs a{font-weight:600;color:var(--brown)}
.st{display:inline-block;border-radius:999px;padding:3px 11px;font-size:13px;font-weight:700;white-space:nowrap}
.st-grey{background:#e9e3d8;color:var(--muted)}
.st-honey{background:#fbe9bd;color:var(--honey-dark)}
.st-green{background:#dcebdf;color:var(--green)}
.st-red{background:#fbe0da;color:var(--red)}
.steps{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:12px}
.steps li{display:flex;gap:14px;align-items:start}
.steps li b{flex:0 0 30px;height:30px;border-radius:50%;background:var(--honey);color:var(--brown);display:grid;place-items:center;font-size:14px}
.empty{text-align:center;padding:36px 20px;border:1.5px dashed var(--line);border-radius:var(--radius);color:var(--muted)}
.photos{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.photos img{border-radius:8px;aspect-ratio:4/3;object-fit:cover;width:100%}
.note{background:#fff8e8;border-left:3px solid var(--honey);padding:12px 16px;border-radius:8px;margin-top:14px}
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;margin:14px 0 0}
dl.kv dt{color:var(--muted);font-weight:600}
dl.kv dd{margin:0}
.msgs{display:grid;gap:10px;margin-bottom:20px}
.msg{padding:12px 16px;border-radius:10px;background:#dcebdf;color:var(--green);font-weight:600}
.msg.error{background:#fbe0da;color:var(--red)}
.msg.warning{background:#fbe9bd;color:var(--honey-dark)}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:36px;align-items:center;padding:24px 0 12px}
.hero .card{background:var(--brown);color:#fff;border:0}
.hero .card .eyebrow{color:var(--honey)}
.hero .card .steps li b{background:var(--honey)}

/* footer */
.site-footer{background:var(--ink);color:#cfc6b8;padding:22px 0;font-size:14px}
.site-footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.site-footer a{color:#cfc6b8}

@media (max-width:700px){
  .grid2,.hero{grid-template-columns:1fr}
  .tag{display:none}
  .links{gap:12px;font-size:14px}
  .photos{grid-template-columns:1fr 1fr}
  .reqs{font-size:15px}
  .reqs th:nth-child(3),.reqs td:nth-child(3){display:none}
}
