/**
 * Dayvessa — M5 Business Days Calculator page styles. Extends the shared
 * design-token system (tokens.css) and the existing component patterns
 * (dv-title-block, dv-button, dv-source-block, dv-unavailable are reused
 * unchanged from components.css) — no approved Business Days Calculator
 * Desktop/Mobile Claude Design mockup file was available in this session
 * (same situation as M2/M3/M4 — see docs/CURRENT_STATE.md); this
 * stylesheet extends the established system rather than a pixel reference.
 * Flagged for founder review before M6.
 */

/* Form */

.dv-business-days-form {
	margin: var(--dv-space-4) 0;
	background: var(--dv-color-surface);
	border: 1px solid rgba(32, 35, 32, 0.1);
	border-radius: var(--dv-radius-card);
	padding: var(--dv-space-4);
}

.dv-business-days-form h2 {
	font-family: var(--dv-font-serif);
	font-size: var(--dv-text-h3);
	color: var(--dv-color-primary);
	margin: 0 0 var(--dv-space-3);
}

.dv-business-days-form__form {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dv-space-3);
}

@media (min-width: 700px) {
	.dv-business-days-form__form {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1100px) {
	.dv-business-days-form__form {
		grid-template-columns: repeat(3, 1fr) auto;
		align-items: end;
	}
}

.dv-business-days-form__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.dv-business-days-form__field label {
	font-size: var(--dv-text-label);
	font-weight: 600;
	color: rgba(32, 35, 32, 0.72);
}

.dv-business-days-form__field select,
.dv-business-days-form__field input {
	width: 100%;
	max-width: 100%;
	font-family: inherit;
	font-size: var(--dv-text-body);
	padding: 10px 12px;
	border-radius: var(--dv-radius-control);
	border: 1px solid rgba(32, 35, 32, 0.2);
	background: var(--dv-color-warm-white);
	color: var(--dv-color-text);
}

.dv-business-days-form__toggles {
	grid-column: 1 / -1;
	display: flex;
	flex-wrap: wrap;
	gap: var(--dv-space-3);
	border: none;
	padding: 0;
	margin: 0;
}

.dv-business-days-form__toggles legend {
	font-size: var(--dv-text-label);
	font-weight: 600;
	color: rgba(32, 35, 32, 0.72);
	padding: 0;
	margin: 0 0 6px;
	width: 100%;
}

.dv-business-days-form__checkbox {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 14px;
	color: var(--dv-color-text);
}

.dv-business-days-form__submit {
	justify-self: start;
	height: fit-content;
}

/* Summary */

.dv-business-days-summary {
	margin: var(--dv-space-4) 0;
}

.dv-business-days-summary h2 {
	font-family: var(--dv-font-serif);
	font-size: var(--dv-text-h3);
	color: var(--dv-color-primary);
	margin: 0 0 var(--dv-space-2);
}

.dv-business-days-summary__partial-note {
	font-size: 13px;
	color: var(--dv-color-emphasis);
	background: rgba(232, 183, 53, 0.15);
	border: 1px solid rgba(232, 183, 53, 0.4);
	border-radius: var(--dv-radius-control);
	padding: 10px 14px;
	margin: 0 0 var(--dv-space-3);
}

.dv-business-days-summary {
	text-align: center;
}

.dv-business-days-summary__headline {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	margin: var(--dv-space-3) 0 var(--dv-space-2);
}

.dv-business-days-summary__number {
	font-family: var(--dv-font-serif);
	font-size: 72px;
	color: var(--dv-color-primary);
	line-height: 1;
}

.dv-business-days-summary__label {
	font-size: var(--dv-text-body);
	color: rgba(32, 35, 32, 0.7);
}

.dv-business-days-summary__range-note {
	font-size: 15px;
	font-weight: 600;
	color: var(--dv-color-primary);
	margin: 0;
}

.dv-business-days-summary__range-detail {
	font-size: 13px;
	color: rgba(32, 35, 32, 0.55);
	margin: 2px 0 0;
}

.dv-business-days-summary__equation {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--dv-space-3);
	margin: var(--dv-space-4) 0 0;
}

.dv-business-days-summary__equation-term {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.dv-business-days-summary__equation-number {
	font-family: var(--dv-font-serif);
	font-size: 32px;
	color: rgba(32, 35, 32, 0.35);
	line-height: 1;
}

.dv-business-days-summary__equation-term--result .dv-business-days-summary__equation-number {
	color: var(--dv-color-primary);
}

.dv-business-days-summary__equation-label {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: rgba(32, 35, 32, 0.5);
	margin-top: 4px;
}

.dv-business-days-summary__equation-op {
	font-family: var(--dv-font-serif);
	font-size: 24px;
	color: rgba(32, 35, 32, 0.3);
	padding-bottom: 20px;
}

.dv-business-days-summary__overlap-note {
	font-size: 13px;
	color: rgba(32, 35, 32, 0.65);
	font-style: italic;
	margin: var(--dv-space-3) 0 0;
}

/* Excluded days */

.dv-business-days-excluded {
	margin: var(--dv-space-5) 0;
}

.dv-business-days-excluded__cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--dv-space-3);
}

@media (min-width: 700px) {
	.dv-business-days-excluded__cards {
		grid-template-columns: repeat(2, 1fr);
	}
}

.dv-business-days-excluded__card {
	background: var(--dv-color-surface);
	border: 1px solid rgba(32, 35, 32, 0.08);
	border-radius: var(--dv-radius-card);
	padding: var(--dv-space-3) var(--dv-space-4);
}

.dv-business-days-excluded__card-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 4px;
}

.dv-business-days-excluded__card-header h3 {
	font-family: var(--dv-font-serif);
	font-size: 18px;
	color: var(--dv-color-primary);
	margin: 0;
}

.dv-business-days-excluded__card-count {
	font-size: 13px;
	font-weight: 600;
	color: rgba(32, 35, 32, 0.5);
}

.dv-business-days-excluded__card-note {
	font-size: 12px;
	color: rgba(32, 35, 32, 0.5);
	margin: 0 0 var(--dv-space-2);
}

.dv-business-days-excluded h2 {
	font-family: var(--dv-font-serif);
	font-size: var(--dv-text-h3);
	color: var(--dv-color-primary);
	margin: 0 0 var(--dv-space-3);
}

.dv-business-days-excluded__list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 280px;
	overflow-y: auto;
}

.dv-business-days-excluded__item {
	display: flex;
	justify-content: space-between;
	gap: var(--dv-space-2);
	padding: 8px 0;
	font-size: 13px;
	border-bottom: 1px solid rgba(32, 35, 32, 0.06);
}

.dv-business-days-excluded__item:last-child {
	border-bottom: none;
}

.dv-business-days-excluded__date {
	font-weight: 600;
	color: var(--dv-color-primary);
	white-space: nowrap;
}

.dv-business-days-excluded__reason {
	color: rgba(32, 35, 32, 0.65);
	text-align: right;
}