/**
 * Личный кабинет DRIVE&SHIP — дизайн-система оригинального сайта.
 *
 * Палитра и пластика сняты с driveship.by: чёрные блоки с крупным скруглением,
 * кремовые карточки и поля форм, синий акцент, розовый чекбокс, pill-кнопки,
 * белый фон контента. Типографика наследует глобальные шрифты Elementor-кита
 * сайта (--e-global-typography-*), фоллбэк — Montserrat / PT Sans.
 */

:root {
	--ds-black: #0f0f0f;
	--ds-black-2: #1a1a1a;
	--ds-cream: #f8f1e1;
	--ds-cream-soft: #fbf7ec;
	--ds-cream-input: #fdfaf2;
	--ds-border: #e8dfc9;
	--ds-blue: #5868df;
	--ds-blue-dark: #4453c8;
	--ds-blue-tint: #e6e9fb;
	--ds-pink: #f0467e;
	--ds-green: #3d9a63;
	--ds-green-tint: #e3f2e8;
	--ds-amber: #c9881b;
	--ds-amber-tint: #faf0da;
	--ds-text: #161616;
	--ds-muted: #82796a;
	--ds-white-muted: rgba(255, 255, 255, 0.65);
	--ds-radius-lg: 24px;
	--ds-radius: 18px;
	--ds-radius-pill: 100px;
	--ds-font-head: var(--e-global-typography-primary-font-family, "Montserrat"), sans-serif;
	--ds-font-text: var(--e-global-typography-text-font-family, "PT Sans"), sans-serif;
}

