/* Calculator pensii — design consistent cu calculatoarele de salarii (WCAG 2.2 AA).
   NOTĂ: clasele .csr-* replică sistemul de design comun; de consolidat într-un CSS
   partajat în bit-core (datorie tehnică). Specificul pensiilor folosește .cpr-*. */

.csr-sr-only {
	position: absolute !important;
	width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

.csr-calc {
	--csr-fg: #1a1a1a;
	--csr-accent: #0b4f9c;
	--csr-accent-fg: #ffffff;
	--csr-border: #5a5a5a;
	--csr-soft: #f2f5f9;
	--csr-strong: #073a73;
	--csr-warn-bg: #fff4e5;
	--csr-warn-border: #8a5300;
	max-width: 720px;
	margin: 0 auto 2rem;
	color: var(--csr-fg);
	font-size: 1rem;
	line-height: 1.5;
}
.csr-calc *, .csr-calc *::before, .csr-calc *::after { box-sizing: border-box; }

.csr-title { font-size: 1.5rem; margin: 0 0 .25rem; }
.csr-subtitle { margin: 0 0 1.25rem; color: #333; }

.csr-form fieldset {
	border: 1px solid var(--csr-border);
	border-radius: 8px;
	padding: 1rem 1rem .5rem;
	margin: 0 0 1rem;
}
.csr-form legend { font-weight: 700; padding: 0 .4rem; }

.csr-field { margin-bottom: .85rem; }
.csr-field > label { display: block; font-weight: 600; margin-bottom: .3rem; }
.csr-field input[type="number"],
.csr-field input[type="date"],
.csr-field select {
	width: 100%;
	min-height: 44px;
	padding: .5rem .6rem;
	font-size: 1rem;
	color: var(--csr-fg);
	background: #ffffff;
	border: 1px solid var(--csr-border);
	border-radius: 6px;
}
.csr-field--check { display: flex; align-items: flex-start; gap: .5rem; }
.csr-field--check input[type="checkbox"],
.csr-field--check input[type="radio"] { width: 22px; height: 22px; margin-top: .15rem; flex: 0 0 auto; }
.csr-field--check label { font-weight: 600; }
.csr-help { margin: .25rem 0 0; font-size: .875rem; color: #444; }

.csr-note, .csr-disclaimer {
	font-size: .9rem; color: #333; background: var(--csr-soft);
	border-radius: 6px; padding: .6rem .8rem;
}

.csr-actions { margin: .5rem 0 1rem; display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.csr-btn {
	display: inline-block; min-height: 44px; min-width: 44px;
	padding: .6rem 1.4rem; font-size: 1.05rem; font-weight: 700;
	color: var(--csr-accent-fg); background: var(--csr-accent);
	border: 2px solid var(--csr-strong); border-radius: 6px; cursor: pointer;
}
.csr-btn:hover { background: var(--csr-strong); }
.csr-btn-link {
	background: none; border: 0; padding: .4rem; color: var(--csr-accent);
	font-weight: 600; text-decoration: underline; cursor: pointer; min-height: 44px;
}
.csr-btn-link:hover { color: var(--csr-strong); }
.csr-btn-link[disabled] { color: #1a6e37; text-decoration: none; cursor: default; }

.csr-calc :focus-visible { outline: 3px solid #c2410c; outline-offset: 2px; }

.csr-result {
	border: 2px solid var(--csr-accent); border-radius: 8px;
	padding: 1rem 1.1rem; background: var(--csr-soft); margin: 0 0 1.5rem;
}
.csr-result h3 { margin: 0 0 .6rem; font-size: 1.2rem; }

/* Sumar */
.csr-summary { margin: 0 0 1rem; }
.csr-summary-primary { margin: 0 0 .9rem; }
.csr-summary-label { margin: 0; font-size: .95rem; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: #333; }
.csr-summary-value { margin: .1rem 0 0; font-size: 2.2rem; line-height: 1.1; font-weight: 800; }
.csr-tone-net { color: #1a6e37; }
.csr-tone-cost { color: #073a73; }
.csr-tone-neg { color: #b42318; }
.csr-summary-sub { margin: .15rem 0 0; color: #50575e; font-size: .95rem; }

.csr-metrics { list-style: none; margin: 0; padding: 0; border-top: 1px solid #cdd9e6; }
.csr-metric { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid #cdd9e6; }
.csr-metric-label { color: #2a2a2a; }
.csr-metric-value { font-weight: 700; color: #1a1a1a; text-align: right; }

.csr-lead-note { margin: .6rem 0; padding: .6rem .8rem; background: #eaf4ee; border-left: 4px solid #1a6e37; border-radius: 4px; }
.csr-lead-note strong { color: #155026; }

/* Bloc evidențiat — pensionare pentru deficiență de vedere gravă (imediat sub data standard) */
.csr-summary-visual { margin: 0 0 1rem; padding: .8rem 1rem; background: #eaf4ee; border-left: 5px solid #1a6e37; border-radius: 6px; }
.csr-summary-visual .csr-summary-label { color: #155026; }
.csr-summary-visual .csr-summary-value { font-size: 1.9rem; }
.csr-summary-visual-note { margin: .35rem 0 0; color: #1f2d25; line-height: 1.5; }
.csr-summary-visual-note strong { color: #155026; }

/* Detalii (tabel scenarii) */
.csr-detail { margin-top: .5rem; }
.csr-detail-toggle { cursor: pointer; font-weight: 700; color: var(--csr-accent); padding: .4rem 0; }
.csr-detail-toggle:hover { color: var(--csr-strong); }
.csr-detail-body { margin-top: .25rem; }

/* Container derulabil orizontal pentru tabel (evită overflow-ul paginii pe mobil). */
.csr-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.csr-table-scroll:focus-visible { outline: 3px solid #c2410c; outline-offset: 2px; }

.csr-table { width: 100%; border-collapse: collapse; margin: .5rem 0; background: #ffffff; }
.csr-table caption { text-align: left; font-weight: 700; padding: .4rem 0; }
.csr-table th, .csr-table td { text-align: left; padding: .55rem .6rem; border-bottom: 1px solid #d0d0d0; vertical-align: top; }
.csr-table thead th { border-bottom: 2px solid var(--csr-border); }
.csr-row-strong th, .csr-row-strong td { font-weight: 700; background: #e6eef8; color: var(--csr-strong); }
.csr-row-note td { font-size: .9rem; color: #444; background: #fafbfc; }

.csr-warn {
	margin: .8rem 0 0; padding: .7rem .9rem; background: var(--csr-warn-bg);
	border-left: 4px solid var(--csr-warn-border); border-radius: 4px; color: #4a2e00;
}

/* Specific pensii */
.cpr-pair { display: grid; grid-template-columns: 2fr 1fr; gap: .8rem; align-items: start; }
.cpr-radioset { padding: .8rem 1rem .4rem; }
.cpr-advanced > summary { cursor: pointer; font-weight: 700; color: var(--csr-accent); padding: .5rem 0; margin-bottom: .5rem; }
.cpr-advanced > summary:hover { color: var(--csr-strong); }
.cpr-autofill-note {
	margin: 0 0 1rem; padding: .55rem .8rem; background: #eef6ff;
	border-left: 4px solid #0b4f9c; border-radius: 4px; font-size: .92rem; color: #15324f;
}

/* Desktop: formular stânga, rezultat dreapta (sticky). */
@media (min-width: 880px) {
	.csr-calc {
		max-width: 980px; display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: 2rem; align-items: start;
	}
	.csr-title, .csr-subtitle { grid-column: 1 / -1; }
	.cpr-form { grid-column: 1; margin: 0; }
	.csr-result { grid-column: 2; position: sticky; top: 1rem; margin: 0; }
}

@media (max-width: 768px) {
	.csr-title { font-size: 1.3rem; }
	.csr-btn { width: 100%; }
	.csr-summary-value { font-size: 1.8rem; }
	.cpr-pair { grid-template-columns: 1fr; }

	/* Tabel mai compact + container cu bordură (semnal vizual că se poate derula). */
	.csr-table-scroll { border: 1px solid #cdd9e6; border-radius: 6px; }
	.csr-table { font-size: .9rem; margin: 0; }
	.csr-table th, .csr-table td { padding: .4rem .45rem; }
	.csr-table caption { padding: .4rem .45rem; }

	/* Textul lung se rupe, nu împinge layout-ul. */
	.csr-warn, .csr-disclaimer, .csr-lead-note, .csr-row-note td, .csr-metric-label { overflow-wrap: anywhere; }
}
