/* Flash Skin for OpenCart 3.0 (default theme). Loaded after stylesheet.css.
   Palette and font from flashparking.com: Outfit; primary #004CD7, navy #003699,
   coral accent #FB555E, light blue #C4D9FF, text #585452, light #F7F7F7, border #D2CECD. */

:root {
	--flash-blue: #004CD7;
	--flash-navy: #003699;
	--flash-coral: #FB555E;
	--flash-light-blue: #C4D9FF;
	--flash-text: #585452;
	--flash-light: #F7F7F7;
	--flash-border: #D2CECD;
	--flash-black: #000000;
}

/* Type */
body, h1, h2, h3, h4, h5, h6, .btn, input, select, textarea, .dropdown-menu, #menu {
	font-family: 'Outfit', 'Helvetica Neue', Arial, sans-serif;
}
body { color: var(--flash-text); font-size: 14px; }
h1, h2, h3, h4, h5, h6 { color: var(--flash-black); font-weight: 500; }
a { color: var(--flash-blue); }
a:hover, a:focus { color: var(--flash-navy); }

/* Top bar */
#top { background: var(--flash-black); border-bottom: 0; }
#top .btn-link, #top-links li, #top-links a, #top #form-currency .btn-link { color: #fff; text-shadow: none; }
#top .btn-link:hover, #top-links a:hover { color: var(--flash-coral); }
#top-links .dropdown-menu a { color: var(--flash-text); }
#top-links .dropdown-menu a:hover { background: var(--flash-blue); color: #fff; }

/* Header: logo, store name, search, cart */
header { padding: 6px 0 2px; }
#logo { margin: 18px 0 14px; }
#logo img { max-height: 34px; width: auto; display: inline-block; }
#logo .flash-store-name {
	display: block;
	margin-top: 6px;
	color: var(--flash-text);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .12em;
	text-transform: uppercase;
}
#search .input-lg { border-color: var(--flash-border); border-radius: 4px 0 0 4px; }
#search .input-lg:focus { border-color: var(--flash-blue); box-shadow: 0 0 0 2px var(--flash-light-blue); }
#search .btn-lg { background: var(--flash-blue); background-image: none; border-color: var(--flash-blue); color: #fff; text-shadow: none; }
#cart > .btn { background: var(--flash-black); background-image: none; border-color: var(--flash-black); text-shadow: none; border-radius: 4px; }
#cart.open > .btn, #cart > .btn:hover { background: var(--flash-navy); }

/* Blue ribbon (category menu) */
#menu {
	background: var(--flash-navy);
	background-image: none;
	border: 0;
	border-bottom: 3px solid var(--flash-coral);
	border-radius: 4px 4px 0 0;
}
#menu .nav > li > a { color: #fff; text-shadow: none; font-weight: 500; letter-spacing: .01em; }
#menu .nav > li > a:hover, #menu .nav > li.open > a { background: var(--flash-blue); }
#menu .dropdown-menu { border-top: 3px solid var(--flash-coral); }
#menu .dropdown-inner a { color: var(--flash-text); }
#menu .dropdown-inner li a:hover, #menu .see-all:hover { background: var(--flash-blue); color: #fff; }
#menu #category { color: #fff; text-shadow: none; }
#menu .btn-navbar { background: var(--flash-blue); background-image: none; border-color: var(--flash-blue); }

/* Buttons */
.btn-primary, .btn-info {
	background: var(--flash-blue);
	background-image: none;
	border-color: var(--flash-blue);
	color: #fff;
	text-shadow: none;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,
.btn-info:hover, .btn-info:focus, .btn-info:active {
	background: var(--flash-navy);
	background-image: none;
	border-color: var(--flash-navy);
}
.btn-default { background-image: none; text-shadow: none; }

/* Breadcrumb, account menu, tabs, pagination */
.breadcrumb { background: var(--flash-light); border-color: #ececec; }
.breadcrumb > li:after { border-color: #ececec; }
.breadcrumb a { color: var(--flash-blue); }
.list-group a { color: var(--flash-text); }
.list-group a:hover, .list-group a.active, .list-group a.active:hover {
	background: var(--flash-light);
	color: var(--flash-blue);
	border-color: #ddd;
	box-shadow: inset 3px 0 0 var(--flash-coral);
}
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { background: var(--flash-blue); }
.nav-tabs > li.active > a { border-top: 2px solid var(--flash-coral); }
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover { background: var(--flash-blue); border-color: var(--flash-blue); }
.label-info { background: var(--flash-blue); }

/* Tables and panels */
.table thead td, .table thead th { background: var(--flash-light); color: var(--flash-black); font-weight: 500; }
.panel-default > .panel-heading { background: var(--flash-light); }

/* Shipment Tracking extension: progress bar in Flash blue. The panel's own <style> comes
   later in the page, so these selectors are one class more specific to win. Delivered
   (green) and exception (red) keep their colors. */
.st-panel .st-steps.info .st-step.done, .st-panel .st-steps.default .st-step.done { background: var(--flash-blue); }
.st-panel details summary { color: var(--flash-blue); }

/* Product cards */
.product-thumb { border-color: #e6e6e6; border-radius: 6px; }
.product-thumb h4 a { color: var(--flash-black); }
.product-thumb .button-group button { color: var(--flash-text); }
.product-thumb .button-group button:hover { background: var(--flash-blue); color: #fff; }
.price { color: var(--flash-black); }

/* Footer */
footer { background: var(--flash-black); border-top: 4px solid var(--flash-coral); color: #bdbab9; }
footer h5 { color: #fff; font-weight: 500; }
footer a { color: var(--flash-border); }
footer a:hover { color: #fff; }
footer hr { border-top-color: #333; border-bottom-color: #000; }