/*
 * Тема сайта в стиле личного кабинета.
 * Подключается последней (после bootstrap, main.css, app.css) и только
 * перекрашивает существующую разметку — классы и скрипты страниц не меняются.
 * Отключить тему = убрать строку с theme.css из Controller_General::before().
 */

:root {
	--z-brown: #240d09;
	--z-brown-2: #3a1a13;
	--z-orange: #fc8220;
	--z-orange-dark: #e06d0e;
	--z-bg: #f4f1ee;
	--z-card: #ffffff;
	--z-line: #ece8e5;
	--z-line-2: #f1eeeb;
	--z-head: #f7f4f2;
	--z-text: #2b2b2b;
	--z-muted: #7a7470;
	--z-red: #b3261e;
	--z-green: #1d7a45;
	--z-radius: 12px;
}

/* --- Основа ------------------------------------------------------------- */
body {
	background: var(--z-bg);
	color: var(--z-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	padding-top: 60px;
	margin-bottom: 0;
	-webkit-font-smoothing: antialiased;
}
html { min-height: 100%; }
body { display: flex; flex-direction: column; min-height: 100vh; }
body > main { flex: 1 0 auto; }
body > footer { flex-shrink: 0; }
a { color: var(--z-orange-dark); }
a:hover { color: var(--z-brown); }
main > .jumbotron {
	background: transparent;
	padding: 32px 0 40px;
	margin-bottom: 0;
	border-radius: 0;
}

/* --- Верхнее меню ------------------------------------------------------- */
.navbar.bg-zhuk {
	min-height: 60px;
	padding-top: 0;
	padding-bottom: 0;
	box-shadow: 0 2px 12px rgba(36,13,9,.18);
}
.navbar-dark .navbar-nav .nav-link {
	color: rgba(255,255,255,.82);
	font-size: 15px;
	padding: 19px 12px;
	border-bottom: 3px solid transparent;
	transition: color .15s, border-color .15s;
	white-space: nowrap;
}
.navbar-nav.navbar-right li:first-child .nav-link {
	max-width: 240px;
	overflow: hidden;
	text-overflow: ellipsis;
}
@media (min-width: 768px) and (max-width: 1439px) {
	.navbar-dark .navbar-nav .nav-link { font-size: 14px; padding-left: 8px; padding-right: 8px; }
	.navbar-nav.navbar-right li:first-child .nav-link { max-width: 170px; }
}
@media (min-width: 768px) and (max-width: 1199px) {
	.navbar-dark .navbar-nav .nav-link { font-size: 13px; padding-left: 6px; padding-right: 6px; }
	.navbar-nav.navbar-right li:first-child .nav-link { display: none; }
}
.navbar-dark .navbar-nav .nav-link:hover { color: #fff; }
.navbar-dark .navbar-nav .active > .nav-link {
	color: #fff;
	font-weight: 600;
	border-bottom-color: var(--z-orange);
}
.navbar-nav.navbar-right li:first-child .nav-link {
	color: #fff;
	font-weight: 600;
	cursor: default;
}
.logo-box { border-radius: 8px; }
@media (max-width: 767px) {
	.navbar-dark .navbar-nav .nav-link { padding: 10px 4px; border-bottom: 0; border-left: 3px solid transparent; padding-left: 10px; }
	.navbar-dark .navbar-nav .active > .nav-link { border-left-color: var(--z-orange); }
	.navbar-collapse { padding-bottom: 10px; }
}

/* --- Карточка страницы -------------------------------------------------- */
main .content {
	background: var(--z-card);
	border: 1px solid #e6e2df;
	border-radius: var(--z-radius);
	box-shadow: 0 6px 24px rgba(36,13,9,.06);
	padding: 0 0 26px;
}
/* Заголовок страницы — тёмная шапка, как в кабинете */
main .content > .container > h1:first-child {
	background: var(--z-brown);
	color: #fff;
	font-size: 26px;
	font-weight: 700;
	margin: 0 -15px 24px;
	padding: 26px 30px 24px;
	position: relative;
	overflow: hidden;
	border-radius: 11px 11px 0 0;
}
main .content > .container > h1:first-child::before {
	content: "Система заказов";
	display: block;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--z-orange);
	font-weight: 600;
	margin-bottom: 6px;
}
main .content > .container > h1:first-child::after {
	content: "";
	position: absolute;
	right: -60px; top: -60px;
	width: 220px; height: 220px;
	border-radius: 50%;
	background: rgba(252,130,32,.14);
}
main .content > .container { padding-left: 30px; padding-right: 30px; }
main .content > .container > h1:first-child { margin-left: -30px; margin-right: -30px; }
@media (max-width: 767px) {
	main > .jumbotron { padding: 16px 0 24px; }
	main .content { width: calc(100% - 16px); margin-left: 8px; margin-right: 8px; }
	main .content > .container { padding-left: 16px; padding-right: 16px; }
	main .content > .container > h1:first-child { margin-left: -16px; margin-right: -16px; padding: 20px 16px; font-size: 22px; }
}
main .content > [class*="col-md"] { padding-top: 26px; }
main .content > .col-md-3 a { color: var(--z-brown); font-weight: 500; }
main .content > .col-md-3 a:hover { color: var(--z-orange-dark); text-decoration: none; }
main .content > .col-md-9 > h1, main .content > .col-md-9 h1:first-child { color: var(--z-brown); font-weight: 700; font-size: 26px; }
main h2, main h3, main h4 { color: var(--z-brown); font-weight: 700; }

/* --- Таблицы ------------------------------------------------------------ */
main .table {
	color: var(--z-text);
	font-size: 14px;
	margin-bottom: 0;
}
main .table thead th {
	background: var(--z-head);
	color: #6b6560;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	border-top: 0;
	border-bottom: 1px solid var(--z-line);
	padding: 10px 10px;
	vertical-align: bottom;
}
main .table td, main .table th { border-top: 1px solid var(--z-line-2); vertical-align: middle; }
main .table td { padding: 9px 10px; }
main .table-sm td, main .table-sm th { padding: 7px 10px; }
main .table-striped tbody tr:nth-of-type(odd) { background: #fcfbfa; }
main .table-hover tbody tr:hover { background: #fbf3ea; }
main .table-responsive { border: 1px solid var(--z-line); border-radius: 10px; }

/* --- Формы -------------------------------------------------------------- */
main .form-control {
	border: 1px solid #ddd6d1;
	border-radius: 8px;
	color: var(--z-text);
	transition: border-color .15s, box-shadow .15s;
}
main .form-control:focus {
	border-color: var(--z-orange);
	box-shadow: 0 0 0 3px rgba(252,130,32,.18);
}
main .form-control[readonly], main .form-control:disabled {
	background: #f7f4f2;
	border-color: var(--z-line);
	color: #5a5450;
}
main .col-form-label, main label { color: #5a5450; font-weight: 600; }
main .form-text.text-muted { color: var(--z-muted) !important; }
main .custom-control-input:checked ~ .custom-control-label::before {
	background-color: var(--z-orange);
	border-color: var(--z-orange);
}

/* --- Кнопки ------------------------------------------------------------- */
.btn { border-radius: 8px; font-weight: 600; transition: background .15s, border-color .15s, box-shadow .15s; }
.btn-primary {
	background: var(--z-orange);
	border-color: var(--z-orange);
	color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active {
	background: var(--z-orange-dark);
	border-color: var(--z-orange-dark);
	box-shadow: 0 0 0 3px rgba(252,130,32,.2);
}
.btn-info {
	background: #fff;
	border-color: #d9d1cb;
	color: var(--z-brown);
}
.btn-info:hover, .btn-info:focus, .btn-info:not(:disabled):not(.disabled):active {
	background: var(--z-brown);
	border-color: var(--z-brown);
	color: #fff;
	box-shadow: none;
}
.btn-danger { background: var(--z-red); border-color: var(--z-red); }
.btn-danger:hover { background: #8f1d17; border-color: #8f1d17; }
.btn-secondary { background: #fff; border-color: #d9d1cb; color: #4a4440; }
.btn-secondary:hover { background: #f4f1ee; border-color: #cfc6bf; color: #2b2b2b; }

main .table .btn-primary, main .table .btn-info {
	background: #fff;
	border-color: #f1c9a4;
	color: var(--z-orange-dark);
	font-weight: 600;
}
main .table .btn-primary:hover, main .table .btn-info:hover {
	background: var(--z-orange);
	border-color: var(--z-orange);
	color: #fff;
}

/* --- Стол заказов: группы товаров --------------------------------------- */
main .products-group-box { margin-bottom: 12px; }
main .products-group-box .head {
	background: var(--z-head);
	border: 1px solid var(--z-line);
	border-radius: 10px;
	padding: 12px 16px;
	font-weight: 700;
	color: var(--z-brown);
	transition: background .15s;
}
main .products-group-box .head:hover { background: #f0ebe7; }
main .products-group-box.open .head,
main .products-group-box.sopen .head {
	background: var(--z-brown);
	border-color: var(--z-brown);
	color: #fff;
	border-radius: 10px 10px 0 0;
}
main .products-group-box.open .head:hover,
main .products-group-box.sopen .head:hover { background: var(--z-brown-2); }
main .products-group-box .body {
	border: 1px solid var(--z-line);
	border-top: 0;
	border-radius: 0 0 10px 10px;
	overflow: hidden;
}
main .products-group-box .body .table thead th { background: #fbf8f6; }
main .item-count { font-weight: 600; }

/* --- Статусы заказов ---------------------------------------------------- */
.badge.order-status {
	font-size: 12px;
	font-weight: 600;
	padding: 5px 11px;
	border-radius: 999px;
}
.badge.order-status-1 { background: #e3effc; color: #1f5fa8; } /* новый */
.badge.order-status-2 { background: #fff3dc; color: #9a5b00; } /* в обработке */
.badge.order-status-3 { background: #ffe8d6; color: #b35200; } /* в производстве */
.badge.order-status-4 { background: #eef0f3; color: #4a5260; } /* отклонён */
.badge.order-status-5 { background: #e5f4ea; color: var(--z-green); } /* выполнен */

/* --- Сообщения ---------------------------------------------------------- */
main .alert { border-radius: 10px; border: 1px solid transparent; }
main .alert-info { background: #fff6e5; border-color: #f6dfb3; color: #7a4d00; }
main .alert-danger { background: #fbe4e1; border-color: #f1c4bd; color: var(--z-red); }
main .alert-success { background: #e5f4ea; border-color: #bfe3cc; color: var(--z-green); }

/* --- Пагинация ---------------------------------------------------------- */
.pagination .page-link {
	color: var(--z-brown);
	border-color: var(--z-line);
	margin: 0 2px;
	border-radius: 8px !important;
	min-width: 38px;
	text-align: center;
}
.pagination .page-link:hover { background: #fbf3ea; color: var(--z-brown); border-color: #e9d9cb; }
.pagination .page-item.disabled .page-link {
	background: #fff; color: #b9b0aa; border-color: var(--z-line);
}
.pagination .page-item.active .page-link {
	background: var(--z-orange);
	border-color: var(--z-orange);
	color: #fff;
	font-weight: 700;
}

/* --- Новости ------------------------------------------------------------ */
.news-alerts .toast, .newsBox .toast {
	border: 1px solid var(--z-line);
	border-radius: 10px;
	box-shadow: 0 4px 16px rgba(36,13,9,.06);
	overflow: hidden;
}
.news-alerts .toast .toast-header {
	background: var(--z-head);
	color: var(--z-brown);
	border-bottom: 1px solid var(--z-line);
}

/* --- Вход --------------------------------------------------------------- */
main .well h1 { color: var(--z-brown); font-weight: 700; font-size: 24px; }
main .well {
	border: 1px solid #e6e2df;
	border-radius: var(--z-radius);
	box-shadow: 0 6px 24px rgba(36,13,9,.06);
	padding: 28px 26px;
}

/* --- Подвал ------------------------------------------------------------- */
.footer {
	position: static;
	height: auto;
	line-height: 1.5;
	background: var(--z-brown);
	color: rgba(255,255,255,.65);
	padding: 18px 0;
	font-size: 14px;
}
.footer .container { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 24px; }
.footer .text-muted { color: rgba(255,255,255,.65) !important; }
.footer .flex-footer p { display: none; }
.footer .flex-footer a { color: rgba(255,255,255,.85); }
.footer .flex-footer a:hover { color: var(--z-orange); }

/* --- Стол заказов на телефоне: строки товаров — карточки ------------------
 * Только перестановка ячеек стилями: DOM и классы, на которые опираются
 * скрипты (tr.item, .item-cost, .item-count, .item-sum, .item-mincount),
 * не меняются. Касается только таблиц .order-items и блока .order-total. */
@media (max-width: 767px) {
	#createOrder .products-group-box .body > .table-responsive,
	#createOrder > .table-responsive:has(> table.order-items) {
		border: 0;
		border-radius: 0;
		overflow: visible;
	}
	main table.order-items,
	main table.order-items tbody { display: block; width: 100%; }
	main table.order-items thead { display: none; }

	main table.order-items tr.item {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 6px;
		padding: 12px 14px 14px;
		border-top: 1px solid var(--z-line-2);
		background: #fff !important;
	}
	main table.order-items tbody tr.item:first-child { border-top: 0; }
	main table.order-items tr.item > td {
		display: block;
		border: 0;
		padding: 0;
	}

	/* название */
	main table.order-items .item-name {
		order: 1;
		flex: 1 1 100%;
		font-size: 15px;
		font-weight: 600;
		line-height: 1.3;
		color: var(--z-brown);
		margin-bottom: 2px;
	}
	main table.order-items .item-name .isNew { margin: 0; }
	main table.order-items .item-name .isNew span { color: var(--z-orange-dark); font-weight: 600; margin-left: 4px; }

	/* плашки с параметрами */
	main table.order-items tr.item > td.item-vendor,
	main table.order-items tr.item > td.item-price,
	main table.order-items tr.item > td.item-unit,
	main table.order-items tr.item > td.item-timeout,
	main table.order-items tr.item > td.item-min,
	main table.order-items tr.item > td.item-quant {
		font-size: 12px;
		line-height: 1;
		color: #5a5450;
		background: var(--z-head);
		border-radius: 6px;
		padding: 5px 8px;
		white-space: nowrap;
	}
	main table.order-items .item-vendor { order: 2; }
	main table.order-items tr.item > td.item-price { order: 3; font-weight: 700; color: var(--z-brown); background: #fdeedd; }
	main table.order-items .item-unit   { order: 4; }
	main table.order-items .item-timeout{ order: 5; }
	main table.order-items .item-days   { order: 6; }
	main table.order-items .item-min    { order: 7; cursor: pointer; }
	main table.order-items .item-quant  { order: 8; }

	main table.order-items .item-vendor::before { content: "арт. "; color: var(--z-muted); }
	main table.order-items .item-price::after   { content: " ₽"; }
	main table.order-items .item-unit::before   { content: "за "; color: var(--z-muted); }
	main table.order-items .item-timeout::before { content: "заказ до "; color: var(--z-muted); }
	main table.order-items .item-timeout.item-days::before { content: "за "; }
	main table.order-items .item-timeout.item-days::after  { content: " дн."; color: var(--z-muted); }
	main table.order-items .item-min .item-mincount,
	main table.order-items .item-quant .item-kvantcount { display: inline; }
	main table.order-items .item-min::before   { content: "мин. "; color: var(--z-muted); }
	main table.order-items .item-quant::before { content: "квант "; color: var(--z-muted); }

	/* перенос строки перед полями количества и суммы */
	main table.order-items tr.item::after {
		content: "";
		order: 9;
		flex: 0 0 100%;
		height: 0;
	}
	/* количество и сумма */
	main table.order-items tr.item > td.item-qty     { order: 10; flex: 1 1 0; min-width: 0; }
	main table.order-items tr.item > td.item-sumcell { order: 11; flex: 0 0 38%; min-width: 0; }
	main table.order-items .item-qty::before,
	main table.order-items .item-sumcell::before {
		display: block;
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .04em;
		color: var(--z-muted);
		margin-bottom: 4px;
	}
	main table.order-items .item-qty::before     { content: "Количество"; }
	main table.order-items .item-sumcell::before { content: "Сумма, ₽"; }
	main table.order-items .item-qty .form-control,
	main table.order-items .item-sumcell .form-control {
		height: 44px;
		font-size: 16px; /* меньше 16px — iPhone увеличивает страницу при вводе */
	}
	main table.order-items .item-qty .form-control { font-weight: 700; border-color: #e3c9b0; }
	main table.order-items .item-qty .input-group { flex-wrap: nowrap; }

	/* «в группе нет продуктов» */
	main table.order-items tr:not(.item) { display: block; }
	main table.order-items tr:not(.item) > td { display: block; border: 0; padding: 14px; color: var(--z-muted); }

	/* Итого — прилипает к низу экрана */
	#createOrder .order-total {
		position: sticky;
		bottom: 8px;
		z-index: 30;
		margin: 14px 0;
		background: #fff;
		border: 1px solid #e6d3c2;
		border-radius: 12px;
		box-shadow: 0 -2px 18px rgba(36,13,9,.14);
		overflow: visible;
	}
	#createOrder .order-total table,
	#createOrder .order-total tbody { display: block; width: 100%; }
	#createOrder .order-total thead { display: none; }
	#createOrder .order-total tr {
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 10px 12px;
		background: #fff !important;
	}
	#createOrder .order-total td { display: block; border: 0; padding: 0; }
	#createOrder .order-total td:first-child { flex: 0 0 auto; color: var(--z-brown); }
	#createOrder .order-total td:nth-child(2) { flex: 0 0 26%; }
	#createOrder .order-total td:nth-child(3) { flex: 1 1 auto; }
	#createOrder .order-total td:last-child { display: none; }
	#createOrder .order-total .form-control { height: 38px; font-size: 16px; font-weight: 700; text-align: right; }
	#createOrder .order-total .items-sum { color: var(--z-brown); background: #fdeedd; border-color: #f1d2b3; }
}
