h2 {	}


form {
	dl {
		display: grid;
		width: 100%;
		grid-template-columns: auto 1fr;
		gap: 1rem;


		dt { justify-self: start;  grid-column: 1; margin: 0; }
		dd { grid-column: 2; margin: 0; position: relative; 
			.error { background: #800; color: #fff; padding: 4px; }
			.field_with_errors { input[type=text], input[type=email], input[type=password] { border: 3px double #800; width: calc(100% - 14px); }}}
			input[type=text], input[type=email], input[type=password] { width: 100%; padding: 4px; }
			&:has(:required):after { content: "Required"; display: block; color: #e74c3c; font-size: 0.875rem; margin-top: 2px; text-align: left;}
			&:has(:required:valid):after {color: green;}
		}
	}
}
	
#actions input { display: block; }
.button_to {
	float: right;
	margin-top: -1.4em;
	button { background: darkred; color: white; border: 1px solid darkgrey; border-radius: 4px; }
}


.quantity_saved option[selected] { font-weight: bold; }
.product {
  a, a:hover {
    color: #000; text-decoration: none;
    dt { color: #008 !important; }
    }
  a:hover {
     dt { text-decoration: underline; }
    }
  }


dd:has(:invalid) {
  background: red;
  padding: 2px; 
  border-radius: 4px; 
  }