/* Shared Shop screen design. Print/PDF styling is deliberately independent. */
@font-face{font-family:Shop Poppins;src:url('assets/fonts/poppins-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Shop Poppins;src:url('assets/fonts/poppins-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Shop Poppins;src:url('assets/fonts/poppins-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@media screen{
  body.shop-customer,body.shop-owner{--bg:#f6f8fb;--surface:#fff;--ink:#142c42;--muted:#596c7e;--line:#dce4ed;--blue:#1264a3;--navy:#153d62;--soft:#eff4f9;--pale:#eff4f9;--art:#edf3f8;--card-art:#f0f5f8;--notice:#edf5fc;--green:#24684f;font:400 15px/1.6 'Shop Poppins','Segoe UI',sans-serif;letter-spacing:0}
  body.shop-customer.dark,body.shop-owner.dark{--bg:#101b29;--surface:#172638;--ink:#edf3fa;--muted:#adbdce;--line:#304258;--blue:#80c5ff;--navy:#edf3fa;--soft:#203247;--pale:#203247;--art:#1b2e42;--card-art:#1b2e42;--notice:#203449;--green:#92d5b6}
  :is(.shop-customer,.shop-owner) :is(button,input,textarea,select){font-family:inherit}
  :is(.shop-customer,.shop-owner) :is(.page-width,.header-inner){width:min(1180px,calc(100% - 64px))}
  :is(.shop-customer,.shop-owner) :is(.header,.site-header){background:var(--surface)}
  .shop-customer .site-header{height:82px;padding-inline:max(32px,calc((100vw - 1180px)/2));gap:16px}
  .shop-owner .header-inner{height:82px;gap:16px;flex-wrap:nowrap}
  :is(.shop-customer,.shop-owner) .brand{gap:14px}
  :is(.shop-customer,.shop-owner) .brand img{width:148px}
  .shop-customer .shop-word,.shop-owner .brand>span{font-size:19px;font-weight:600;letter-spacing:1.2px}
  .shop-owner .brand small{font-size:10px;letter-spacing:.25px;font-weight:400;margin-top:5px}
  :is(.shop-customer,.shop-owner) .header-actions{gap:10px}
  :is(.shop-customer,.shop-owner) :is(.button,.edit-button,.logout-button){font-size:14px;font-weight:600;line-height:1.5;min-height:46px;border-radius:10px;padding:11px 17px;gap:10px}
  :is(.shop-customer,.shop-owner) .button.primary{background:#145d98;color:#fff;box-shadow:none}
  :is(.shop-customer,.shop-owner) .button.primary:hover{background:#104c7d;transform:none}
  :is(.shop-customer,.shop-owner) .button.secondary{background:var(--surface);border-color:var(--line);color:var(--ink)}
  :is(.shop-customer,.shop-owner) .icon-button{width:44px;height:44px;font-size:28px}
  :is(.shop-customer,.shop-owner) .eyebrow{font-size:12px;font-weight:600;letter-spacing:.3px;line-height:1.5;text-transform:none;color:var(--muted)}
  :is(.shop-customer,.shop-owner) :is(.subtitle,.hero-description){font-size:15px;line-height:1.7;color:var(--muted)}
  :is(.shop-customer,.shop-owner) :is(.mode-tabs,.tabs){padding:4px;border-radius:10px;gap:4px;background:var(--soft)}
  :is(.shop-customer,.shop-owner) :is(.mode-tabs,.tabs) button{min-height:44px;font-size:14px;font-weight:600;padding:10px 18px;border-radius:7px}
  :is(.shop-customer,.shop-owner) :is(.search,.search-box){height:48px;border-radius:10px;background:var(--surface);padding-inline:14px}
  :is(.shop-customer,.shop-owner) :is(.search,.search-box) input{font-size:15px}
  :is(.shop-customer,.shop-owner) :is(.results-line,.result-count){font-size:13px;margin-block:20px 14px;line-height:1.5}
  :is(.shop-customer,.shop-owner) :is(.price,.metric,.quantity-stepper,.quote-totals,.stock-current){font-variant-numeric:tabular-nums}
  :is(.shop-customer,.shop-owner) dialog:not(#document-dialog){border-radius:18px;padding:28px;box-shadow:0 24px 80px #071b3233}
  :is(.shop-customer,.shop-owner) :is(.dialog-header,.dialog-top){margin-bottom:24px;align-items:flex-start;gap:16px}
  :is(.shop-customer,.shop-owner) :is(.dialog-header,.dialog-top) h2{font-size:25px;font-weight:600;line-height:1.35;letter-spacing:-.5px}
  :is(.shop-customer,.shop-owner) .dialog-header .eyebrow{margin-bottom:5px}
  :is(.shop-customer,.shop-owner) dialog:not(#document-dialog) :is(.hint,.field-limit,.form-field small,.price-brief,.form-error,.error,.status,.enquiry-intro,.enquiry-privacy){font-size:13px;line-height:1.65}
  :is(.shop-customer,.shop-owner) dialog:not(#document-dialog) :is(.field-label,.fields label,.reason-field,legend){font-size:14px;font-weight:600;line-height:1.5}
  :is(.shop-customer,.shop-owner) dialog:not(#document-dialog) :is(input[type=text],input[type=tel],input[type=email],input[type=password],textarea,.select-trigger){font-size:16px;min-height:48px;border-radius:9px}
  :is(.shop-customer,.shop-owner) dialog:not(#document-dialog) input::placeholder{font-size:14px}
  :is(.shop-customer,.shop-owner) dialog:not(#document-dialog) :is(.choice-chips span,.detail-options button){font-size:14px;line-height:1.5;min-height:44px;border-radius:8px}
  :is(.shop-customer,.shop-owner) :is(.bdj-date__trigger,.select-trigger){font-size:15px;min-height:48px;border-radius:9px}
  :is(.shop-customer,.shop-owner) .bdj-date__panel{border-radius:14px;font-family:inherit}
  :is(.shop-customer,.shop-owner) :is(.bdj-date__label,.bdj-date__weekdays>span){font-size:12px}
  :is(.shop-customer,.shop-owner) .bdj-date__day{font-size:14px}
  :is(.shop-customer,.shop-owner) .dialog-actions{gap:12px;margin-top:24px;padding-top:20px;flex-wrap:wrap}

  /* Customer: calm hierarchy, readable product names and one action per card. */
  .shop-customer .preview-strip{background:var(--soft);color:var(--muted);font-size:12px;letter-spacing:0;padding:7px 16px}
  .shop-customer .request-button{font-size:14px;min-height:44px;border-radius:10px;padding:8px 12px}
  .shop-customer .hero{gap:64px;padding-block:48px;min-height:0}
  .shop-customer .hero-copy h1{font-size:clamp(34px,3.8vw,50px);font-weight:600;letter-spacing:-1.5px;line-height:1.18;margin-bottom:16px}
  .shop-customer .hero-description{max-width:380px;margin-bottom:24px}
  .shop-customer .hero-art{border-radius:20px;height:260px}
  .shop-customer .catalogue{padding-block:36px 40px}
  .shop-customer .section-heading{margin-bottom:24px}
  .shop-customer .section-heading h2{font-size:28px;font-weight:600;letter-spacing:-.65px}
  .shop-customer .catalogue-toolbar{gap:20px;margin-bottom:16px}
  .shop-customer .category-filters{gap:8px}
  .shop-customer .category-filters button{font-size:13px;min-height:44px;border-radius:8px;padding:10px 14px}
  .shop-customer .category-filters button[aria-pressed=true]{background:var(--notice);color:var(--blue);border-color:var(--blue)}
  .shop-customer .product-grid{gap:20px}
  .shop-customer .product-card{border-radius:16px;box-shadow:none}
  .shop-customer .card-visual{height:190px;background:var(--card-art)}
  .shop-customer .card-visual img{width:150px;height:150px}
  .shop-customer .product-badge{font-size:11px;text-transform:none;letter-spacing:0;border-radius:6px;top:12px;left:12px;padding:3px 9px}
  .shop-customer .card-content{padding:20px}
  .shop-customer .card-category{font-size:12px;line-height:1.5;text-transform:none;letter-spacing:0;min-height:0;margin-bottom:6px}
  .shop-customer .card-content h3{font-size:19px;font-weight:600;line-height:1.4;letter-spacing:-.25px;min-height:0;margin-bottom:6px}
  .shop-customer .product-title{font-weight:600}
  .shop-customer .card-description{font-size:13px;line-height:1.6;min-height:0;margin-bottom:18px}
  .shop-customer .card-foot{margin-top:auto;padding-top:16px;align-items:center}
  .shop-customer .price{font-size:20px;line-height:1.4;font-weight:600;letter-spacing:-.25px}
  .shop-customer .price-unset{font-size:15px;letter-spacing:0}
  .shop-customer .price small,.shop-customer .price-caption{font-size:12px;font-weight:400;line-height:1.5}
  .shop-customer .add-button{background:var(--notice);border-color:var(--line);color:var(--blue);border-radius:10px;width:44px;height:44px;min-width:44px;font-size:25px}
  .shop-customer .add-button:hover{background:#145d98;color:#fff}
  .shop-customer :is(.availability-note,.market-note){font-size:12px;line-height:1.6;min-height:0}
  .shop-customer .site-footer{padding-block:24px;gap:16px}
  .shop-customer .footer-brand{font-size:16px;font-weight:600;letter-spacing:.4px}
  .shop-customer .footer-brand span{font-size:12px;letter-spacing:1px}
  .shop-customer .site-footer>a:last-of-type{font-size:13px}
  .shop-customer #product-dialog .detail-intro h2{font-size:25px;line-height:1.35;font-weight:600;letter-spacing:-.5px}
  .shop-customer .detail-market strong{font-size:21px;font-weight:600;line-height:1.5}
  .shop-customer .detail-market p{font-size:14px;line-height:1.6}
  .shop-customer .detail-market .price-brief{margin-top:12px;color:var(--muted)}
  .shop-customer .request-item{padding-block:22px;gap:12px 16px}
  .shop-customer .request-item h3{font-size:17px;line-height:1.4;font-weight:600}
  .shop-customer .request-item :is(p,.request-availability){font-size:13px}
  .shop-customer :is(.draft-notice,.request-summary span,.request-quantity-label){font-size:13px;line-height:1.6}
  .shop-customer .request-summary strong{font-size:16px;font-weight:600}
  .shop-customer .enquiry-form{padding-block:24px}
  .shop-customer .enquiry-form h3{font-size:20px;font-weight:600;line-height:1.4}
  .shop-customer .enquiry-consent{font-size:13px;line-height:1.7}

  /* Owner: stronger product hierarchy and labels close to their values. */
  .shop-owner .owner-sections{margin-top:28px;padding:0;gap:24px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;display:flex}
  .shop-owner .owner-sections button{font-size:15px;padding:12px 2px;border-radius:0;min-height:48px;background:none;box-shadow:none;border-bottom:3px solid transparent;margin-bottom:-1px}
  .shop-owner .owner-sections button[aria-pressed=true]{border-bottom-color:var(--blue);color:var(--blue);background:none;box-shadow:none}
  .shop-owner .page-heading{padding-block:28px 24px;gap:20px}
  .shop-owner .page-heading h1{font-size:30px;font-weight:600;line-height:1.3;letter-spacing:-.8px;margin:0}
  .shop-owner .heading-actions{display:flex;gap:10px;flex-wrap:wrap}
  .shop-owner .catalogue-panel{padding:24px;border-radius:16px}
  .shop-owner .toolbar{gap:20px}
  .shop-owner :is(.column-labels,.product-row){grid-template-columns:minmax(240px,2.3fr) minmax(105px,1fr) minmax(100px,1fr) minmax(120px,1.2fr) 60px 100px;gap:16px}
  .shop-owner .column-labels{font-size:12px;font-weight:600;color:var(--muted);padding-bottom:14px}
  .shop-owner .product-row{padding-block:22px}
  .shop-owner .product-identity{gap:14px}
  .shop-owner .product-identity>div:last-child{min-width:0}
  .shop-owner .product-image{border-radius:12px}
  .shop-owner .product-image img{width:68px;height:74px}
  .shop-owner .product-identity h2{font-size:17px;line-height:1.4;letter-spacing:-.2px;font-weight:600;margin-bottom:5px;overflow-wrap:break-word}
  .shop-owner .product-identity p{font-size:13px;line-height:1.5;overflow-wrap:break-word}
  .shop-owner .product-identity .mode{font-size:11px;letter-spacing:.3px;font-weight:600;margin-top:6px}
  .shop-owner .metric strong{font-size:16px;line-height:1.5;font-weight:600}
  .shop-owner .metric .missing{font-size:13px;line-height:1.5}
  .shop-owner .metric small{font-size:12px;line-height:1.5;margin-top:4px}
  .shop-owner .listing-badge{font-size:12px}
  .shop-owner .stock-product-actions{gap:8px}
  .shop-owner .stock-product-actions .edit-button{font-size:13px;min-height:44px;padding:10px 8px;border-radius:8px}
  .shop-owner .page-footnote{font-size:13px;line-height:1.65;margin-block:18px 0}
  .shop-owner .auth-card{margin:60px auto;padding:32px;border-radius:18px;box-shadow:0 8px 32px #0c2f4808}
  .shop-owner .auth-card h1{font-size:28px;line-height:1.3;font-weight:600;margin-bottom:12px;letter-spacing:-.6px}
  .shop-owner .auth-card :is(.subtitle,.hint,.auth-status){font-size:14px}
  .shop-owner .auth-card form label{font-size:14px}
  .shop-owner .auth-card input{border-radius:9px}
  .shop-owner :is(.editor-product strong,.quote-line h3,.offline-line-heading h4){font-size:18px;font-weight:600;line-height:1.4}
  .shop-owner :is(.editor-product p,.quote-line-heading p,.visibility small){font-size:13px;line-height:1.6}
  .shop-owner .edit-icon-section{display:grid;grid-template-columns:minmax(0,1fr) 64px;gap:14px;align-items:end}
  .shop-owner #edit-icon-preview{padding:0;margin:0;min-height:0;background:none;border:0}
  .shop-owner #edit-icon-preview img{width:64px;height:64px}
  .shop-owner #edit-icon-preview p{display:none}
  .shop-owner .input-unit>span{font-size:12px}
  .shop-owner .enquiry-card{border-radius:14px}
  .shop-owner .enquiry-card summary{padding:22px 24px}
  .shop-owner .enquiry-summary-copy strong{font-size:18px;font-weight:600;line-height:1.45}
  .shop-owner :is(.enquiry-reference,.enquiry-summary-meta,.enquiry-contact dt,.enquiry-badge){font-size:12px;letter-spacing:0;line-height:1.6}
  .shop-owner .enquiry-content{padding:24px}
  .shop-owner .enquiry-contact dd{font-size:15px}
  .shop-owner .quote-totals{border-radius:12px;padding:18px 20px;font-size:15px}
  .shop-owner .quote-totals small{font-size:12px}
  .shop-owner .quote-totals .quote-inclusive{font-size:17px}
  .shop-owner :is(.stock-current span,.stock-preview span,.rental-quantities dt,.rental-history small,.rental-due,.rental-fleet,.rental-held,.stock-history li small){font-size:13px;line-height:1.6}
  .shop-owner :is(.rental-quantities dd,.stock-preview strong){font-size:16px}
  .shop-owner :is(.rental-line h3,.rental-history h3){font-size:18px;font-weight:600}
  .shop-owner :is(.stock-current>div,.quote-line,.offline-line){border-radius:12px}
  .shop-owner :is(.select-options,.icon-picker-head){font-family:inherit}
  .shop-owner .select-options [role=option]{font-size:14px;min-height:44px;line-height:1.5}
  .shop-owner .icon-option>span{font-size:13px;line-height:1.5}
  .shop-owner #icon-picker{padding:0}

  @media(max-width:1100px){
    .shop-owner :is(.column-labels,.product-row){grid-template-columns:minmax(205px,2fr) minmax(88px,1fr) minmax(85px,1fr) minmax(100px,1fr) 56px 90px;gap:12px}
    .shop-owner .product-image img{width:54px;height:62px}
    .shop-owner .product-identity{gap:10px}
    .shop-owner .catalogue-panel{padding:20px}
    .shop-customer .hero{gap:32px}
  }
  @media(max-width:950px){
    .shop-owner .column-labels{display:none}
    .shop-owner #product-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
    .shop-owner .product-row,.shop-owner .product-row:last-child{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
    .shop-owner .product-identity{grid-column:1/-1}
    .shop-owner .mobile-label{display:block;position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;font-size:12px;color:var(--muted);margin-bottom:5px}
    .shop-owner .metric-not-offered{display:none}
    .shop-owner .listing{grid-column:auto;align-self:center}
    .shop-owner .stock-product-actions{grid-column:1/-1;flex-direction:row;justify-self:stretch;padding-top:14px;border-top:1px solid var(--line)}
    .shop-owner .stock-product-actions .edit-button{flex:1}
    .shop-owner .product-image img{width:64px;height:70px}
  }
  @media(max-width:700px){
    :is(.shop-customer,.shop-owner) :is(.page-width,.header-inner){width:calc(100% - 32px)}
    .shop-customer .site-header{height:72px;padding-inline:16px}
    .shop-owner .header-inner{min-height:72px;height:72px;padding:0;gap:8px;flex-wrap:nowrap}
    :is(.shop-customer,.shop-owner) .brand{gap:10px;min-width:0}
    :is(.shop-customer,.shop-owner) .brand img{width:118px}
    .shop-customer .shop-word,.shop-owner .brand>span{font-size:15px;letter-spacing:1px;padding-left:10px}
    .shop-customer .shop-word{padding-left:0}
    .shop-owner .brand small{font-size:9px;letter-spacing:0;line-height:1.4}
    .shop-owner .brand>span{display:block}
    :is(.shop-customer,.shop-owner) .header-actions{gap:4px}
    .shop-owner .logout-button{font-size:12px;min-height:44px;padding:9px 8px}
    .shop-customer .request-button{border:0;background:none;padding:4px 6px;gap:6px;min-width:44px}
    .shop-customer .request-label{display:none}
    .shop-customer .list-symbol{display:block}
    :is(.shop-customer,.shop-owner) :is(.search,.search-box) input{font-size:16px}
    :is(.shop-customer,.shop-owner) dialog:not(#document-dialog){width:calc(100% - 24px);max-width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:20px;border-radius:16px}
    .shop-owner #icon-picker{padding:0}
    :is(.shop-customer,.shop-owner) :is(.dialog-header,.dialog-top) h2{font-size:22px;line-height:1.35}
    :is(.shop-customer,.shop-owner) :is(.button,.edit-button){font-size:14px;padding:11px 14px;white-space:normal}
    .shop-customer .hero{grid-template-columns:1fr;padding-block:32px;gap:24px}
    .shop-customer .hero-copy h1{font-size:35px;line-height:1.2;letter-spacing:-1px;margin-bottom:14px}
    .shop-customer .hero-description{font-size:14px;max-width:340px;margin-bottom:20px}
    .shop-customer .hero-art{height:150px;grid-template-columns:1fr 1.2fr 1fr;grid-template-rows:1fr;padding:10px;gap:6px;border-radius:16px}
    .shop-customer .hero-art img{grid-row:1;width:100%;height:125px}
    .shop-customer .hero-cement{grid-column:1}.shop-customer .hero-mixer{grid-column:2}.shop-customer .hero-rebar{grid-column:3}
    .shop-customer .catalogue{padding-block:28px 32px}
    .shop-customer .section-heading h2{font-size:25px;letter-spacing:-.5px}
    .shop-customer .section-heading{margin-bottom:20px}
    .shop-customer .catalogue-toolbar{flex-direction:column;align-items:stretch;gap:14px}
    .shop-customer .search-box{max-width:none;flex:none}
    .shop-customer .mode-tabs button{flex:1;padding-inline:10px;font-size:14px}
    .shop-customer .product-grid{grid-template-columns:1fr;gap:14px}
    .shop-customer .product-card{display:grid;grid-template-columns:100px minmax(0,1fr);align-items:stretch}
    .shop-customer .card-visual{height:auto;min-height:180px}
    .shop-customer .card-visual img{width:92px;height:112px;max-width:100%;object-fit:contain}
    .shop-customer .card-visual .view-details{display:none}
    .shop-customer .product-badge{top:10px;left:10px;font-size:11px;padding:2px 7px}
    .shop-customer .card-content{padding:16px 14px;min-width:0}
    .shop-customer .card-category{font-size:12px;line-height:1.45;margin-bottom:5px}
    .shop-customer .card-content h3{font-size:18px;line-height:1.4;letter-spacing:-.2px;margin-bottom:5px}
    .shop-customer .card-description{font-size:13px;margin-bottom:14px}
    .shop-customer .card-foot{padding-top:12px;gap:8px}
    .shop-customer .price{font-size:18px}.shop-customer .price-unset{font-size:14px}
    .shop-customer .site-footer{padding-bottom:96px;gap:8px}
    .shop-customer .site-footer>a:last-of-type{font-size:12px}
    .shop-customer #product-dialog .detail-intro{grid-template-columns:64px minmax(0,1fr);gap:14px}
    .shop-customer #product-dialog .detail-intro h2{font-size:22px}
    .shop-customer .request-item{grid-template-columns:48px minmax(0,1fr) 44px;gap:12px}
    .shop-customer .request-item h3{font-size:16px}
    .shop-owner .owner-sections{margin-top:16px;gap:24px}
    .shop-owner .page-heading,.shop-owner #products-panel>.page-heading,.shop-owner #enquiries-panel>.page-heading{padding-block:24px 20px;display:flex;flex-direction:column;align-items:stretch;gap:16px}
    .shop-owner .page-heading h1{font-size:27px;letter-spacing:-.6px}
    .shop-owner .heading-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .shop-owner .heading-actions .button{padding-inline:10px}
    .shop-owner .catalogue-panel{padding:0;border:0;background:none;overflow:visible}
    .shop-owner .toolbar{flex-direction:column;align-items:stretch;gap:14px}
    .shop-owner .tabs{width:100%}.shop-owner .tabs button{flex:1;padding-inline:8px}
    .shop-owner .search{width:100%;max-width:none}
    .shop-owner #product-list{grid-template-columns:1fr;gap:14px}
    .shop-owner .product-row,.shop-owner .product-row:last-child{padding:18px;gap:18px 14px}
    .shop-owner .product-identity h2{font-size:18px}
    .shop-owner .product-identity p{font-size:13px}
    .shop-owner .product-image img{width:60px;height:66px}
    .shop-owner .auth-card{margin-block:28px;padding:24px}
    .shop-owner .enquiry-card summary,.shop-owner .enquiry-content{padding:18px}
    .shop-owner .enquiry-card summary{gap:12px;grid-template-columns:minmax(0,1fr) auto 12px}
    .shop-owner .enquiry-summary-copy strong{font-size:17px}
    .shop-owner .enquiry-contact{grid-template-columns:1fr;gap:16px}
    .shop-owner dialog:not(#document-dialog) .dialog-actions{position:static;margin-bottom:0;padding-bottom:0}
    .shop-owner .quote-totals{padding:16px;font-size:14px}
    .shop-owner .quote-totals .quote-inclusive{font-size:16px}
  }
  @media(max-width:360px){
    :is(.shop-customer,.shop-owner) .brand img{width:94px}
    :is(.shop-customer,.shop-owner) .brand{gap:7px}
    .shop-owner .brand>span{padding-left:7px;font-size:14px}
    .shop-owner .brand small{font-size:8px}
    .shop-customer .product-card{grid-template-columns:80px minmax(0,1fr)}
    .shop-customer .card-visual img{width:76px;height:100px}
    .shop-customer .card-content{padding:14px 12px}
    .shop-customer .card-content h3{font-size:17px}
    .shop-customer .hero-copy h1{font-size:31px}
  }
}