/* ============================================================
   Clay Connected - ADA Color Compliance Overrides
   WCAG 2.1 AA - Minimum 4.5:1 contrast ratio on white (#FFFFFF)
   Primary text color: #1a1a1a (near-black, 18.1:1 ratio)
   Link/accent color:  #003087 (dark navy blue, 9.8:1 ratio)
   Brand teal: #132f3a (navbar + footer, 12.2:1 contrast ratio)
   Last Updated: 2026-03-27
   ============================================================ */

/* ============================================================
   SECTION 1 - BODY & GENERAL TEXT
   ============================================================ */

body, p, span, div, li, td, th,
.page-copy p, .xrm-attribute-value p, .xrm-attribute-value,
.col-md-8 p, .col-md-8 span, .entity-form p,
.tab-content p, .form-page p {
  color: #1a1a1a !important;
}

h1, h2, h3, h4, h5, h6,
.page-header h1, .page-header h2,
h1.page-title, .content-header h1,
div.page-heading h1, div.page-heading h2,
.heading-section h1, .profile-page-heading,
.panel-title, .page-heading h1, .page-heading h2 {
  color: #1a1a1a !important;
  text-shadow: none !important;
}

.page-copy a, .xrm-attribute-value a {
  color: #003087 !important;
  text-decoration: underline;
}
.page-copy a:hover, .xrm-attribute-value a:hover,
.xrm-attribute-value a:focus {
  color: #001f5c !important;
  text-decoration: underline;
}

