/* © HKSolutions — AlibiLock. All rights reserved.
   Colours/spacing come from /static/tokens.css (generated from brand/tokens.json). */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--color-background);color:var(--color-textPrimary);
  font:var(--weight-body) 16px/1.55 var(--font-latin),var(--font-deva),system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
body.script-deva{font-family:var(--font-deva),var(--font-latin),system-ui,sans-serif;line-height:1.7}
h1,h2,h3{font-weight:var(--weight-heading);line-height:1.25;margin:0 0 calc(var(--space)*1.5)}
h1{font-size:1.5rem}h2{font-size:1.2rem}h3{font-size:1.05rem}
p{margin:0 0 var(--space)}
a{color:var(--color-secondary)}
.topbar{background:var(--color-primary);color:var(--color-onPrimary)}
@media (prefers-color-scheme: dark){.topbar{background:var(--color-surface);border-bottom:1px solid var(--color-border)}}
.topbar__inner,.page,.footer{max-width:640px;margin:0 auto;padding:calc(var(--space)*2)}
.topbar__inner{display:flex;align-items:center;gap:calc(var(--space)*1.5)}
.brand-mark{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:8px;
  border:1px solid currentColor;font-weight:600;letter-spacing:.04em;font-size:.85rem}
.brand-text{display:flex;flex-direction:column;line-height:1.2}
.brand-product{font-size:.85rem;opacity:.85}
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-card);
  padding:calc(var(--space)*2.5);margin:0 0 calc(var(--space)*2)}
.card--success{border-left:4px solid var(--color-success)}
.card--error{border-left:4px solid var(--color-danger)}
.card--warning{border-left:4px solid var(--color-warning)}
.card--info{border-left:4px solid var(--color-secondary)}
.muted,.note{color:var(--color-textSecondary)}
.note{font-size:.875rem}
.lead{font-size:1.05rem}
.facts{display:grid;grid-template-columns:1fr;gap:var(--space);margin:0 0 calc(var(--space)*2)}
.facts div{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space);
  border-bottom:1px solid var(--color-border);padding-bottom:var(--space)}
.facts dt{color:var(--color-textSecondary)}
.facts dd{margin:0;font-weight:600;text-align:end;overflow-wrap:anywhere}
.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:400;font-size:.8rem}
.terms-text{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--color-background);
  border-radius:8px;padding:calc(var(--space)*1.5)}
.photos{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--space)}
.photos img{width:100%;height:auto;border-radius:8px;border:1px solid var(--color-border)}
.notice{font-size:.9rem;background:var(--color-background);border-radius:8px;padding:calc(var(--space)*1.5);
  margin-bottom:calc(var(--space)*2)}
.field{display:block;font-weight:600;margin:calc(var(--space)*2) 0 var(--space)}
input[type=text]{width:100%;min-height:var(--touch);padding:0 calc(var(--space)*1.5);font:inherit;
  color:inherit;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-button)}
input[type=text]:focus-visible,button:focus-visible,a:focus-visible,canvas:focus-visible,input[type=checkbox]:focus-visible{
  outline:3px solid var(--color-secondary);outline-offset:2px}
.pad{display:flex;flex-direction:column;gap:var(--space)}
#signature-pad{width:100%;height:200px;touch-action:none;background:#fff;border:1px dashed var(--color-border);
  border-radius:var(--radius-button)}
.check{display:flex;gap:calc(var(--space)*1.5);align-items:flex-start;min-height:var(--touch);
  margin:calc(var(--space)*2) 0;cursor:pointer}
.check input{width:24px;height:24px;flex:0 0 24px;margin-top:2px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:var(--touch);min-width:var(--touch);
  padding:0 calc(var(--space)*2.5);border-radius:var(--radius-button);border:1px solid transparent;
  font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.button--primary{background:var(--color-primary);color:var(--color-onPrimary);width:100%}
.button--secondary{background:transparent;color:var(--color-textPrimary);border-color:var(--color-border);align-self:flex-end}
a.button--secondary{width:100%;margin-top:var(--space)}
.button--danger{background:transparent;color:var(--color-danger);border-color:var(--color-danger);width:100%}
.button[disabled]{opacity:.5;cursor:not-allowed}
.actions{display:flex;flex-direction:column;gap:calc(var(--space)*1.5)}
.alert{border-radius:8px;padding:calc(var(--space)*1.5);margin:var(--space) 0}
.alert--error{background:color-mix(in srgb,var(--color-danger) 12%,transparent);color:var(--color-textPrimary);
  border:1px solid var(--color-danger)}
.badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.8rem;font-weight:600;color:#fff;vertical-align:middle}
.badge--pending{background:var(--status-pending)}
.badge--locked{background:var(--status-locked)}
.badge--disputed{background:var(--status-disputed)}
.badge--completed{background:var(--status-completed)}
.footer{color:var(--color-textSecondary);font-size:.85rem;text-align:center}
.footer__langs{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space)}
.footer__langs a,.footer__langs span{display:inline-flex;align-items:center;min-height:var(--touch);padding:0 var(--space)}
.footer__langs span{font-weight:600;color:var(--color-textPrimary)}
[hidden]{display:none!important}
.footer__legal { display: flex; flex-wrap: wrap; gap: 0 calc(2 * var(--space)); justify-content: center; }
.footer__legal a { min-height: var(--touch); display: inline-flex; align-items: center; }
.alert--warning{background:color-mix(in srgb,var(--color-warning) 14%,transparent);color:var(--color-textPrimary);border:1px solid var(--color-warning)}
.brand-link{display:inline-flex;align-items:center;gap:calc(var(--space)*1.5);color:inherit;text-decoration:none}
