/* Hyde Park Pharmacy — product-page design system (PARITY2, 2026-07-05).
   Pharmica's PDP anatomy 1:1 — two-column (main + sidebar), price-checker box,
   icon trust column under the gallery, "Other popular options" rail, tabbed
   description — re-skinned in our cinematic brand: teal #0f5257 / dark #0A2E36 /
   cream #FAF7F2 / terracotta #c47556 (commerce CTA) / lime #A7CD3A (trust ticks),
   Proxima Nova, radii 20/16/12. Linked by scripts/gen_shop_pdp.py on every PDP.
   POM rule stands: consult CTA (teal) only — POMs never add-to-basket. */

.pdp-wrap{max-width:1180px;margin:22px auto 64px;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:24px;align-items:start;font-family:'Proxima Nova',-apple-system,sans-serif;}
.pdp-main{min-width:0;display:flex;flex-direction:column;gap:22px;}
.pdp-side{display:flex;flex-direction:column;gap:20px;min-width:0;}

/* ── cards ─────────────────────────────────────────────────────────── */
.pdp-card{background:#fff;border:1.5px solid #ece7dd;border-radius:20px;padding:28px;box-shadow:0 12px 44px rgba(10,46,54,.07);}
.pdp-side-card{background:#fff;border:1.5px solid #ece7dd;border-radius:16px;padding:20px;}
.pdp-side-hd{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700;color:#0A2E36;margin:0 0 10px;}
.pdp-side-hd svg{flex-shrink:0;}

/* ── hero: gallery + details ───────────────────────────────────────── */
.pdp-hero{display:grid;grid-template-columns:292px minmax(0,1fr);gap:32px;}
.pdp-gallery{min-width:0;}
/* product-image card = fully WHITE, larger image (Director 2026-07-05) */
.pdp-img{background:#fff;border:1.5px solid #ece7dd;border-radius:16px;height:312px;display:flex;align-items:center;justify-content:center;padding:10px;position:relative;overflow:hidden;}
.pdp-img img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
.pdp-img .pill-class{position:absolute;top:10px;right:10px;font-size:10.5px;font-weight:800;letter-spacing:.05em;padding:3px 10px;border-radius:100px;}
.pdp-img .pill-gsl{background:#eaf3d2;color:#4d6b12;}
.pdp-img .pill-p{background:#fdeecf;color:#8a5a12;}
.pdp-img-caption{font-size:11px;color:#9ca3af;margin:8px 2px 0;line-height:1.45;text-align:center;}
.pdp-thumbs{display:flex;gap:8px;margin-top:10px;justify-content:center;}
.pdp-thumb{width:52px;height:52px;border:1.5px solid #ece7dd;border-radius:10px;background:#FAF7F2;padding:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pdp-thumb img{max-width:100%;max-height:100%;object-fit:contain;}
.pdp-thumb.active{border-color:#0f5257;}

/* icon trust column (Pharmica's left rail) */
.pdp-trustlist{margin-top:18px;padding-top:16px;border-top:1px solid #f0ede6;display:flex;flex-direction:column;gap:11px;}
.pdp-trustlist span{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:#0A2E36;line-height:1.35;}
.pdp-trustlist svg{flex-shrink:0;}
.pdp-ship{margin-top:14px;padding-top:14px;border-top:1px solid #f0ede6;display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:#0A2E36;}

/* details column */
.pdp-details{min-width:0;}
.pdp-kicker{font-size:13px;color:#6b7280;margin:0 0 7px;}
h1.pdp-title{font-family:'Proxima Nova',sans-serif;font-size:28px;font-weight:800;color:#0A2E36;margin:0 0 4px;line-height:1.2;}
.pdp-sub{font-size:15.5px;font-weight:600;color:#0f5257;margin:0 0 12px;}
.pdp-stars{display:none;align-items:center;gap:8px;margin:0 0 12px;font-size:13.5px;color:#374151;}
.pdp-desc{font-size:15px;color:#374151;line-height:1.6;margin:0 0 14px;}
.pdp-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px;}
.pdp-tag{background:#FAF7F2;border:1px solid #ece7dd;color:#374151;font-size:12px;padding:4px 11px;border-radius:100px;font-weight:600;}
.pdp-strength{font-size:14px;color:#0A2E36;margin:0 0 12px;}
.pdp-strength b{font-weight:800;}
.pdp-strength-pills{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 4px;}
.pdp-strength-pill{border:1.5px solid #ece7dd;background:#fff;border-radius:12px;padding:9px 18px;font-size:14px;font-weight:700;color:#0A2E36;cursor:pointer;font-family:inherit;transition:border-color .15s,background .15s;}
.pdp-strength-pill:hover{border-color:#0f5257;}
.pdp-strength-pill.active{background:#0f5257;border-color:#0f5257;color:#FAF7F2;}

/* ── the price-checker box ─────────────────────────────────────────── */
/* price-checker (information) card = cream; its dropdown flips to white (Director 2026-07-05) */
.pdp-pricebox{position:relative;border:1.5px solid #e6ddd0;border-radius:14px;padding:22px 18px 18px;margin:16px 0 14px;max-width:420px;background:#FAF7F2;}
.pdp-pricebox-tab{position:absolute;top:-13px;left:14px;background:#0f5257;color:#FAF7F2;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:100px;padding:5px 13px;}
.pdp-qty label{display:block;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#6b7280;margin:0 0 6px;}
.pdp-qty select{width:100%;padding:12px;border:1.5px solid #ded6c8;border-radius:10px;font-size:14.5px;font-weight:600;color:#0A2E36;background:#fff;font-family:inherit;cursor:pointer;}
.pdp-price{font-size:31px;font-weight:800;color:#0A2E36;margin:13px 0 4px;line-height:1;}
.pdp-price small{font-size:13px;font-weight:600;color:#6b7280;margin-left:6px;}
.pdp-price-ticks{display:flex;flex-direction:column;gap:7px;margin-top:10px;}
.pdp-price-ticks span{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:#0A2E36;}

/* CTA — terracotta = commerce (OTC basket), teal = consultation (POM) */
.pdp-cta{display:block;width:100%;max-width:420px;background:linear-gradient(135deg,#c47556,#b05f3f);color:#fff;border:none;border-radius:100px;padding:16px 26px;font-size:16px;font-weight:800;cursor:pointer;font-family:inherit;text-align:center;text-decoration:none;box-sizing:border-box;box-shadow:0 10px 26px rgba(196,117,86,.32);transition:transform .15s,box-shadow .15s,filter .15s;}
.pdp-cta:hover{transform:translateY(-1px);box-shadow:0 14px 32px rgba(196,117,86,.4);filter:brightness(1.04);}
.pdp-cta--consult{background:linear-gradient(135deg,#0f5257,#0A2E36);box-shadow:0 10px 26px rgba(15,82,87,.32);}
.pdp-cta--consult:hover{box-shadow:0 14px 32px rgba(15,82,87,.4);}
.pdp-cta-note{font-size:12px;color:#9ca3af;margin:9px 0 0;line-height:1.5;max-width:420px;}
.pdp-arrive{font-size:13.5px;color:#374151;margin:13px 0 0;line-height:1.55;}
.pdp-arrive b{color:#0A2E36;}
.pdp-arrive .pdp-countdown{color:#c47556;font-weight:800;}

/* ── sidebar: popular options rail ─────────────────────────────────── */
.pdp-pop a{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid #f0ede6;text-decoration:none;}
.pdp-pop a:last-child{border-bottom:none;padding-bottom:2px;}
.pdp-pop-tile{width:50px;height:50px;flex-shrink:0;background:#fff;border:1.5px solid #ece7dd;border-radius:10px;display:flex;align-items:center;justify-content:center;padding:5px;}
.pdp-pop-tile img{max-width:100%;max-height:100%;object-fit:contain;}
.pdp-pop-name{font-size:13.5px;font-weight:700;color:#0A2E36;line-height:1.3;display:block;}
.pdp-pop-name:hover{color:#0f5257;}
.pdp-pop-price{font-size:12.5px;font-weight:700;color:#0f5257;display:block;margin-top:2px;}

/* sidebar: cinematic visit-us / trust card */
.pdp-visit{background:linear-gradient(160deg,#0A2E36 0%,#0f5257 100%);border:none;border-radius:16px;padding:22px 20px;color:#FAF7F2;position:relative;overflow:hidden;}
.pdp-visit::after{content:'';position:absolute;right:-46px;top:-46px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(167,205,58,.18),transparent 70%);pointer-events:none;}
.pdp-visit h3{font-size:16.5px;font-weight:800;margin:0 0 10px;color:#FAF7F2;}
.pdp-visit ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.pdp-visit li{display:flex;align-items:flex-start;gap:9px;font-size:13px;line-height:1.45;color:rgba(250,247,242,.92);}
.pdp-visit li svg{flex-shrink:0;margin-top:2px;}
.pdp-visit .pdp-visit-reg{font-size:11px;color:rgba(250,247,242,.55);margin:14px 0 0;}

/* ── tabs (Description | More information) ─────────────────────────── */
.pdp-tabs{display:flex;gap:2px;border-bottom:2px solid #ece7dd;margin:0;}
.pdp-tab{padding:12px 18px;font-size:15px;font-weight:700;color:#5b6470;background:none;border:none;cursor:pointer;font-family:inherit;position:relative;}
.pdp-tab:hover{color:#0A2E36;}
.pdp-tab.active{color:#0A2E36;}
.pdp-tab.active::after{content:'';position:absolute;left:8px;right:8px;bottom:-2px;height:3px;border-radius:3px;background:#c47556;}
.pdp-panel{display:none;padding:20px 2px 4px;}
.pdp-panel.active{display:block;}
.pdp-panel h2,.pdp-panel h3{font-size:17px;font-weight:700;color:#0A2E36;margin:18px 0 10px;}
.pdp-panel h2:first-child,.pdp-panel h3:first-child{margin-top:2px;}
.pdp-panel p{font-size:14.5px;color:#374151;line-height:1.65;}
.pdp-about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-top:6px;}
.pdp-about-cell{background:#FAF7F2;border:1px solid #f0ede6;border-radius:10px;padding:12px 14px;}
.pdp-about-cell strong{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:#9ca3af;margin-bottom:4px;font-weight:700;}
.pdp-about-cell span{font-size:14px;color:#1f2937;font-weight:600;}

/* ── responsive ────────────────────────────────────────────────────── */
@media(max-width:1080px){
  .pdp-wrap{grid-template-columns:1fr;}
  .pdp-side{flex-direction:row;flex-wrap:wrap;}
  .pdp-side>*{flex:1 1 300px;}
}
@media(max-width:700px){
  .pdp-wrap{padding:0 16px;margin-top:14px;gap:16px;}
  .pdp-card{padding:20px 16px;border-radius:16px;}
  .pdp-hero{grid-template-columns:1fr;gap:18px;}
  .pdp-img{height:218px;max-width:320px;margin:0 auto;}
  .pdp-gallery{text-align:center;}
  .pdp-trustlist{align-items:flex-start;text-align:left;max-width:340px;margin:14px auto 0;}
  .pdp-ship{max-width:340px;margin:12px auto 0;}
  h1.pdp-title{font-size:23px;}
  .pdp-pricebox,.pdp-cta,.pdp-cta-note{max-width:none;}
  .pdp-about-grid{grid-template-columns:repeat(2,1fr);}
  .pdp-side{flex-direction:column;}
  .pdp-tabs{overflow-x:auto;}
}

/* PARITY3: patient information leaflet block (emc link, medicines only) */
.pdp-pil{margin-top:22px;padding-top:18px;border-top:1px solid #f0ede6;}
.pdp-pil h2{font-size:16px;color:#0A2E36;margin:0 0 8px;}
.pdp-pil p{font-size:13.5px;color:#6b7280;margin:0 0 8px;}
.pdp-pil ul{margin:0;padding-left:18px;}
.pdp-pil li{margin:0 0 4px;}
.pdp-pil a{color:#0f5257;font-weight:600;text-decoration:none;}
.pdp-pil a:hover{text-decoration:underline;}

/* PARITY3: structured product description (What is / How / Benefits / Cautions) */
.pdp-desc-sections{margin-top:6px;}
.pdp-desc-sections h3{font-size:15.5px;font-weight:800;color:#0A2E36;margin:20px 0 7px;}
.pdp-desc-sections p{font-size:14.5px;line-height:1.65;color:#374151;margin:0 0 8px;}
.pdp-benefits{margin:4px 0 8px;padding-left:20px;}
.pdp-benefits li{font-size:14.5px;line-height:1.6;color:#374151;margin:0 0 4px;}