.col-md-8, .col-md-4, .container { color: #1a1a1a; }

::selection { background-color: #132f3a !important; color: #FFFFFF !important; }
::-moz-selection { background-color: #132f3a !important; color: #FFFFFF !important; }

/* ============================================================
   SECTION 2 - FORMS & LABELS
   ============================================================ */

label, .field-label, label.field-label, .info label,
.form-group label, .form-group .control-label,
.control label, .entity-form label, fieldset label,
.tab-content label, .form-control-cell label, .section label {
  color: #1a1a1a !important;
  font-weight: 600 !important;
}

.section-heading, fieldset legend, legend, .info-section-title {
  color: #1a1a1a !important;
  font-weight: 700 !important;
}

input::placeholder, textarea::placeholder,
input[type="search"]::placeholder, input[type="text"]::placeholder,
input[type="email"]::placeholder, input[type="tel"]::placeholder,
.search-input::placeholder, #q::placeholder {
  color: #595959 !important;
  opacity: 1 !important;
}

input[type="search"], input[type="text"], input[type="email"],
input[type="tel"], input[type="text"].search-input,
.input-group input, textarea {
  color: #1a1a1a !important;
}

select, select option, .form-control option, select.form-control {
  color: #1a1a1a !important;
  background-color: #FFFFFF !important;
}
select option:checked, select option:hover {
  background-color: #132f3a !important;
  color: #FFFFFF !important;
}

/* ============================================================
   SECTION 3 - NAVBAR
   ============================================================ */

.navbar, .navbar-inverse, .navbar-static-top,
.navbar.navbar-inverse.navbar-static-top {
  background-color: #132f3a !important;
  border-color: #132f3a !important;
}

/* -- Clay Connected site title - white -- */
.siteTitle, h1.siteTitle,
.navbar-brand h1, .navbar-brand .siteTitle,
.navbar .siteTitle, .navbar-brand,
.navbar-brand span, .navbar-brand a,
.navbar-header .siteTitle {
  color: #FFFFFF !important;
  text-shadow: none !important;
}

.navbar-nav > li > a, .navbar-nav > li > a:visited,
.nav.navbar-nav > li > a, .weblinks.navbar-nav > li > a {
  color: #FFFFFF !important;
  background-color: transparent !important;
  border: none !important;
}
.navbar-nav > li > a:hover, .navbar-nav > li > a:focus,
.nav.navbar-nav > li > a:hover, .nav.navbar-nav > li > a:focus {
  color: #fbb040 !important;
  background-color: transparent !important;
  text-decoration: underline !important;
}

.navbar .dropdown-toggle, .navbar .btn.dropdown-toggle,
.navbar-nav .dropdown-toggle, .navbar .navbar-nav .btn {
  color: #FFFFFF !important;
  background-color: transparent !important;
  border: none !important;
  font-weight: normal !important;
  box-shadow: none !important;
}
.navbar .dropdown-toggle:hover, .navbar .dropdown-toggle:focus,
.navbar-nav .dropdown-toggle:hover, .navbar-nav .dropdown-toggle:focus {
  color: #fbb040 !important;
  background-color: transparent !important;
  text-decoration: underline !important;
}

.navbar .fa-home, .navbar .fa-search, .navbar .glyphicon-search,
.navbar .icon-bar, .navbar span.username, .navbar .username,
.navbar .caret, .navbar-nav .fa, .navbar-nav .glyphicon,
.navbar a span, .navbar a .fa, .navbar-icon span, .navbar-icon .glyphicon {
  color: #FFFFFF !important;
}
.navbar .fa-home:hover, .navbar .fa-search:hover,
.navbar span.username:hover, .navbar .username:hover,
.navbar .caret:hover, .navbar-nav .fa:hover, .navbar-nav .glyphicon:hover {
  color: #fbb040 !important;
}

.dropdown-menu, .navbar .dropdown-menu { background-color: #FFFFFF !important; }
.dropdown-menu > li > a, .navbar .dropdown-menu > li > a {
  color: #1a1a1a !important;
  background-color: #FFFFFF !important;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus,
.navbar .dropdown-menu > li > a:hover, .navbar .dropdown-menu > li > a:focus {
  color: #132f3a !important;
  background-color: #e8f0f4 !important;
  text-decoration: underline !important;
}

/* -- Protect navbar from button overrides -- */
.navbar .btn, .navbar .btn:hover, .navbar .btn:focus,
.navbar-nav .btn, .navbar-nav .btn:hover, .navbar-nav .btn:focus,
.navbar .btn-primary, .navbar .btn-default {
  background-color: transparent !important;
  border: none !important;
  color: #FFFFFF !important;
  box-shadow: none !important;
}

/* ============================================================
   SECTION 4 - BUTTONS
   ============================================================ */

/* -- Gold buttons - slim clean border -- */
.hero .btn, .banner .btn, .home-page .btn, .carousel .btn,
.content-panel .btn, section.page-section .btn, div.page-section .btn,
a.btn.btn-primary, .btn.btn-primary, .btn.btn-default, .btn.btn-outline,
.grid-actions .btn, .entity-grid .btn-primary, .view-toolbar .btn,
.actions .btn, .actions .btn-default, .actions .btn-outline, .actions a.btn,
input[type="submit"], input[type="button"], button[type="submit"],
button.btn-default, button.btn-outline, .btn-submit,
.btn.btn-upload, label.btn-upload, .attach-file .btn, .file-upload .btn {
  color: #000000 !important;
  background-color: #fbb040 !important;
  border: 1px solid #c07800 !important;
  font-weight: 600 !important;
}

/* -- Button hover - teal with white text -- */
.hero .btn:hover, .hero .btn:focus,
.banner .btn:hover, .banner .btn:focus,
.home-page .btn:hover, .home-page .btn:focus,
.sectionBlockLayout .btn:hover, .sectionBlockLayout .btn:focus,
.content-panel .btn:hover, .content-panel .btn:focus,
section.page-section .btn:hover, section.page-section .btn:focus,
div.page-section .btn:hover, div.page-section .btn:focus,
a.btn.btn-primary:hover, a.btn.btn-primary:focus,
.btn.btn-primary:hover, .btn.btn-primary:focus,
.btn.btn-default:hover, .btn.btn-default:focus,
.btn.btn-outline:hover, .btn.btn-outline:focus,
.grid-actions .btn:hover, .grid-actions .btn:focus,
.entity-grid .btn-primary:hover, .entity-grid .btn-primary:focus,
.view-toolbar .btn:hover, .view-toolbar .btn:focus,
.actions .btn:hover, .actions .btn:focus,
.actions .btn-default:hover, .actions .btn-default:focus,
.actions a.btn:hover, .actions a.btn:focus,
input[type="submit"]:hover, input[type="submit"]:focus,
input[type="button"]:hover, input[type="button"]:focus,
button[type="submit"]:hover, button[type="submit"]:focus,
button.btn-default:hover, button.btn-default:focus,
.btn.btn-upload:hover, .btn.btn-upload:focus {
  background-color: #132f3a !important;
  color: #FFFFFF !important;
  border: 1px solid #132f3a !important;
  text-decoration: underline !important;
}

/* -- Next button -- */
.btn.btn-primary.next,
button.btn-primary[value="Next"],
input[type="button"][value="Next"] {
  color: #FFFFFF !important;
  background-color: #132f3a !important;
  border: 1px solid #132f3a !important;
}
.btn.btn-primary.next:hover,
button.btn-primary[value="Next"]:hover,
input[type="button"][value="Next"]:hover {
  background-color: #0a1e25 !important;
  color: #FFFFFF !important;
  text-decoration: underline !important;
}

/* ============================================================
   SECTION 5 - STEPPER / TAB NAVIGATION
   (html body prefix beats Section 1 specificity)
   ============================================================ */

html body .nav-tabs > li > a,
html body .nav-tabs > li:not(.active) > a,
html body ul.nav-tabs li a {
  color: #1a1a1a !important;
  background-color: #c0c0c0 !important;
  border: 1px solid #888888 !important;
  font-weight: 600 !important;
}

html body .nav-tabs > li:not(.active) > a:hover,
html body .nav-tabs > li:not(.active) > a:focus,
html body ul.nav-tabs li:not(.active) a:hover,
html body ul.nav-tabs li:not(.active) a:focus {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
  border-color: #0047BB !important;
}

html body .nav-tabs > li.active > a,
html body .nav-tabs > li.active > a:hover,
html body .nav-tabs > li.active > a:focus {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
  border-color: #0047BB !important;
  font-weight: 600 !important;
}

html body .nav-tabs > li.complete > a,
html body .nav-tabs > li.done > a,
html body .nav-tabs > li.visited > a,
html body ul.nav-tabs li.complete a,
html body ul.nav-tabs li.done a,
html body li.complete a, html body li.done a, html body li.visited a {
  color: #1a1a1a !important;
  background-color: #c0c0c0 !important;
  border: 1px solid #888888 !important;
  font-weight: 600 !important;
}

html body .nav-tabs > li.complete > a:hover,
html body .nav-tabs > li.complete > a:focus,
html body .nav-tabs > li.done > a:hover,
html body .nav-tabs > li.done > a:focus,
html body ul.nav-tabs li.complete a:hover,
html body ul.nav-tabs li.done a:hover {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
  border-color: #0047BB !important;
}

/* ============================================================
   SECTION 6 - SIDEBAR & PROFILE
   ============================================================ */

.list-group-item, .weblinks-depth-1 .list-group-item,
.weblink-name, .nav-profile .list-group-item,
a.list-group-item, a.list-group-item:visited {
  color: #132f3a !important;
}
a.list-group-item:hover, a.list-group-item:focus {
  color: #0a1e25 !important;
  text-decoration: underline;
}
.nav-profile a, .nav-profile .list-group-item { color: #132f3a !important; }
.breadcrumb a, .breadcrumb li, .breadcrumb .active { color: #1a1a1a !important; }
.userFullName { color: #1a1a1a !important; }
.panel-heading .panel-title, .panel-heading .xrm-attribute-value { color: #1a1a1a !important; }

/* ============================================================
   SECTION 7 - TABLES & GRIDS
   ============================================================ */

.entity-grid th a, .entity-grid th, table.table th,
table.table th a, .grid-head th, .grid-head a {
  color: #1a1a1a !important;
  font-weight: 700 !important;
}
.entity-grid td, table.table td, .grid-body td { color: #1a1a1a !important; }
.view-name, .grid-title, .entity-grid-title, h3.view-title, .view-header {
  color: #1a1a1a !important;
  font-weight: 600 !important;
}

/* ============================================================
   SECTION 8 - HOMEPAGE HERO
   ============================================================ */

.hero h1, .banner h1, .carousel-caption h1 {
  color: #FFFFFF !important;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.85) !important;
}
.sectionBlockLayout[style*="background-image"],
div[style*="background-image"][style*="cover"] {
  background-attachment: scroll !important;
  background-size: cover !important;
  overflow: hidden !important;
}

/* ============================================================
   SECTION 9 - FOOTER
   ============================================================ */

footer, footer.footer, .footer-bottom, div.footer-bottom {
  background-color: #132f3a !important;
}
footer a, footer .footerbtn, .footer-bottom a,
.footer-bottom button, .footerbtn {
  color: #FFFFFF !important;
  background-color: transparent !important;
  border: none !important;
}
footer a:hover, footer a:focus,
.footer-bottom a:hover, .footer-bottom a:focus,
.footerbtn:hover, .footerbtn:focus {
  color: #fbb040 !important;
  text-decoration: underline !important;
}
footer p, footer span, footer div,
.footer-bottom p, .footer-bottom span,
.copyrightname, footer .copyrightname {
  color: #FFFFFF !important;
}
footer img.socialimage, .footer-bottom img.socialimage, .socialimage {
  filter: brightness(0) invert(1) !important;
}

/* ============================================================
   SECTION 10 - LAYOUT FIXES
   ============================================================ */

html, body { height: 100%; margin: 0 !important; padding: 0 !important; }
footer, .footer-bottom {
  position: relative;
  z-index: 10;
  width: 100%;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
}
body > div:last-of-type:empty, body > div:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}

/* ============================================================
   SECTION 11 - STEPPER PROGRESS INDICATOR FIX
   Overrides Section 6 broad .list-group-item rule.
   Exact HTML from browser inspect:
   ol.progress-list-group > li.list-group-item
   ============================================================ */

/* -- Active step - WHITE text on blue -- */
html body ol.progress-list-group > li.list-group-item.active,
html body ol.progress-list-group > li.list-group-item.active:hover,
html body ol.progress-list-group > li.list-group-item.active:focus {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
  border-color: #0047BB !important;
  font-weight: 600 !important;
}

/* -- Inactive steps - dark text on grey -- */
html body ol.progress-list-group > li.list-group-item,
html body ol.progress-list-group > li.list-group-item.incomplete {
  color: #1a1a1a !important;
  background-color: #c0c0c0 !important;
  border: 1px solid #888888 !important;
  font-weight: 600 !important;
}

/* -- Inactive step hover - WHITE text on blue -- */
html body ol.progress-list-group > li.list-group-item.incomplete:hover,
html body ol.progress-list-group > li.list-group-item.incomplete:focus {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
  border-color: #0047BB !important;
}

/* ============================================================
   SECTION 12 - SUMMARY BANNER WHITE TEXT
   Exact HTML from browser inspect: h2.tab-title
   Overrides Section 1 broad h2 rule by loading last.
   ============================================================ */

html body h2.tab-title,
html body .tab-title {
  color: #FFFFFF !important;
  text-shadow: none !important;
}

/* ============================================================
   SECTION 13 - ACTIVE STEPPER TAB NUCLEAR FIX
   li.list-group-item.active confirmed from browser inspect
   Using attribute selector for maximum specificity
   ============================================================ */

html body ol.progress-list-group li[class*="list-group-item"][class*="active"],
html body li.list-group-item.active:not(.nav-profile .list-group-item) {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
}

html body ol.progress-list-group li[class*="list-group-item"][class*="incomplete"]:hover,
html body ol.progress-list-group li[class*="list-group-item"][class*="incomplete"]:focus {
  color: #FFFFFF !important;
  background-color: #0047BB !important;
}

/* ============================================================
   SECTION 14 - HERO HEADING WHITE TEXT
   "Clay Connected" h1 over background image
   ============================================================ */

html body .sectionBlockLayout h1,
html body .hero h1,
html body .banner h1,
html body div[style*="background-image"] h1,
html body div[style*="background"] h1 {
  color: #FFFFFF !important;
  text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.6) !important;
}