.easy-zoom-effect {
  transition: transform 0.75s ease;
}
.easy-zoom-effect:hover {
  transform: scale(2.15);
}

button.buttsrch {
	margin: 0px; padding: 0px 4px 4px 4px; font-size: 100%; font-family: Arial, Sans-Serif;	border: 1px solid #4464B8;
	color: #FFFFFF; background-color: #3291e6; cursor: pointer; height: auto; width:48px;
}
button.buttsrch:hover {color: #FFFFFF; background-color:#4464B8; border: 1px solid #000096;}

button.addtocart {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--surface-color);
  border: none;
  color: var(--accent-color);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  transform: translateX(20px);
  animation: slideIn 0.3s ease forwards;
  opacity: 0;
  cursor: pointer;
  position:relative;
}

button.addtocart:nth-child(2) {
  animation-delay: 0.1s;
}

button.addtocart:hover {
/*  background: var(--accent-color);*/
	background-color: var(--accent-color);
	color: var(--contrast-color);
	transform: translateY(-2px);
}

button.addtocart i {
  font-size: 1.4rem;
}

dialog::backdrop {
  background-color: transparent; /* Полностью убираем затемнение */
}

.btn-runblue {
/*
  display: inline-block;
  position: relative;
*/  
  font-weight: 500;
  background-color: var(--accent-color);
  color: var(--contrast-color);
  text-decoration: none;
  padding-bottom: 0.25rem;
  border-bottom: 2px solid var(--heading-color);
  transition: all 0.3s ease;
  cursor: pointer;
  margin-top: 16px;
}

.btn-runblue:hover {
  background-color: var(--bluelite-color);
  border-color: var(--accent-color);
  color: var(--contrast-color);
}

.btn-runwhite {
  font-weight: 500;
  background-color: var(--liteback-color);
  color: var(--default-color);
  text-decoration: none;
  padding-bottom: 0.25rem;
  border-bottom: 2px solid var(--midlgray-color);
  transition: all 0.3s ease;
  cursor: pointer;
  margin-top: 16px;
}

.btn-runwhite:hover {
  background-color: var(--midlback-color);
  border-color: var(--default-color);
  color: var(--contrast-color);
}

a.prec-history {
  width: 2.0rem;
  height: 2.0rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--bluestar-color);
  border-radius: 50%;
  font-size: 1.2rem;
  cursor: pointer;
  position: relative;
  top: -4px;
}

a.prec-history:hover {
	background-color: var(--accent-color);
	color: var(--contrast-color);
}

a.headcart-delrec {
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--midlgray-color);
  border-radius: 50%;
  font-size: 1.0rem;
  cursor: pointer;
/*  margin-top: 4px;
  margin: 4px 0 0 12px;
 */
}

a.headcart-delrec:hover {
	background-color: var(--schoolink-color);
	color: var(--contrast-color);
}

button.eshablon {
  width: 1.45rem;
  height: 1.45rem;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  background-color: var(--bluestar-color);
  color: var(--contrast-color);
  border-radius: 50%;
  font-size: 1.0rem;
  cursor: pointer;
  position:relative;
  margin-right: 8px;
}

button.eshablon:hover {
	background-color: var(--accent-color);
	color: var(--contrast-color);
}

button.eshablon.empty {
	background-color: var(--contrast-color);
	color: var(--midlgray-color);
}

button.efavorit {
  width: 1.45rem;
  height: 1.45rem;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  background-color: var(--bluestar-color);
  color: var(--contrast-color);
  border-radius: 50%;
  font-size: 1.0rem;
  cursor: pointer;
  position:relative;
  padding: 2px 0 0 0;
  margin-right: 8px;
}

button.efavorit:hover {
	background-color: var(--accent-color);
	color: var(--contrast-color);
}

button.efavorit.empty {
	background-color: var(--contrast-color);
	color: var(--midlgray-color);
}

