/* =========================================================
   Chronovex Product Detail Styles (Phase 9V-PROD-273-FULL)
   Scope: classes used in ec_products_translations.content / description
   Brand: #0a4d7a (primary), #15803d (success), #b91c1c (danger), #92400e (warn)
   ========================================================= */
.cvx-pd{font-size:15px; line-height:1.65; color:#1f2937;}
.cvx-pd h2{font-size:22px; font-weight:700; color:#0a4d7a; margin:28px 0 12px; padding-bottom:8px; border-bottom:2px solid #e5e7eb;}
.cvx-pd h2.cvx-h2-promo{margin-top:36px; color:#0a4d7a;}
.cvx-pd h3{font-size:17px; font-weight:600; color:#111827; margin:20px 0 8px;}
.cvx-pd p{margin:0 0 12px;}
.cvx-pd ul, .cvx-pd ol{margin:0 0 14px; padding-left:22px;}
.cvx-pd li{margin-bottom:6px;}
.cvx-pd strong{color:#111827; font-weight:600;}
.cvx-pd a{color:#0a4d7a; text-decoration:underline;}
.cvx-pd a:hover{color:#072e49;}

/* ---- Lead paragraph (description blurb) ---- */
.cvx-lead{font-size:16px; line-height:1.7; color:#1f2937; margin:0 0 14px;}
.cvx-lead strong{color:#0a4d7a;}

/* ---- Key feature bullets (description) ---- */
.cvx-keys{list-style:none !important; padding-left:0 !important; margin:0 0 16px;}
.cvx-keys li{position:relative; padding-left:24px; margin-bottom:8px;}
.cvx-keys li::before{content:"\2713"; position:absolute; left:0; top:0; color:#15803d; font-weight:700;}

/* ---- Spec strip (small grid of key specs) ---- */
.cvx-spec-strip{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:8px; margin:14px 0; padding:12px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:6px;}
.cvx-spec-strip > div{font-size:13px; color:#374151;}
.cvx-spec-strip strong{display:block; font-size:11px; color:#6b7280; text-transform:uppercase; letter-spacing:0.5px; font-weight:600; margin-bottom:2px;}

/* ---- Generic tables (spec / usecase / compare / bulk) ---- */
.cvx-table-wrap{overflow-x:auto; margin:14px 0; border:1px solid #e5e7eb; border-radius:6px; -webkit-overflow-scrolling:touch;}
.cvx-spec-table, .cvx-usecase-table, .cvx-compare-table, .cvx-table{width:100%; border-collapse:collapse; font-size:14px;}
.cvx-spec-table th, .cvx-usecase-table th, .cvx-compare-table th, .cvx-table th{background:#0a4d7a; color:#fff; padding:10px 12px; text-align:left; font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:0.3px; white-space:nowrap;}
.cvx-spec-table td, .cvx-usecase-table td, .cvx-compare-table td, .cvx-table td{padding:9px 12px; border-bottom:1px solid #e5e7eb; vertical-align:top;}
.cvx-spec-table tbody tr:nth-child(even), .cvx-usecase-table tbody tr:nth-child(even), .cvx-compare-table tbody tr:nth-child(even){background:#f9fafb;}
.cvx-spec-table tbody tr:last-child td, .cvx-usecase-table tbody tr:last-child td, .cvx-compare-table tbody tr:last-child td{border-bottom:0;}

/* ---- FAQ accordion (purifier-safe div markup) ---- */
.cvx-faq{margin:8px 0; border:1px solid #e5e7eb; border-radius:6px; overflow:hidden; background:#fff;}
.cvx-faq__q{margin:0 !important; padding:14px 44px 14px 16px; font-size:15px !important; font-weight:600; color:#111827; cursor:pointer; position:relative; user-select:none; background:#fff; border-bottom:1px solid transparent; transition:background 0.15s;}
.cvx-faq__q:hover{background:#f9fafb;}
.cvx-faq__q::after{content:"+"; position:absolute; right:16px; top:50%; transform:translateY(-50%); font-size:22px; font-weight:400; color:#6b7280; line-height:1;}
.cvx-faq.is-open .cvx-faq__q{border-bottom-color:#e5e7eb; background:#f9fafb;}
.cvx-faq.is-open .cvx-faq__q::after{content:"\2212";}
.cvx-faq__a{max-height:0; overflow:hidden; transition:max-height 0.25s ease; padding:0 16px;}
.cvx-faq.is-open .cvx-faq__a{max-height:600px; padding:14px 16px;}
.cvx-faq__a p{margin:0; color:#374151; font-size:14px; line-height:1.6;}
.cvx-faq__a p + p{margin-top:8px;}

/* ---- Notes / disclaimers ---- */
.cvx-note{font-size:13px; color:#6b7280; font-style:italic; margin:10px 0 18px; padding:8px 12px; background:#fefce8; border-left:3px solid #ca8a04; border-radius:0 4px 4px 0;}

/* ---- Bulk pricing / dealer section ---- */
.cvx-bulk{margin:24px 0; padding:18px; background:linear-gradient(135deg,#0a4d7a 0%,#0c5a8f 100%); color:#fff; border-radius:8px;}
.cvx-bulk-title{font-size:18px; font-weight:700; color:#fff; margin-bottom:6px;}
.cvx-bulk-sub{font-size:13px; color:#cbd5e1; margin-bottom:14px;}
.cvx-bulk .cvx-table-wrap{background:#fff; border:0; margin-top:0;}
.cvx-bulk .cvx-table th{background:#072e49;}
.cvx-bulk .cvx-table td{color:#1f2937;}
.cvx-bulk .cvx-table a{color:#0a4d7a;}

/* ---- Tier badges (Retail / Bulk / Dealer / Distributor / OEM) ---- */
.cvx-tier-badge{display:inline-block; padding:2px 8px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; border-radius:3px; color:#fff;}
.cvx-tier-badge.t-retail{background:#6b7280;}
.cvx-tier-badge.t-bulk{background:#0a4d7a;}
.cvx-tier-badge.t-dealer{background:#15803d;}
.cvx-tier-badge.t-dist{background:#92400e;}
.cvx-tier-badge.t-oem{background:#b91c1c;}
.cvx-disc{display:inline-block; font-weight:700; font-size:13px;}

/* ---- CTA buttons inside content ---- */
.cvx-action{display:inline-block; padding:5px 11px; font-size:12px; font-weight:600; text-decoration:none !important; border-radius:4px; transition:opacity 0.15s; white-space:nowrap;}
.cvx-action:hover{opacity:0.85;}
.cvx-action.btn-buy{background:#0a4d7a; color:#fff !important;}
.cvx-action.btn-wa{background:#15803d; color:#fff !important;}
.cvx-action.btn-mail{background:#92400e; color:#fff !important;}
.cvx-action.btn-call{background:#b91c1c; color:#fff !important;}

/* ---- Boxes (generic info boxes) ---- */
.cvx-box{padding:14px 16px; background:#f3f4f6; border:1px solid #e5e7eb; border-radius:6px; margin:14px 0;}

/* ---- Features grid ---- */
.cvx-features{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin:14px 0;}
.cvx-features > div{padding:12px 14px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:6px;}
.cvx-features strong{display:block; color:#0a4d7a; margin-bottom:4px;}

/* ---- Install steps (numbered list with bigger numbers) ---- */
.cvx-install{counter-reset:cvx-step; list-style:none !important; padding-left:0 !important; margin:14px 0;}
.cvx-install li{counter-increment:cvx-step; position:relative; padding:8px 8px 8px 44px; margin-bottom:8px; background:#f9fafb; border-left:3px solid #0a4d7a; border-radius:0 4px 4px 0;}
.cvx-install li::before{content:counter(cvx-step); position:absolute; left:8px; top:50%; transform:translateY(-50%); width:28px; height:28px; line-height:28px; text-align:center; background:#0a4d7a; color:#fff; border-radius:50%; font-weight:700; font-size:13px;}

/* ---- Related categories internal links list ---- */
.cvx-related{display:flex; flex-wrap:wrap; gap:8px; list-style:none !important; padding-left:0 !important; margin:14px 0;}
.cvx-related li{margin:0;}
.cvx-related a{display:inline-block; padding:6px 12px; background:#eff6ff; color:#0a4d7a !important; border:1px solid #bfdbfe; border-radius:4px; font-size:13px; text-decoration:none !important; transition:background 0.15s;}
.cvx-related a:hover{background:#dbeafe;}

/* ---- Trust strip at end ---- */
.cvx-trust{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:10px; margin:18px 0; padding:14px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:6px;}
.cvx-trust-line{display:flex; align-items:flex-start; gap:8px; font-size:13px; color:#374151;}
.cvx-trust-line strong{color:#0a4d7a;}

/* ---- Mobile adjustments ---- */
@media (max-width:767.98px){
  .cvx-pd{font-size:14px;}
  .cvx-pd h2{font-size:19px; margin-top:24px;}
  .cvx-pd h3{font-size:16px;}
  .cvx-spec-strip{grid-template-columns:repeat(2,1fr); gap:6px; padding:10px;}
  .cvx-bulk{padding:14px;}
  .cvx-bulk-title{font-size:16px;}
  .cvx-features{grid-template-columns:1fr;}
  .cvx-trust{grid-template-columns:1fr; padding:12px;}
  .cvx-action{font-size:11px; padding:4px 8px;}
}


/* ---- Slim description (cvx-keys--compact + cvx-jump) ---- */
.cvx-lead{font-size:15px; line-height:1.55; margin:0 0 12px 0;}
.cvx-lead strong{color:#0d6efd;}
.cvx-keys{list-style:none; padding:0; margin:0 0 14px 0;}
.cvx-keys li{position:relative; padding:6px 0 6px 26px; font-size:14px; line-height:1.5; border-bottom:1px solid #f1f3f5;}
.cvx-keys li:last-child{border-bottom:none;}
.cvx-keys li::before{content:"\2714"; position:absolute; left:0; top:6px; width:18px; height:18px; line-height:18px; text-align:center; color:#0a4d7a; background:#e7f1fb; border-radius:50%; font-size:11px; font-weight:700;}
.cvx-keys--compact li{padding:4px 0 4px 24px; font-size:13.5px; border-bottom:none;}
.cvx-keys--compact li::before{top:4px; width:16px; height:16px; line-height:16px; font-size:10px;}
.cvx-jump{margin:10px 0 0 0; padding:8px 12px; background:#eff6ff; border-left:3px solid #0d6efd; border-radius:4px; font-size:13.5px;}
.cvx-jump a{color:#0d6efd !important; font-weight:600; text-decoration:none;}
.cvx-jump a:hover{text-decoration:underline;}
@media (max-width:767.98px){
  .cvx-lead{font-size:14.5px;}
  .cvx-keys--compact li{font-size:13px; padding:5px 0 5px 22px;}
  .cvx-jump{font-size:13px; padding:8px 10px;}
}

/* ===== Phase 9V-PROD-273-MORE: collapsible resources toggle ===== */
.cvx-more-toggle{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  width:100%; margin:18px 0 0 0; padding:12px 16px;
  background:#eff6ff; color:#0d6efd;
  border:1px solid #bfdbfe; border-radius:6px;
  font-size:14px; font-weight:600; line-height:1.4; cursor:pointer;
  text-align:left; transition:background-color .15s ease, border-color .15s ease;
  -webkit-tap-highlight-color:transparent;
}
.cvx-more-toggle:hover{ background:#dbeafe; border-color:#93c5fd; }
.cvx-more-toggle:focus-visible{ outline:2px solid #0d6efd; outline-offset:2px; }
.cvx-more-toggle__label{ flex:1; }
.cvx-more-toggle__icon{ display:inline-block; transition:transform .2s ease; font-size:12px; }
.cvx-more-toggle.is-open{ background:#dbeafe; border-color:#93c5fd; }
.cvx-more-toggle.is-open .cvx-more-toggle__icon{ transform:rotate(180deg); }
.cvx-more-wrap{ display:none; margin-top:0; }
.cvx-more-wrap.is-open{ display:block; margin-top:14px; animation: cvx-more-fade .25s ease; }
@keyframes cvx-more-fade{ from{opacity:0; transform:translateY(-4px);} to{opacity:1; transform:translateY(0);} }
@media (max-width:767.98px){
  .cvx-more-toggle{ font-size:13.5px; padding:11px 14px; }
  .cvx-more-toggle__icon{ font-size:11px; }
}
