/*reset*/
* {padding: 0px;margin: 0px;border: none;outline: none;}
*,*:before,*:after {box-sizing: border-box;}
a,a:link,a:visited,a:hover {text-decoration: none;}
aside,nav,footer,header,section,main {display: block;}
h1,h2,h3,h4,h5,h6,p {padding: 0;margin: 0;font-size: inherit;font-weight: inherit;}
ul,ul li,ol,ol li {padding: 0;margin: 0;list-style: none;}
img,svg,webp {width: 100%;max-width: 100%;height: auto;}
address {font-style: normal;}
form {width: 100%;}
input,textarea,button,select {font-family: inherit;font-size: inherit;color: inherit;background: transparent;outline: none;resize: none;}
input::-ms-clear {display: none;}
button,input[type="submit"] {display: inline-block;box-shadow: none;background: transparent;cursor: pointer;}
input:focus,input:active,button:focus,button:active {outline: none;}
button::-moz-focus-inner {padding: 0;border: 0;}
legend {display: block;}
@font-face{font-family:'Inter';font-weight:400;font-style:normal;font-display:swap;src: url("../extension/fonts/inter/inter-regular.woff2")format("woff2");}
@font-face{font-family:'Roboto Condensed';font-weight:600;font-style:normal;font-display:swap;src: url("../extension/fonts/roboto-condensed/roboto-condensed-regular.woff2")format("woff2");}
/**/
:root {
	color-scheme: light dark;
	--brand: #f39313;
	--radius: 10px;

	--bg: #fffef3;

	--very-dark: #1f1f1f;
	--dark: #555555;
	--average: #efefef;
	--white: #ffffff;

	--font: 'Inter';
	--font-Condensed: 'Roboto Condensed';
	--font-size: 16px;

	--text: #2f2f2f;
	--text-light: #e2e8f0;
	--text-muted: #64748b;

	--link: #333333;

	--input-bg: #fffef3;
	--input-text: #212121;
	--input-focus: #ffffff;
	--input-button: #121212;
	--input-placeholder: #ffffff;
	--input-placeholder-text: #666666;
	--input-error: #f9a7a7;

	--button-bg: #555555;
	--button-text: #ffffff;
	--button-hover: #fffef3;
	--button-hover-text: #212121;
	--button-disable: #aaaaaa;
	--button-disable-text: #ffffff;

	--border-color: rgba(190 190 190);

	--shadow-bottom: 0px 8px 5px -5px rgb(160 160 160);
	--shadow-all-small: 0px 0px 4px 2px rgb(160 160 160 / 0.5);
	--shadow-select: 0px 5px 10px 0px rgb(160 160 160 / 0.5);

	--gradient-hr: linear-gradient(to right, transparent 0%, var(--brand) 30%, var(--brand) 70%, transparent 100%);
	--gradient-error: linear-gradient(to right, rgb(255 170 170 / 0.9) 0%, rgb(255 170 170) 30%, rgb(255 170 170) 70%, rgb(255 170 170 / 0.9) 100% 100%);
	--gradient-success: linear-gradient(to right, rgb(170 255 170 / 0.9) 0%, rgb(170 255 170) 30%, rgb(170 255 170) 70%, rgb(170 255 170 / 0.9) 100% 100%);
	--gradient-msg: linear-gradient(to right, rgb(255 230 190 / 0.9) 0%, rgb(255 230 190) 30%, rgb(255 230 190) 70%, rgb(255 230 190 / 0.9) 100% 100%);
	--gradient-add: linear-gradient(to right, rgb(170 255 170 / 0.9) 0%, rgb(170 255 170) 30%, rgb(170 255 170) 70%, rgb(170 255 170 / 0.9) 100% 100%);

	--text-error: #b30000;
	--text-success: green;
	--text-msg: #f39313;
	--text-add: green;

	--stock: #b30000;

	--max-width: 1440px;
	--min-width: 320px;
}
::-webkit-scrollbar {width: 6px;background: var(--dark);}
::-webkit-scrollbar-thumb {border-radius: var(--radius);background: var(--brand);}
::-webkit-scrollbar-track {border-radius: var(--radius);background: var(--dark);}
/**/
html {
	font-size: var(--font-size);
}
body {
	display: flex;
	flex-direction: column;
	min-width: var(--min-width);
	min-height: 100%;
	font-family: var(--font);
	font-weight: 400;
	line-height: 1.4;
	background: var(--bg);
	color: var(--text);
	margin: 0;
	overflow-x: hidden;
	overflow-y: auto;
	overflow-anchor: none;
}
/*
body {
	animation: fadeIn 0.3s ease-in-out;
}
@keyframes fadeIn {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: translateY(0); }
}
*/
/**/
.clr:after {
	display: table;
	content: " ";
	clear: both;
}
.clr:before {
	display: table;
	content: " ";
}
/**/
a, 
[data-link] {
	cursor: pointer;
	color: var(--link);
	transition: color 0.2s linear;
}
a:hover,
[data-link]:hover {
	color: var(--brand);
}
.dark a,
.dark [data-link] {
	color: var(--white);
}
.dark a:hover,
.dark [data-link]:hover {
	color: var(--brand);
}
/**/
input,
select,
textarea {
	width: 100%;
	padding: 6px 10px 6px 10px;
	background: var(--input-bg);
	color: var(--input-text);
	border: 1px solid var(--average);
	border-radius: var(--radius);
	transition: background-color 0.2s linear, border-color 0.2s linear;
}
input:focus,
select:focus,
textarea:focus {
	background-color: var(--input-focus);
	border-color: var(--brand);
}
input {
	height: 35px;
}		
textarea {
	height: auto;
}
input[type="date"] {
	text-align: end;
	min-width: 150px;
}
::-webkit-input-placeholder {
	color: var(--input-text-placeholder);
	opacity: 1;
	transition: opacity 0.2s linear;
}
:focus::-webkit-input-placeholder {
	opacity: 0;
}
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
	-webkit-appearance:none;
}
input.input-error {
	background-color: var(--input-error) !important;
	border-color: var(--input-error) !important;
}
.input-button {
	display: flex;
	align-items: center;
	padding: 0 5px;
	position: absolute;
	top: 50%;
	right: 0;
	height: 100%;
	border-radius: 0 var(--radius) var(--radius) 0;
	transform: translate(0, -50%);
	opacity: 0.3;
	transition: opacity 0.2s linear;
}
input:focus + .input-button,
.input-button:hover {
	background: rgba(0, 0, 0, 0.05);
	opacity: 1;
}
.input-button:before {
	content: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='currentColor' d='M480 272C480 317.9 465.1 360.3 440 394.7L566.6 521.4C579.1 533.9 579.1 554.2 566.6 566.7C554.1 579.2 533.8 579.2 521.3 566.7L394.7 440C360.3 465.1 317.9 480 272 480C157.1 480 64 386.9 64 272C64 157.1 157.1 64 272 64C386.9 64 480 157.1 480 272zM272 416C351.5 416 416 351.5 416 272C416 192.5 351.5 128 272 128C192.5 128 128 192.5 128 272C128 351.5 192.5 416 272 416z'/></svg>");
	width: 1.6rem;
	height: 1.6rem;
}
input:not(:placeholder-shown),
textarea:not(:placeholder-shown) {
	background-color: var(--input-placeholder);		
	border: 1px solid var(--brand);
}
.form-input {
	max-width: calc(var(--max-width) - 400px);
	margin: 25px auto 0;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	position: relative;
}
.form-group {
	min-width: 180px;
	position: relative;
	flex: 1;
}
.form-group label {
	font-size: 1rem;
	line-height: 1;
	color: var(--text);
	white-space: nowrap;
	position: absolute;
	top: 10px;
	left: 10px;
	pointer-events: none;
	transition: padding 0.2s linear, font-size 0.2s linear, color 0.2s linear, left 0.2s linear, top 0.2s linear;
	z-index: 1;
}
.form-group.hide {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
input:focus + label,
input:not(:placeholder-shown) + label,
input:focus + div + label,
input:not(:placeholder-shown) + div + label,
textarea:focus + label,
textarea:not(:placeholder-shown) + label {
	color: var(--white);
	font-size: 0.9rem;
	top: -18px;
	left: 10px;
	padding: 2px 10px;
}
form > .button {
	margin: 15px auto 5px;
}

/**/
.svg-brand,
.svg-whatsapp,
.svg-telegram,
.svg-max,
.svg-dzen,
.svg-vk,
.svg-rutube {
	cursor: pointer;
	padding: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: calc(var(--radius) / 1.5);
	transition: background-color 0.2s linear;
	width: 2rem;
	height: 2rem;
}
.svg-brand path,
.svg-whatsapp path,
.svg-telegram path,
.svg-max path,
.svg-dzen path,
.svg-vk path,
.svg-rutube path {
	fill: var(--white) !important;
	transition: fill 0.2s linear;
}
.svg-brand {
	background: var(--brand);
	border: 1px solid var(--brand);
}
.svg-whatsapp {
	background: #65bc54;
	border: 1px solid #65bc54;
}
.svg-telegram {
	background: #64a9dc;
	border: 1px solid #64a9dc;
}
.svg-max {
	background: #555555;
	border: 1px solid #555555;
	padding: 4px;
}
.svg-dzen {
	background: #555555;
	border: 1px solid #555555;
}
.svg-vk {
	background: #4c75a3;
	border: 1px solid #4c75a3;
}
.svg-rutube {
	background: #9a13ed;
	border: 1px solid #9a13ed;
	padding: 3px;
}
.svg-brand:hover,
.svg-whatsapp:hover,
.svg-telegram:hover,
.svg-max:hover,
.svg-dzen:hover,
.svg-vk:hover,
.svg-rutube:hover {
	background-color: #ffffff;
}
.svg-brand:hover path {
	fill: var(--brand) !important;
}
.svg-whatsapp:hover path {
	fill: #65bc54 !important;
}
.svg-telegram:hover path {
	fill: #64a9dc !important;
}
.svg-max:hover path {
	fill: #0a0b0b !important;
}
.svg-dzen:hover path {
	fill: #000000 !important;
}
.svg-vk:hover path {
	fill: #4c75a3 !important;
}
.svg-rutube:hover path {
	fill: #100943 !important;
}
/**/
.button {
	min-width: fit-content;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	border: none;
	border-radius: var(--radius);
	background: transparent;
	cursor: pointer;
	margin: 10px 5px;
	padding: 10px 15px;
	color: var(--button-text);
	font-size: 1.05rem;
	transition: color 0.2s linear;
}
.button:hover {
	color: var(--button-hover-text);
}
.button:before {
	content: "";
	position: absolute;
	inset: 0;
	display: block;
	background: var(--button-bg);
	border: 3px solid var(--button-bg);
	border-bottom: 3px solid var(--brand);
	border-radius: var(--radius);
	transition: background-color 0.2s linear, border-color 0.2s linear;
}
.dark .button:before {
	background: var(--very-dark);
}
.button:hover:before {
	background-color: var(--button-hover);
	border-color: var(--brand);
}
.button > span {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	white-space: nowrap;
	text-align: center;
	gap: 5px;
}
.button:disabled {
	pointer-events: none;
	cursor: default;
	box-shadow: none;
	opacity: 0.5;
	color: var(--button-text-disable);
}
.button:disabled:before {
	background: var(--button-disable);
	opacity: 0.5;
	border: 3px solid var(--button-disable);
}
/**/
img {
	/*object-fit: cover;*/
	max-inline-size: 100%;
	block-size: auto;
	display: block;
	max-width: 100%;
	height: 100%;
}
img.lzy-img {
	display: flex;
	align-items: center;
	justify-content: center;
}
/**/
hr {
	width: 100%;
	margin: 30px auto;
	border: none;
	height: 2px;
	background: var(--gradient-hr);
}
/**/
.close-btn {
	background: var(--white);
	border-radius: 50%;
}
.close-btn:before {
	content: "";
	display: flex;
	width: 1.7rem;
	height: 1.7rem;
	background-color: var(--text-error);
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='%23ff0000' d='M320 576C461.4 576 576 461.4 576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 461.4 178.6 576 320 576zM231 231C240.4 221.6 255.6 221.6 264.9 231L319.9 286L374.9 231C384.3 221.6 399.5 221.6 408.8 231C418.1 240.4 418.2 255.6 408.8 264.9L353.8 319.9L408.8 374.9C418.2 384.3 418.2 399.5 408.8 408.8C399.4 418.1 384.2 418.2 374.9 408.8L319.9 353.8L264.9 408.8C255.5 418.2 240.3 418.2 231 408.8C221.7 399.4 221.6 384.2 231 374.9L286 319.9L231 264.9C221.6 255.5 221.6 240.3 231 231z'/></svg>");
	mask-repeat: no-repeat;
	opacity: 0.6;
	cursor: pointer;
}
.close-btn:hover:before {
	opacity: 1;
}
/**/
.icon-alert:before {
	content: "";
	display: flex;
	width: 1.8rem;
	height: 1.8rem;
	background-color: var(--text-error);
	mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path fill='currentColor' d='M320 64C334.7 64 348.2 72.1 355.2 85L571.2 485C577.9 497.4 577.6 512.4 570.4 524.5C563.2 536.6 550.1 544 536 544L104 544C89.9 544 76.8 536.6 69.6 524.5C62.4 512.4 62.1 497.4 68.8 485L284.8 85C291.8 72.1 305.3 64 320 64zM320 416C302.3 416 288 430.3 288 448C288 465.7 302.3 480 320 480C337.7 480 352 465.7 352 448C352 430.3 337.7 416 320 416zM320 224C301.8 224 287.3 239.5 288.6 257.7L296 361.7C296.9 374.2 307.4 384 319.9 384C332.5 384 342.9 374.3 343.8 361.7L351.2 257.7C352.5 239.5 338.1 224 319.8 224z'/></svg>");
	mask-repeat: no-repeat;
}
/**/
/**/
main {
	width: 100%;
	box-shadow: inset -30px 0 15px -15px #f2dca690, inset 60px 0 30px -30px #f2dca690;
	position: relative;
}
.squeeze body:has(.no-sticky) main {
	top: var(--header-height);
}
.squeeze body:has(.no-sticky) footer {
		top: var(--header-height);
}
.container {
	width: 100%;
	max-width: var(--max-width);
	margin: 0 auto;
	padding: 0 25px;
}
.content-top {
	display: flex;
	align-items: flex-start;
	gap: 15px;
}
.content-left {
	min-width: 400px;
	max-width: 400px;
	position: sticky;
	top: 0;
	z-index: 2;
	transition: top 0.2s linear;
}
.squeeze .content-left {
    top: calc(var(--header-height));
}
.content-right {
	width: calc(100% - 415px);
}
.content-center {
	width: 100%;
}
.content-bottom {
	width: 100%;
}
.page-content {
	margin: 20px 0;
}
/**/
@media only screen and (max-width: 1439.98px) {
	.content-left { min-width: 380px; max-width: 380px; }
	.content-right { width: calc(100% - 395px); }
}
@media only screen and (max-width: 1279.98px) {
	html { font-size: calc(var(--font-size) - 1px); }
}
@media only screen and (max-width: 1023.98px) {

}
@media only screen and (max-width: 991.98px) {
	html { font-size: calc(var(--font-size) - 2px); }
	.container { padding: 0 20px;}
	main { box-shadow: none; }
	.content-left { display: none; }
	.content-right { width: 100%; }
}
@media only screen and (max-width: 799.98px) {

}
@media only screen and (max-width: 767.98px) {
	html { font-size: calc(var(--font-size) - 3px); }
}
@media only screen and (max-width: 639.98px) {
	.container { padding: 0 15px;}
	input { height: 30px; }
	.form-group label { top: 7px; }
}
@media only screen and (max-width: 479.98px) {
	html { font-size: calc(var(--font-size) - 4px); }
}
@media only screen and (max-width: 413.98px) {

}
@media only screen and (max-width: 359.98px) {
	.container { padding: 0 10px;}
}
@media only screen and (max-width: 319.98px) {

}
