/* DAS Auto Parts White Plains: modern skin for the embedded Epicor parts catalog. */
html, body {
	margin: 0;
	padding: 0;
	background: #ffffff !important;
	color: #111111;
	font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}
body { padding: 8px !important; }
body * { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important; }
table { max-width: 100%; border-collapse: collapse; }
td { font-size: 13px; }

/* Breadcrumb / header line */
.smallsubnavredbold, .smallsubnavred, a.smallsubnavred {
	color: #c8102e !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	letter-spacing: .3px;
}
a.smallsubnavred:hover { text-decoration: underline !important; }

/* Headings and vehicle line */
.selectStyle, b { color: #111111; }
.selectStyle { font-size: 14px !important; font-weight: 700; }
select.selectStyle { font-weight: 400; }

/* Dropdowns and list boxes */
select {
	font-size: 13px !important;
	border: 1px solid #cfcfcf !important;
	border-radius: 6px !important;
	padding: 3px !important;
	background: #ffffff !important;
	color: #111111 !important;
	outline: none;
	box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
select:focus { border-color: #c8102e !important; box-shadow: 0 0 0 3px rgba(200,16,46,.15); }
select option { padding: 2px 4px; }

/* Year / Make / Model / Engine and Category / Group boxes: compact so every column fits the catalog width. */
form[name="vsForm"] td { padding: 0 3px !important; }
form[name="vsForm"] select { width: auto !important; min-width: 0 !important; max-width: 190px; font-size: 13px !important; padding: 3px !important; box-sizing: border-box; }
form[name="vsForm"] select[name="yearSelectCombo"] { max-width: 80px; }
form[name="vsForm"] select[name="categorySelectCombo"] { max-width: 185px; }
form[name="vsForm"] select[name="groupSelectCombo"], form[name="vsForm"] select[name*="roup"] { max-width: 360px; min-width: 200px !important; }
form[name="vsForm"] select option { padding: 2px 4px; }
select option:checked { background: #c8102e linear-gradient(0deg, #c8102e 0%, #c8102e 100%); color: #ffffff; }

/* Text inputs */
input[type="text"], input[type="search"], input:not([type]) {
	font-size: 15px !important;
	border: 1px solid #cfcfcf !important;
	border-radius: 8px !important;
	padding: 9px 12px !important;
}
input[type="text"]:focus { border-color: #c8102e !important; outline: none; box-shadow: 0 0 0 3px rgba(200,16,46,.15); }

/* Buttons (text buttons and old image buttons) */
input[type="submit"], input[type="button"], button {
	background: #c8102e !important;
	color: #ffffff !important;
	border: 0 !important;
	border-radius: 8px !important;
	padding: 9px 16px !important;
	font-weight: 700 !important;
	cursor: pointer;
}
input[type="submit"]:hover, input[type="button"]:hover, button:hover { background: #a50d26 !important; }
input[type="image"] { border-radius: 6px; }

/* Column headers in list boxes and results */
td[bgcolor="#CCCCCC"], td[bgcolor="#cccccc"], tr[bgcolor="#CCCCCC"] td, th {
	background: #111111 !important;
	color: #ffffff !important;
	font-weight: 700 !important;
	padding: 8px 10px !important;
}

/* Results table */
#partsListForm table { width: 100% !important; }
#partsListForm tr[bgcolor="#FFFFFF"] td { border-bottom: 1px solid #eeeeee; padding: 8px 6px !important; vertical-align: top; }
#partsListForm tr:hover td { background: #fafafa; }
.partNumber { font-weight: 800; color: #111111; font-size: 14px; }
.partDescription, .partDescription a, a.linklegal { color: #333333 !important; font-size: 14px; text-decoration: none !important; }
a.linklegal:hover { color: #c8102e !important; }
input[type="checkbox"] { width: 17px; height: 17px; accent-color: #c8102e; }

/* Brand rows inside results (bold brand names) */
#partsListForm td b, #partsListForm td strong { color: #c8102e; letter-spacing: .5px; }

/* Links */
a { color: #c8102e; }

/* Hide dated spacer bars and the old footer logo block */
img[src*="blk_bar.gif"], img[src*="activant_small.gif"] { display: none !important; }

/* ---------- DAS stock layer ---------- */
.das-wrap { margin: 6px 0 16px; }
.das-panel, .das-list {
	border: 2px solid #17692b;
	border-radius: 10px;
	background: #f3fbf5;
	padding: 14px;
	margin-bottom: 12px;
}
.das-list { border-color: #111111; background: #ffffff; }
.das-panel.das-loading { border-color: #e5e5e5; background: #fafafa; }
.das-panel.das-empty { border-color: #e5e5e5; background: #fafafa; }
.das-panel-head, .das-list-head { font-weight: 800; font-size: 16px; color: #17692b; margin-bottom: 8px; }
.das-list-head { color: #111111; }
.das-loading .das-panel-head, .das-empty .das-panel-head { color: #111111; }
.das-bar { height: 8px; background: #e5e5e5; border-radius: 99px; overflow: hidden; margin: 6px 0 8px; }
.das-bar span {
	display: block; height: 100%; width: 8%;
	background: linear-gradient(90deg, #c8102e, #ffc20e, #c8102e);
	background-size: 200% 100%;
	animation: das-slide 1.2s linear infinite;
	transition: width .3s ease;
}
@keyframes das-slide { from { background-position: 0 0; } to { background-position: 200% 0; } }
.das-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.das-table th { background: transparent !important; color: #555555 !important; font-size: 12px !important; text-align: left; padding: 4px 6px !important; border-bottom: 1px solid #d6eedb; }
.das-table td { padding: 7px 6px; border-bottom: 1px solid #e3efe6; vertical-align: middle; }
.das-muted { color: #555555; font-size: 12px; }
.das-eq { display: inline-block; margin-left: 4px; padding: 1px 6px; border-radius: 4px; background: #eef4ff; color: #1d3f8a; border: 1px solid #a9c1f0; font-size: 11px; font-weight: 700; vertical-align: middle; }
.das-c2c { margin: 6px 0 2px; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px; }
.das-c2c-img { width: 72px; height: 72px; object-fit: contain; background: #fff; border: 1px solid #e5e5e5; border-radius: 6px; cursor: zoom-in; }
.das-c2c-big .das-c2c-img { width: 240px; height: 240px; cursor: zoom-out; }
.das-c2c-btn { background: #f2f2f2 !important; color: #111111 !important; padding: 4px 10px !important; font-size: 12px !important; border-radius: 6px !important; }
.das-c2c-specs { flex-basis: 100%; font-size: 12px; background: #fafafa; border: 1px solid #eeeeee; border-radius: 6px; padding: 8px 10px; columns: 2; column-gap: 16px; }
.das-c2c-specs div { break-inside: avoid; padding: 2px 0; }
.das-c2c-specs span { color: #666666; }
.das-warn { color: #a15c00; font-weight: 700; }
.das-total { text-align: right; font-size: 15px; margin-top: 8px; }
.das-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.das-btn { display: inline-block; border-radius: 8px !important; padding: 7px 12px !important; font-weight: 700 !important; font-size: 13px !important; text-decoration: none !important; cursor: pointer; border: 0 !important; }
.das-btn-red { background: #c8102e !important; color: #ffffff !important; }
.das-btn-dark { background: #111111 !important; color: #ffffff !important; }
.das-btn-light { background: #eeeeee !important; color: #111111 !important; }
.das-qty { width: 56px; padding: 4px 6px !important; border-radius: 6px !important; }
.das-x { background: #eeeeee !important; color: #111111 !important; padding: 2px 9px !important; }

@media (max-width: 600px) {
	body { padding: 8px !important; }
	.das-table th:nth-child(3), .das-table td:nth-child(3) { display: none; }
}

/* Loading overlay: spinner plus a bar that fills while the next catalog screen loads. */
#das-loading > div { position: relative; padding: 18px 26px 16px 62px !important; font-size: 16px !important; text-align: left !important; min-width: 230px; }
#das-loading > div::before { content: ""; position: absolute; left: 20px; top: 16px; width: 26px; height: 26px; border-radius: 50%; border: 3px solid #444; border-top-color: #ffc20e; border-right-color: #c8102e; animation: das-spin .8s linear infinite; }
#das-loading > div::after { content: "Getting parts for your vehicle"; display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: #bbbbbb; }
#das-loading > div > div { width: 100% !important; margin-top: 12px !important; }
#das-loading > div > div > div { width: 0 !important; margin-left: 0 !important; animation: das-fill 9s cubic-bezier(.08,.75,.25,1) forwards !important; }
@keyframes das-spin { to { transform: rotate(360deg); } }
@keyframes das-fill { 0% { width: 4%; } 30% { width: 55%; } 60% { width: 78%; } 100% { width: 94%; } }

/* In-stock panel: short rows in yellow, (i) details button. */
.das-table tr.das-short td { background: #fff4c2; }
.das-short-key { background: #fff4c2; padding: 0 4px; border-radius: 3px; font-weight: 700; }
button.das-info { display: inline-block !important; width: 18px !important; height: 18px !important; min-width: 0 !important; line-height: 16px !important; padding: 0 !important; margin: 0 4px 0 0 !important; border-radius: 50% !important; border: 1px solid #c8102e !important; background: #fff !important; color: #c8102e !important; font: italic 700 12px Georgia, serif !important; text-align: center; cursor: pointer; vertical-align: 1px; box-shadow: none !important; }
button.das-info:hover { background: #c8102e !important; color: #fff !important; }

/* Use the full frame width: the catalog's fixed 550px layout tables stretch to fit. */
table[width="550"], td[width="550"] { width: 100% !important; }