body.ds-body {
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	background: #fff;
	color: var(--ds-text);
	font-family: var(--ds-font-text);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

body.ds-body--bare {
	background: var(--ds-black);
}

.ds-body a {
	color: var(--ds-blue);
	text-decoration: none;
	transition: color 0.2s;
}

.ds-body a:hover {
	color: var(--ds-blue-dark);
}

.ds-body h1,
.ds-body h2,
.ds-body h3,
.ds-body legend {
	font-family: var(--ds-font-head);
}

.ds-container {
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 24px;
	box-sizing: border-box;
}

.ds-main {
	flex: 1;
	padding: 28px 0 72px;
}

/* ------------------------------------------------------------------ */
/* Появление страницы                                                   */
/* ------------------------------------------------------------------ */

@keyframes ds-rise {
	from {
		opacity: 0;
		transform: translateY(14px);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.ds-page-head,
.ds-chips,
.ds-filters,
.ds-card,
.ds-empty,
.ds-creds,
.ds-auth__card {
	animation: ds-rise 0.45s cubic-bezier(0.22, 0.7, 0.3, 1) backwards;
}

.ds-chips,
.ds-filters,
.ds-creds {
	animation-delay: 0.08s;
}

.ds-card,
.ds-empty {
	animation-delay: 0.14s;
}

@media (prefers-reduced-motion: reduce) {
	.ds-page-head,
	.ds-chips,
	.ds-filters,
	.ds-card,
	.ds-empty,
	.ds-creds,
	.ds-auth__card {
		animation: none;
	}
}

/* ------------------------------------------------------------------ */
/* Шапка — как на сайте: чёрная, логотип-шестиугольник, белое меню      */
/* ------------------------------------------------------------------ */

.ds-header {
	background: var(--ds-black);
	color: #fff;
}

.ds-header__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 16px 24px;
	display: flex;
	align-items: center;
	gap: 34px;
}

.ds-logo {
	display: inline-flex;
	align-items: center;
	gap: 11px;
	color: inherit !important;
	flex: none;
}

.ds-logo__mark {
	display: inline-flex;
	flex: none;
}

.ds-logo__text {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.ds-logo__text strong {
	font-family: var(--ds-font-head);
	font-weight: 700;
	font-size: 15px;
	letter-spacing: 0.22em;
	color: #fff;
}

.ds-logo__text small {
	font-size: 9px;
	font-weight: 400;
	letter-spacing: 0.26em;
	text-transform: uppercase;
	color: var(--ds-white-muted);
}

.ds-nav {
	display: flex;
	align-items: center;
	gap: 26px;
	flex-wrap: wrap;
}

.ds-nav__link {
	color: #fff !important;
	font-size: 15.5px;
	line-height: 1.3;
	border-bottom: 1px solid transparent;
	padding-bottom: 1px;
	transition: color 0.2s;
}

.ds-nav__link:hover {
	color: #aab4f5 !important;
}

.ds-nav__link.is-active {
	color: #7d8cf0 !important;
}

.ds-nav__link--site {
	color: var(--ds-white-muted) !important;
}

.ds-nav__link--site:hover {
	color: #fff !important;
}

.ds-header__side {
	margin-left: auto;
	display: flex;
	align-items: center;
	gap: 18px;
	flex: none;
}

.ds-user {
	display: flex;
	flex-direction: column;
	text-align: right;
	line-height: 1.3;
}

.ds-user__name {
	font-size: 14.5px;
	font-weight: 700;
}

.ds-user__role {
	font-size: 12px;
	color: var(--ds-white-muted);
}

.ds-nav-toggle {
	display: none;
	background: none;
	border: 0;
	padding: 8px;
	cursor: pointer;
	order: 3;
}

.ds-nav-toggle span {
	display: block;
	width: 24px;
	height: 2px;
	background: #fff;
	margin: 5px 0;
	border-radius: 2px;
}

/* ------------------------------------------------------------------ */
/* Кнопки — pill, как «Оставить заявку» на сайте                        */
/* ------------------------------------------------------------------ */

.ds-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 13px 30px;
	border-radius: var(--ds-radius-pill);
	border: 1px solid transparent;
	font-family: var(--ds-font-text);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	cursor: pointer;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
	white-space: nowrap;
	text-decoration: none !important;
}

.ds-btn--primary {
	background: var(--ds-blue);
	color: #fff !important;
}

.ds-btn--primary:hover {
	background: var(--ds-blue-dark);
	color: #fff !important;
}

/* Прозрачная с белой обводкой — стиль «Оставить заявку» в шапке сайта */
.ds-btn--outline-light {
	background: transparent;
	border-color: #fff;
	color: #fff !important;
	font-weight: 400;
}

.ds-btn--outline-light:hover {
	background: #fff;
	color: var(--ds-black) !important;
}

.ds-btn--dark {
	background: var(--ds-black);
	color: #fff !important;
}

.ds-btn--dark:hover {
	background: #2c2c2c;
	color: #fff !important;
}

.ds-btn--success {
	background: var(--ds-green);
	color: #fff !important;
}

.ds-btn--success:hover {
	background: #2f7d4f;
	color: #fff !important;
}

.ds-btn--ghost-dark {
	background: transparent;
	border-color: #d9cfb6;
	color: var(--ds-text) !important;
	font-weight: 400;
}

.ds-btn--ghost-dark:hover {
	border-color: var(--ds-black);
	color: var(--ds-black) !important;
}

.ds-btn--ghost-danger {
	background: transparent;
	border-color: #f3c5d6;
	color: var(--ds-pink) !important;
	font-weight: 400;
}

.ds-btn--ghost-danger:hover {
	border-color: var(--ds-pink);
	color: var(--ds-pink) !important;
}

.ds-btn--sm {
	padding: 8px 18px;
	font-size: 13.5px;
}

.ds-btn--block {
	width: 100%;
}

.ds-icon-btn {
	width: 30px;
	height: 30px;
	flex: none;
	border: 1px solid #d9cfb6;
	border-radius: 50%;
	background: transparent;
	color: var(--ds-muted);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: 0.2s;
}

.ds-icon-btn:hover {
	border-color: var(--ds-pink);
	color: var(--ds-pink);
}

/* ------------------------------------------------------------------ */
/* Тёмная плашка-герой страницы — как hero-блоки сайта                  */
/* ------------------------------------------------------------------ */

.ds-page-head {
	background: var(--ds-black);
	border-radius: var(--ds-radius-lg);
	padding: 30px 36px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	flex-wrap: wrap;
	margin: 0 0 26px;
}

.ds-title {
	margin: 0;
	color: #fff;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.2;
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.ds-page-head__actions {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

/* Тёмные кнопки внутри тёмной плашки превращаются в светлую обводку */
.ds-page-head .ds-btn--dark {
	background: transparent;
	border-color: #fff;
}

.ds-page-head .ds-btn--dark:hover {
	background: #fff;
	color: var(--ds-black) !important;
}

.ds-back {
	display: inline-block;
	margin-bottom: 12px;
	color: var(--ds-muted) !important;
	font-size: 13.5px;
}

.ds-back:hover {
	color: var(--ds-text) !important;
}

/* ------------------------------------------------------------------ */
/* Карточки                                                             */
/* ------------------------------------------------------------------ */

.ds-card {
	background: var(--ds-cream);
	border-radius: var(--ds-radius-lg);
	padding: 30px 32px;
	box-sizing: border-box;
}

.ds-card__title {
	margin: 0 0 20px;
	font-size: 21px;
	font-weight: 700;
}

.ds-card--table {
	padding: 8px 0;
	background: var(--ds-cream-soft);
	overflow-x: auto;
}

.ds-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 26px;
	align-items: start;
}

.ds-muted {
	color: var(--ds-muted);
}

.ds-empty {
	background: var(--ds-cream);
	border-radius: var(--ds-radius-lg);
	padding: 56px 32px;
	text-align: center;
	color: var(--ds-muted);
}

.ds-empty .ds-btn {
	margin-top: 12px;
}

.ds-empty .ds-title {
	justify-content: center;
	color: var(--ds-text);
}

/* ------------------------------------------------------------------ */
/* Алерты и статусы                                                     */
/* ------------------------------------------------------------------ */

.ds-alert {
	padding: 15px 22px;
	border-radius: var(--ds-radius);
	margin-bottom: 22px;
	font-size: 15px;
}

.ds-alert--success {
	background: var(--ds-green-tint);
	color: #1f6b41;
}

.ds-alert--error {
	background: #fce9f0;
	color: #b3265b;
}

.ds-badge {
	display: inline-block;
	padding: 6px 16px;
	border-radius: var(--ds-radius-pill);
	font-family: var(--ds-font-text);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	white-space: nowrap;
}

.ds-badge--new {
	background: var(--ds-blue-tint);
	color: #3a48ad;
}

.ds-badge--transit {
	background: var(--ds-amber-tint);
	color: #8f5e07;
}

.ds-badge--done {
	background: var(--ds-green-tint);
	color: #1f6b41;
}

.ds-badge--cancelled {
	background: #eee9dc;
	color: var(--ds-muted);
}

/* Чипы-фильтры по статусам */

.ds-chips {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 18px;
}

.ds-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 20px;
	border: 1px solid var(--ds-border);
	border-radius: var(--ds-radius-pill);
	background: #fff;
	color: var(--ds-text) !important;
	font-size: 14px;
	transition: 0.2s;
}

.ds-chip:hover {
	border-color: var(--ds-blue);
	color: var(--ds-blue) !important;
}

.ds-chip.is-active {
	background: var(--ds-blue);
	border-color: var(--ds-blue);
	color: #fff !important;
}

.ds-chip__count {
	opacity: 0.6;
}

/* ------------------------------------------------------------------ */
/* Формы — кремовые поля, как в форме «Оставить заявку»                 */
/* ------------------------------------------------------------------ */

.ds-input {
	width: 100%;
	box-sizing: border-box;
	padding: 13px 20px;
	border: 1px solid var(--ds-border);
	border-radius: var(--ds-radius);
	background: var(--ds-cream-input);
	color: var(--ds-text);
	font-size: 15px;
	font-family: var(--ds-font-text);
	transition: border-color 0.2s;
}

.ds-input::placeholder {
	color: #a89e8b;
}

.ds-input:focus {
	outline: none;
	border-color: var(--ds-blue);
}

.ds-input--sm {
	width: auto;
	padding: 9px 16px;
	font-size: 14px;
}

textarea.ds-input {
	resize: vertical;
}

select.ds-input {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2382796a' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 18px center;
	padding-right: 42px;
}

.ds-field {
	display: block;
	margin-bottom: 16px;
}

.ds-field__label {
	display: block;
	font-size: 13px;
	font-weight: 700;
	margin-bottom: 7px;
	color: #4f483b;
}

.ds-field__hint {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	color: var(--ds-muted);
	font-weight: 400;
}

.ds-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 24px;
}

.ds-form__actions {
	display: flex;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.ds-form--narrow {
	max-width: 580px;
}

.ds-check {
	display: flex;
	align-items: center;
	gap: 9px;
	font-size: 14px;
	margin-bottom: 20px;
	cursor: pointer;
}

/* Чекбокс с розовым акцентом — как в форме заявки на сайте */
.ds-check input {
	accent-color: var(--ds-pink);
	width: 16px;
	height: 16px;
}

.ds-status-form {
	display: flex;
	align-items: center;
	gap: 10px;
}

/* Фильтры списка заказов */

.ds-filters {
	display: flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	margin-bottom: 22px;
}

.ds-filters .ds-input {
	width: auto;
	min-width: 190px;
}

.ds-filters__search {
	flex: 1;
	min-width: 230px !important;
}

.ds-filters__reset {
	font-size: 14px;
	color: var(--ds-muted) !important;
}

.ds-filters__reset:hover {
	color: var(--ds-text) !important;
}

/* ------------------------------------------------------------------ */
/* Таблицы                                                              */
/* ------------------------------------------------------------------ */

.ds-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.ds-table th {
	text-align: left;
	padding: 16px 20px;
	font-family: var(--ds-font-head);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ds-muted);
	border-bottom: 1px solid var(--ds-border);
	white-space: nowrap;
}

.ds-table td {
	padding: 15px 20px;
	border-bottom: 1px solid #f1ead8;
	vertical-align: middle;
}

.ds-table tbody tr:last-child td {
	border-bottom: 0;
}

.ds-table__row {
	cursor: pointer;
	transition: background 0.15s;
}

.ds-table__row:hover {
	background: #f6efdd;
}

.ds-table__num {
	font-weight: 700;
	display: block;
}

.ds-table td small {
	display: block;
	font-size: 12.5px;
}

.ds-table__actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	align-items: center;
}

