/* Cart and account surfaces share the STG type, colour and spacing system. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.commerce-view { --checkout-accent:#007a80; background:#fff; }
.commerce-view button, .profile-auth button { transition:background-color .15s, border-color .15s; }
.commerce-view button:disabled, .profile-auth button:disabled { cursor:default; opacity:.5; }
.text-action { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:4px 0; border:0; background:transparent; color:#00777d; font-size:14px; font-weight:700; text-decoration:none; }
.text-action:hover { color:#004e54; text-decoration:underline; }
.text-action svg { width:16px; height:16px; }
.commerce-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:4px 0 28px; }
.commerce-heading h1 { margin:0; font-size:30px; line-height:1.25; font-weight:800; }
.commerce-heading p { margin:8px 0 0; color:#657174; font-size:15px; line-height:1.5; }
.commerce-heading > button { flex-shrink:0; }
.commerce-view .checkout-progress { display:flex; gap:0; padding:0 0 26px; margin:0 0 26px; border-bottom:1px solid #e2e8e8; }
.checkout-progress li { display:flex; align-items:center; justify-items:initial; gap:0; flex:1; }
.checkout-progress li:not(:last-child)::after { content:''; height:1px; flex:1; margin:0 18px; background:#dde5e5; }
.checkout-progress li:last-child { flex:0 0 auto; }
.checkout-progress button { display:flex; align-items:center; gap:10px; padding:0; min-height:34px; background:none; border:0; color:#6b7679; font-size:14px; font-weight:600; white-space:nowrap; }
.commerce-view .checkout-progress button:disabled { opacity:1; }
.commerce-view .checkout-progress b { width:30px; height:30px; border-color:#dfe6e6; color:#647375; font-size:13px; font-weight:700; }
.commerce-view .checkout-progress .active b { background:#007a80; color:#fff; border-color:#007a80; }
.commerce-view .checkout-progress .active button, .commerce-view .checkout-progress .complete button { color:#006b70; font-weight:800; }
.commerce-view .checkout-progress .complete b { background:#e5f4f2; color:#007a80; border-color:#c4e3df; }
.checkout-layout { display:grid; grid-template-columns:minmax(0,1fr) 310px; align-items:start; gap:32px; }
.checkout-main { min-width:0; }
.checkout-section-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:0 0 8px; min-height:34px; }
.checkout-section-heading h2, .summary-heading h2 { margin:0; font-size:18px; line-height:1.4; font-weight:800; }
.checkout-section-heading > span { color:#6a7477; font-size:13px; white-space:nowrap; }
.commerce-view .cart-items { display:block; }
.commerce-view .cart-item { display:grid; grid-template-columns:42px minmax(0,1fr) auto; gap:14px; padding:24px 0; border:0; border-bottom:1px solid #e3e9e9; border-radius:0; background:none; box-shadow:none; }
.commerce-view .cart-item .service-symbol { width:42px; height:42px; border-radius:6px; background:#e9f5f4; color:#007a80; }
.commerce-view .cart-item .service-symbol svg { width:22px; height:22px; stroke-width:1.7; }
.commerce-view .cart-item h3 { margin:0; font-size:16px; line-height:1.45; font-weight:700; overflow-wrap:anywhere; }
.cart-item-tools { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin-top:5px; }
.cart-item-state { font-size:12px; color:#697577; }
.cart-item-end { display:flex; flex-direction:column; align-items:flex-end; gap:14px; }
.commerce-view .cart-item-price { font-size:18px; margin:0; line-height:1.4; color:#1b282a; font-weight:800; white-space:nowrap; }
.commerce-view .remove-item { display:grid; place-items:center; padding:0; border:0; background:transparent; color:#7a8587; min-width:32px; height:32px; border-radius:4px; }
.commerce-view .remove-item:hover { color:#a13232; background:#fff1ef; }
.commerce-view .remove-item svg { width:17px; height:17px; stroke-width:1.6; }
.commerce-view .quantity-control { display:inline-grid; grid-template-columns:30px 30px 30px; align-items:center; height:32px; margin:12px 0 0; gap:0; border:1px solid #dce4e4; border-radius:5px; }
.commerce-view .quantity-control button { width:30px; min-height:30px; border:0; background:transparent; color:#304244; font-size:18px; }
.commerce-view .quantity-control span { text-align:center; font-size:13px; font-weight:600; }
.cart-document-note { display:flex; align-items:flex-start; gap:9px; margin:20px 0; font-size:13px; line-height:1.6; color:#697678; }
.cart-document-note svg { flex:0 0 17px; height:20px; stroke-width:1.6; }
.checkout-aside { position:sticky; top:0; padding:24px; border:1px solid #dce7e5; border-radius:8px; background:#f5f9f8; }
.summary-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:24px; }
.summary-heading img { width:45px; height:auto; opacity:.85; }
.checkout-breakdown { margin:0 0 20px; display:grid; gap:14px; font-size:14px; }
.checkout-breakdown > div { display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.checkout-breakdown dt { color:#647274; }
.checkout-breakdown dd { margin:0; text-align:right; font-weight:600; }
.checkout-total { display:flex; align-items:baseline; justify-content:space-between; gap:12px; padding-top:20px; border-top:1px solid #dbe5e3; }
.checkout-total span { font-size:16px; font-weight:700; }
.checkout-total strong { font-size:29px; line-height:1.2; font-weight:800; color:#152d2d; white-space:nowrap; }
.checkout-total-note { margin:12px 0 0; font-size:12px; line-height:1.6; color:#647274; }
.commerce-view .payment-option { display:flex; align-items:flex-start; gap:10px; padding:18px 0; border:0; border-radius:0; margin:0; background:transparent; }
.commerce-view .payment-option > svg { flex:0 0 19px; height:23px; color:#007a80; stroke-width:1.7; }
.commerce-view .payment-option strong { font-size:13px; color:#315656; font-weight:700; }
.commerce-view .payment-option p { margin:4px 0 0; font-size:12px; line-height:1.5; color:#657375; }
.commerce-view .checkout-button { min-height:48px; background:#007a80; border:1px solid #007a80; color:#fff; font-size:15px; font-weight:700; border-radius:6px; }
.commerce-view .checkout-button:hover { background:#006269; }
.checkout-primary { display:flex; align-items:center; justify-content:center; gap:8px; }
.checkout-primary svg { width:18px; height:18px; }
.whatsapp-alternative { display:flex; justify-content:center; align-items:center; gap:8px; min-height:46px; width:100%; margin:10px 0 0; border:1px solid #c4d6d2; border-radius:6px; background:#fff; color:#245653; font-size:13px; font-weight:700; }
.whatsapp-alternative:hover { background:#e7f3ef; }
.whatsapp-alternative svg { width:18px; height:18px; }
.checkout-next { margin:10px 0 0; font-size:12px; line-height:1.6; text-align:center; color:#657375; }
.checkout-help { margin-top:23px; padding-top:20px; border-top:1px solid #dce6e4; display:grid; justify-items:center; gap:8px; font-size:12px; color:#677576; }
.checkout-help a { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700; color:#245b5b; }
.checkout-help svg { width:16px; height:16px; }
.commerce-view .checkout-form { max-width:none; padding:0; margin:0; border:0; border-radius:0; background:none; }
.checkout-account { margin:12px 0 24px; font-size:14px; color:#657375; line-height:1.6; overflow-wrap:anywhere; }
.contact-fields { display:grid; gap:14px; }
.commerce-view .checkout-form label { margin:0; }
.commerce-view .checkout-form label > span { font-size:14px; font-weight:600; margin:0 0 8px; }
.commerce-view .checkout-form input, .commerce-view .checkout-form textarea { border-color:#cdd8d7; border-radius:6px; padding:12px; font-size:16px; min-height:50px; }
.commerce-view .checkout-form input::placeholder, .commerce-view .checkout-form textarea::placeholder { color:#8a9696; }
.checkout-notes { border-block:1px solid #e3e9e9; margin:24px 0; padding:16px 0; }
.checkout-notes summary { cursor:pointer; font-size:14px; font-weight:600; }
.checkout-notes summary span { margin-left:8px; color:#798587; font-size:12px; font-weight:400; }
.checkout-notes textarea { margin-top:14px; }
.commerce-view .consent-check { padding:0; border:0; background:transparent; border-radius:0; grid-template-columns:20px minmax(0,1fr); gap:10px; }
.commerce-view .consent-check input { min-height:18px; width:18px; height:18px; padding:0; margin-top:2px; }
.commerce-view .consent-check span { font-size:13px !important; line-height:1.65; color:#536264; font-weight:400 !important; }
.commerce-view .consent-check a { color:#006e74; text-decoration:underline; text-underline-offset:3px; }
.checkout-feedback { color:#9a3427; font-size:14px; line-height:1.6; }
.checkout-feedback:empty { display:none; }
.checkout-mobile-bar { display:none; }
.checkout-layout.is-empty { grid-template-columns:1fr; }
.is-empty .checkout-section-heading { display:none; }
.cart-empty { display:flex; flex-direction:column; align-items:center; padding:48px 12px; text-align:center; }
.cart-empty > svg { width:54px; height:54px; stroke-width:1.2; color:#007a80; margin-bottom:22px; }
.cart-empty h2 { font-size:24px; margin:0; }
.cart-empty p { font-size:15px; color:#697678; margin:12px 0 28px; }
.cart-empty .checkout-button { width:auto; padding:0 28px; }
.commerce-view .request-review { max-width:620px; margin:0 auto; padding:16px 0 30px; border:0; }
.confirmation-mark { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:#e3f3ed; color:#287050; margin-bottom:18px; }
.confirmation-mark svg { width:24px; height:24px; }
.commerce-view .request-status { font-size:13px; color:#34735b; }
.commerce-view .request-review h2 { margin:8px 0; font-size:26px; line-height:1.3; }
.commerce-view #requestReference { color:#647577; font-size:13px; }
.commerce-view #requestSaveStatus { font-size:15px; color:#4f6062; line-height:1.6; }
.confirmation-summary { margin:24px 0; border-block:1px solid #e1e8e6; }
.confirmation-summary > div { display:flex; justify-content:space-between; gap:24px; padding:12px 0; font-size:14px; }
.confirmation-summary strong { white-space:nowrap; }
.confirmation-summary .confirmation-total { margin-top:6px; padding:16px 0; border-top:1px solid #e1e8e6; font-size:18px; font-weight:700; }
.commerce-view .request-actions { display:grid; grid-template-columns:1fr; gap:10px; }
.commerce-view .request-actions a { display:flex; align-items:center; justify-content:center; gap:8px; font-size:14px; color:#266564; border:1px solid #d1dfdc; background:#fff; border-radius:6px; }
.commerce-view .request-actions svg { width:18px; height:18px; }
.confirmation-message { margin-top:24px; padding:16px 0; border-block:1px solid #e1e8e6; font-size:14px; }
.confirmation-message summary { cursor:pointer; color:#526365; }
.request-summary-head { margin-top:18px; }
.commerce-view .confirmation-message textarea { min-height:150px; font-size:13px; line-height:1.6; background:#fafcfc; }
.confirmation-footer { display:flex; justify-content:space-between; gap:20px; padding-top:18px; }
.confirmation-footer button { font-size:13px; }
.app-view.is-auth { background:#fff; }
.profile-auth { width:min(100%,400px); margin:36px auto 24px; }
.auth-heading { text-align:center; margin-bottom:30px; }
.auth-heading img { width:76px; height:auto; margin:0 auto 26px; }
.auth-heading h1 { margin:0; font-size:30px; line-height:1.3; font-weight:800; }
.auth-heading p { margin:12px 0 0; color:#657476; font-size:15px; line-height:1.6; }
.profile-auth .checkout-form { max-width:none; margin:0; padding:0; border:0; border-radius:0; background:transparent; }
.profile-auth .checkout-form label { margin:0 0 18px; }
.profile-auth .checkout-form label[for$="Password"] { margin:0; }
.profile-auth .checkout-form label span { margin:0 0 8px; font-size:14px; font-weight:600; color:#344447; }
.profile-auth .checkout-form input { min-height:52px; font-size:16px; border:1px solid #ccd6d5; border-radius:6px; padding:12px 14px; }
.profile-auth .checkout-form input:focus, .commerce-view .checkout-form input:focus { border-color:#007a80; box-shadow:0 0 0 3px #007a8010; outline:none; }
.password-field { position:relative; }
.profile-auth .password-field input { padding-right:50px; }
.password-toggle { position:absolute; right:5px; top:5px; width:42px; height:42px; display:grid; place-items:center; border:0; background:transparent; border-radius:4px; color:#657375; }
.password-toggle:hover { background:#f1f5f4; }
.password-toggle svg { width:20px; height:20px; stroke-width:1.7; }
.password-toggle[aria-pressed="true"] { color:#007a80; background:#ebf6f4; }
.auth-recovery { display:flex; justify-content:flex-end; margin:8px 0 24px; }
.auth-recovery button { font-size:13px; min-height:30px; font-weight:600; }
.profile-auth .checkout-button { min-height:50px; background:#007a80; color:#fff; font-size:15px; font-weight:700; border-radius:6px; }
.profile-auth .checkout-button:hover { background:#006269; }
.auth-switch { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:6px; margin:24px 0 0; font-size:14px; color:#657476; }
.auth-switch button { font-size:14px; }
.auth-footer { display:flex; justify-content:center; gap:12px; margin-top:44px; color:#6d7a7c; font-size:12px; }
.auth-footer a:hover { text-decoration:underline; }
.auth-hint { margin:8px 0 22px; font-size:12px; color:#6b7779; }
.auth-feedback { margin:0 0 18px; padding:12px; color:#315954; background:#eef6f4; border-left:2px solid #007a80; font-size:14px; line-height:1.6; border-radius:0 4px 4px 0; overflow-wrap:anywhere; }
.auth-feedback:empty { display:none; }
#resetPasswordForm { width:min(100%,400px); margin:36px auto; padding:0; border:0; background:transparent; }
#resetPasswordForm label span { font-size:14px; }
@media(max-width:1100px) {
  .checkout-layout { grid-template-columns:minmax(0,1fr) 280px; gap:22px; }
  .checkout-aside { padding:20px; }
  .checkout-total strong { font-size:26px; }
  .commerce-view .cart-item { gap:10px; grid-template-columns:34px minmax(0,1fr) auto; }
  .commerce-view .cart-item .service-symbol { width:34px; height:36px; }
  .commerce-view .cart-item-price { font-size:16px; }
}
@media(max-width:800px) {
  .app-frame:has(.commerce-view.active, .is-auth.active) .nav-main { padding-top:0 !important; }
  .app-frame:has(.commerce-view.active, .is-auth.active) .nav-main-icon { position:static; width:21px; height:21px; border:0; border-radius:0; background:transparent; box-shadow:none; color:inherit; }
  .app-frame:has(.commerce-view.active, .is-auth.active) .nav-main-icon svg { width:21px; height:21px; }
  .commerce-view { padding:24px 20px 116px; }
  .checkout-mobile-bar { position:fixed; bottom:72px; left:0; right:0; z-index:45; display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:78px; padding:12px 20px; background:#fff; border-top:1px solid #dce6e4; box-shadow:0 -4px 14px #16373409; }
  .checkout-mobile-bar > div { display:grid; gap:4px; }
  .checkout-mobile-bar span { color:#637476; font-size:12px; }
  .checkout-mobile-bar strong { font-size:18px; white-space:nowrap; }
  .checkout-mobile-bar .checkout-button { width:auto; min-width:144px; min-height:46px; padding:8px 16px; font-size:13px; }
  .checkout-mobile-bar svg { width:16px; height:16px; vertical-align:middle; }
  .checkout-layout { grid-template-columns:1fr; gap:22px; }
  .checkout-aside { position:static; padding:22px; }
  .commerce-heading { align-items:flex-start; gap:12px; margin:0 0 24px; }
  .commerce-heading h1 { font-size:26px; }
  .commerce-heading p { font-size:14px; max-width:26ch; }
  .commerce-heading > button { font-size:12px; padding-top:8px; }
  .commerce-heading > button svg { display:none; }
  .commerce-view .checkout-progress { margin-bottom:24px; padding-bottom:20px; }
  .checkout-progress button { gap:6px; font-size:12px; }
  .checkout-progress li:not(:last-child)::after { margin:0 8px; }
  .commerce-view .checkout-progress b { width:25px; height:25px; font-size:11px; }
  .commerce-view .cart-item { grid-template-columns:36px minmax(0,1fr) auto; padding:20px 0; gap:10px; }
  .commerce-view .cart-item h3 { font-size:15px; }
  .commerce-view .cart-item-price { font-size:16px; }
  .cart-item-tools { display:grid; justify-items:start; gap:0; }
  .cart-item-tools .text-action { min-height:32px; font-size:13px; }
  .checkout-section-heading h2, .summary-heading h2 { font-size:17px; }
  .commerce-view .quantity-control { margin-top:9px; }
  .checkout-total strong { font-size:30px; }
  .profile-auth { margin:24px auto; max-width:380px; padding:0 6px; }
  .auth-heading { margin-bottom:26px; }
  .auth-heading img { margin-bottom:22px; }
  .auth-heading h1 { font-size:28px; }
  .auth-footer { margin-top:32px; }
}
@media(max-width:360px) {
  .commerce-view { padding-inline:16px; }
  .commerce-heading > button { max-width:65px; white-space:normal; }
  .checkout-progress button { font-size:12px; gap:5px; }
  .checkout-progress li:not(:last-child)::after { margin-inline:6px; }
  .commerce-view .cart-item { grid-template-columns:minmax(0,1fr) auto; }
  .commerce-view .cart-item > .service-symbol { display:none; }
}
@media(prefers-reduced-motion:reduce) { .commerce-view button, .profile-auth button { transition:none; } }