button.epackqty {
  width: 3.0rem;
  height: 2.0rem;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  background-color: var(--contrast-color);
  color: var(--accent-color);
  border-radius: 50%;
  font-size: 1.0rem;
  cursor: pointer;
/*  
  position:relative;
  padding: 2px 0 0 0;
  margin-right: 8px;
*/  
}

button.epackqty:hover {
	background-color: var(--accent-color);
	color: var(--contrast-color);
}

a.fsprefb {
	color: var(--bluelite-color);
	font-size: 1.0rem;
	font-weight: 600;
	cursor: pointer;
}
a.fsprefb:visited {
	color: var(--accent-color);
} 
a.fsprefb:hover {
	background-color: var(--bluelite-color);
	color: var(--contrast-color);
}

.cartqty {
  background-color: var(--accent-color);
  color: var(--contrast-color);
  font-size: 15px;
  padding: 2px 6px;
  border-radius: 50%;
  min-width: 28px;
  width: 32px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cartqty.empty {
/*  background-color: var(--contrast-color);*/
  display: none;
}

.sel-price1 {
  font-family: 'Arial', sans-serif;
  color: var(--bluelite-color);
  vertical-align: super;
  font-size: 18px;
  font-weight: 600;
  margin-left: 16px;
}

.old-price1 {
  color: var(--schoolink-color);
  text-decoration: line-through;
  font-style: italic;
  font-size: 15px;
  margin-left: 10px;
}

.sel-price0 {
  color: var(--bluelito-color);
  font-size: 24px;
  font-weight: 500;
  margin-top: 0px;
}

.old-price0 {
  color: var(--midlgray-color);
  text-decoration: line-through;
  font-style: italic;
  font-size: 18px;
  margin-left: 24px;
}

.dec-price0 {
  font-size: 20px;
  position: relative; 
  top:-6px;
}

.old-proce {
  color: var(--redalarm-color);
  font-style: italic;
  padding-left: 5px;
  font-size: 14px;
}

.product-name {
	font-size: 16px;
}	

.product-name-tableg {
	padding-top: 4px;
	font-size: 16px;
	text-align: left;
}	

.product-name-tableg.midl {
	font-size: 15px;
}	

.product-name-tableg.small {
	font-size: 14px;
}	

.view1-options {
  display: flex;
  gap: 0.5rem;
}

.view1-options .view-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 6px;
  background-color: var(--surface-color);
  border: 1px solid color-mix(in srgb, var(--default-color), transparent 85%);
  color: var(--default-color);
  transition: all 0.3s ease;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.03);
}

.view1-options .view-btn:hover {
  background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
  border-color: var(--accent-color);
  color: var(--accent-color);
}

.view1-options .view-btn.active {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
  color: var(--contrast-color);
  box-shadow: 0 2px 8px color-mix(in srgb, var(--accent-color), transparent 60%);
}

.view1-options .view-btn i {
  font-size: 1.1rem;
}

/***scroll-tableg*/
.scroll-tableg {
	width: 100%;
	overflow: auto;
/*	min-height: 480px;*/
	height: auto;
	position: relative;
	border-color: var(--liteback-color);
	border-width: 1px; 
	border-style: solid; 
}

.scroll-tableg table {
	border-collapse: collapse;
	width: 100%;
	margin-top: 4px;
	border-spacing: 1px;
	cellspacing: 1;
}

.scroll-tableg td {
	padding: 5px;
	border: solid 1px var(--midlback-color);
	background: #fff;
	color: var(--default-color);
	font: 0.9em "Arial", Helvetica, Sans-Serif;
}

.scroll-tableg td.num {
	padding: 5px;
	border: solid 1px var(--midlback-color);
	background: #fff;
	font: 1.1em "Arial", Helvetica, Sans-Serif;
	text-align: right;
}

.scroll-tableg td.num.minus {
	background-color: color-mix(in srgb, var(--schoolink-color) 50%, transparent);
/*	background-color: var(--schoolink-color); */
	color: var(--surface-color);
}

