﻿.cds-login-shell {
	display: flex;
	justify-content: center;
	padding: 32px 16px;
}

.cds-login-card {
	width: min(100%, 480px);
	padding: 32px;
	border: 1px solid #d8dde6;
	border-radius: 18px;
	background: linear-gradient(180deg, #ffffff 0%, #f5f8fc 100%);
	box-shadow: 0 18px 40px rgba(24, 54, 94, 0.08);
}

.cds-login-card--dashboard {
	width: min(calc(100vw - 32px), 1120px);
	max-width: 1120px;
}

.cds-login-topbar {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 10px;
}

.cds-login-topbar__logout {
	flex: 0 0 auto;
}

.cds-login-kicker {
	margin: 0 0 10px;
	color: #1a5d8f;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.cds-login-title {
	margin: 0 0 12px;
	color: #12314a;
	font-size: 30px;
	line-height: 1.15;
}

.cds-login-copy,
.cds-login-note {
	margin: 0 0 18px;
	color: #4d6478;
	font-size: 15px;
	line-height: 1.6;
}

.cds-login-form {
	display: grid;
	gap: 16px;
}

.cds-login-label {
	display: grid;
	gap: 8px;
	color: #17374d;
	font-size: 14px;
	font-weight: 600;
}

.cds-login-label input {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid #bfd0df;
	border-radius: 12px;
	background: #ffffff;
	color: #153148;
	font-size: 15px;
}

.cds-login-label input:focus {
	outline: none;
	border-color: #1a78b0;
	box-shadow: 0 0 0 4px rgba(26, 120, 176, 0.12);
}

.cds-login-button {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	min-height: 48px;
	padding: 12px 18px;
	border: none;
	border-radius: 999px;
	background: #0f6ea8;
	color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

.cds-login-button--secondary {
	background: #e7eef5;
	color: #17374d;
}

.cds-login-actions {
	margin-top: 24px;
}

.cds-login-message {
	margin: 0 0 18px;
	padding: 12px 14px;
	border-radius: 12px;
	font-size: 14px;
	line-height: 1.5;
}

.cds-login-message a {
	font-weight: 700;
}

.cds-login-message--success {
	background: #e8f7ef;
	color: #1c6a43;
}

.cds-login-message--error {
	background: #fdebed;
	color: #9a2438;
}

.cds-login-message--warning {
	background: #fff6df;
	color: #7d5900;
}

.cds-kol-dashboard {
	margin-top: 24px;
	border: 1px solid #d7e0ea;
	border-radius: 22px;
	overflow: hidden;
	background: #eff4fb;
}

.cds-kol-dashboard__header {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 28px;
	align-items: center;
	padding: 20px 28px;
	background: linear-gradient(135deg, #4f86c8 0%, #326dad 100%);
	color: #ffffff;
}

.cds-kol-dashboard__brand {
	font-size: 24px;
	font-weight: 800;
	letter-spacing: 0.01em;
}

.cds-kol-dashboard__subtitle {
	font-size: 15px;
	font-weight: 600;
	opacity: 0.96;
}

.cds-kol-dashboard__grid {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	padding: 20px;
}

.cds-kol-column {
	display: grid;
	gap: 18px;
	min-width: 0;
	flex: 1 1 0;
}

.cds-kol-column--results {
	flex: 0 0 38%;
}

.cds-kol-panel {
	padding: 18px 20px;
	border: 1px solid #dde5ef;
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 10px 24px rgba(33, 58, 94, 0.05);
}

.cds-kol-panel--warning {
	background: #fff7e6;
	border-color: #efd7a0;
}

.cds-kol-panel--advanced {
	padding-top: 12px;
}

.cds-kol-panel__title {
	margin: 0 0 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid #e6edf5;
	color: #344b6d;
	font-size: 17px;
	font-weight: 700;
}

.cds-kol-field-grid {
	display: grid;
	gap: 12px;
}

.cds-kol-field-grid--advanced {
	margin-top: 12px;
}

.cds-kol-field {
	display: grid;
	grid-template-columns: minmax(120px, 1fr) minmax(0, 160px);
	gap: 12px;
	align-items: center;
	color: #334964;
	font-size: 15px;
	font-weight: 600;
}

.cds-kol-field input,
.cds-kol-field select,
.cds-kol-inline-input {
	width: 100%;
	min-height: 42px;
	padding: 10px 12px;
	border: 1px solid #c7d4e2;
	border-radius: 9px;
	background: #ffffff;
	color: #20384f;
	font-size: 15px;
}

.cds-kol-field input:disabled,
.cds-kol-field select:disabled,
.cds-kol-inline-input:disabled {
	background: #f0f3f7;
	color: #7a8a99;
	cursor: not-allowed;
}

.cds-kol-field__controls--cat {
	display: flex;
	gap: 10px;
	align-items: center;
}

.cds-cat-score-input {
	max-width: 110px;
}

.cds-cat-toggle-button,
.cds-cat-apply-button,
.cds-cat-close-button {
	min-height: 42px;
}

.cds-cat-apply-button:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.cds-cat-calculator {
	margin-top: 18px;
	padding: 18px;
	border: 1px solid #d7e4f1;
	border-radius: 14px;
	background: #f8fbff;
}

.cds-cat-calculator__title {
	margin: 0 0 8px;
	color: #24415d;
	font-size: 17px;
	font-weight: 700;
}

.cds-cat-calculator__copy {
	margin: 0 0 18px;
	color: #52677b;
	font-size: 14px;
	line-height: 1.6;
}

.cds-cat-calculator__body {
	display: grid;
	gap: 14px;
}

.cds-cat-question {
	padding-bottom: 14px;
	border-bottom: 1px solid #dbe5ef;
}

.cds-cat-question:last-child {
	padding-bottom: 0;
	border-bottom: none;
}

.cds-cat-question__labels {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-bottom: 10px;
	color: #334b65;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
}

.cds-cat-question__labels span:last-child {
	text-align: right;
}

.cds-cat-question__options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: center;
}

.cds-cat-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 8px;
	border: 1px solid #c7d6e6;
	border-radius: 999px;
	background: #ffffff;
	color: #2a4562;
	font-size: 13px;
	font-weight: 700;
}

.cds-cat-calculator__footer {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	align-items: center;
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid #dbe5ef;
}

.cds-cat-total {
	color: #27425e;
	font-size: 15px;
	font-weight: 700;
}

.cds-cat-total__value {
	font-size: 20px;
}

.cds-cat-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.cds-kol-status {
	margin-top: 14px;
	font-size: 15px;
	font-weight: 700;
}

.cds-kol-status--ok {
	color: #2c9c60;
}

.cds-kol-status--neutral {
	color: #5f7288;
}

.cds-kol-status--warning {
	color: #a06619;
}

.cds-kol-status--alert {
	color: #bf3046;
}

.cds-kol-choice-list {
	display: grid;
	gap: 12px;
	margin-bottom: 16px;
}

.cds-kol-choice {
	display: flex;
	gap: 10px;
	align-items: center;
	color: #344b6d;
	font-size: 15px;
	font-weight: 600;
}

.cds-kol-choice input {
	width: 20px;
	height: 20px;
}

.cds-kol-outline-button {
	min-height: 40px;
	padding: 10px 14px;
	border: 1px solid #8eb1d9;
	border-radius: 10px;
	background: #f7fbff;
	color: #2e6daa;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

.cds-kol-inline-row {
	display: flex;
	gap: 10px;
	align-items: center;
	margin-bottom: 14px;
}

.cds-kol-inline-input {
	max-width: 160px;
}

.cds-kol-inline-unit {
	color: #4a6079;
	font-size: 15px;
}

.cds-kol-check {
	display: inline-flex;
	gap: 8px;
	align-items: center;
	color: #344b6d;
	font-size: 15px;
	font-weight: 600;
}

.cds-kol-advanced-summary {
	cursor: pointer;
	color: #344b6d;
	font-size: 15px;
	font-weight: 700;
	list-style: none;
}

.cds-kol-advanced-summary::-webkit-details-marker {
	display: none;
}

.cds-kol-advanced-summary::after {
	content: '+';
	margin-left: 8px;
	font-size: 11px;
}

.cds-kol-submit-row {
	display: flex;
	justify-content: flex-end;
}

.cds-kol-submit-button {
	min-width: 240px;
}

.cds-kol-input--invalid {
	border-color: #bf3046 !important;
	background: #fff5f7 !important;
	box-shadow: 0 0 0 3px rgba(191, 48, 70, 0.12);
}

.cds-kol-field-error,
.cds-kol-inline-error {
	color: #bf3046;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
}

.cds-kol-field-error {
	grid-column: 2;
	margin-top: -4px;
}

.cds-kol-inline-error {
	margin-top: -6px;
}
.cds-kol-result-stack {
	display: grid;
	gap: 8px;
	color: #2d4361;
	font-size: 15px;
}

.cds-kol-result-strong {
	color: #182f49;
	font-size: 18px;
	font-weight: 800;
}

.cds-kol-warning-title {
	margin-bottom: 12px;
	color: #a45b1b;
	font-size: 17px;
	font-weight: 800;
}

.cds-kol-note {
	margin: 0 0 10px;
	color: #5b6d80;
	font-size: 15px;
	line-height: 1.65;
}

.cds-kol-list {
	margin: 0;
	padding-left: 20px;
	color: #324861;
	font-size: 15px;
	line-height: 1.7;
}

.cds-kol-list li + li {
	margin-top: 6px;
}

.cds-kol-list--tight {
	margin-bottom: 14px;
}

.cds-kol-tag {
	display: inline-flex;
	align-items: center;
	padding: 8px 12px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
}

.cds-kol-tag--neutral {
	background: #e7eef5;
	color: #496077;
}

.cds-kol-tag--ok {
	background: #e8f7ef;
	color: #1f7a49;
}

.cds-kol-tag--warning {
	background: #fff4df;
	color: #a06619;
}

.cds-kol-tag--alert {
	background: #fde7ea;
	color: #bf3046;
}

@media (max-width: 560px) {
	.cds-kol-dashboard__grid {
		flex-direction: column;
	}

	.cds-kol-column,
	.cds-kol-column--results {
		flex: 1 1 auto;
		width: 100%;
	}
}

@media (max-width: 600px) {
	.cds-login-card {
		padding: 24px;
		border-radius: 16px;
	}

	.cds-login-title {
		font-size: 26px;
	}

	.cds-kol-dashboard__header {
		padding: 18px 20px;
	}

	.cds-kol-dashboard__brand {
		font-size: 21px;
	}

	.cds-kol-dashboard__subtitle {
		font-size: 14px;
	}

	.cds-kol-dashboard__grid {
		padding: 16px;
		gap: 16px;
	}

	.cds-kol-field {
		grid-template-columns: 1fr;
	}

	.cds-kol-field-error {
		grid-column: 1;
	}

	.cds-kol-field__controls--cat,
	.cds-cat-calculator__footer,
	.cds-kol-inline-row {
		flex-direction: column;
		align-items: stretch;
	}

	.cds-kol-inline-input,
	.cds-kol-submit-button {
		max-width: none;
		width: 100%;
	}

	.cds-login-topbar {
		flex-direction: column;
	}
}


