/* Intentionally minimal. Product detail styles live in enhance-search.css */
/* This file exists to satisfy enqueue and avoid 404 requests. */
.csm-detail-grid{ display:grid; grid-template-columns: 1fr; gap:20px; }
@media (min-width: 980px){ .csm-detail-grid{ grid-template-columns: 420px 1fr; } }
.csm-detail-media{ background:#fff; border:1px solid #e6e8eb; border-radius:10px; padding:16px; display:flex; flex-direction:column; gap:10px; }
.csm-media-main{ width:100%; aspect-ratio: 1 / 1; background:#f9fafb; border:1px dashed #e5e7eb; border-radius:10px; display:flex; align-items:center; justify-content:center; }
.csm-media-ph{ width:120px; height:120px; background:#eef2ff; border-radius:16px; }
.csm-media-thumbs{ display:flex; gap:12px; }
.csm-thumb{ width:60px; height:60px; border:1px solid #e5e7eb; border-radius:8px; background:#f9fafb; }

.csm-detail-info{ background:#fff; border:1px solid #e6e8eb; border-radius:10px; padding:16px; }
.csm-detail-title{ font-size:26px; font-weight:800; margin-bottom:6px; }
.csm-detail-price{ margin:8px 0 10px; }
.csm-price{ font-size:24px; font-weight:900; color:#16a34a; }
.csm-detail-badge{ margin-bottom:8px; }
.csm-section{ margin-top:14px; }
.csm-label{ font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:#6b7280; margin-bottom:8px; }
.csm-chip-group{ display:flex; flex-wrap:wrap; gap:8px; }
.csm-chip{ border:1px solid #e6e8eb; background:#f9fafb; padding:6px 10px; border-radius:999px; font-weight:700; cursor:pointer; }
.csm-chip.active{ background:#0ea5e9; color:#fff; border-color:#0ea5e9; }
.csm-info-pill{ background:#eef2ff; border-color:#c7d2fe; color:#111827; }

.csm-pkg-list{ display:flex; flex-direction:column; gap:10px; }
.csm-pkg-card{ display:flex; align-items:center; justify-content:space-between; border:1px solid #22c55e55; border-radius:10px; padding:12px; background:#f8fff9; cursor:pointer; }
.csm-pkg-card.selected{ background:#eafff1; border-color:#22c55e; box-shadow:0 0 0 2px #22c55e22 inset; }
.csm-pkg-main{ display:flex; flex-direction:column; gap:4px; }
.csm-pkg-qty{ font-weight:800; }
.csm-pkg-strength{ font-size:12px; color:#374151; }
.csm-pkg-country{ display:flex; gap:8px; align-items:center; font-size:12px; color:#374151; }
.csm-pkg-side{ display:flex; align-items:center; gap:12px; }
.csm-pkg-price{ font-weight:900; color:#16a34a; }

.csm-highlight{ animation: csmFlash 2s ease; box-shadow: 0 0 0 3px rgba(14,165,233,0.35) inset; }
@keyframes csmFlash{ 0%{ box-shadow: 0 0 0 0 rgba(14,165,233,0.0) inset; } 20%{ box-shadow: 0 0 0 3px rgba(14,165,233,0.45) inset; } 100%{ box-shadow: 0 0 0 0 rgba(14,165,233,0.0) inset; } }

/* Nav CSS Edits */

.csm-media-main img.csm-main-img{
    max-width: 80%;
    max-height: 80%;
}
.csm-media-thumbs img{
    max-width: 100%;
    max-height: 80%;
    object-fit: cover;
}
.csm-media-thumbs .csm-thumb{
    align-self: center;
    justify-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 60px;
    width: 60px;
}
.csm-strength-chips .csm-chip{
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 700;
    cursor: pointer;
    font-size: 12px;
    color: #000000;
    background-color: #ffffff;
}
.csm-strength-chips .csm-chip.active{
    background-color: #008815;
    color: #ffffff;
    border-color: #008815;
}
.csm-country-chips .csm-chip{
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    padding: 6px 10px;
    border-radius: 999px;
    font-weight: 700;
    cursor: pointer;
    font-size: 12px;
    color: #000000;
    background-color: #ffffff;
}
.csm-country-chips .csm-chip.active{
    background-color: #008815;
    color: #ffffff;
    border-color: #008815;
}
.csm-pkg-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #008815;
    border-radius: 10px;
    padding: 12px;
    background: #0088150a;
    cursor: pointer;
}
.csm-pkg-card .csm-pkg-title{
    color: #333333;
}
.csm-pkg-strength{
    color: #333333;
    font-size: 16px;
    /* padding-left: 10px; */
}
.csm-pkg-main{
    display: flex;
    flex-direction: row;
    gap: 5px;
}
.csm-label{
    color:#333333;
}
.csm-specs{
    color:#333333;
    margin-top: 10px;
}
/* .csm-detail-title{
    display: inline-block;
}
.csm-detail-badge{
    display: inline-block;
} */
 .csm-detail-title-wrap{
    display: flex;
    align-items: center;
    justify-content: space-between;
 }
 .csm-pkg-card.selected{
    background: #008815;
    border-color: #008815;
    box-shadow: 0 0 0 2px #008815 inset;
 }
 .csm-pkg-card.selected .csm-pkg-title{
    color: #ffffff;
 }
 .csm-pkg-card.selected .csm-pkg-strength{
    color: #ffffff;
 }
 .csm-pkg-card.selected .csm-pkg-country{
    color: #ffffff;
 }
 .csm-pkg-card.selected .csm-pkg-price{
    color: #ffffff;
 }
 .csm-pkg-card.selected .csm-pkg-qty{
    color: #ffffff;
 }
 .csm-pkg-card.selected .csm-pkg-attrs{
    color: #ffffff;
 }

/* ── Manufacturer Information + Drug Information cards ───────────────── */
.csm-product-info{
    display:flex;
    flex-direction:column;
    gap:16px;
    margin-top:24px;
}
.csm-info-card{
    background:#ffffff;
    border:1px solid #e6e8eb;
    border-radius:14px;
    padding:22px 18px;
    box-shadow:0 1px 2px rgba(16,24,40,.04);
}
@media (min-width:780px){
    .csm-info-card{ padding:30px; }
}
.csm-info-title{
    margin:0 0 18px;
    text-align:center;
    font-size:13px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:#111827;
}
.csm-info-title::after{
    content:"";
    display:block;
    width:38px;
    height:3px;
    border-radius:3px;
    background:#008815;
    margin:10px auto 0;
}

/* Manufacturer: centered columns */
.csm-manufacturer-grid{
    margin:0;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:18px 52px;
}
.csm-manufacturer-grid .csm-info-item{
    align-items:center;
    text-align:center;
    min-width:150px;
}

/* Drug info: responsive 1/2/3 column grid */
.csm-druginfo-grid{
    margin:0;
    display:grid;
    grid-template-columns:1fr;
    gap:16px 28px;
}
@media (min-width:560px){
    .csm-druginfo-grid{ grid-template-columns:1fr 1fr; }
}
@media (min-width:900px){
    .csm-druginfo-grid{ grid-template-columns:1fr 1fr 1fr; }
}

.csm-info-item{
    display:flex;
    flex-direction:column;
    gap:5px;
}
.csm-info-item dt{
    font-size:11px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:#6b7280;
}
.csm-info-item dd{
    margin:0;
    font-size:15px;
    line-height:1.5;
    color:#1f2937;
    font-weight:600;
}
.csm-druginfo-grid .csm-info-item{
    border-bottom:1px solid #f1f2f4;
    padding-bottom:14px;
}
@media (min-width:560px){
    .csm-druginfo-grid .csm-info-item{ border-bottom:0; padding-bottom:0; }
}
.csm-info-country{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}
.csm-info-card .csm-flag{
    width:22px;
    height:22px;
    flex:0 0 auto;
}

/* Pills */
.csm-rx-pill{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:3px 11px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    width:fit-content;
}
.csm-rx-pill.required{ background:#fef3c7; color:#92400e; }
.csm-rx-pill.required::before{ content:"!"; font-weight:900; }
.csm-rx-pill.not-required{ background:#dcfce7; color:#166534; }
.csm-rx-pill.not-required::before{ content:"\2713"; font-weight:900; }
.csm-type-pill{
    display:inline-flex;
    align-items:center;
    padding:3px 11px;
    border-radius:999px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.05em;
    text-transform:uppercase;
    background:#eef2f7;
    color:#475467;
    width:fit-content;
}

/* ── Typography polish ──────────────────────────────────────────────────
   The detail UI was inheriting an *unloaded* "Roboto" from the theme, which
   fell back to a plain system sans and clashed with the Inter used across
   the rest of the site. Unify everything on Inter and dial the heavy 800/900
   weights back to 600–700 so the page reads warm and comfortable, not shouty. */
.csm-detail-container,
.csm-detail-grid,
.csm-product-info,
.csm-breadcrumb{
    font-family:"Inter","Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,"Helvetica Neue",Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

/* Product title — large and friendly rather than ultra-bold.
   The info-card <h3> headings need font-family set explicitly: the theme
   applies a slab-serif heading font (Roboto Slab) to h1–h6 via a tag-level
   rule that beats the container's inherited family, so force Inter here. */
.csm-detail-title,
.csm-product-info .csm-info-title{
    font-family:"Inter","Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,"Helvetica Neue",Arial,sans-serif;
}
.csm-detail-title{
    font-weight:700;
    font-size:27px;
    line-height:1.25;
    letter-spacing:-.01em;
    color:#1f2937;
}

/* Price — strong but not heaviest weight */
.csm-price{ font-weight:800; letter-spacing:-.01em; }

/* Section labels ("Strength Options", "Shipping From"…) — calmer */
.csm-label{ font-weight:700; letter-spacing:.04em; }

/* Chips, packages, breadcrumb — ease the weights back */
.csm-strength-chips .csm-chip,
.csm-country-chips .csm-chip,
.csm-chip{ font-weight:600; }
.csm-pkg-card .csm-pkg-title{ font-weight:700; }
.csm-pkg-qty{ font-weight:700; }
.csm-pkg-price{ font-weight:700; }
.csm-pkg-strength{ font-weight:500; }
.csm-breadcrumb a{ font-weight:600; }

/* Info cards — softer headings/labels, roomier value line-height */
.csm-info-title{ font-weight:700; letter-spacing:.05em; }
.csm-info-item dt{ font-weight:700; letter-spacing:.04em; }
.csm-info-item dd{ font-weight:600; line-height:1.55; }