.scroll-tableg td.qty {
	padding: 5px;
	border: solid 1px var(--midlback-color);
	background: #fff;
	font: 1.0em "Arial", Helvetica, Sans-Serif;
	text-align: center;
}

.scroll-tableg td.ordtxt {
	padding: 2px 0 0 0;
	border: none;
}


.scroll-tableg td.linec {
	text-align: center;
}

.scroll-tableg td.linel {
	text-align: left;
}

.scroll-tableg td.liner {
	text-align: right;
	padding-right: 12px;
}

.scroll-tableg td.liner.small {
	font-size: 12px;
}

.scroll-tableg td.padtopbot {
	padding-top: 8px;
	padding-bottom: 8px;
}
.scroll-tableg td.midl {
	padding: 5px;
	border: solid 1px var(--bluerowd-color);
	background: #fff;
	font: 1.0em "Arial", Helvetica, Sans-Serif;
	text-align: right;
}


.scroll-tableg td.sum {
	background: var(--accent-color);
	padding: 4px;
	border: solid 1px white;
	font: 1.0em "Arial", Helvetica, Sans-Serif;
	color: #fff;
	height: 32px;
	font-size: 18px;
	font-weight: 500;
	margin-left: 16px;
	text-align: center;
/*	font-weight: bold;*/
}

.scroll-tableg th {
    background: linear-gradient(135deg, 
      var(--bluestar-color) 20%, 
      var(--bluelito-color) 30%, 
      var(--bluestar-color) 50%, 
      var(--accent-color) 100%
    );
	padding: 4px;
	border: solid 1px white;
/*	font: 0.8em "Arial", Helvetica, Sans-Serif;*/
	font-size: 14px;
	font-weight: 400;
	color: var(--contrast-color);
}

.scroll-tableg th.small {
	font-size: 12px;
	font-weight: 400;
}

.scroll-tableg tr.fixed {
	position: relative;
	top: expression(this.parentElement.parentElement.parentElement.scrollTop)
}
.tableg-label-barc {
  height: auto;
  width: auto;
  position: relative;
  display: flex;
}
.tableg-label-price {
  height: auto;
  width: auto;
  position: relative;
  display: flex;
}
/*scroll-tableg***/

/***scroll-tablew*/
.scroll-tablew {
	width: 100%;
	overflow: auto;
	height: auto;
	position: relative;
}

.scroll-tablew table {
	border-collapse: collapse;
/*	margin-top: 8px;*/
	width: 99%;
/*	border-spacing: 25px;*/
}

.scroll-tablew td {
	padding: 5px 0 5px 0;
	width: 120px;
	text-align: center;
	background-color: var(--liteback-color);
	border: solid 8px var(--liteback-color);
/*	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);*/
}

.tablew-label {
  height: 348px;
  width: 304px;
  position: relative;
  border-radius: 12px;
  border: solid 1px var(--midlback-color);
  background-color: #fff;
}

.tablew-label.mobi {
  width: 264px;
}

.scroll-tablew tr.fixed {
	position: relative;
	top: expression(this.parentElement.parentElement.parentElement.scrollTop)
}
/*scroll-tablew***/

#blueline {
	margin-top: 5px;
	border-top: 1px solid var(--bluelite-color);
}

#grayline {
	margin-top: 1px;
	border-top: 1px solid var(--liteback-color);
}

#goldline {
	margin: 5px 0 5px 0;
	border-top: 1px solid var(--gold-color);
}