.ds-route__arrow {
	color: var(--ds-blue);
}

.ds-pagination {
	display: flex;
	gap: 8px;
	margin-top: 24px;
	flex-wrap: wrap;
}

.ds-pagination__item {
	min-width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	border: 1px solid var(--ds-border);
	background: #fff;
	color: var(--ds-text) !important;
	font-size: 14px;
	transition: 0.2s;
}

.ds-pagination__item:hover {
	border-color: var(--ds-blue);
	color: var(--ds-blue) !important;
}

.ds-pagination__item.is-active {
	background: var(--ds-blue);
	border-color: var(--ds-blue);
	color: #fff !important;
}

/* ------------------------------------------------------------------ */
/* Карточка заказа: свойства и маршрут                                  */
/* ------------------------------------------------------------------ */

.ds-props {
	margin: 0;
}

.ds-props__row {
	display: grid;
	grid-template-columns: 155px 1fr;
	gap: 14px;
	padding: 11px 0;
	border-bottom: 1px solid #efe7d1;
}

.ds-props__row:last-child {
	border-bottom: 0;
}

.ds-props dt {
	color: var(--ds-muted);
	font-size: 14px;
}

.ds-props dd {
	margin: 0;
	font-weight: 700;
}

.ds-props dd a {
	display: block;
	font-weight: 400;
	font-size: 14px;
}

