@charset "UTF-8";
.order-main .hide-title {
		display: none;
}
.order-main .title {
		font: 600 var(--bold-text)/1.5 var(--font2);
		margin: 0;
		color: inherit;
}
.order-card {
		border: 1px solid var(--darkblue);
		border-radius: var(--radius);
		padding: 19px;
		display: grid;
		gap: 40px;
		font: 600 var(--text)/1.5 var(--font2);
		color: var(--darkgrey);
		margin-bottom: 40px;
}
@media only screen and (max-width: 767px) {
		.order-card {
				grid-template-columns: 1fr;
		}
}
@media only screen and (min-width: 768px) and (max-width: 999px) {
		.order-card {
				grid-template-columns: repeat(2, 1fr);
		}
}
@media only screen and (min-width: 1000px) {
		.order-card {
				grid-template-columns: repeat(4, 1fr);
				gap: 40px;
		}
}
@media only screen and (min-width: 1280px) {
		.order-card {
				gap: 40px 80px;
		}
}
.order-card .col {
		position: relative;
}
.order-card .col, .order-card .col * {
		text-wrap: auto;
}
.order-card .col:before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		width: 1px;
		background: var(--lightlightgrey);
		display: none;
}
@media only screen and (max-width: 767px) {
		.order-card .col:not(:first-child) {
				border-top: 1px solid var(--lightlightgrey);
				padding-top: 40px;
		}
}
@media only screen and (min-width: 768px) and (max-width: 999px) {
		.order-card .col:nth-child(even):before {
				left: -20px;
				display: block;
		}
}
@media only screen and (min-width: 1000px) {
		.order-card .col:not(:nth-child(4n - 3)):before {
				left: -20px;
				display: block;
		}
}
@media only screen and (min-width: 1280px) {
		.order-card .col:not(:nth-child(4n - 3)):before {
				left: -40px;
		}
}
.order-card .col > *:first-child {
		margin-top: 0 !important;
}
.order-card .col > *:last-child {
		margin-bottom: 0 !important;
}
.order-card .title {
		margin-bottom: 10px;
}
.order-card .status {
		margin: 10px 0 20px 0;
}
.order-card .btns {
		display: flex;
		align-items: flex-start;
		gap: 10px;
		flex-direction: column;
		margin: 20px 0 0 0;
}
@media only screen and (min-width: 768px) and (max-width: 999px) {
		.order-card .btns {
				flex-direction: row;
				flex-wrap: wrap;
				align-items: center;
		}
}
.order-card .total {
		border-collapse: collapse;
		width: 100%;
		border: 0;
		background: none;
		margin: 0 0 28px 0;
		font-weight: 500;
}
.order-card .total td {
		border-style: solid;
		border-width: 0;
		border-color: var(--lightlightgrey);
		padding: 10px 0 12px 0;
		text-align: left;
		vertical-align: middle;
}
.order-card .total tr:not(:first-child) td {
		border-top-width: 1px;
}
.order-card .total .price {
		text-align: right;
		white-space: nowrap;
		color: var(--darkblue);
		font: bold var(--bold-text)/1 var(--font1);
}
.order-card .total .price.big {
		font-size: var(--big-text);
}
.order-card .total .price.grey {
		color: var(--lightgrey);
}
.order-card .contact, .order-card .contact li {
		list-style: none;
		margin: 0;
		padding: 0;
}
.order-card .contact {
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin-top: 4px;
}
.order-card .contact li {
		position: relative;
		padding-left: 26px;
}
.order-card .contact .icon {
		width: 16px;
		height: 16px;
		position: absolute;
		top: 0.75em;
		left: 0;
		margin: -8px 0;
		object-fit: contain;
		object-position: center;
}
.order-icons, .order-icons li {
		list-style: none;
		margin: 0;
		padding: 0;
}
.order-icons {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 20px;
		margin-top: 10px;
}
.order-icons img {
		height: 30px;
		width: auto;
}
.order-main .tabs {
		margin-bottom: 20px;
}
.order-main:has(input.order-card-contains-input:not(:checked)) .order-card-contains, .order-main:has(input.order-card-userdata-input:not(:checked)) .order-card-userdata {
		display: none;
}
.order-card-contains {
		border: 1px solid var(--darkblue);
		border-radius: var(--radius);
		padding: 19px;
}
.order-main .catalog-table table {
		margin-top: 0;
		margin-bottom: 0;
}
@media only screen and (max-width: 767px) {
		.order-main .catalog-table tr {
				gap: 10px 0;
		}
		.order-main .catalog-table tr:nth-last-child(2) {
				border-bottom-width: 0;
				padding-bottom: 0;
		}
		.order-main .catalog-table .name {
				margin-bottom: 6px;
		}
}
.order-card-userdata {
		border: 1px solid var(--darkblue);
		padding: 19px;
		border-radius: var(--radius);
		font: 600 var(--text)/1.5 var(--font2);
}
@media only screen and (min-width: 1000px) {
		.order-card-userdata {
				display: flex;
				gap: 40px;
		}
}
.order-card-userdata .col {
		position: relative;
}
.order-card-userdata .col:before {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		width: 1px;
		background: var(--lightlightgrey);
		display: none;
}
@media only screen and (max-width: 999px) {
		.order-card-userdata .col:not(:last-child) {
				border-bottom: 1px solid var(--lightlightgrey);
				padding-bottom: 20px;
				margin-bottom: 20px;
		}
}
@media only screen and (min-width: 1000px) {
		.order-card-userdata .col {
				flex: 1;
		}
		.order-card-userdata .col:not(:last-child):before {
				display: block;
				right: -20px;
		}
}
.order-card-userdata .title {
		margin-bottom: 20px;
}
.order-card-userdata ul, .order-card-userdata li {
		list-style: none;
		margin: 0;
		padding: 0;
}
.order-card-userdata ul {
		display: flex;
		flex-direction: column;
		gap: 10px;
}
@media only screen and (max-width: 767px) {
		.order-card-userdata ul {
				gap: 16px;
		}
}
.order-card-userdata .light {
		font-weight: 500;
		margin-right: 0.5em;
}