/* Scoped additions for the local draft "When Is the Filter Cart Finished?".
   Loaded after the live LubeServ stylesheets. Only new components and the
   minimum-size fixes from figures.md live here; everything else is the live template. */

/* Byline area: organisation name plus an honest draft status. */
.filter-cart-article .journal-article-meta .ls-draft-status { color: #5b4a2a; font-weight: 650; }
.filter-cart-article .journal-article-meta .ls-draft-status time { font-weight: inherit; }
.filter-cart-article .journal-toc > p { font-size: 12px !important; }

/* f1 hero plate: genuine TTI cart crop (422 x 764), shown at 160 px wide on desktop. */
.filter-cart-article .ls-cart-plate {
  padding: 28px 24px 24px;
  border: 1px solid #d8e1dd;
  border-top: 3px solid #17805f;
  border-radius: 6px;
  background: linear-gradient(155deg, #f9fbf9 0%, #edf4ef 100%);
  box-shadow: 0 8px 22px rgba(24, 49, 38, 0.04);
}
.filter-cart-article .ls-cart-plate img { width: 160px; max-width: 100%; height: auto; }
.filter-cart-article .ls-cart-plate figcaption { font-size: 14px; line-height: 1.6; color: #3f5249; }
.filter-cart-article .ls-cart-plate figcaption span { font-size: 17px; font-weight: 700; color: #153e32; }
.filter-cart-article .ls-cart-plate figcaption span.ls-nowrap { display: inline; margin: 0; color: inherit; font: inherit; white-space: nowrap; }
@media (max-width: 850px) {
  .filter-cart-article .ls-cart-plate { grid-template-columns: 110px minmax(0, 1fr); gap: 18px; align-items: center; padding: 22px 18px; }
  .filter-cart-article .ls-cart-plate img { width: 110px; }
  .filter-cart-article .ls-cart-plate figcaption { font-size: 14px; }
}
@media (max-width: 380px) {
  .filter-cart-article .ls-cart-plate { grid-template-columns: 96px minmax(0, 1fr); gap: 16px; }
  .filter-cart-article .ls-cart-plate img { width: 96px; }
}

/* f2 chart: static inline SVG, desktop and phone drawings chosen by the figure's own width. */
.filter-cart-article .ls-chart-figure {
  margin: 32px 0 34px;
  padding: 18px 0 0;
  border: 1px solid #d8e1dd;
  border-radius: 6px;
  background: #ffffff;
}
.filter-cart-article .ls-chart-frame { container-type: inline-size; }
.filter-cart-article .ls-chart-frame svg { display: block; width: 100%; height: auto; }
.filter-cart-article .ls-chart-frame svg.ls-chart-desktop { max-width: 680px; margin: 0 auto; }
.filter-cart-article .ls-chart-frame svg.ls-chart-phone { display: none; max-width: 420px; margin: 0 auto; }
@container (max-width: 639.98px) {
  .filter-cart-article .ls-chart-frame svg.ls-chart-desktop { display: none; }
  .filter-cart-article .ls-chart-frame svg.ls-chart-phone { display: block; }
}
.filter-cart-article .ls-chart-figure figcaption {
  margin: 0;
  padding: 18px 20px 16px;
  background: #f8faf8;
  border-top: 1px solid #e3e9e6;
  color: #3f5154;
  font-size: 15px;
  line-height: 1.6;
}
.filter-cart-article .ls-chart-figure figcaption > span:first-child {
  display: block;
  margin-bottom: 4px;
  color: #172426;
  font-size: 17px;
  font-weight: 700;
}
.filter-cart-article .ls-chart-numbers { border-top: 1px solid #e3e9e6; }
.filter-cart-article .ls-chart-numbers summary {
  min-height: 44px;
  padding: 11px 18px;
  color: #125e52;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.filter-cart-article .ls-chart-numbers-body { padding: 0 18px 16px; overflow-x: auto; }
.filter-cart-article .ls-chart-numbers table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
.filter-cart-article .ls-chart-numbers th,
.filter-cart-article .ls-chart-numbers td { padding: 8px 10px 8px 0; border-bottom: 1px solid #e3e9e6; text-align: left; vertical-align: top; color: #344245; }
.filter-cart-article .ls-chart-numbers thead th { color: #172426; font-weight: 700; }
.filter-cart-article .ls-chart-numbers tbody th { color: #172426; font-weight: 650; }
@media (max-width: 600px) {
  .filter-cart-article .ls-chart-figure { margin: 26px 0 30px; padding-top: 14px; }
  .filter-cart-article .ls-chart-figure figcaption { padding: 14px 14px 12px; }
  .filter-cart-article .ls-chart-numbers summary { padding: 11px 14px; }
  .filter-cart-article .ls-chart-numbers-body { padding: 0 14px 14px; }
  .filter-cart-article .ls-chart-numbers table,
  .filter-cart-article .ls-chart-numbers tbody,
  .filter-cart-article .ls-chart-numbers tr,
  .filter-cart-article .ls-chart-numbers th,
  .filter-cart-article .ls-chart-numbers td { display: block; width: 100%; }
  .filter-cart-article .ls-chart-numbers thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .filter-cart-article .ls-chart-numbers tr { padding: 8px 0; border-bottom: 1px solid #e3e9e6; }
  .filter-cart-article .ls-chart-numbers th,
  .filter-cart-article .ls-chart-numbers td { padding: 2px 0; border: 0; }
  .filter-cart-article .ls-chart-numbers td:nth-of-type(1)::before { content: "Time to target: "; font-weight: 650; color: #6b4210; }
  .filter-cart-article .ls-chart-numbers td:nth-of-type(2)::before { content: "At seven passes: "; font-weight: 650; color: #6b4210; }
  .filter-cart-article .ls-chart-numbers td:nth-of-type(3)::before { content: "Steady level: "; font-weight: 650; color: #6b4210; }
}

/* f3: genuine 361 px source. A 180 CSS px cap preserves 2x pixel density.
   Do not replace it with a different sight-glass product or invent extra detail. */
.filter-cart-article .route-editorial-photo.ls-pod-photo img {
  width: 180px;
  max-width: min(100%, 180px);
  height: auto;
  justify-self: center;
}
.filter-cart-article .route-editorial-photo.ls-pod-photo {
  border: 1px solid #d8e1dd;
  border-left: 3px solid #17805f;
  border-radius: 6px;
  background: #f8faf8;
  padding: 24px;
  gap: 28px;
}
.filter-cart-article .ls-pod-photo figcaption { color: #3f5249; line-height: 1.65; }
.filter-cart-article .route-editorial-photo.ls-pod-photo > figcaption {
  background: transparent !important;
}
.filter-cart-article .ls-pod-photo figcaption > span { font-size: 18px; line-height: 1.4; }
@media (max-width: 600px) {
  .filter-cart-article .route-editorial-photo.ls-pod-photo { padding: 22px 18px; gap: 18px; }
  .filter-cart-article .ls-pod-photo figcaption { text-align: left; }
}

/* f4 evidence table: readable sizes (header 14 px, cells 15 px), cards on phones. */
.filter-cart-article .ls-evidence-wrap {
  margin: 30px 0 34px;
  border: 1px solid rgba(24, 36, 39, 0.16);
  border-radius: 4px;
  background: #ffffff;
  overflow: hidden;
}
.filter-cart-article .ls-evidence-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.filter-cart-article .ls-evidence-table caption {
  padding: 13px 16px 12px;
  background: #f4f7f5;
  color: #31403f;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  text-align: left;
}
.filter-cart-article .ls-evidence-table th,
.filter-cart-article .ls-evidence-table td {
  padding: 13px 14px;
  border-right: 1px solid rgba(24, 36, 39, 0.1);
  border-bottom: 1px solid rgba(24, 36, 39, 0.1);
  text-align: left;
  vertical-align: top;
}
.filter-cart-article .ls-evidence-table :is(th, td):last-child { border-right: 0; }
.filter-cart-article .ls-evidence-table tbody tr:last-child :is(th, td) { border-bottom: 0; }
.filter-cart-article .ls-evidence-table thead th {
  background: #1d292c;
  color: #ffffff;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}
.filter-cart-article .ls-evidence-table thead th:nth-child(1) { width: 27%; }
.filter-cart-article .ls-evidence-table thead th:nth-child(2) { width: 39%; }
.filter-cart-article .ls-evidence-table thead th:nth-child(3) { width: 34%; }
.filter-cart-article .ls-evidence-table tbody th { color: #172426; font-size: 15px; font-weight: 700; line-height: 1.5; background: #ffffff; }
.filter-cart-article .ls-evidence-table td { color: #344245; font-size: 15px; line-height: 1.55; }
/* The reservoir result answers the target question; other rows remain useful process evidence. */
.filter-cart-article .ls-evidence-table .ls-evidence-target > :is(th, td) { background: #edf5ee; }
.filter-cart-article .ls-evidence-table .ls-evidence-target > th { box-shadow: inset 4px 0 #215d47; }
.filter-cart-article .ls-evidence-table .ls-evidence-target > td:first-of-type { color: #163f31; font-weight: 650; }
@media (max-width: 600px) {
  .filter-cart-article .ls-evidence-wrap { border: 0; background: transparent; overflow: visible; }
  .filter-cart-article .ls-evidence-table,
  .filter-cart-article .ls-evidence-table tbody,
  .filter-cart-article .ls-evidence-table tr,
  .filter-cart-article .ls-evidence-table th,
  .filter-cart-article .ls-evidence-table td { display: block; width: 100%; }
  .filter-cart-article .ls-evidence-table caption {
    display: block;
    margin-bottom: 10px;
    padding: 12px 14px;
    border: 1px solid rgba(24, 36, 39, 0.14);
    border-radius: 4px;
    font-size: 15px;
  }
  .filter-cart-article .ls-evidence-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .filter-cart-article .ls-evidence-table tr {
    margin-bottom: 10px;
    border: 1px solid rgba(24, 36, 39, 0.14);
    border-radius: 4px;
    background: #ffffff;
  }
  .filter-cart-article .ls-evidence-table tbody th,
  .filter-cart-article .ls-evidence-table td { border-right: 0; padding: 10px 14px; }
  .filter-cart-article .ls-evidence-table tbody th { padding-top: 12px; border-bottom: 1px solid rgba(24, 36, 39, 0.1); font-size: 16px; }
  .filter-cart-article .ls-evidence-table td { border-bottom: 0; font-size: 15px; }
  .filter-cart-article .ls-evidence-table td + td { padding-top: 0; padding-bottom: 12px; }
  .filter-cart-article .ls-evidence-table tbody tr:last-child th { border-bottom: 1px solid rgba(24, 36, 39, 0.1); }
  .filter-cart-article .ls-evidence-table td::before {
    display: block;
    margin-bottom: 2px;
    color: #6b4210;
    content: attr(data-label);
    font-size: 14px;
    font-weight: 700;
  }
}

/* Closing note under the references. */
.filter-cart-article .ls-sources-note { margin-top: 14px; color: #4a585b; font-size: 14px; line-height: 1.6; }

/* Anchor offset only: does not move any figure during normal reading. */
.filter-cart-article figure[id],
.filter-cart-article section[id] {
  scroll-margin-top: calc(var(--header-h, 64px) + 16px);
}

/*21October visual overhaul: genuine catalogue photography, not a product mockup. */
.filter-cart-article .ls-cart-plate{border:0;border-radius:0;background:#f3f6f0;box-shadow:none;padding:22px 24px 20px;position:relative}
.filter-cart-article .ls-cart-plate::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#b56a20}
.filter-cart-article .ls-cart-plate img{width:180px;filter:none}
.filter-cart-article .ls-cart-plate figcaption{padding-top:16px;border-top:1px solid #cad7c8;margin-top:18px;font-size:14px;line-height:1.65}
.filter-cart-article .ls-cart-plate figcaption>span{font-size:19px;line-height:1.35;margin-bottom:7px}
.filter-cart-article .ls-chart-figure{padding:0;overflow:hidden;border-radius:3px;border-color:#c6d3c7;background:#fbfcf9}
.filter-cart-article .ls-chart-heading{padding:25px 26px 22px;background:#173c30;color:#fff}
.filter-cart-article .ls-chart-heading>p{margin:0 0 11px;font-size:12px;letter-spacing:.1em;font-weight:650;color:#d5e3cf}
.filter-cart-article .ls-chart-heading>h4{margin:0;font-size:28px;line-height:1.2;font-weight:600;letter-spacing:-.025em;color:#fff;max-width:22ch}
.filter-cart-article .ls-chart-outcomes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:8px 22px 22px;gap:20px}
.filter-cart-article .ls-chart-outcomes>div{border-top:1px solid #c9d6c9;padding-top:15px;min-width:0}
.filter-cart-article .ls-chart-outcomes h5{margin:9px 0 14px;font-size:14px;line-height:1.5;font-weight:600;color:#2c4438;min-height:3em}
.filter-cart-article .ls-chart-outcomes strong{display:block;color:#153e32;font-size:31px;line-height:1.2;letter-spacing:-.035em;font-weight:650;font-variant-numeric:tabular-nums}
.filter-cart-article .ls-chart-outcomes strong>span{font-size:17px;letter-spacing:0;font-weight:500}
.filter-cart-article .ls-chart-outcomes .ls-outcome-slow strong{color:#8d4b10}
.filter-cart-article .ls-chart-outcomes .ls-outcome-plateau strong{color:#365b90;font-size:24px;letter-spacing:-.03em}
.filter-cart-article .ls-chart-outcomes p{margin:8px 0 0;font-size:14px;line-height:1.5;color:#506156}
.filter-cart-article .ls-line-key{display:block;width:42px;border-top:3px solid #156851}
.filter-cart-article .ls-outcome-slow .ls-line-key{border-color:#a65b16;border-top-style:dashed}
.filter-cart-article .ls-outcome-plateau .ls-line-key{border-color:#395fa4;border-top-style:dotted}
.filter-cart-article .ls-chart-figure figcaption{font-size:14px;background:#f0f4ed;padding:18px 22px}
.filter-cart-article .ls-chart-figure figcaption>span:first-child{font-size:16px;margin-bottom:8px}
.filter-cart-article .route-editorial-photo.ls-pod-photo{border:0;border-radius:0;background:#f3f6f0;gap:32px;padding:30px}
.filter-cart-article .ls-pod-photo figcaption>span{font-size:22px;letter-spacing:-.02em}
@media(max-width:850px){
 .filter-cart-article .ls-cart-plate{grid-template-columns:110px minmax(0,1fr);padding:20px;gap:24px}
 .filter-cart-article .ls-cart-plate img{width:110px}
 .filter-cart-article .ls-cart-plate figcaption{border:0;padding:0;margin:0}
}
@media(max-width:600px){
 .filter-cart-article .ls-chart-heading{padding:22px 18px}
 .filter-cart-article .ls-chart-heading>h4{font-size:25px}
 .filter-cart-article .ls-chart-outcomes{grid-template-columns:minmax(0,1fr);padding:5px 18px 20px;gap:0}
 .filter-cart-article .ls-chart-outcomes>div{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;padding:18px 0;align-items:baseline}
 .filter-cart-article .ls-chart-outcomes h5{margin:0;min-height:0;font-size:15px;grid-column:1}
 .filter-cart-article .ls-line-key{margin:0 0 10px;grid-column:1/-1}
 .filter-cart-article .ls-chart-outcomes strong{font-size:30px;grid-column:2;grid-row:2}
 .filter-cart-article .ls-chart-outcomes .ls-outcome-plateau strong{font-size:21px}
 .filter-cart-article .ls-chart-outcomes p{grid-column:1/-1;margin-top:7px}
 .filter-cart-article .ls-chart-figure figcaption{padding:18px}
 .filter-cart-article .route-editorial-photo.ls-pod-photo{padding:24px 20px;gap:20px}
}
@media(max-width:380px){
 .filter-cart-article .ls-cart-plate{grid-template-columns:96px minmax(0,1fr);padding:18px;gap:16px}
 .filter-cart-article .ls-cart-plate img{width:96px}
 .filter-cart-article .ls-chart-outcomes>div{column-gap:10px}
 .filter-cart-article .ls-chart-outcomes strong{font-size:27px}
 .filter-cart-article .ls-chart-outcomes .ls-outcome-plateau strong{font-size:19px}
}

.filter-cart-insight-card .insights-post-media{background:#f3f6f0}.filter-cart-insight-card .insights-post-media img{object-fit:contain;padding:18px}.filter-cart-insight-card .insights-card-author-name{font-size:13px}
.filter-cart-article .journal-article-meta a.insights-author-link { text-decoration: underline; text-underline-offset: .18em; }
