/* HourLLC public site + customer portal — design polish (Nov 1 2026). Loaded LAST on every public page except the
   home page's own sections (the home page has its own redesign). Visual only: no text, prices or behaviour change.
   Shared components only: focus ring, scrolling chip rows, loading states, number alignment, spacing between page parts. */

/* one clear focus ring for keyboard users (mouse and touch taps don't show it) */
:focus-visible{outline:2px solid #2453ff;outline-offset:2px;border-radius:6px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:0}

/* prices and totals line up */
.price,.amount,.total,.sv-price,.co-sum,#co-sum,.fee,.receipt{font-variant-numeric:tabular-nums}

/* service group chips (/services): show there is more to swipe instead of cutting a word in half */
@media (max-width:760px){
  .sv-jump{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 32px),transparent);padding-right:28px!important;scroll-padding-inline:16px}
  .sv-jump a{min-height:44px}
}

/* order form on /services/<item>: a calm loading state instead of a bare line of text */
.svc-loading{display:flex;align-items:center;justify-content:center;gap:10px;min-height:120px;margin:0;color:#64748b;font-size:15px}
.svc-loading::before{content:"";flex:none;width:18px;height:18px;border-radius:50%;border:2px solid #d7dce5;border-top-color:#2453ff;animation:zpspin .8s linear infinite}
@keyframes zpspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.svc-loading::before{animation-duration:2.4s}}

/* inner pages: the first section after the page title doesn't leave a big empty gap on phones */
@media (max-width:640px){
  .page-hero+.section{padding-top:24px}
  .page-hero+.section .faq{margin-top:0}
}

/* headings wrap evenly, paragraphs avoid a lonely last word */
.page-hero h1,.section h2,.acct h1,.card h2{text-wrap:balance}
.page-hero p,.section p{text-wrap:pretty}

/* customer portal (account.html) */
.acct .filing{transition:border-color .15s,box-shadow .15s,transform .05s}
.acct .filing:active{transform:translateY(.5px)}
.acct .tags{min-width:0;max-width:100%}
.acct .row-btns .btn{min-height:44px}
.linkbtn{min-height:44px;display:inline-flex;align-items:center}
.acct .msg:empty{display:none}

/* long company names and emails never push a phone screen sideways */
.acct,.svc-card,.page-hero{overflow-wrap:break-word}

/* ---- Nov 1 2026 icons: the same search magnifier as the admin, inside every search field (public/zicons.js) ---- */
input[type="search"]:where(:not(.zi-noic)){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 17a6.5 6.5 0 1 0 0-13 6.5 6.5 0 0 0 0 13zM20 20l-4.9-4.9'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:12px 50%!important;background-size:17px 17px!important;padding-left:38px!important}
input[type="search"]:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.22)}

/* Nov 2 2026 audit6: on pages without the menu button, a link that ends the header row (Home on My account) used a -6px margin and stuck
   6px out of its row; the row now ends 6px further right instead, so the link stays in exactly the same spot. */
@media (max-width:959px){.site-header:not(.sc-has-menu) .header-inner:has(> .hdr-right > .hdr-account:last-child),.site-header:not(.sc-has-menu) .header-inner:has(> .hdr-right > .hdr-account + [hidden]:last-child){padding-right:14px}html body .site-header:not(.sc-has-menu) .hdr-right > .hdr-account:last-child,html body .site-header:not(.sc-has-menu) .hdr-right > .hdr-account:has(+ [hidden]:last-child){margin-right:0}}