/* M-Val theme for the public Supplier Application form (/supplier-application).
   Scoped by path so no other web page is affected. The theme is the two colours of the
   M-Val logo - the red "V" and the navy "M-VAL"; fonts are inherited. */

body[data-path^="supplier-application"] {
	--mv-red: #a21d25;
	--mv-red-dark: #7a151c;
	--mv-navy: #10426f;
	--mv-navy-soft: #e8eef4;
	--mv-text: #141b22;
	--mv-muted: #6b7682;
	--mv-border: #e6e8eb;
	--mv-green: #148f5b;
	--mv-green-soft: #e4f5ec;
	background: #f3f4f6;
	color: var(--mv-text);
}

/* Page heading card: navy band with a red rule, like the emails */
/* (!important: the web form's own stylesheet sets these with !important) */
body[data-path^="supplier-application"] .web-form-header {
	background-color: var(--mv-navy) !important;
	border: 0 !important;
	border-bottom: 4px solid var(--mv-red) !important;
	border-radius: 10px 10px 0 0;
}
body[data-path^="supplier-application"] .web-form-header h1,
body[data-path^="supplier-application"] .web-form-header h2,
body[data-path^="supplier-application"] .web-form-header .web-form-title { color: #fff !important; }
body[data-path^="supplier-application"] .web-form-header .web-form-introduction,
body[data-path^="supplier-application"] .web-form-header .web-form-introduction *,
body[data-path^="supplier-application"] .web-form-header p { color: rgba(255, 255, 255, .9) !important; }

/* Buttons */
body[data-path^="supplier-application"] .btn-primary,
body[data-path^="supplier-application"] .btn-primary:focus {
	background: var(--mv-red);
	border-color: var(--mv-red);
	color: #fff;
}
body[data-path^="supplier-application"] .btn-primary:hover,
body[data-path^="supplier-application"] .btn-primary:active {
	background: var(--mv-red-dark) !important;
	border-color: var(--mv-red-dark) !important;
	color: #fff;
}

/* Step pills */
body[data-path^="supplier-application"] .wizard-step-pill.active,
body[data-path^="supplier-application"] .wizard-step-pill.active:hover {
	background: var(--mv-navy-soft);
	color: var(--mv-navy);
}
body[data-path^="supplier-application"] .wizard-step-pill.active .wizard-step-num {
	background: var(--mv-navy);
	color: #fff;
}
body[data-path^="supplier-application"] .wizard-step-pill.done {
	background: var(--mv-green-soft);
	color: var(--mv-green);
}
body[data-path^="supplier-application"] .wizard-step-pill.done .wizard-step-num {
	background: var(--mv-green);
	color: #fff;
}

/* Headings, links, focus */
body[data-path^="supplier-application"] .web-form .section-head { color: var(--mv-text); }
body[data-path^="supplier-application"] .web-form a:not(.btn) { color: var(--mv-navy); }
body[data-path^="supplier-application"] .web-form .form-control:focus,
body[data-path^="supplier-application"] .web-form select:focus {
	border-color: var(--mv-navy);
	box-shadow: 0 0 0 2px rgba(16, 66, 111, .18);
}
body[data-path^="supplier-application"] .web-form .control-label .text-danger,
body[data-path^="supplier-application"] .web-form .reqd-star { color: var(--mv-red); }
