/* PS-95 — full storefront pages (product, cart, checkout, account) for the PhoxShop template.
   Loaded by every page that runs /assets/phoxshop-runtime.js. Colours come from the template's own
   palette tokens (--color-primary / --color-accent / --color-text / --line …), so a shop that changes
   its colour scheme in admin re-skins these pages too; the fallbacks only apply on a page that does
   not declare them. Sentence case, no emoji, per the PharmaGuide design system. */

.phox-page{display:block;min-height:50vh}
body.info-open .phox-page{display:none}
.pg-wrap,.pdp,.pdp-crumbs,.pdp-related{width:100%;max-width:var(--maxw,1300px);margin-inline:auto;padding-inline:var(--gutter,22px)}
.pg-wrap{padding-block:32px 72px}
.pg-title{font-size:1.6rem;font-weight:900;color:var(--color-text,#242424);margin:0 0 18px}
.pg-note{color:var(--muted,#5b6472);font-size:.92rem;margin:0 0 14px}
.pg-loading{color:var(--muted,#5b6472)}
.pg-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.pg-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--color-accent,#40beee);color:#fff;border:none;border-radius:999px;padding:12px 22px;font-weight:800;font-size:.92rem;text-decoration:none;cursor:pointer}
.pg-btn:hover{filter:brightness(.94)}
.pg-btn[disabled]{opacity:.55;cursor:default}
.pg-btn.ghost{background:#fff;color:var(--color-text,#242424);border:1px solid var(--line,#d5d9d9)}
.pg-btn.sm{padding:8px 14px;font-size:.84rem}
.pg-link{background:none;border:none;color:var(--color-primary,#005d91);font-weight:700;cursor:pointer;padding:0;text-decoration:underline}
.pg-card{background:var(--surface,#fff);border:1px solid var(--line,#d5d9d9);border-radius:var(--radius,12px);padding:20px}
.pg-card+.pg-card{margin-top:14px}
.pg-grid>.pg-card,.pg-grid>div>.pg-card:first-child{margin-top:0}
.pg-card h2{font-size:1.05rem;font-weight:800;margin:0 0 12px;color:var(--color-text,#242424)}
.pg-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:22px;align-items:start}
.pg-empty{background:var(--surface,#fff);border:1px dashed var(--line,#d5d9d9);border-radius:var(--radius,12px);padding:34px 20px;text-align:center;color:var(--muted,#5b6472)}
.pg-empty p{margin:0 0 14px}
.pg-error{color:#b3261e;font-size:.86rem;margin-top:6px}
.pg-ok{color:#1f7a3a}
@media (max-width:860px){.pg-grid{grid-template-columns:1fr}}

/* Toast (category pages carry no template toast style of their own) */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--nav,#242424);color:#fff;padding:13px 22px;border-radius:10px;font-size:.88rem;font-weight:600;z-index:90;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Product page */
.pdp-crumbs{padding-top:22px;font-size:.84rem;color:var(--muted,#5b6472);display:flex;flex-wrap:wrap;gap:6px}
.pdp-crumbs a{color:var(--color-primary,#005d91);text-decoration:none;font-weight:600}
.pdp-crumbs a:hover{text-decoration:underline}
.pdp{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;padding-block:18px 40px}
.pdp-main{position:relative;aspect-ratio:1/1;background:var(--primary-soft,#f2f6f9);border-radius:var(--radius,12px);display:flex;align-items:center;justify-content:center;overflow:hidden}
.pdp-main img{max-width:100%;max-height:100%;object-fit:contain}
.pdp-noimg{color:var(--muted,#5b6472);font-weight:600}
.pdp-ribbon{position:absolute;top:14px;left:14px;background:var(--color-primary,#005d91);color:#fff;font-size:.74rem;font-weight:800;padding:5px 10px;border-radius:999px;z-index:1}
.pdp-thumbs{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.pdp-thumb{width:72px;height:72px;border:2px solid transparent;border-radius:10px;background:var(--primary-soft,#f2f6f9);padding:4px;cursor:pointer}
.pdp-thumb img{width:100%;height:100%;object-fit:contain}
.pdp-thumb.active,.pdp-thumb:hover{border-color:var(--color-accent,#40beee)}
.pdp-brand{font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary,#005d91);margin-bottom:6px}
.pdp-name{font-size:1.9rem;line-height:1.2;font-weight:900;color:var(--color-text,#242424);margin:0 0 16px}
.pdp-buy{border-top:1px solid var(--line,#d5d9d9);border-bottom:1px solid var(--line,#d5d9d9);padding:16px 0;margin-bottom:18px}
.pdp-price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pdp-now{font-size:1.7rem;font-weight:900;color:var(--color-text,#242424)}
.pdp-was{font-size:1rem;color:var(--muted,#5b6472);text-decoration:line-through}
.pdp-save{background:#fdecea;color:#b3261e;font-size:.76rem;font-weight:800;padding:3px 8px;border-radius:999px}
.pdp-price-hidden{font-weight:700;color:var(--color-primary,#005d91)}
.pdp-stock{margin-top:8px;font-size:.88rem;font-weight:700;color:#1f7a3a}
.pdp-stock.low{color:#a15c00}
.pdp-stock.out{color:#b3261e}
.pdp-opt-label{font-size:.82rem;font-weight:800;margin:14px 0 8px;color:var(--color-text,#242424)}
.pdp-opts{display:flex;flex-wrap:wrap;gap:8px}
.pdp-opt{border:1.5px solid var(--line,#d5d9d9);background:#fff;border-radius:999px;padding:8px 16px;font-weight:700;font-size:.86rem;color:var(--color-text,#242424);cursor:pointer}
.pdp-opt.active{border-color:var(--color-primary,#005d91);background:var(--color-primary,#005d91);color:#fff}
.pdp-opt:disabled{opacity:.45;cursor:not-allowed;text-decoration:line-through}
.pdp-actions{display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}
.pdp-qty{display:inline-flex;align-items:center;border:1px solid var(--line,#d5d9d9);border-radius:999px;overflow:hidden}
.pdp-qty button{width:38px;height:42px;background:#fff;border:none;font-size:1.1rem;cursor:pointer;color:var(--color-text,#242424)}
.pdp-qty input{width:46px;height:42px;border:none;text-align:center;font-weight:700;font-size:.95rem;-moz-appearance:textfield}
.pdp-qty input::-webkit-outer-spin-button,.pdp-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pdp-add{flex:1;min-width:200px}
.pdp-hint{font-size:.82rem;color:var(--muted,#5b6472);margin-top:10px}
.pdp-desc{font-size:.95rem;line-height:1.6;color:var(--color-text,#242424)}
.pdp-desc p{margin:0 0 10px}
.pdp-sections{margin-top:18px;border-top:1px solid var(--line,#d5d9d9)}
.pdp-section{border-bottom:1px solid var(--line,#d5d9d9)}
.pdp-section summary{cursor:pointer;padding:14px 2px;font-weight:800;font-size:.95rem;list-style:none;display:flex;justify-content:space-between;align-items:center}
.pdp-section summary::-webkit-details-marker{display:none}
.pdp-section summary::after{content:"+";font-size:1.2rem;color:var(--muted,#5b6472)}
.pdp-section[open] summary::after{content:"\2212"}
.pdp-section-body{padding:0 2px 16px;font-size:.92rem;line-height:1.6}
.pdp-related{padding-block:10px 64px}
.pdp-related h2{font-size:1.3rem;font-weight:900;margin:0 0 16px;color:var(--color-text,#242424)}
@media (max-width:860px){.pdp{grid-template-columns:1fr;gap:22px}.pdp-name{font-size:1.5rem}}

/* Product cards link to their page */
.card a.card-link{color:inherit;text-decoration:none}
.card a.card-link:hover h3,.card a.card-link:focus-visible h3{text-decoration:underline}

/* Cart page */
.cart-lines{display:flex;flex-direction:column}
.cart-row{display:grid;grid-template-columns:84px minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line,#d5d9d9)}
.cart-row:last-child{border-bottom:none}
.cart-thumb{width:84px;height:84px;border-radius:10px;background:var(--primary-soft,#f2f6f9);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cart-thumb img{max-width:100%;max-height:100%;object-fit:contain}
.cart-name{font-weight:700;color:var(--color-text,#242424);text-decoration:none}
.cart-name:hover{text-decoration:underline}
.cart-unit{font-size:.82rem;color:var(--muted,#5b6472);margin-top:2px}
.cart-controls{display:flex;align-items:center;gap:12px;margin-top:8px}
.cart-total{font-weight:800;text-align:right;white-space:nowrap}
.sum-row{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:.92rem}
.sum-row.total{border-top:1px solid var(--line,#d5d9d9);margin-top:6px;padding-top:12px;font-weight:900;font-size:1.05rem}
.sum-row.discount{color:#1f7a3a}
.sum-item{display:flex;justify-content:space-between;gap:12px;font-size:.86rem;padding:4px 0;color:var(--muted,#5b6472)}

/* Checkout page */
.co-steps{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px;padding:0;list-style:none;font-size:.82rem;font-weight:700;color:var(--muted,#5b6472)}
.co-steps li{padding:6px 12px;border-radius:999px;background:var(--primary-soft,#f2f6f9)}
.co-steps li.on{background:var(--color-primary,#005d91);color:#fff}
.pg-field{margin-bottom:12px}
.pg-field label{display:block;font-size:.78rem;font-weight:700;color:var(--muted,#5b6472);margin-bottom:5px}
.pg-field input,.pg-field select{width:100%;padding:10px 12px;border:1px solid var(--line,#d5d9d9);border-radius:9px;font-size:.92rem;background:#fff;color:var(--color-text,#242424);box-sizing:border-box}
.pg-field input:focus,.pg-field select:focus{outline:2px solid var(--color-accent,#40beee);outline-offset:1px}
.pg-field input[readonly]{background:#f3f4f6;color:var(--muted,#5b6472)}
.pg-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pg-row.two{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:620px){.pg-row,.pg-row.two{grid-template-columns:1fr}}
.ship-choice{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line,#d5d9d9);border-radius:10px;padding:12px 14px;margin-bottom:8px;cursor:pointer}
.ship-choice.sel{border-color:var(--color-primary,#005d91);background:var(--primary-soft,#f2f6f9)}
.ship-choice .sc-main{flex:1}
.ship-choice .sc-lbl{font-weight:700}
.ship-choice .sc-est{font-size:.8rem;color:var(--muted,#5b6472)}
.ship-choice .sc-amt{font-weight:800}
.co-inline{display:flex;gap:8px;align-items:center}
.co-inline input{flex:1;min-width:0}
.co-reserve,.co-info{background:#fff8e6;border:1px solid #f1d58a;border-radius:10px;padding:10px 12px;font-size:.86rem;margin-bottom:14px}
.co-done{text-align:center;padding:26px 10px}
.co-done h2{font-size:1.3rem;margin:0 0 8px}
.co-redeem-row{display:flex;gap:8px;align-items:center;margin-top:8px}
.co-redeem-row input[type=range]{flex:1;min-width:0}
.co-redeem-row input[type=number]{width:96px;padding:8px;border:1px solid var(--line,#d5d9d9);border-radius:8px}

/* Account pages */
.acct-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:22px;align-items:start}
.acct-side{display:flex;flex-direction:column;gap:4px;background:var(--surface,#fff);border:1px solid var(--line,#d5d9d9);border-radius:var(--radius,12px);padding:10px}
.acct-side a,.acct-side button{display:block;text-align:left;padding:11px 14px;border-radius:9px;color:var(--color-text,#242424);text-decoration:none;font-weight:700;font-size:.9rem;background:none;border:none;cursor:pointer;font-family:inherit}
.acct-side a:hover,.acct-side button:hover{background:rgba(0,0,0,.04)}
.acct-side a.active{background:var(--color-primary,#005d91);color:#fff}
@media (max-width:760px){.acct-layout{grid-template-columns:1fr}.acct-side{flex-direction:row;flex-wrap:wrap}}
.acct-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:12px 0}
.acct-tile{background:var(--primary-soft,#f2f6f9);border-radius:12px;padding:16px}
.acct-tile b{display:block;font-size:1.3rem;font-weight:900;color:var(--color-text,#242424)}
@media (max-width:620px){.acct-tiles{grid-template-columns:1fr}}
.addr-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:6px}
.addr-name{font-weight:800}
.addr-lines{font-size:.9rem;line-height:1.5;color:var(--color-text,#242424)}
.addr-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.pg-badge{display:inline-block;font-size:.72rem;font-weight:800;padding:3px 9px;border-radius:999px;background:#ebebeb;color:#616161}
.pg-badge.status-paid,.pg-badge.status-delivered{background:#e3f4e8;color:#1f6b35}
.pg-badge.status-fulfilling,.pg-badge.status-shipped{background:#e3effa;color:#1b4f8a}
.pg-badge.status-refunded{background:#fdecea;color:#9c2a20}
.ord-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.ord-id{font-weight:800}
.ord-meta{font-size:.82rem;color:var(--muted,#5b6472);margin-top:2px}
.ord-line{display:flex;justify-content:space-between;gap:12px;font-size:.9rem;padding:6px 0;border-bottom:1px solid var(--line,#eee)}
.ord-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px}
.ord-total{font-weight:900}
.pg-404{text-align:center;padding-block:80px}
/* The Google Places suggestion list hangs off <body>: keep it over the sticky header and page chrome. */
.pac-container{z-index:1300;font-family:inherit}