/* Маршрут: вехи-шестиугольники в духе логотипа */

.ds-timeline {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ds-timeline__item {
	position: relative;
	display: flex;
	gap: 16px;
	padding: 0 0 24px;
	align-items: flex-start;
}

.ds-timeline__item::before {
	content: "";
	position: absolute;
	left: 7px;
	top: 20px;
	bottom: -2px;
	width: 2px;
	background: #e3d9c0;
}

.ds-timeline__item:last-child::before {
	display: none;
}

.ds-timeline__point {
	width: 16px;
	height: 18px;
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
	background: var(--ds-blue);
	flex: none;
	margin-top: 3px;
	position: relative;
	z-index: 1;
}

.ds-timeline__item--start .ds-timeline__point {
	background: var(--ds-black);
}

.ds-timeline__item--end .ds-timeline__point {
	background: #c9bda0;
}

.ds-timeline__item--end.is-done .ds-timeline__point {
	background: var(--ds-green);
}

.ds-timeline__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1;
}

.ds-timeline__body small {
	font-size: 12.5px;
}

.ds-timeline__item form {
	margin-left: auto;
}

/* Форма добавления точки */

.ds-point-form {
	margin-top: 20px;
	padding-top: 20px;
	border-top: 1px dashed #d8cdaf;
}