/***discount-badges*/
.discount-badges {
  position: absolute;
  top: 3rem;
  right: 1rem;
  background-color: var(--bluelite-color);
  color: var(--contrast-color);
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.discount-badges .percent {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1;
}

.discount-badges .text {
  font-size: 1rem;
  font-weight: 600;
}
/*discount-badges***/

.label-sablon-s {
	color: var(--default-color);
	font-size: 20px;
}	

.textinfo {
	border: solid 1px #bbb; 
	border-radius: 10px; 
	padding: 14px 18px;
/*
  color: var(--accent-color);
  background-color: #fff;
  font-size: 15px;
  border: solid 1px #bbb;
  border-radius: 10px;
  padding: 14px 18px;
  height: auto;
  transition: all 0.3s ease;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.02);
*/
}

.forminfo {
	border: solid 1px var(--accent-color); 
	border-radius: 10px; 
	padding: 14px 18px;
}

.circle-gold-badge {
/*
  position: absolute;
  top: 1rem;
  right: 1rem;
*/  
  background-color: var(--gold-color);
  color: var(--contrast-color);
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.circle-gold-badge .text-l {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1;
}

.circle-gold-badge .text-m {
  font-size: 1rem;
  font-weight: 600;
}

.circle-gold-badge .text-s {
  font-size: 0.75rem;
  font-weight: 500;
  margin-top: -8px;
}

.circle-gold-badge-s {
  background-color: var(--gold-color);
  color: var(--contrast-color);
/*  width: 2.5rem;
  height: 2.5rem;
 */ 
  width: 2.0rem;
  height: 2.0rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.circle-gold-badge-s .text-m.silver {
  font-size: 0.75rem;
}

.circle-gold-badge-s .text-m {
/*  font-size: 1.0rem;*/
  font-size: 0.9rem;
  font-weight: 600;
}

.circle-gold-badge-s .text-p {
/*  font-size: 0.75rem;*/
  font-size: 0.65rem;
  font-weight: 500;
  margin-top: -8px;
}

.circle-gold-badge-s .text-s {
/*  font-size: 0.75rem;*/
  font-size: 0.65rem;
  font-weight: 500;
  margin-top: -4px;
}

.circle-gold-badge-s.silver {
  background-color: var(--silver-color);
}

.circle-news-badge-s {
  background-color: var(--bluestar-color);
  color: var(--contrast-color);
/*
  width: 2.5rem;
  height: 2.5rem;
*/  
  width: 2.0rem;
  height: 2.0rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.circle-news-badge-s .text-m {
/*  font-size: 0.9rem;*/
  font-size: 0.75rem;
  font-weight: 400;
}

.circle-news-badge-s .text-p {
/*  font-size: 0.75rem;*/
  font-size: 0.65rem;
  font-weight: 500;
  margin-top: -8px;
}

.circle-news-badge-s .text-s {
/*  font-size: 0.75rem;*/
  font-size: 0.65rem;
  font-weight: 500;
  margin-top: -2px;
}

.circle-spec-badge-s {
  background-color: var(--greennew-color);
  color: var(--contrast-color);
/*
  width: 2.5rem;
  height: 2.5rem;
*/  
  width: 2.0rem;
  height: 2.0rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.circle-spec-badge-s .text-m {
/*  font-size: 0.9rem;*/
  font-size: 0.75rem;
  font-weight: 400;
}

.circle-spec-badge-s .text-p {
/*font-size: 0.75rem;*/
  font-size: 0.65rem;
  font-weight: 400;
  margin-top: -8px;
}

.circle-spec-badge-s .text-s {
/*  font-size: 0.75rem;*/
  font-size: 0.65rem;
  font-weight: 400;
  margin-top: -4px;
}

.circle-akcs-badge-s {
  background-color: var(--orange-color);
  color: var(--contrast-color);
/*   width: 2.5rem;
  height: 2.5rem;
 */
  width: 2.0rem;
  height: 2.0rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.circle-akcs-badge-s .text-l {
/*  font-size: 1.0rem;*/
  font-size: 0.8rem;
  font-weight: 600;
}

.circle-akcs-badge-s .text-m {
/*  font-size: 0.85rem;*/
  font-size: 0.70rem;
  font-weight: 400;
  margin-top: 2px;
}

.circle-akcs-badge-s .text-p {
/*  font-size: 0.8rem;*/
  font-size: 0.7rem;
  font-weight: 700;
  margin-top: -6px;
}

.circle-akcs-badge-s .text-s {
/*  font-size: 0.8rem;*/
  font-size: 0.7rem;
  font-weight: 700;
}


.oval-country-s {
  color: var(--default-color);
  width: 1.8rem;
  height: 1.2rem;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--midlgray-color); 
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
}

.oval-country-s .text-m {
  font-size: 0.7rem;
  font-weight: 500;
}

.page-title-h1 {
  color: var(--default-color);
  font-size: 22px;
  font-weight: 600;
  margin: 0;
}

.page-title-h1.blue {
  color: var(--bluelite-color);
}

.page-title-h2 {
  color: var(--default-color);
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}

.page-title-h2.blue {
  color: var(--bluelite-color);
}

.page-title-h3 {
  color: var(--default-color);
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}

.page-title-h3.blue {
  color: var(--bluelite-color);
}

.page-title-h3.accn {
  color: var(--accent-color);
}


.atld-dateto {
  color: var(--orange-color);
  font-size: 12px;
  font-weight: 500;
  margin: 0;
}

.menu-down {
	border: solid 1px var(--midlback-color); 
	width: 328px; 
	box-shadow: 5px 5px 10px rgba(0,0,0,0.25);
}


.head-account {
	width: 92%;
	margin: 4px 0 12px 18px;
	overflow: auto;
	height: auto;
	position: relative;
	border-width: 1px; 
	border-style: solid; 
}

.head-account table {
	border: solid 1px var(--liteback-color);
	border-collapse: collapse;
	border-spacing: 1px;
	cellspacing: 1;
}

.head-account td {
	border: solid 1px var(--liteback-color);
	background: #fff;
}

.head-account td.param {
	padding: 2px 10px 2px 0;
	text-align: right;
	font-size: 14px;
	width: 160px;
}

.head-account td.value {
	padding: 2px 0 2px 10px;
	text-align: left;
	font-size: 16px;
}

.head-account-p {
	color: var(--accent-color);
	font-size: 12px;
	font-weight: 600;
	margin-left: 20px;
}

.min-ord-qty-s {
	color: var(--accent-color);
	font-size: 11px;
}	

.dialog-prec-history {
	border: solid 1px var(--midlgray-color); 
	width:400px; 
	border-radius: 8px;"
}

.dialog-table {
	width: 100%;
	overflow: auto;
	height: auto;
	position: relative;
	border-color: var(--liteback-color);
	border-width: 1px; 
	border-style: solid; 
	margin-bottom: 12px;
}

.dialog-table table {
	border-collapse: collapse;
	width: 100%;
	margin-top: 4px;
	border-spacing: 1px;
	cellspacing: 1;
}

.dialog-table td {
	padding: 5px 5px 5px 5px;
	border: solid 1px var(--midlback-color);
	background: #fff;
	font: 1.0em "Arial", Helvetica, Sans-Serif;
	text-align: center;
}

.dialog-table td.small {
	padding: 2px 2px 2px 2px;
	background: #fff;
	font-size: 11px;
}

.dialog-table th {
    background: linear-gradient(135deg, 
      var(--bluestar-color) 20%, 
      var(--bluelito-color) 30%, 
      var(--bluestar-color) 50%, 
      var(--accent-color) 100%
    );
	padding: 5px 5px 5px 5px;
	border: solid 1px white;
	font: 0.8em "Arial", Helvetica, Sans-Serif;
	font-weight: 400;
	color: var(--contrast-color);
	text-align: center;
}


.btn-fsp {
  font-size: 14px;
  padding: 0.4rem 0.8rem;
  background-color: var(--accent-color);
  border-color: var(--accent-color);
  color: var(--contrast-color);
  transition: 0.3s;
  border-radius: 50px;
  margin-top: 8px;
  margin-bottom: 12px;
}

.btn-fsp:hover {
  background-color: var(--bluelite-color);
  color: var(--contrast-color);
}

.btn-fsp-out {
  border-color: var(--accent-color);
  background-color: transparent;
  color: var(--accent-color);
}

.clear-delete {
  color: var(--schoolink-color);
}

.btn-fsp-out:hover {
  background-color: var(--accent-color);
  color: var(--contrast-color);
}

button.editcart {
  width: 28px;
  height: 28px;
  background: var(--surface-color);
  border: solid 1px var(--midlgray-color);
  color: var(--midlgray-color);
  font-size: 18px;
  align-items: center;
  cursor: pointer;
  padding: 0;
  margin: 0 !important;
}

button.editcart.nobord {
	border: none;
}

button.editcart.noleft {
	border-left: none;
}

button.editcart.noright {
	border-right: none;
}

button.editcart:hover {
	background-color: var(--bluelite-color);
	color: var(--contrast-color);
}

button.editcart.delrec:hover {
	background-color: var(--schoolink-color);
	color: var(--contrast-color);
}

.ul-menu-empl {
	border: solid 1px var(--midlback-color); 
	width: 240px; 
	box-shadow: 5px 5px 10px rgba(0,0,0,0.25);
}	

.small-gray-11 {
	font-size: 11px;
	color: var(--midlgray-color);
}

/* Плавное изменение фона формы */
.form-cart {
    background-color: #ffffff;
    transition: background-color 0.3s ease;
}
.form-cart.is-empty {
	background: repeating-linear-gradient(
	135deg,
    transparent 0%,
    rgba(145, 50, 230, 0.5) 50%,
    transparent 100%
  );
  border-radius: 8px;
}

.toast-container {
	position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none; /* Чтобы контейнер не блокировал клики по другим элементам страницы */	
}

.toast-notification {
/*
    background-color: var(--surface-color);
	color: var(--default-color);
*/
	background-color: color-mix(in srgb, var(--schoolink-color) 60%, transparent);
	color: var(--surface-color);
/* 
	background: repeating-linear-gradient(
	135deg,
    #fff 0%,
    #9132E6 50%,
    #fff 100%
	);
    color: #ffffff;
 */	
    padding: 12px 24px;
    border-radius: 8px;
	border: 1px solid var(--schoolink-color);
    font-family: sans-serif;
    font-size: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
	box-shadow: 5px 5px 10px rgba(0,0,0,0.25);
}

/* Анимация появления */
.toast-notification.show {
    opacity: 1;
    transform: translateY(0);
}


.barcode {
  width: 28px;
  height: 10px;
  font-size: 10px;
  margin-top: 4px;
  background: 
    linear-gradient(90deg, #fff 1px, transparent 1px) 0 0 / 3px 100%,
    linear-gradient(90deg, #fff 1px, transparent 1px) 1px 0 / 5px 100%,
    linear-gradient(90deg, #fff 1px, transparent 1px) 2px 0 / 7px 100%;
}

input.ordtxt { 
	margin: 0; 
	padding: 0; 
	width: 100%;
	height: 36px; 
	border: 1px solid var(--midlback-color); 
	color: var(--accent-color); 
	background: #fff;
	font: 1.2em "Arial", Helvetica, Sans-Serif; 
	font-style: italic;
/*	maxlength: 4;*/
}

input.ordtxt:focus { 
	border-color: var(--bluelite-color);
	outline: none;
}


/*
button.editcart i {
  color: var(--default-color);
  font-size: 1.0rem;
  margin-top: 8px;
}

button.editcart i.hover {
	background-color: var(--bluelite-color);
	color: var(--contrast-color);
}
*/
/*
.diagonal-lines {
    background: linear-gradient(135deg, 
      var(--bluestar-color) 20%, 
      var(--bluelite-color) 30%, 
      var(--bluestar-color) 50%, 
      var(--bluelite-color) 100%
    );
}	
*/	

/*
.flex-container {
  display: flex;
  justify-content: space-between;
}
*/
/*
.col-small { width: 60px; }
.col-medium { width: 160px; }
.col-large { width: 320px; }
*/