/* Shared look for the MTSi~DATS online forms (POA, revocation, trip worksheet). Matches customer-info.html. */
:root{
  --red:#a3141a; --deep:#5c1013; --soft:#fbeceb; --gold:#e2a521;
  --ink:#241a19; --ink-2:#5e504d; --line:#e7dcd8; --paper:#ffffff; --ground:#f8f4f1;
  --display:"Overpass","Arial Narrow",Arial,sans-serif; --body:"Public Sans",-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font:16px/1.5 var(--body)}
a{color:var(--red)}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
header.top{background:var(--paper);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding-block:12px}
.wrap{max-width:860px;margin:0 auto;padding-inline:16px}
.wm{font:700 24px/1 "Libre Baskerville",Georgia,serif;color:var(--red);text-decoration:none}
h1{font:800 32px/1.1 var(--display);margin:28px 0 6px}
.lead{color:var(--ink-2);margin:0 0 18px;max-width:64ch}
.box{padding:18px;background:var(--paper);border:1px solid var(--line);border-radius:12px;margin:0 0 18px}
.box h2{font:800 14px/1 var(--display);letter-spacing:.1em;text-transform:uppercase;color:#fff;background:var(--deep);padding:10px 14px;margin:-18px -18px 16px;border-radius:12px 12px 0 0}
.grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 14px}
.c6{grid-column:span 6}.c4{grid-column:span 4}.c3{grid-column:span 3}.c2{grid-column:span 2}
label.f{display:flex;flex-direction:column;gap:5px;font:600 12.5px/1.2 var(--display);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
input[type=text],input[type=date],input[type=number]{height:46px;border:1px solid var(--line);border-radius:8px;padding:0 12px;font:16px var(--body);color:var(--ink);background:var(--ground);width:100%}
input:focus{background:#fff;border-color:var(--red)}
.q{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-weight:600}
.q label{display:inline-flex;align-items:center;gap:6px;font-weight:500}
.q input{width:20px;height:20px;accent-color:var(--red);margin:0}
.note{background:#fdf3dc;border-left:4px solid var(--gold);padding:12px 14px;border-radius:0 8px 8px 0;margin:0 0 18px}
.actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:4px 0 14px}
.btn{font:800 17px/1 var(--display);border:2px solid var(--red);border-radius:8px;padding:14px 22px;background:var(--red);color:#fff;cursor:pointer;text-decoration:none}
.btn.line{background:transparent;color:var(--red)}
.btn.sm{font-size:14px;padding:9px 14px}
#msg{font-weight:600;min-height:1.4em;margin:0 0 30px}
#msg.ok{color:#1f7a4d}#msg.err{color:var(--red)}
.alt{font-size:14.5px;color:var(--ink-2);margin:0 0 40px}
/* document preview (what gets printed) */
.doc{background:#fff;border:1px solid var(--line);border-radius:6px;padding:40px 46px;font:15px/1.9 Georgia,"Times New Roman",serif;color:#111;margin:0 0 18px}
.doc .dh{text-align:center;border-bottom:2px solid var(--red);padding-bottom:8px;margin-bottom:18px}
.doc .dh b{display:block;font:700 26px/1.1 "Libre Baskerville",Georgia,serif;color:var(--red)}
.doc .dh small{font:12px/1.4 var(--body);color:#555}
.doc h3{text-align:center;font:700 16px/1.2 var(--body);text-decoration:underline;margin:0 0 20px}
.doc .fill{display:inline-block;min-width:160px;border-bottom:1px solid #111;padding:0 6px;font-family:var(--body);font-weight:600}
.doc .sig{display:grid;grid-template-columns:2fr 1fr;gap:18px;margin-top:34px}
.doc .sig div{border-top:1px solid #111;font:11px var(--body);padding-top:3px;color:#444}
.doc .notary{border:1px solid #999;padding:12px 14px;margin-top:26px;font-size:14px;line-height:2}
/* tables (trip worksheet) */
.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;min-width:560px}
th{font:700 11.5px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);text-align:left;padding:6px 6px;border-bottom:2px solid var(--line)}
td{padding:4px 4px;border-bottom:1px solid var(--line)}
td input{height:40px!important;padding:0 8px!important}
td.x{width:40px;text-align:center}
.tot{display:flex;justify-content:flex-end;gap:12px;align-items:center;font:800 16px var(--display);margin-top:10px}
.tot output{min-width:110px;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:640px){.grid{grid-template-columns:minmax(0,1fr)}.c6,.c4,.c3,.c2{grid-column:auto}h1{font-size:27px}.doc{padding:24px 18px;font-size:14px}}
@media print{
  body{background:#fff}
  header.top,.lead,.box,.actions,#msg,.alt,.note,.noprint{display:none!important}
  .wrap{max-width:none;padding:0}
  .doc{border:0;padding:0;margin:0}
}
