/* Shared customer-facing layout. Existing authentication and payment flows are retained. */
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:#f3f6fc;color:#142b45;line-height:1.55}
button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:#0753a4}
.app-header{background:#091a37;color:#fff;position:sticky;top:0;z-index:30;border-bottom:1px solid #ffffff20}
.app-header .header-inner{max-width:1080px;min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:10px 20px;margin:auto}
.app-header .brand{display:flex;align-items:center;gap:10px;color:#fff;font-size:24px;font-weight:850;text-decoration:none;white-space:nowrap}
.app-header .brand-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#f23c52;color:#fff;box-shadow:4px 4px 0 #2786fb}
.app-header .brand small{display:block;color:#d4e4fa;font-size:10px;letter-spacing:.5px}
.app-header .topnav{display:flex;gap:5px;align-items:center}
.app-header .topnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:56px;min-width:80px;padding:7px 8px;border-radius:10px;color:#e1ebfa;text-decoration:none;font-size:12px;font-weight:750}
.app-header .topnav a:hover,.app-header .topnav a:focus-visible{background:#24466e;color:#fff}
.app-header .topnav .nav-icon{width:20px;height:20px}
.app-header .topnav a.addlink{background:#c32240;color:#fff}
.header-account-shortcut{display:none;color:#fff;font-weight:750}
.live-layout .compact-hero .home-intro{padding-top:25px;padding-bottom:25px}
.live-layout .compact-hero .home-lead{margin-bottom:0}
.live-layout .compact-hero .home-lead .home-heading h1{font-size:clamp(34px,4vw,47px);letter-spacing:-1.4px;margin:12px 0}
.live-layout .compact-hero .home-art{min-height:160px;max-height:250px}
.live-layout .compact-hero .hero-actions{justify-content:center;gap:10px;margin-top:18px}
.live-layout .compact-hero .hero-actions .btn{font-size:15px;min-height:48px}
.live-layout .compact-hero .hero-free{font-size:14px;margin:13px 0 0;color:#e1ebfa}
.live-layout .category-grid{grid-template-columns:repeat(9,minmax(0,1fr));gap:8px}
.live-layout .category-card{min-height:100px;padding:10px 5px;font-size:12px}
.live-layout .category-description{display:none;font-size:13px;max-width:32ch}
.live-layout .category-card[aria-pressed="true"] .category-description{display:block}
.live-layout .category-examples>h2{font-size:22px}
.live-layout .category-examples>p{font-size:14px;color:#42566f}
.live-layout #page-hitta>.section-head,.live-layout #page-skapa>.section-head{margin-top:12px;margin-bottom:18px}
.live-layout .live-market{border:0;padding:0;box-shadow:none;background:transparent}
.live-layout .live-market>h3,.live-layout .live-market>p.muted,#live-market-app>hr{display:none}
#live-market-status{padding:8px 0;margin:12px 0;color:#243b53;background:transparent;border:0}
.live-layout .job{padding:22px}.live-layout .job h3{font-size:22px}.live-layout .job p{font-size:16px}
.live-layout .report-link{background:transparent;color:#42566f;box-shadow:none;border:0;text-decoration:underline;font-size:13px;padding:8px}
.live-layout .how-it-works{margin-top:36px;text-align:center}.live-layout .how-it-works .info-step{text-align:left}
.live-layout .how-it-works .info-step p{font-size:15px}
.live-layout .live-posting .fieldset{margin-bottom:20px}.live-layout .fieldset label{font-size:15px}
.municipality-search{width:100%;min-width:0;border:1px solid #b8c9df;border-radius:9px;padding:10px 12px;background:#fff;color:#142b45;font-size:15px;margin:0}
.municipality-hint{display:block;font-size:13px;color:#42566f;margin:4px 0 0}
.live-layout #live-post-status.error{color:#9c2036;border-color:#9c2036;background:#fff0f2}
.live-layout .info-shell,.live-layout .privacy-card{text-align:left}
.live-layout .privacy-card :is(p,li){max-width:78ch}
.live-layout .auth-message{font-size:16px;line-height:1.55;padding:10px 0}
.live-layout .mine-tabs{margin:20px 0}.live-layout .mine-tabs button{min-height:48px;font-size:16px}
.job-state{display:inline-block;padding:5px 10px;border-radius:8px;background:#edf0f4;color:#42566f;font-weight:750}
.payment-layout .wrap{max-width:1080px;margin:auto;padding:28px 20px 40px}
.payment-layout .section-head h1{font-size:30px;margin:0}.payment-layout .section-head p{margin:7px 0;color:#42566f}
.payment-layout button,.payment-layout .button{font:inherit;border:0;border-radius:10px;background:#0756bd;color:#fff;padding:11px 16px;display:inline-flex;align-items:center;justify-content:center;min-height:46px;margin:5px 5px 5px 0;text-decoration:none;font-weight:750}
.payment-layout button:disabled{opacity:.55;cursor:wait}.payment-layout button.secondary{background:#eaf0f7;color:#243b53}
.payment-layout .panel{background:#fff;border:1px solid #d1dceb;border-radius:16px;padding:24px;margin:18px 0;box-shadow:0 10px 28px #0f29530c}
.payment-layout article{border:1px solid #d1dceb;border-radius:12px;padding:18px;margin:16px 0}
.payment-layout h2{font-size:24px;margin-top:0}.payment-layout h3{font-size:19px;margin:18px 0 9px}
.payment-layout label{display:block;margin:12px 0}.payment-layout select,.payment-layout input:not([type=checkbox]){display:block;width:100%;font:inherit;padding:10px;border:1px solid #b8c9df;border-radius:9px;color:#142b45;background:#fff}
.payment-layout input[type=checkbox]{width:20px;height:20px;flex-shrink:0;accent-color:#0756bd}
.payment-layout .checkline{display:flex;gap:10px;align-items:flex-start}
.payment-layout .formgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.payment-layout fieldset{border:0;padding:0;margin:0}.payment-layout .muted{color:#42566f;font-size:15px}
.payment-layout .tabs-sub{display:flex;gap:8px;flex-wrap:wrap}.payment-layout .tabs-sub button{background:#eaf0f7;color:#243b53;border:1px solid #c9d9ef}
.payment-layout .tabs-sub button.active{background:#0756bd;color:#fff;border-color:#0756bd}
.payment-layout .identity-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:14px}
.payment-layout .identity-row p{margin:0;overflow-wrap:anywhere}
#message:not(:empty){padding:12px 16px;background:#fff1cb;border-radius:10px}
.contact{white-space:pre-line;overflow-wrap:anywhere;padding:12px;background:#eaf5ff}
.watch-category-picker{padding:14px;border:1px solid #d1dceb;border-radius:10px;margin:14px 0}
.watch-category-picker summary{font-weight:750;cursor:pointer}
#categories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px 14px}
#categories legend{padding-top:14px;font-size:14px;color:#42566f}#categories label{font-size:14px;display:flex;align-items:center;gap:7px;margin:5px 0}
.push-setup,#purchase{border-top:1px solid #d1dceb;padding-top:15px;margin-top:18px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #eaa12d;outline-offset:3px}
@media(max-width:900px){.live-layout .category-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:760px){
 .app-header .header-inner,.live-layout .header-inner{display:flex;min-height:65px;padding:10px 15px}
 .live-layout .topnav,.payment-layout .app-header .topnav{display:none}
 .header-account-shortcut{display:inline-block;font-size:14px}
 .live-layout .bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
 .live-layout .bottom-nav .nav-icon{width:21px;height:21px}
 .live-layout .bottom-nav button{min-width:0;min-height:49px;gap:4px;font-size:11px}
 .live-layout .launch-footer{padding-bottom:95px}
 .payment-layout .wrap{padding:22px 15px 35px}
 .payment-layout .panel{padding:18px}.payment-layout .formgrid{grid-template-columns:1fr;gap:0}
 #categories{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){.live-layout .compact-hero .home-lead{grid-template-columns:1fr 1fr;gap:14px}.live-layout .compact-hero .home-lead .home-heading h1{font-size:30px}.live-layout .compact-hero .home-art{aspect-ratio:1;min-height:170px}.live-layout .compact-hero .hero-kicker{display:none}.live-layout .compact-hero .home-heading p{font-size:14px}.live-layout .compact-hero .hero-actions{flex-direction:column}.live-layout .category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.live-layout .category-card{font-size:13px}.live-layout .category-description{font-size:13px}.payment-layout .tabs-sub button{flex:1}}
@media(max-width:420px){.live-layout .compact-hero .home-lead{grid-template-columns:1fr}.live-layout .compact-hero .home-art{display:block;aspect-ratio:3/1;min-height:100px;max-height:150px}.live-layout .compact-hero .hero-actions{flex-direction:row}.live-layout .compact-hero .hero-actions .btn{flex:1}.live-layout .compact-hero .home-heading p{max-width:28ch}#categories{grid-template-columns:1fr}}

.live-layout .live-market .statline{margin:12px 0}.live-layout .live-market .job-list{margin-top:14px}

.payment-layout .bottom-nav{display:none}
@media(max-width:760px){.payment-layout .bottom-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;z-index:40;background:#fff;border-top:1px solid #d1dceb;padding:7px 7px max(7px,env(safe-area-inset-bottom));box-shadow:0 -5px 20px #091d351e}.payment-layout .bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:49px;min-width:0;font-size:11px;font-weight:750;color:#243b53;text-decoration:none}.payment-layout .bottom-nav .nav-icon{width:21px;height:21px}.payment-layout .bottom-nav a.addlink{color:#b31c37}}

/* Shared municipality autocomplete: stays above scrolling form panels. */
.municipality-suggestions{position:fixed;z-index:1000;overflow-y:auto;overscroll-behavior:contain;background:#fff;color:#142b45;border:1px solid #8ca7c5;border-radius:10px;box-shadow:0 6px 20px #142b4533;padding:4px;box-sizing:border-box}
.municipality-suggestions[hidden]{display:none}
.municipality-suggestion{padding:11px 12px;min-height:44px;box-sizing:border-box;border-radius:6px;cursor:pointer;font-size:16px;line-height:22px}
.municipality-suggestion[aria-selected="true"],.municipality-suggestion:hover{background:#e1edfb;color:#102c4d}
.municipality-no-match{padding:12px;line-height:1.5;color:#344f6b}
.municipality-search:focus-visible{outline:3px solid #276bc2;outline-offset:2px}