.ds-point-form__title {
	margin: 0 0 14px;
	font-size: 16px;
	font-weight: 700;
}

.ds-point-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 16px;
}

/* Repeater точек в форме заказа */

.ds-points {
	border: 1px dashed #d8cdaf;
	border-radius: var(--ds-radius);
	padding: 20px;
	margin: 8px 0 4px;
}

.ds-points__title {
	font-weight: 700;
	font-size: 15px;
	padding: 0 8px;
}

.ds-points__row {
	display: grid;
	grid-template-columns: 1.4fr 1.4fr 1fr 30px;
	gap: 10px;
	align-items: center;
	margin-bottom: 10px;
}

.ds-points [data-ds-point-add] {
	margin-top: 8px;
}

.ds-danger-zone {
	margin-top: 28px;
	text-align: right;
}

/* ------------------------------------------------------------------ */
/* Действия водителя и файлы заказа                                     */
/* ------------------------------------------------------------------ */

.ds-driver-actions,
.ds-files-card {
	margin-bottom: 26px;
}

.ds-panel {
	margin-bottom: 10px;
}

.ds-panel__summary {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	box-sizing: border-box;
	padding: 14px 20px;
	background: #fff;
	border: 1px solid var(--ds-border);
	border-radius: var(--ds-radius);
	font-family: var(--ds-font-text);
	font-size: 15px;
	font-weight: 700;
	color: var(--ds-text);
	cursor: pointer;
	list-style: none;
	transition: border-color 0.2s;
}

.ds-panel__summary::-webkit-details-marker {
	display: none;
}

.ds-panel__summary:hover,
.ds-panel[open] .ds-panel__summary {
	border-color: var(--ds-blue);
}

.ds-panel__summary span {
	font-size: 18px;
	flex: none;
}

.ds-panel__summary--btn:disabled {
	opacity: 0.65;
	cursor: wait;
}

.ds-panel__summary--sm {
	padding: 9px 16px;
	font-size: 13.5px;
	font-weight: 400;
	width: auto;
	display: inline-flex;
	border-radius: var(--ds-radius-pill);
}

.ds-panel__body {
	padding: 16px 6px 6px;
}

.ds-panel__text {
	line-height: 1.65;
}

.ds-panel--geo {
	margin-bottom: 10px;
}

.ds-upload {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.ds-upload__input {
	width: 100%;
	box-sizing: border-box;
	padding: 12px;
	border: 1px dashed #c9bda0;
	border-radius: var(--ds-radius);
	background: var(--ds-cream-input);
	font-family: var(--ds-font-text);
	font-size: 14px;
}

.ds-files-group {
	margin-bottom: 22px;
}

.ds-files-group:last-child {
	margin-bottom: 0;
}

.ds-files-group__title {
	margin: 0 0 12px;
	font-size: 16px;
	font-weight: 700;
}

.ds-files-group__empty {
	margin: 0 0 10px;
	font-size: 14px;
}

.ds-files {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 12px;
}

.ds-file {
	position: relative;
}

.ds-file__thumb {
	display: block;
	width: 112px;
	height: 112px;
	border-radius: 14px;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--ds-border);
}

.ds-file__thumb img,
.ds-file__thumb video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ds-file__thumb--video {
	position: relative;
}

.ds-file__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 28px;
	color: #fff;
	background: rgba(0, 0, 0, 0.32);
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
	pointer-events: none;
}

.ds-file__doc {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px;
	background: #fff;
	border: 1px solid var(--ds-border);
	border-radius: var(--ds-radius-pill);
	font-size: 14px;
	color: var(--ds-text) !important;
	max-width: 280px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ds-file__doc:hover {
	border-color: var(--ds-blue);
	color: var(--ds-blue) !important;
}

.ds-file__delete {
	position: absolute;
	top: -8px;
	right: -8px;
}

.ds-file__delete .ds-icon-btn {
	background: #fff;
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.18);
}

.ds-timeline__map {
	font-size: 13.5px;
}

/* Блок «Узнать местоположение груза» */

