/* Savings calculator tab — prototype styles. Copied from theme EV calculator styles, prefixed to stay isolated. */

/* ── Savings calculator tab (car detail page) ── */
.bilinfo-sv-wrap {
    --bilinfo-sv-primary: #5A7388;
    --bilinfo-sv-ev-bg: #0f1011;
    --bilinfo-sv-surface: #fff;
    --bilinfo-sv-surface-alt: #f5f7fa;
    --bilinfo-sv-border: #cbd5df;
    --bilinfo-sv-fg: #201E21;
    --bilinfo-sv-muted: #737373;
    --bilinfo-sv-icon-bg: #EFF7FF;
    --bilinfo-sv-r: 1rem;
    --bilinfo-sv-r-sm: 0.75rem;
    font-family: var(--font-inter, 'Inter', sans-serif);
    color: var(--bilinfo-sv-fg);
    /* margin-top: 2.5rem; */
}


/* panels */
.bilinfo-sv-panels {display: grid;gap: 1.5rem;margin-bottom: 1.5rem;}
.bilinfo-sv-panels p{padding-bottom: 0px;}

@media (min-width: 992px) {
    .bilinfo-sv-panels { grid-template-columns: 1fr 1fr; align-items: stretch; }
}

.bilinfo-sv-card {border-radius: var(--bilinfo-sv-r);overflow: hidden;display: flex;flex-direction: column;}
.bilinfo-sv-ev-card {background: var(--bilinfo-sv-ev-bg);color: #fff;padding: 1.5rem ;position: relative;box-shadow: 0 24px 80px -32px rgba(0,0,0,0.4);}

@media (min-width: 768px) { 
	/* .bilinfo-sv-ev-card { padding: 2.5rem; }  */
}

.bilinfo-sv-ev-dots {position: absolute;inset: 0;z-index: 0;opacity: 0.3;background-image: radial-gradient(rgba(255,255,255,0.08) 1px, transparent 1px);background-size: 20px 20px;pointer-events: none;}
.bilinfo-sv-ev-card > * { position: relative; z-index: 1; }
.bilinfo-sv-ev-header {display: flex;align-items: center;justify-content: space-between;}
.bilinfo-sv-ev-badge {display: inline-flex;align-items: center;gap: 0.4rem;background: rgba(255,255,255,0.1);border-radius: 9999px;padding: 0.25rem 0.75rem;font-size: 0.75rem;line-height: 1rem;font-weight: 500;text-transform: uppercase;letter-spacing: 0.14em;}
.bilinfo-sv-ev-header-sub { font-size: 0.75rem; color: rgba(255,255,255,0.6); }
.bilinfo-sv-main-cost { margin-top: 2.5rem; text-align: center; }
.bilinfo-sv-label-upper {font-size: 0.875rem;line-height: 1.125rem;text-transform: uppercase;letter-spacing: 0.1em;color: rgba(255,255,255,0.6);margin: 0 0 0.25rem;padding-bottom: 0px;}
.bilinfo-sv-label-upper--dark { color: var(--bilinfo-sv-muted); }
.bilinfo-sv-big-num {font-family: var(--font-urbanist, 'Urbanist', sans-serif);font-size: clamp(2.5rem, 5vw, 3.75rem);font-weight: 800;line-height: 1;margin: 0;color: #fff;padding-bottom: 0px;}
.bilinfo-sv-big-num--dark { color: var(--bilinfo-sv-fg); }

.bilinfo-sv-sub-lbl { font-size: 0.875rem;line-height: 1.125rem; color: rgba(255,255,255,0.6); margin-top: 0.3rem;padding-bottom: 0px;}
.bilinfo-sv-sub-lbl.bottom{margin-top: 1rem;}
.bilinfo-sv-sub-lbl--dark { color: var(--bilinfo-sv-muted); }

/* mini 2-col grid */
.bilinfo-sv-mini-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 0.75rem;margin-top: 1.5rem;}
.bilinfo-sv-mini-grid--light { margin-top: 1.5rem; }

.bilinfo-sv-mini-box {background: rgba(255,255,255,0.05);border: 1px solid rgba(255,255,255,0.1);border-radius: var(--bilinfo-sv-r-sm);padding: 1rem;}
.bilinfo-sv-mini-box--light {background: var(--bilinfo-sv-surface-alt);border-color: var(--bilinfo-sv-border);}
.bilinfo-sv-mini-lbl {font-size: 0.75rem;line-height: 1rem;letter-spacing: 0.1em;text-transform: uppercase;color: rgba(255,255,255,0.5);margin: 0 0 0.5rem;padding-bottom: 0px;}
.bilinfo-sv-mini-lbl--dark { color: var(--bilinfo-sv-muted); }
.bilinfo-sv-mini-val {font-family: var(--font-urbanist, 'Urbanist', sans-serif);font-size: 1.125rem;line-height: 1.4;font-weight: 600;color: #fff;margin: 0 0 0.15rem;}
.bilinfo-sv-mini-val--dark { color: var(--bilinfo-sv-fg); }
.bilinfo-sv-mini-sub {font-size: 0.75rem;line-height: 1rem; color: rgba(255,255,255,0.5); margin: 0; }
.bilinfo-sv-mini-sub--dark { color: var(--bilinfo-sv-muted); }

/* EV inputs area — pushed to bottom */
.bilinfo-sv-ev-inputs { margin-top: auto; padding-top: 2.5rem; }
.bilinfo-sv-inputs-box {background: rgba(255,255,255,0.05);border: 1px solid rgba(255,255,255,0.1);border-radius: var(--bilinfo-sv-r-sm);padding: 1.25rem;}
.bilinfo-sv-inputs-box--light {background: var(--bilinfo-sv-surface-alt);border-color: var(--bilinfo-sv-border);margin-top: 1.5rem;}
.bilinfo-sv-sect-lbl {font-size: 0.75rem;line-height: 1rem;text-transform: uppercase;letter-spacing: 0.16em;color: rgba(255,255,255,0.6);margin: 0 0 1rem;}
.bilinfo-sv-sect-lbl--dark { color: var(--bilinfo-sv-muted); }
.bilinfo-sv-inline-rows { display: flex; flex-direction: column; gap: 1rem; }
.bilinfo-sv-inline-field {display: flex;align-items: center;justify-content: space-between;gap: 0.75rem;flex-wrap: wrap;}
.bilinfo-sv-inline-lbl { font-size: 0.875rem; color: rgba(255,255,255,0.8); }
.bilinfo-sv-inline-lbl--dark { color: rgba(32,30,33,0.8); }

.bilinfo-sv-inline-ctrl { display: flex; align-items: center; gap: 0.4rem; }
.bilinfo-sv-btn-sm {width: 1.75rem;height: 1.75rem;border-radius: 9999px;border: 1px solid rgba(255,255,255,0.2);background: transparent;color: rgba(255,255,255,0.8);cursor: pointer;display: flex;align-items: center;justify-content: center;font-size: 1.05rem;line-height: 1;transition: border-color 0.2s, color 0.2s;padding: 0;flex-shrink: 0;}
.bilinfo-sv-btn-sm:hover { border-color: #fff; color: #fff; }
.bilinfo-sv-btn-sm--light { border-color: var(--bilinfo-sv-border); color: rgba(32,30,33,0.7); }
.bilinfo-sv-btn-sm--light:hover { border-color: var(--bilinfo-sv-primary); color: var(--bilinfo-sv-primary); }

input[type="text"].bilinfo-sv-il-input,
input[type="number"].bilinfo-sv-il-input{width: 4.5rem;border: none;border-radius: 0px;border-bottom: 1px solid #fff3;background: transparent;color: #fff;text-align: center;font-size: 0.875rem;font-weight: 600;font-family: var(--font-inter, 'Inter', sans-serif);outline: none;padding-bottom: 0.1rem;transition: border-color 0.2s;}
.bilinfo-sv-il-input:focus { border-bottom-color: #fff; }

input[type="text"].bilinfo-sv-il-input--light,
input[type="number"].bilinfo-sv-il-input--light { color: var(--bilinfo-sv-fg); border-bottom-color: var(--bilinfo-sv-border); }

input[type="text"].bilinfo-sv-il-input--light:focus,
input[type="number"].bilinfo-sv-il-input--light:focus { border-bottom-color: var(--bilinfo-sv-primary); }
.bilinfo-sv-il-input::-webkit-outer-spin-button,
.bilinfo-sv-il-input::-webkit-inner-spin-button { -webkit-appearance: none; }
.bilinfo-sv-il-input[type=number] { -moz-appearance: textfield; }

.bilinfo-sv-unit { font-size: 0.7rem; color: rgba(255,255,255,0.5); min-width: 3.5rem; text-align: right; flex-shrink: 0; }
.bilinfo-sv-unit--dark { color: var(--bilinfo-sv-muted); }

/* ── Fuel card ── */
.bilinfo-sv-fuel-card {background: var(--bilinfo-sv-surface);border: 1px solid var(--bilinfo-sv-border);padding: 1rem;box-shadow: 0 18px 50px -24px rgba(90,115,136,0.28);}
@media (min-width: 768px) { 
	.bilinfo-sv-fuel-card { padding: 2rem; } 
}

.bilinfo-sv-fuel-header {display: flex;align-items: center;justify-content: space-between;gap: 1rem;}
.bilinfo-sv-tabs {display: inline-flex;border-radius: 9999px;border: 1px solid var(--bilinfo-sv-border);background: var(--bilinfo-sv-surface-alt);padding: 0.25rem;max-width: fit-content;margin: 0 auto;}
.bilinfo-sv-tab {display: inline-flex;align-items: center;gap: 0.4rem;border-radius: 9999px;padding: 0.4rem 1rem;font-size: 0.85rem;font-weight: 500;cursor: pointer;border: none;background: transparent;color: var(--bilinfo-sv-muted);transition: background 0.2s, color 0.2s, box-shadow 0.2s;font-family: var(--font-inter, 'Inter', sans-serif);}
.bilinfo-sv-tab--active { background: var(--bilinfo-sv-primary); color: #fff; box-shadow: 0 2px 8px rgba(90,115,136,0.3); }
.bilinfo-sv-tab:hover:not(.bilinfo-sv-tab--active) { color: var(--bilinfo-sv-fg); }

.bilinfo-sv-fuel-icon {width: 2.5rem;height: 2.5rem;border-radius: 9999px;background: var(--bilinfo-sv-icon-bg);color: var(--bilinfo-sv-primary);display: flex;align-items: center;justify-content: center;flex-shrink: 0;}
.bilinfo-sv-fuel-main { margin-top: 2rem; text-align: center; }

/* savings box */
.bilinfo-sv-savings {margin-top: 1.5rem;background: var(--bilinfo-sv-icon-bg);border: 1px solid rgba(90,115,136,0.2);border-radius: var(--bilinfo-sv-r-sm);padding: 1.25rem;}
.bilinfo-sv-savings-hd {display: flex;align-items: center;gap: 0.4rem;color: var(--bilinfo-sv-primary);font-size: 0.75rem;line-height: 1rem;font-weight: 600;text-transform: uppercase;letter-spacing: 0.1em;margin-bottom: 0.2rem;padding-bottom: 0}
.bilinfo-sv-savings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.bilinfo-sv-savings-sub { font-size: 0.85rem;line-height: 1rem; color: var(--bilinfo-sv-muted);padding-bottom: 0px;margin-bottom: 5px; }
.bilinfo-sv-savings-val {font-family: var(--font-urbanist, 'Urbanist', sans-serif);font-size: 1.5rem;line-height: 2rem;font-weight: 700;color: var(--bilinfo-sv-fg);margin: 0;}

/* The result is the sales pitch, not a footnote — give it a real headline, not just the small eyebrow. */
.bilinfo-sv-savings-headline {
	font-family: var(--font-urbanist, 'Urbanist', sans-serif);
	font-size: 1.25rem;
	line-height: 1.2;
	font-weight: 800;
	color: var(--bilinfo-sv-fg);
	margin: 0 0 1.4rem;
	text-wrap: balance;
}
/* Positive saving: accent in the same green as the Besparelse tab. */
.bilinfo-sv-savings--positive { background: rgba(31, 122, 77, 0.08); border-color: rgba(31, 122, 77, 0.3); }
.bilinfo-sv-savings--positive .bilinfo-sv-savings-headline,
.bilinfo-sv-savings--positive .bilinfo-sv-savings-val { color: #1f7a4d; }
.bilinfo-sv-savings--positive .bilinfo-sv-savings-hd { color: #1f7a4d; }
/* Nested inside "Din nuværende bil": pinned to the bottom of the card, the same way the
   theme calculator pins its EV inputs box, so the shorter card's blank space is used. */
.bilinfo-sv-usage .bilinfo-sv-savings { margin-top: auto; padding-top: 1.25rem; }
.bilinfo-sv-usage .bilinfo-sv-fields { margin-bottom: 1.5rem; }

/* ── Usage section ── */
.bilinfo-sv-usage {background: var(--bilinfo-sv-surface);border: 1px solid var(--bilinfo-sv-border);border-radius: var(--bilinfo-sv-r);padding: 1.5rem 1rem 1rem;box-shadow: 0 18px 50px -24px rgba(90,115,136,0.28);}
@media (min-width: 768px) { 
	/* .bilinfo-sv-usage { padding: 2rem; }  */
}

.bilinfo-sv-usage-hd {display: flex;align-items: flex-start;justify-content: space-between;gap: 1rem;margin-bottom: 1.5rem;}
.bilinfo-sv-usage-label {font-size: 0.65rem;text-transform: uppercase;letter-spacing: 0.16em;color: var(--bilinfo-sv-muted);margin: 0 0 0.25rem;}
.bilinfo-sv-usage-title {font-family: var(--font-urbanist, 'Urbanist', sans-serif);font-size: 1.25rem;line-height:1.4; font-weight: 700;color: var(--bilinfo-sv-fg);margin: 0;}
.bilinfo-sv-gauge-icon {width: 2.5rem;height: 2.5rem;border-radius: 9999px;background: var(--bilinfo-sv-icon-bg);color: var(--bilinfo-sv-primary);display: flex;align-items: center;justify-content: center;flex-shrink: 0;}
@media (max-width: 767px) { 
	.bilinfo-sv-gauge-icon { display: none; } 
}

.bilinfo-sv-usage-grid { display: grid; gap: 1.5rem; }
@media (min-width: 768px) { 
	.bilinfo-sv-usage-grid { grid-template-columns: 1fr 1fr; } 
}

.bilinfo-sv-ufield-hd {display: flex;align-items: center;justify-content: space-between;margin-bottom: 0.75rem;}
.bilinfo-sv-ufield-lbl { font-size: 0.875rem; font-weight: 500; color: rgba(32,30,33,0.8); }
.bilinfo-sv-ufield-sfx { font-size: 0.75rem; color: var(--bilinfo-sv-muted); }
.bilinfo-sv-ufield-ctrl { display: flex; align-items: center; gap: 0.75rem; }
.bilinfo-sv-btn-lg {width: 2.5rem;height: 2.5rem;border-radius: 9999px;border: 1px solid var(--bilinfo-sv-border);background: var(--bilinfo-sv-surface);color: var(--bilinfo-sv-fg);cursor: pointer;display: flex;align-items: center;justify-content: center;transition: border-color 0.2s, color 0.2s;flex-shrink: 0;padding: 0;}
.bilinfo-sv-btn-lg:hover { border-color: var(--bilinfo-sv-primary); color: var(--bilinfo-sv-primary); }

.bilinfo-sv-ufield-ctrl .bilinfo-sv-input-wrap { flex: 1; }
.bilinfo-sv-u-input[type=number],
.bilinfo-sv-u-input {width: 100%;border: none;border-radius: 0px;border-bottom: 1px solid var(--bilinfo-sv-border);background: transparent;text-align: center;font-family: var(--font-urbanist, 'Urbanist', sans-serif);font-size: 1.75rem;font-weight: 700;color: var(--bilinfo-sv-fg);outline: none;padding-bottom: 0.5rem;padding-top: 0.25rem;transition: border-color 0.2s;}
.bilinfo-sv-u-input:focus { border-bottom-color: var(--bilinfo-sv-primary); }
.bilinfo-sv-u-input::-webkit-outer-spin-button,
.bilinfo-sv-u-input::-webkit-inner-spin-button { -webkit-appearance: none; }
.bilinfo-sv-u-input[type=number] { -moz-appearance: textfield; }

@media(max-width: 420px){
	.bilinfo-sv-inline-field{ align-items: start;flex-direction: column;}
	.bilinfo-sv-inline-ctrl{width: 100%;}
	input[type="text"].bilinfo-sv-il-input,
	input[type="number"].bilinfo-sv-il-input{flex-grow: 1;width: 100%;}
}

/* EV road tax separator row */
.bilinfo-sv-ev-roadtax-row { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,0.1); }

/* ── EV Mode toggle (Subscription / kWh) inside dark card ── */
.bilinfo-sv-ev-mode-tabs {display: inline-flex;border-radius: 9999px;border: 1px solid rgba(255,255,255,0.15);background: rgba(255,255,255,0.05);padding: 0.2rem;}
.bilinfo-sv-ev-tab {display: inline-flex;align-items: center;gap: 0.3rem;border-radius: 9999px;padding: 0.3rem 0.65rem;font-size: 0.75rem;line-height: 1rem; font-weight: 600;cursor: pointer;border: none;background: transparent;color: rgba(255,255,255,0.7);transition: background 0.2s, color 0.2s, box-shadow 0.2s;font-family: var(--font-inter, 'Inter', sans-serif);white-space: nowrap;}
.bilinfo-sv-ev-tab--active {background: #fff;color: #0f1011;box-shadow: 0 2px 8px rgba(0,0,0,0.25);}
.bilinfo-sv-ev-tab:hover:not(.bilinfo-sv-ev-tab--active) {color: #fff;}

/* ── EV Decision section ── */
.bilinfo-sv-decision {margin-top: 1.5rem;overflow: hidden;border: 1px solid var(--bilinfo-sv-border);border-radius: var(--bilinfo-sv-r);background: var(--bilinfo-sv-surface);box-shadow: 0 18px 50px -24px rgba(90,115,136,0.28);}
.bilinfo-sv-decision-hd {display: flex;flex-direction: column;gap: 0.75rem;border-bottom: 1px solid var(--bilinfo-sv-border);background: var(--bilinfo-sv-surface-alt);padding: 1.5rem;}
@media (min-width: 768px) {.bilinfo-sv-decision-hd {flex-direction: row;align-items: center;justify-content: space-between;padding: 2rem;}}

.bilinfo-sv-cheapest-badge {display: inline-flex;align-items: center;gap: 0.4rem;border-radius: 9999px;background: var(--bilinfo-sv-icon-bg);color: var(--bilinfo-sv-primary);padding: 0.375rem 0.75rem;font-size: 0.7rem;font-weight: 600;align-self: flex-start;flex-shrink: 0;}
@media (min-width: 768px) {.bilinfo-sv-cheapest-badge {align-self: auto;}}

.bilinfo-sv-dcards {display: grid;gap: 1rem;padding: 1.5rem;}
@media (min-width: 768px) {.bilinfo-sv-dcards {grid-template-columns: 1fr 1fr;padding: 2rem;}}

.bilinfo-sv-dcard {border: 1px solid var(--bilinfo-sv-border);border-radius: var(--bilinfo-sv-r-sm);padding: 1.25rem;text-align: left;background: var(--bilinfo-sv-surface);cursor: pointer;transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;width: 100%;}
.bilinfo-sv-dcard--best {border-color: var(--bilinfo-sv-primary);background: var(--bilinfo-sv-icon-bg);}
.bilinfo-sv-dcard--active {box-shadow: 0 0 0 2px rgba(90,115,136,0.3);}
.bilinfo-sv-dcard:hover:not(.bilinfo-sv-dcard--best) {border-color: rgba(90,115,136,0.4);}

.bilinfo-sv-dcard-header {display: flex;align-items: center;justify-content: space-between;margin-bottom: 1rem;}
.bilinfo-sv-dcard-title {display: inline-flex;align-items: center;gap: 0.4rem;font-size: 0.875rem;font-weight: 600;color: var(--bilinfo-sv-fg);}
.bilinfo-sv-dcard-best {border-radius: 9999px;background: var(--bilinfo-sv-primary);color: #fff;padding: 0.1rem 0.5rem;font-size: 0.62rem;font-weight: 700;text-transform: uppercase;letter-spacing: 0.08em;}
.bilinfo-sv-dcard-total {font-family: var(--font-urbanist, 'Urbanist', sans-serif);font-size: 1.875rem;font-weight: 800;color: var(--bilinfo-sv-fg);margin: 0 0 0.1rem;padding-bottom: 0;}
.bilinfo-sv-dcard-total-sub {font-size: 0.75rem;color: var(--bilinfo-sv-muted);margin: 0;padding-bottom: 0;}
.bilinfo-sv-dcard-footer {display: flex;align-items: center;justify-content: space-between;border-top: 1px solid var(--bilinfo-sv-border);padding-top: 0.75rem;margin-top: 1rem;font-size: 0.75rem;}
.bilinfo-sv-dcard-footer span:first-child {color: var(--bilinfo-sv-muted);}
.bilinfo-sv-dcard-footer span:last-child {font-weight: 600;color: var(--bilinfo-sv-fg);}

.bilinfo-sv-disclaimer { font-size: 0.75rem; line-height: 1.1rem; color: var(--bilinfo-sv-muted); margin: 1.25rem 0 0; padding-bottom: 0; }

/* ── Responsive layout (prototype) ──────────────────────────────────────── */

/* Size the cards by the space the tab actually has, not by the screen width.
   The tab sits beside a sidebar on desktop, so screen-width breakpoints made the cards thin. */
.bilinfo-sv-wrap { container-type: inline-size; }

/* One card per row by default. Two side by side only when the column is wide enough. */
.bilinfo-sv-panels { grid-template-columns: minmax(0, 1fr); }
@container (min-width: 620px) {
	.bilinfo-sv-panels { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
}

/* Input fields: label above, field with unit inside, two columns on wider cards, one on phones. */
.bilinfo-sv-fields {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1rem;
	margin-top: 1.25rem;
}
@container (min-width: 420px) {
	.bilinfo-sv-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.bilinfo-sv-field--wide { grid-column: 1 / -1; }
}
.bilinfo-sv-field { min-width: 0; }
.bilinfo-sv-field-lbl {
	display: block;
	font-size: 0.8125rem;
	line-height: 1.25rem;
	color: var(--bilinfo-sv-muted);
	margin-bottom: 0.4rem;
}
.bilinfo-sv-field-ctrl {
	position: relative;
	display: flex;
	align-items: center;
}
input[type="number"].bilinfo-sv-field-input {
	width: 100%;
	height: 2.75rem;
	padding: 0 2.3rem 0 0.9rem;
	border: 1px solid var(--bilinfo-sv-border);
	border-radius: var(--bilinfo-sv-r-sm);
	background: var(--bilinfo-sv-surface);
	color: var(--bilinfo-sv-fg);
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
}
input[type="number"].bilinfo-sv-field-input:focus {
	outline: none;
	border-color: var(--bilinfo-sv-primary);
	box-shadow: 0 0 0 3px rgba(90, 115, 136, 0.2);
}

/* Chrome, Safari, Edge, Opera */
input[type="number"].bilinfo-sv-field-input::-webkit-outer-spin-button,
input[type="number"].bilinfo-sv-field-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"].bilinfo-sv-field-input {
  -moz-appearance: textfield;
}


.bilinfo-sv-field-unit {
	position: absolute;
	right: 0.9rem;
	font-size: 0.75rem;
	color: var(--bilinfo-sv-muted);
	pointer-events: none;
}

/* Result: two cells (per month, over 5 years). */
.bilinfo-sv-savings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.bilinfo-sv-usage-intro {font-size: 0.875rem; color: var(--bilinfo-sv-muted);padding-bottom:0px;}
.bilinfo-sv-note { font-size: 0.75rem; color: rgba(255,255,255,0.5); margin: 1.25rem 0 0; }
.bilinfo-sv-usage .bilinfo-sv-note { color: var(--bilinfo-sv-muted); }

/* "Din nuværende bil" heading with the "Brændstofbiler" badge on the right. */
.bilinfo-sv-usage-head-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	flex-wrap: wrap;
}
.bilinfo-sv-usage-head-row .bilinfo-sv-sect-lbl { margin: 0; }
.bilinfo-sv-fuel-badge {
	display: inline-flex;
	align-items: center;
	background: var(--bilinfo-sv-icon-bg);
	color: var(--bilinfo-sv-primary);
	border-radius: 9999px;
	padding: 0.3rem 0.85rem;
	font-size: 0.75rem;
	font-weight: 600;
	white-space: nowrap;
}

/* Mini boxes: two per row, the third (price) spans the full width. */
.bilinfo-sv-mini-grid > .bilinfo-sv-mini-box:last-child { grid-column: 1 / -1; }

/* Besparelse tab accent (Emil's request) — only the .saving-green tab, not the other three. */
.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs .bilinfo-dp-tab.saving-green.active,
.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs .bilinfo-dp-tab.saving-green:hover {
	background-color: #1f7a4d;
	border-color: #1f7a4d;
	color: #fff;
}

/* Detail tabs: four tabs must scroll sideways on narrow screens instead of squeezing. */
.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs {overflow-x: auto;scrollbar-width: none;-webkit-overflow-scrolling: touch;}
.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs::-webkit-scrollbar { display: none; }
.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs .bilinfo-dp-tab {width: auto;flex: 1 0 auto;white-space: nowrap;}
@media (max-width: 767px) {
	.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs { gap: 8px; }
	.bilinfo-dp-tabs-wrap .bilinfo-dp-tabs .bilinfo-dp-tab { padding: 10px 16px; font-size: 1rem; }
}

/* Car-savings icon next to the sidebar title (only loaded when the tab shows, same condition). */
.bilinfo-dp-title-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.bilinfo-dp-title-row .bilinfo-dp-title { margin: 0; }
/* Starting point — 58x58, adjust once it's visible on the page. */
.bilinfo-dp-savings-icon-wrap {
	width: 58px;
	height: 58px;
	border-radius: 50%;
	background: #F2F4F6;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.bilinfo-dp-savings-icon { display: block; }