/* WP EasyCart Admin — Settings › Store details as a Store setup page ( 6.0.7 ): cards that show the result of each setting first
   ( prices as shoppers see them, a receipt's heading, the store pages' health ), the controls under them. Accent follows the admin
   colorizer through --ecsu-accent ( setup-v2.css ). */
.ecsd2 { display:flex; flex-direction:column; gap:14px; container-type:inline-size; container-name:ecsd2; }
.ecsd2-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; align-items:start; }
.ecsd2-col { display:flex; flex-direction:column; gap:14px; min-width:0; }
@container ecsd2 (min-width: 900px) {
	.ecsd2-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
	.ecsd2-grid-small { align-items:stretch; }
}

.ecsd2-card { background:#fff; border:1px solid var(--ecv2-g200); border-radius:var(--ecv2-r); padding:16px 18px; display:flex; flex-direction:column; gap:14px; min-width:0; scroll-margin-top:72px; }
.ecsd2-card.is-quiet { background:var(--ecv2-g50, #f9fafb); }
.ecsd2-head { display:flex; align-items:flex-start; gap:12px; }
.ecsd2-ic { flex:0 0 auto; width:34px; height:34px; border-radius:9px; background:var(--ecsu-accent-soft); color:var(--ecv2-g800); display:flex; align-items:center; justify-content:center; }
.ecsd2-ic svg { width:17px; height:17px; }
.ecsd2-head-text { flex:1 1 auto; min-width:0; }
.ecsd2-head h2 { margin:0; font-size:15px; font-weight:700; line-height:1.3; color:var(--ecv2-g900); text-wrap:balance; }
.ecsd2-head p { margin:3px 0 0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g500); }
.ecsd2-head-flat { align-items:center; flex-wrap:wrap; }
.ecsd2-head-btn { flex:0 0 auto; }

/* labels, fields */
.ecsd2-label { display:block; font-size:12.5px; font-weight:600; color:var(--ecv2-g700); margin:0 0 6px; padding:0; }
.ecsd2-field { display:flex; flex-direction:column; min-width:0; margin:0; }
.ecsd2-select, .ecsd2-input { width:100%; max-width:100%; min-height:38px; box-sizing:border-box; border:1px solid var(--ecv2-g300); border-radius:var(--ecv2-rs, 6px); padding:6px 10px; font-size:13.5px; background:#fff; color:var(--ecv2-g900); }
textarea.ecsd2-input { min-height:0; font-family:inherit; line-height:1.45; }
.ecsd2-select:focus, .ecsd2-input:focus { border-color:var(--ecsu-accent); outline:2px solid var(--ecsu-accent-soft); outline-offset:0; }
.ecsd2-input::placeholder { color:var(--ecv2-g500); opacity:1; } /* wp-admin's is too faint to read ( Matt ) */
.ecsd2-input.ecsu-secret { letter-spacing:.08em; }
.ecsd2-two { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); align-items:start; gap:12px; }
.ecsd2-muted { font-size:12.5px; line-height:1.45; color:var(--ecv2-g500); }
/* 6.0.7: the time zone field ( print_clock() ). */
.ecsd2-hint { margin:6px 0 0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g600, #4b5563); }
.ecsd2-warn { margin:8px 0 0; padding:8px 10px; border-radius:var(--ecv2-rs, 6px); background:#fffbeb; border:1px solid #fcd34d; color:#78350f; font-size:12.5px; line-height:1.45; }
.ecsd2-link { font-size:13px; font-weight:600; color:var(--ecsu-accent); white-space:nowrap; }
.ecsd2-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.ecsd2-check { display:flex; align-items:flex-start; gap:8px; font-size:13px; line-height:1.45; color:var(--ecv2-g800); cursor:pointer; margin:0; }
.ecsd2-check input { margin:2px 0 0; flex:0 0 auto; }
.ecsd2-check-tight { align-items:center; font-weight:600; }
.ecsd2-check-tight input { margin:0; }
.ecsd2-danger { color:#b91c1c; border-color:#fecaca; }
.ecsd2-danger:hover, .ecsd2-danger:focus-visible { background:#fef2f2; color:#991b1b; }

/* Money: prices as shoppers see them */
.ecsd2-prices { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:0; border:1px solid var(--ecv2-g200); border-radius:10px; overflow:hidden; background:var(--ecv2-g50, #f9fafb); }
.ecsd2-prices > div { display:flex; flex-direction:column; gap:2px; padding:10px 12px; min-width:0; }
.ecsd2-prices > div + div { border-left:1px solid var(--ecv2-g200); }
.ecsd2-prices span { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ecv2-g500); }
.ecsd2-prices b { font-size:18px; font-weight:700; color:var(--ecv2-g900); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.ecsd2-prices b.is-neg { color:#b91c1c; }
@container ecsd2 (max-width: 420px) {
	.ecsd2-prices { grid-template-columns:minmax(0,1fr); }
	.ecsd2-prices > div + div { border-left:0; border-top:1px solid var(--ecv2-g200); }
}


/* a row of choice buttons for one setting */
.ecsd2-seg { display:inline-flex; flex-wrap:wrap; gap:0; max-width:100%; border:1px solid var(--ecv2-g300); border-radius:8px; background:#fff; overflow:hidden; align-self:flex-start; }
.ecsd2-seg-btn { min-height:34px; min-width:44px; padding:0 12px; border:0; background:transparent; color:var(--ecv2-g700); font:inherit; font-size:13px; font-variant-numeric:tabular-nums; cursor:pointer; }
.ecsd2-seg-btn + .ecsd2-seg-btn { border-left:1px solid var(--ecv2-g200); }
.ecsd2-seg-btn:hover { background:var(--ecv2-g50, #f9fafb); }
.ecsd2-seg-btn.is-on { background:var(--ecsu-accent); color:#fff; font-weight:600; }
.ecsd2-seg-btn:focus-visible { outline:2px solid var(--ecsu-accent); outline-offset:-2px; position:relative; }
.ecsd2-seg-btn.is-on:focus-visible { outline-color:var(--ecv2-g900); }
.ecsd2-example { margin-top:6px; font-size:12.5px; color:var(--ecv2-g500); font-variant-numeric:tabular-nums; }
.ecsd2-units { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:14px; }

/* a line with a link at the end */
.ecsd2-row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px 14px; padding-top:12px; border-top:1px solid var(--ecv2-g100); }
.ecsd2-row > div { min-width:0; flex:1 1 220px; }
.ecsd2-row b { font-size:13px; color:var(--ecv2-g900); }
.ecsd2-row p { margin:2px 0 0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g500); }

/* something to decide ( weights to convert, orders in another currency ) */
.ecsd2-notice { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 14px; padding:12px 14px; border:1px solid #fde68a; border-left:4px solid #d97706; border-radius:8px; background:#fffbeb; scroll-margin-top:72px; }
.ecsd2-notice > div:first-child { min-width:0; flex:1 1 260px; }
.ecsd2-notice b { font-size:13px; color:var(--ecv2-g900); }
.ecsd2-notice p { margin:2px 0 0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); }

/* the country's usual currency, format, units */
.ecsd2-suggest { display:flex; flex-direction:column; gap:10px; padding:14px; border:1px solid var(--ecv2-g300); border-radius:10px; background:var(--ecv2-g50, #f9fafb); }
.ecsd2-suggest > b { font-size:13.5px; color:var(--ecv2-g900); text-wrap:balance; }
.ecsd2-suggest p { margin:0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g600); }
.ecsd2-suggest-table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--ecv2-g200); border-radius:8px; overflow:hidden; font-size:13px; }
.ecsd2-wrap .ecsd2-suggest-table th, .ecsd2-suggest-table th, .ecsd2-suggest-table td { padding:8px 10px; text-align:left; border:0; border-bottom:1px solid var(--ecv2-g100); vertical-align:middle; font-variant-numeric:tabular-nums; }
.ecsd2-suggest-table thead th { font-size:11.5px; font-weight:600; color:var(--ecv2-g500); background:var(--ecv2-g50, #f9fafb); }
.ecsd2-suggest-table tbody tr:last-child > * { border-bottom:0; }
.ecsd2-suggest-table td:first-child { width:28px; }
.ecsd2-suggest-table tbody th { font-weight:600; color:var(--ecv2-g800); }
.ecsd2-suggest-table td:nth-child(3) { color:var(--ecv2-g500); }
.ecsd2-suggest-table td b { color:var(--ecv2-g900); }

/* Your business: a receipt's heading */
.ecsd2-letterhead { display:flex; align-items:flex-start; gap:14px; padding:14px; border:1px solid var(--ecv2-g200); border-radius:10px; background:linear-gradient(180deg, var(--ecv2-g50, #f9fafb), #fff 60%); }
.ecsd2-logo { flex:0 0 auto; width:56px; height:56px; border-radius:10px; background:#fff; border:1px solid var(--ecv2-g200); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.ecsd2-logo img { max-width:100%; max-height:100%; object-fit:contain; }
.ecsd2-logo.is-empty { background:var(--ecsu-accent-soft); color:var(--ecv2-g800); font-size:22px; font-weight:700; }
.ecsd2-letterhead-text { display:flex; flex-direction:column; gap:1px; min-width:0; font-size:13px; line-height:1.5; color:var(--ecv2-g700); overflow-wrap:anywhere; }
.ecsd2-letterhead-text b { font-size:15px; color:var(--ecv2-g900); }
.ecsd2-from { margin-top:6px; }
.ecsd2-form { display:flex; flex-direction:column; gap:12px; }

/* Store pages: one tile each */
.ecsd2-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px, 1fr)); gap:10px; }
.ecsd2-tile { display:grid; grid-template-columns:34px minmax(0,1fr); grid-template-areas:"ic text" "ic act"; align-content:start; gap:6px 12px; padding:12px; border:1px solid var(--ecv2-g200); border-radius:10px; background:#fff; min-width:0; scroll-margin-top:72px; }
.ecsd2-tile.is-none, .ecsd2-tile.is-missing, .ecsd2-tile.is-unpublished, .ecsd2-tile.is-no_shortcode { border-color:#fcd34d; background:#fffbeb; }
.ecsd2-tile-ic { grid-area:ic; width:34px; height:34px; border-radius:9px; background:var(--ecsu-accent-soft); color:var(--ecv2-g800); display:flex; align-items:center; justify-content:center; }
.ecsd2-tile-ic svg { width:17px; height:17px; }
.ecsd2-tile-text { grid-area:text; display:flex; flex-direction:column; gap:2px; min-width:0; }
.ecsd2-tile-text .ecsd2-muted { overflow-wrap:anywhere; }
.ecsd2-tile-name { display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; }
.ecsd2-tile-name b { font-size:13.5px; color:var(--ecv2-g900); }
.ecsd2-tile-actions { grid-area:act; display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; }

/* goal and sample products */
.ecsd2-card-small { gap:12px; }
.ecsd2-goal { display:flex; flex-wrap:wrap; align-items:center; gap:10px; }
.ecsd2-meter-wrap { flex:1 1 100%; display:flex; flex-direction:column; gap:4px; }
.ecsd2-meter { height:8px; border-radius:999px; background:var(--ecv2-g100); overflow:hidden; }
.ecsd2-meter span { display:block; height:100%; border-radius:inherit; background:var(--ecsu-accent); }

/* a field reached from the admin search */
.ecsd2 .is-sd-flash { animation:ecsd2-flash 2.2s ease-out 1; border-radius:8px; }
@keyframes ecsd2-flash { 0%, 30% { box-shadow:0 0 0 3px var(--ecsu-accent-soft), 0 0 0 5px var(--ecsu-accent); } 100% { box-shadow:0 0 0 0 transparent; } }
@media (prefers-reduced-motion: reduce) {
	.ecsd2 .is-sd-flash { animation:none; box-shadow:0 0 0 3px var(--ecsu-accent); }

}

/* help under a field */
.ecsd2-help { display:block; margin:6px 0 0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g600); }
.ecsd2-format > .ecsd2-help { margin:0 0 10px; }
.ecsd2-opt { margin-left:4px; padding:0 6px; border-radius:999px; background:var(--ecv2-g100); color:var(--ecv2-g600); font-size:10.5px; font-weight:600; font-style:normal; }

/* Money: one price format, chosen from the usual one, two others and your own ( a radio group ) */
.ecsd2-format { border:0; margin:0; padding:0; min-width:0; }
.ecsd2-presets { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:10px 8px; padding-top:4px; }
.ecsd2-preset { position:relative; display:flex; align-items:flex-start; gap:10px; min-height:66px; padding:11px 12px; border:1px solid var(--ecv2-g300); border-radius:10px; background:#fff; color:var(--ecv2-g800); text-align:left; cursor:pointer; font:inherit; }
.ecsd2-preset:hover { border-color:var(--ecv2-g500); background:var(--ecv2-g50, #f9fafb); }
.ecsd2-preset:focus-visible { outline:2px solid var(--ecsu-accent); outline-offset:2px; }
.ecsd2-radio { flex:0 0 auto; width:18px; height:18px; margin-top:2px; border:2px solid var(--ecv2-g400); border-radius:50%; background:#fff; box-sizing:border-box; }
.ecsd2-preset-body { display:flex; flex-direction:column; gap:3px; min-width:0; }
.ecsd2-preset-body b { font-size:15px; font-weight:700; color:var(--ecv2-g900); font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.ecsd2-preset-body span { font-size:12px; line-height:1.4; color:var(--ecv2-g600); }
.ecsd2-preset.is-on { border:2px solid var(--ecsu-accent); padding:10px 11px; background:var(--ecsu-accent-soft); cursor:default; }
.ecsd2-preset.is-on:hover { background:var(--ecsu-accent-soft); }
.ecsd2-preset.is-on .ecsd2-radio { border-color:var(--ecsu-accent); background:radial-gradient(circle, var(--ecsu-accent) 0 4px, #fff 5px); }
.ecsd2-preset.is-on .ecsd2-preset-body span { color:var(--ecv2-g700); }
.ecsd2-preset-on { position:absolute; top:-9px; right:10px; padding:0 8px; border-radius:999px; background:var(--ecsu-accent); color:#fff; font-size:11px; font-weight:700; font-style:normal; line-height:18px; }
.ecsd2-preset.is-custom { border-style:dashed; }
.ecsd2-preset.is-custom.is-on { border-style:solid; cursor:pointer; }
.ecsd2-preset.is-custom.is-open { border-style:solid; border-color:var(--ecsu-accent); }
.ecsd2-custom { display:flex; flex-direction:column; gap:12px; padding:14px; border:1px solid var(--ecv2-g200); border-radius:10px; background:var(--ecv2-g50, #f9fafb); }
.ecsd2-custom > .ecsd2-help { margin:0; }
.ecsd2-custom .ecsd2-input { max-width:140px; }

/* Your business: what is missing shows as an Add slot where it would print */
.ecsd2-head-side { flex:0 0 auto; display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.ecsd2-biz { display:flex; flex-direction:column; gap:10px; }
button.ecsd2-logo.is-empty { flex-direction:column; gap:0; border:2px dashed var(--ecv2-g300); background:#fff; color:var(--ecv2-g700); font:inherit; font-size:11.5px; font-weight:600; cursor:pointer; }
button.ecsd2-logo.is-empty > span[aria-hidden] { font-size:20px; line-height:1; color:var(--ecsu-accent); }
button.ecsd2-logo.is-empty:hover, button.ecsd2-logo.is-empty:focus-visible { border-color:var(--ecsu-accent); outline:none; background:var(--ecsu-accent-soft); }
.ecsd2-letterhead-text b.is-standin { color:var(--ecv2-g600); }
.ecsd2-slot { align-self:flex-start; display:inline-flex; align-items:center; flex-wrap:wrap; gap:4px 6px; margin:3px 0 0; padding:4px 10px; border:1.5px dashed #d97706; border-radius:7px; background:#fffbeb; color:#92400e; font:inherit; font-size:12.5px; font-weight:600; text-align:left; cursor:pointer; }
.ecsd2-slot::before { content:"+"; font-size:15px; line-height:1; }
.ecsd2-slot:hover, .ecsd2-slot:focus-visible { border-style:solid; outline:none; background:#fef3c7; }
.ecsd2-slot.is-optional { border-color:var(--ecv2-g400); background:#fff; color:var(--ecv2-g700); }
.ecsd2-slot.is-optional:hover, .ecsd2-slot.is-optional:focus-visible { background:var(--ecv2-g50, #f9fafb); border-color:var(--ecv2-g600); }
.ecsd2-slot em { font-style:normal; font-weight:400; color:var(--ecv2-g600); }
.ecsd2-biz-from { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; font-size:12.5px; color:var(--ecv2-g700); }
.ecsd2-biz-from.is-missing { padding:8px 10px; border:1px solid #fde68a; border-radius:8px; background:#fffbeb; color:#92400e; }
.ecsd2-biz-tip { margin:0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); }

/* Store pages: tiles stay one size; the page in use, what it shows, then View / Change */
.ecsd2-tile-where { font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); overflow-wrap:anywhere; }
.ecsd2-tile-where b { color:var(--ecv2-g900); }
.ecsd2-tile-warn { font-size:12.5px; line-height:1.45; color:#92400e; }

/* the Change dialog: what the page does, when to change it, your pages ( marked ) or a new one */
.ecsd2-pd { width:min(700px, calc(100vw - 32px)); }
.ecsd2-pd-explain { display:flex; flex-direction:column; gap:10px; }
.ecsd2-pd-visual { display:grid; grid-template-columns:minmax(0,1.2fr) 34px minmax(0,1fr); align-items:center; gap:10px; padding:14px; border-radius:12px; background:linear-gradient(135deg, var(--ecsu-accent-soft), var(--ecv2-g50, #f9fafb)); }
.ecsd2-pd-browser { border:1px solid var(--ecv2-g200); border-radius:9px; background:#fff; overflow:hidden; box-shadow:0 4px 14px rgba(17,24,39,.08); min-width:0; }
.ecsd2-pd-bar { display:flex; align-items:center; gap:4px; padding:6px 8px; background:var(--ecv2-g100); }
.ecsd2-pd-bar i { width:7px; height:7px; border-radius:50%; background:var(--ecv2-g300); }
.ecsd2-pd-bar em { flex:1 1 auto; min-width:0; margin-left:6px; padding:2px 8px; border-radius:5px; background:#fff; font-size:11px; font-style:normal; color:var(--ecv2-g700); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ecsd2-pd-page { display:flex; flex-direction:column; gap:6px; padding:10px 12px 12px; }
.ecsd2-pd-page b { font-size:13px; color:var(--ecv2-g900); }
.ecsd2-pd-code { align-self:flex-start; padding:3px 8px; border:1.5px solid var(--ecsu-accent); border-radius:6px; background:var(--ecsu-accent-soft); font-family:ui-monospace, Menlo, Consolas, monospace; font-size:12px; font-weight:700; color:var(--ecv2-g900); }
.ecsd2-pd-page s { display:block; height:6px; border-radius:3px; background:var(--ecv2-g100); text-decoration:none; }
.ecsd2-pd-page s + s { width:70%; }
.ecsd2-pd-arrow { justify-self:center; width:26px; height:26px; border-radius:50%; background:var(--ecsu-accent); position:relative; }
.ecsd2-pd-arrow::after { content:""; position:absolute; left:7px; top:9px; width:7px; height:7px; border-top:2px solid #fff; border-right:2px solid #fff; transform:rotate(45deg); }
.ecsd2-pd-sees { display:flex; flex-direction:column; gap:5px; min-width:0; }
.ecsd2-pd-sees > span { font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ecv2-g600); }
.ecsd2-pd-sees ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.ecsd2-pd-sees li { margin:0; padding-left:20px; position:relative; font-size:12.5px; line-height:1.4; color:var(--ecv2-g800); }
.ecsd2-pd-sees li::before { content:""; position:absolute; left:2px; top:3px; width:10px; height:6px; border-left:2px solid #15803d; border-bottom:2px solid #15803d; transform:rotate(-45deg); }
.ecsd2-pd-why { padding:12px 14px; border:1px solid var(--ecv2-g200); border-radius:10px; background:var(--ecv2-g50, #f9fafb); font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); }
.ecsd2-pd-why b { font-size:13px; color:var(--ecv2-g900); }
.ecsd2-pd-why ul { margin:6px 0 0; padding:0 0 0 18px; }
.ecsd2-pd-why li { margin:2px 0; }
.ecsd2-pd-why p { margin:6px 0 0; color:var(--ecv2-g600); }
.ecsd2-pd-tabs { display:flex; gap:4px; padding:4px; border-radius:10px; background:var(--ecv2-g100); }
.ecsd2-pd-tab { flex:1 1 0; min-height:36px; padding:0 10px; border:0; border-radius:7px; background:transparent; color:var(--ecv2-g700); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
.ecsd2-pd-tab[aria-selected="true"] { background:#fff; color:var(--ecv2-g900); box-shadow:0 1px 3px rgba(17,24,39,.12); }
.ecsd2-pd-tab:focus-visible { outline:2px solid var(--ecsu-accent); outline-offset:1px; }
.ecsd2-pd-panel { display:flex; flex-direction:column; gap:10px; }
.ecsd2-pd-list { list-style:none; margin:0; padding:0; max-height:240px; overflow:auto; border:1px solid var(--ecv2-g200); border-radius:9px; }
.ecsd2-pd-list:empty { display:none; }
.ecsd2-pd-list li { margin:0; }
.ecsd2-pd-list li + li { border-top:1px solid var(--ecv2-g100); }
.ecsd2-pd-list .is-empty { padding:12px; font-size:12.5px; color:var(--ecv2-g600); }
.ecsd2-pd-row { display:flex; align-items:center; gap:10px; width:100%; padding:9px 12px; border:0; background:#fff; text-align:left; font:inherit; cursor:pointer; }
.ecsd2-pd-row:hover, .ecsd2-pd-row:focus-visible { background:var(--ecv2-g50, #f9fafb); outline:none; }
.ecsd2-pd-row:focus-visible { box-shadow:inset 0 0 0 2px var(--ecsu-accent); }
.ecsd2-pd-row[aria-selected="true"] { background:var(--ecsu-accent-soft); box-shadow:inset 3px 0 0 var(--ecsu-accent); }
.ecsd2-pd-row-text { flex:1 1 auto; display:flex; flex-direction:column; min-width:0; }
.ecsd2-pd-row-text b { font-size:13px; color:var(--ecv2-g900); overflow-wrap:anywhere; }
.ecsd2-pd-row-text small { font-size:11.5px; color:var(--ecv2-g600); }
.ecsd2-pd-badge { flex:0 0 auto; padding:1px 8px; border-radius:999px; font-size:11px; font-weight:600; white-space:nowrap; }
.ecsd2-pd-badge.is-ok { background:#dcfce7; color:#166534; }
.ecsd2-pd-badge.is-now { background:var(--ecsu-accent); color:#fff; }
.ecsd2-pd-badge.is-no { background:var(--ecv2-amber-light, #fef3c7); color:#92400e; }
.ecsd2-pd-chosen { display:flex; flex-direction:column; gap:6px; padding:10px 12px; border:1px solid var(--ecv2-g200); border-radius:9px; font-size:12.5px; line-height:1.45; color:var(--ecv2-g700); }
.ecsd2-pd-chosen p { margin:0; }
.ecsd2-pd-chosen p.is-ok { color:#166534; font-weight:600; }
.ecsd2-pd-chosen p.is-no { color:#92400e; font-weight:600; }
.ecsd2-pd-new { display:flex; flex-direction:column; gap:4px; padding:10px 12px; border:1px solid var(--ecv2-g200); border-radius:9px; background:var(--ecv2-g50, #f9fafb); }
.ecsd2-pd-new p { margin:0; font-size:12.5px; line-height:1.5; color:var(--ecv2-g700); overflow-wrap:anywhere; }
.ecsd2-pd-new code { padding:1px 5px; border-radius:4px; background:#fff; font-size:12px; }
@media (max-width: 640px) {
	.ecsd2-pd-visual { grid-template-columns:minmax(0,1fr); }
	.ecsd2-pd-arrow { transform:rotate(90deg); }
}

/* display:flex above beats the hidden attribute */
.ecsd2 [hidden] { display:none !important; }
/* Fine-tune lists the rows this page asks for, advanced ones too ( exchange rates ) */
#ecsu[data-area="store"] .ecst-embed .ecst-row.is-advanced:not(.is-shown) { display:grid; }
#ecsu[data-area="store"] .ecst-embed .ecst-row.is-advanced[hidden] { display:none; }

/* 6.0.7: prices in other currencies ( print_rates(): the exchange rates, in the Money card ) */
.ecsd2-rates { display:flex; flex-direction:column; gap:10px; padding-top:14px; border-top:1px solid var(--ecv2-g100); scroll-margin-top:72px; container-type:inline-size; container-name:ecsd2rates; }
.ecsd2-rates-head { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:6px 14px; }
.ecsd2-rates-head > div { flex:1 1 260px; min-width:0; }
.ecsd2-rates-head b { font-size:13.5px; color:var(--ecv2-g900); }
.ecsd2-rates-head p { margin:3px 0 0; font-size:12.5px; line-height:1.45; color:var(--ecv2-g500); }
.ecsd2-rate-cols, .ecsd2-rate { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,1fr) 32px; align-items:center; gap:10px; }
.ecsd2-rate-cols span { font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ecv2-g500); }
.ecsd2-rate-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.ecsd2-rate { margin:0; padding:8px; border:1px solid var(--ecv2-g200); border-radius:10px; background:var(--ecv2-g50, #f9fafb); }
.ecsd2-rate-cur, .ecsd2-rate-val, .ecsd2-rate-shown { min-width:0; }
.ecsd2-rate-cur .ecsu-combo { width:100%; }
.ecsd2-rate-val { display:flex; align-items:center; gap:6px; }
.ecsd2-rate-one, .ecsd2-rate-to { flex:0 0 auto; font-size:12.5px; font-weight:600; color:var(--ecv2-g600, #4b5563); font-variant-numeric:tabular-nums; }
.ecsd2-rate-in.ecsd2-input { flex:1 1 70px; min-width:64px; font-variant-numeric:tabular-nums; text-align:right; background:#fff; }
.ecsd2-rate-shown { font-size:13px; color:var(--ecv2-g600, #4b5563); overflow-wrap:anywhere; }
.ecsd2-rate-shown-k { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.ecsd2-rate-shown-v { font-size:14px; font-weight:700; color:var(--ecv2-g900); font-variant-numeric:tabular-nums; }
.ecsd2-rate-remove { width:32px; height:32px; border:0; border-radius:8px; background:transparent; color:var(--ecv2-g500); font-size:18px; line-height:1; cursor:pointer; }
.ecsd2-rate-remove:hover, .ecsd2-rate-remove:focus-visible { background:#fef2f2; color:#b91c1c; }
.ecsd2-rate-error { margin:0; padding:8px 10px; border-radius:var(--ecv2-rs, 6px); background:#fef2f2; border:1px solid #fecaca; color:#991b1b; font-size:12.5px; }
.ecsd2-rates-foot { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; }
.ecsd2-rates-foot .ecsd2-help { margin:0; }
/* Narrower: the currency and the rate side by side, the example on its own line with its words ( the headings are gone ). */
@container ecsd2rates (max-width: 620px) {
	.ecsd2-rate-cols { display:none; }
	.ecsd2-rate { grid-template-columns:minmax(0,1fr) minmax(150px, 190px) 32px; row-gap:6px; }
	.ecsd2-rate-cur { grid-column:1; grid-row:1; }
	.ecsd2-rate-val { grid-column:2; grid-row:1; }
	.ecsd2-rate-remove { grid-column:3; grid-row:1; }
	.ecsd2-rate-shown { grid-column:1 / -1; grid-row:2; }
	.ecsd2-rate-shown-k { position:static; width:auto; height:auto; margin:0; overflow:visible; clip:auto; white-space:normal; }
}
@container ecsd2rates (max-width: 400px) {
	.ecsd2-rate { grid-template-columns:minmax(0,1fr) 32px; }
	.ecsd2-rate-val { grid-column:1 / -1; grid-row:2; }
	.ecsd2-rate-shown { grid-row:3; }
}