.ds-locate {
	margin-bottom: 22px;
}

.ds-locate .ds-panel__body {
	padding: 16px 0 4px;
}

.ds-locate__status {
	margin: 0 0 14px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.ds-locate__status .ds-muted {
	font-size: 14px;
}

.ds-locate__map {
	width: 100%;
	height: 340px;
	border: 0;
	border-radius: var(--ds-radius);
	display: block;
	margin-bottom: 12px;
	background: var(--ds-cream-soft);
}

.ds-locate__link {
	font-size: 14.5px;
	font-weight: 700;
}

.ds-panel__subtitle {
	margin: 16px 0 6px;
	font-size: 14.5px;
	font-weight: 700;
}

@media (max-width: 800px) {
	.ds-locate__map {
		height: 260px;
	}
}

/* ------------------------------------------------------------------ */
/* Учётные данные (показ один раз) — чёрная карточка                    */
/* ------------------------------------------------------------------ */

.ds-creds {
	background: var(--ds-black);
	color: #fff;
	border-radius: var(--ds-radius-lg);
	padding: 28px 32px;
	margin-bottom: 26px;
}

.ds-creds__title {
	margin: 0 0 6px;
	font-size: 19px;
	color: #fff;
}

.ds-creds__warn {
	margin: 0 0 18px;
	font-size: 14px;
	color: #f3b1c9;
}

.ds-creds__grid {
	display: grid;
	gap: 12px;
}

.ds-creds__item {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}

.ds-creds__item > span {
	width: 140px;
	flex: none;
	font-size: 13px;
	color: var(--ds-white-muted);
}

.ds-creds__item code {
	background: rgba(255, 255, 255, 0.1);
	padding: 7px 16px;
	border-radius: 10px;
	font-size: 15px;
	word-break: break-all;
}

.ds-creds .ds-btn--ghost-dark {
	border-color: rgba(255, 255, 255, 0.4);
	color: #fff !important;
}

.ds-creds .ds-btn--ghost-dark:hover {
	border-color: #fff;
	color: #fff !important;
}

/* ------------------------------------------------------------------ */
/* Вход                                                                 */
/* ------------------------------------------------------------------ */

.ds-auth {
	min-height: calc(100vh - 80px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 36px 0;
}

.ds-auth__card {
	width: 100%;
	max-width: 430px;
	background: var(--ds-cream);
	border-radius: var(--ds-radius-lg);
	padding: 44px 40px;
	text-align: center;
}

.ds-logo--auth {
	justify-content: center;
	margin-bottom: 26px;
}

.ds-logo--auth .ds-logo__text strong {
	color: var(--ds-text);
}

.ds-logo--auth .ds-logo__text small {
	color: var(--ds-muted);
}

.ds-auth__title {
	margin: 0 0 26px;
	font-size: 25px;
}

.ds-auth__card .ds-form {
	text-align: left;
}

.ds-auth__hint {
	margin: 24px 0 10px;
	font-size: 14px;
	color: var(--ds-muted);
}

.ds-auth__back {
	font-size: 14px;
	color: var(--ds-muted) !important;
}

.ds-auth__back:hover {
	color: var(--ds-text) !important;
}

/* ------------------------------------------------------------------ */
/* Подвал — как на сайте: чёрный, 4 колонки, нижняя строка              */
/* ------------------------------------------------------------------ */

.ds-footer {
	background: var(--ds-black);
	color: #fff;
	margin-top: auto;
	font-size: 15px;
}

.ds-footer__grid {
	display: grid;
	grid-template-columns: 1.3fr 1fr 1fr auto;
	gap: 40px;
	padding: 52px 0 40px;
}

.ds-footer__col {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 13px;
}

.ds-footer__col a {
	color: #fff !important;
	transition: color 0.2s;
}

.ds-footer__col a:hover {
	color: #7d8cf0 !important;
}

.ds-footer__contacts span {
	color: var(--ds-white-muted);
}

.ds-social {
	display: flex;
	gap: 14px;
	margin-top: 6px;
}

.ds-social__link {
	color: #fff !important;
	display: inline-flex;
}

.ds-social__link:hover {
	color: #7d8cf0 !important;
}

.ds-footer__brand {
	justify-self: end;
}

.ds-footer__bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding: 20px 0 26px;
	color: var(--ds-white-muted);
	font-size: 14px;
}

.ds-footer__legal {
	display: flex;
	gap: 28px;
	flex-wrap: wrap;
}

.ds-footer__legal a {
	color: var(--ds-white-muted) !important;
}

.ds-footer__legal a:hover {
	color: #fff !important;
}

/* ------------------------------------------------------------------ */
/* Адаптивность                                                         */
/* ------------------------------------------------------------------ */

@media (max-width: 1080px) {
	.ds-footer__grid {
		grid-template-columns: 1fr 1fr;
	}

	.ds-footer__brand {
		justify-self: start;
	}
}

@media (max-width: 920px) {
	.ds-grid,
	.ds-form__grid,
	.ds-point-form__grid {
		grid-template-columns: 1fr;
	}

	.ds-points__row {
		grid-template-columns: 1fr 30px;
	}

	.ds-points__row .ds-input[type="datetime-local"] {
		grid-column: 1 / -1;
	}
}

@media (max-width: 800px) {
	.ds-nav-toggle {
		display: block;
		order: 0;
		margin-left: auto;
	}

	.ds-header__inner {
		flex-wrap: wrap;
		gap: 14px;
	}

	.ds-header__side {
		margin-left: 0;
		order: 1;
	}

	.ds-user {
		display: none;
	}

	.ds-nav {
		display: none;
		order: 4;
		width: 100%;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		padding: 8px 0 12px;
		border-top: 1px solid rgba(255, 255, 255, 0.12);
	}

	.ds-nav.is-open {
		display: flex;
	}

	.ds-nav__link {
		padding: 12px 4px;
	}

	.ds-page-head {
		padding: 24px;
	}

	.ds-title {
		font-size: 26px;
	}

	.ds-card {
		padding: 24px 20px;
	}

	/* Таблицы превращаются в карточки */
	.ds-table thead {
		display: none;
	}

	.ds-table,
	.ds-table tbody,
	.ds-table tr,
	.ds-table td {
		display: block;
		width: 100%;
		box-sizing: border-box;
	}

	.ds-table tr {
		border-bottom: 1px solid var(--ds-border);
		padding: 12px 6px;
	}

	.ds-table tr:last-child {
		border-bottom: 0;
	}

	.ds-table td {
		border: 0;
		padding: 6px 14px;
		display: flex;
		gap: 10px;
		align-items: baseline;
		flex-wrap: wrap;
	}

	.ds-table td::before {
		content: attr(data-label);
		flex: none;
		width: 98px;
		font-family: var(--ds-font-head);
		font-size: 10.5px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.08em;
		color: var(--ds-muted);
	}

	.ds-table td small {
		display: inline;
	}

	.ds-props__row {
		grid-template-columns: 1fr;
		gap: 2px;
	}

	.ds-auth__card {
		padding: 32px 24px;
	}

	.ds-footer__grid {
		grid-template-columns: 1fr;
		gap: 30px;
		padding: 40px 0 30px;
	}
}

/* ------------------------------------------------------------------ */
/* Финансы: сводка, оплаты, отчёт                                       */
/* ------------------------------------------------------------------ */

.ds-summary {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin-bottom: 26px;
}

.ds-summary__item {
	background: var(--ds-cream);
	border-radius: var(--ds-radius);
	padding: 20px 24px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.ds-summary__label {
	font-size: 13px;
	color: var(--ds-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.ds-summary__value {
	font-family: var(--ds-font-head);
	font-size: 28px;
	font-weight: 700;
}

.ds-summary__value--paid {
	color: var(--ds-green);
}

.ds-summary__item--accent {
	background: var(--ds-black);
	color: #fff;
}

.ds-summary__item--accent .ds-summary__label {
	color: rgba(255, 255, 255, 0.6);
}

.ds-summary__item--accent.is-debt .ds-summary__value {
	color: #ff8f8f;
}

.ds-card__subtitle {
	margin: 26px 0 14px;
	font-size: 16px;
	font-weight: 700;
}

.ds-form-wrap {
	max-width: 720px;
}

/* Список оплат */

.ds-paylist {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ds-paylist__item {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 2px 12px;
	align-items: center;
	padding: 12px 0;
	border-bottom: 1px solid #efe7d1;
}

.ds-paylist__item:last-child {
	border-bottom: 0;
}

.ds-paylist__main {
	display: flex;
	align-items: baseline;
	gap: 10px;
}

.ds-paylist__main strong {
	font-size: 17px;
}

.ds-paylist__comment {
	grid-column: 1;
	font-size: 14px;
	color: var(--ds-muted);
}

.ds-paylist__del {
	grid-column: 2;
	grid-row: 1 / span 2;
}

.ds-field--inline {
	margin-bottom: 0;
}

/* Отчёт */

.ds-report {
	background: #fff;
	border: 1px solid var(--ds-border);
	border-radius: var(--ds-radius);
	padding: 28px 30px;
}

.ds-report__head {
	border-bottom: 2px solid var(--ds-black);
	padding-bottom: 14px;
	margin-bottom: 22px;
}

.ds-report__title {
	margin: 0 0 4px;
	font-size: 22px;
}

.ds-report__period {
	margin: 0;
	color: var(--ds-muted);
	font-size: 14px;
}

.ds-report__client {
	margin-bottom: 30px;
}

.ds-report__client-name {
	font-size: 18px;
	margin: 0 0 10px;
	display: flex;
	gap: 12px;
	align-items: baseline;
	flex-wrap: wrap;
}

.ds-report__client-name .ds-muted {
	font-size: 14px;
	font-weight: 400;
}

.ds-table--bordered {
	border: 1px solid var(--ds-border);
	margin-bottom: 10px;
}

.ds-table--bordered th,
.ds-table--bordered td {
	border: 1px solid var(--ds-border);
	padding: 9px 14px;
}

.ds-table--payments th {
	background: var(--ds-cream-soft);
}

.ds-num {
	text-align: right;
	white-space: nowrap;
}

.ds-report__totals {
	display: flex;
	gap: 26px;
	flex-wrap: wrap;
	justify-content: flex-end;
	padding: 10px 4px 0;
	font-size: 15px;
}

.ds-report__debt strong {
	color: var(--ds-red);
}

.ds-report__grand {
	display: flex;
	gap: 30px;
	flex-wrap: wrap;
	justify-content: flex-end;
	border-top: 2px solid var(--ds-black);
	margin-top: 10px;
	padding-top: 16px;
	font-size: 16px;
}

@media (max-width: 800px) {
	.ds-summary {
		grid-template-columns: 1fr;
	}
}

/* Печать отчёта */

@media print {
	.ds-header,
	.ds-footer,
	.ds-no-print,
	.ds-alert {
		display: none !important;
	}

	body.ds-body {
		background: #fff;
	}

	.ds-main {
		padding: 0;
	}

	.ds-report {
		border: 0;
		padding: 0;
	}

	.ds-table--bordered th,
	.ds-table--bordered td {
		border: 1px solid #999;
	}

	.ds-report__client {
		page-break-inside: avoid;
	}
}

/* Индикатор выгрузки файла на Яндекс Диск */
.ds-file__cloud {
	position: absolute;
	bottom: -6px;
	left: -6px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--ds-green);
	color: #fff;
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

.ds-file__cloud--err {
	background: var(--ds-amber);
}

/* Фильтр отчёта: поля и кнопки выровнены по нижней линии */
.ds-report-filter {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 14px;
	margin-bottom: 24px;
}

.ds-report-filter__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.ds-report-filter__field .ds-input {
	width: auto;
	min-width: 170px;
}

.ds-report-filter__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-left: auto;
}

/* Отменённый заказ в таблице клиента */
.ds-table__row.is-cancelled td:not(:last-child) {
	opacity: 0.55;
}

.ds-table__row.is-cancelled .ds-table__num {
	text-decoration: line-through;
}

/* Фильтр отчёта в одну ровную строку: подписи, даты и кнопки на одном уровне */
.ds-report-filter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.ds-report-filter .ds-input {
	width: auto;
	min-width: 160px;
	margin: 0;
}

.ds-report-filter__label {
	font-size: 14px;
	color: var(--ds-muted);
	margin: 0;
}

.ds-report-filter .ds-btn {
	margin: 0;
}

.ds-report-filter .ds-btn--primary {
	margin-left: 6px;
}