:root {
  --brand-white: #fff;
  --brand-black: #180e02;
  --brand-orange: #eb8700;
  --brand-dk-orange: #eb8700;
  --brand-lt-grey: #f5f5f5;
  --brand-dk-grey: #626362;

  --evo-brand-primary: var(--brand-orange);
  --evo-brand-secondary: var(--brand-black);
  --evo-brand-accent: var(--brand-dk-grey);
  --evo-header-background: var(--brand-white);
}

/* =========================
   General Colors & Backgrounds
========================= */

.text-cta { 
  background-color: var(--evo-brand-primary); 
}

.tabbed-boxes .owl-nav > div:before { 
  color: var(--brand-dk-orange); 
}

.bg-black, 
footer { 
  background-color: var(--brand-dk-grey); 
}

/* =========================
   Slide Item
========================= */

.slide-item {
  position: relative;
  background-size: cover;
  background-position: center;
  height: 600px;
  color: #fff;
}

.slide-content {
  position: absolute;
  bottom: 0;
  left: 30px;
  transform: translateY(-25%);
  max-width: 40%;
  text-align: left;
}

.slide-content .kicker {
  font-size: 0.9rem;
  text-transform: uppercase;
  margin-bottom: 0.5em;
}

.slide-content .title {
  font-size: 2.5rem;
  font-weight: bold;
  color: #fff;
  margin: 0 0 0.5em;
}

.slide-content .text {
  font-size: 1rem;
  line-height: 1.4;
  margin-bottom: 1em;
}

.slide-content .btn {
  display: inline-block;
  padding: 0.75em 1.5em;
  font-weight: bold;
  text-decoration: none;
  background: var(--brand-orange);
  color: #fff;
  border: 0;
  border-radius: 0;
}

/* =========================
   Header
========================= */

header .header-mobile { 
  background-color: #000000; 
}

header .header-mobile .header-logo .logo img { 
  content: url(https://us.evocdn.io/dealer/1554/content/media/My_Theme/LOGO-MaineOxy-458x86-1.png);
}

/* =========================
   Footer
========================= */

footer.footer {
  padding-top: 30px; 
}

footer.footer h1, 
footer.footer h2, 
footer.footer h3, 
footer.footer h4, 
footer.footer h5, 
footer.footer h6, 
footer.footer p, 
footer.footer a { 
  color: var(--brand-white); 
}

footer.footer a {
  font-weight: normal;
  text-decoration: none;
  transition:
    color 0.35s ease-in-out,
    font-weight 0.35s ease-in-out,
    opacity 0.35s ease-in-out;
}

footer.footer a:hover {
  color: #cccccc;
  font-weight: normal;
  text-decoration: none;
  opacity: 0.95;
}

footer.footer .logo_container .logo img {
  content: url('https://us.evocdn.io/dealer/1554/content/media/Brands/Maine Oxy/MEO_Full Lockup_2C-Off-White.png');
  height: auto;
  max-height: 60px;
  width: auto;
}

/* =========================
   Buttons
========================= */

.btn,
.bold-button,
.full-width-btn {
  display: inline-block;
  padding: 12px 24px;
  font-weight: bold;
  text-decoration: none;
  border: 1px solid var(--brand-orange);
  border-radius: 0;
  background-color: var(--brand-orange);
  color: #fff;
  cursor: pointer;
  transition:
    background-color 0.3s ease,
    border-color 0.3s ease,
    color 0.3s ease;
}

.btn:hover,
.bold-button:hover,
.full-width-btn:hover {
  background-color: var(--brand-dk-grey);
  color: #fff;
  border-color: var(--brand-dk-grey);
}

.full-width-btn {
  display: block;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
}

/* =========================
   White Outline Button
========================= */

.btn-outline-white {
  background-color: transparent;
  border: 2px solid var(--brand-white);
  color: var(--brand-white);
  outline: none;
  box-shadow: none;
}

.btn-outline-white:hover,
.btn-outline-white:focus,
.btn-outline-white:active {
  background-color: var(--brand-white);
  border-color: var(--brand-white);
  color: var(--brand-orange);
  outline: none;
  box-shadow: none;
}

/* Remove click outline while preserving keyboard accessibility */
.btn-outline-white:focus:not(:focus-visible) {
  outline: none;
  box-shadow: none;
}

.btn-outline-white:focus-visible {
  outline: 2px solid var(--brand-white);
  outline-offset: 3px;
  box-shadow: none;
}

/* Dashboard Buttons */

.dashboard-btn-wrap {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  text-align: left;
  max-width: 800px;
  margin: 0;
  padding-bottom: 30px;
}

.dashboard-btn {
  flex: 1 1 0;
  display: inline-block;
  background-color: var(--brand-orange);
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  padding: 8px 16px;
  font-size: 11px;
  text-align: center;
  border: 2px solid var(--brand-orange);
  outline: none;
  transition:
    background 0.3s ease,
    border 0.3s ease,
    color 0.3s ease;
  min-width: 0;
  max-width: none;
}

.dashboard-btn:hover {
  background-color: var(--brand-dk-grey);
  border: 2px solid var(--brand-dk-grey);
  color: #fff;
}

.dashboard-btn:focus {
  outline: none;
  background-color: var(--brand-orange);
  color: #fff;
  border: 2px solid var(--brand-orange);
}

/* Tablet / Mobile Dashboard Buttons */

@media (max-width: 1024px) {

  .dashboard-btn-wrap {
    flex-direction: column;
    align-items: stretch;
    padding-bottom: 0;
    gap: 0;
  }

  .dashboard-btn {
    display: block;
    width: 100%;
    padding: 10px 16px;
    font-size: 11px;
  }

  .dashboard-btn + .dashboard-btn {
    margin-top: 10px;
  }

  .dashboard-btn:last-child {
    margin-bottom: 30px;
  }
}

/* =========================
   Product & Misc Layouts
========================= */

.productsummary_container .productdetails .prod-code span,
.productspecs_container .tech-specs .item:nth-child(odd),
div.customertools .customertools-container,
#cdash_address .with-padding-trl { 
  background-color: var(--brand-lt-grey) !important; 
}

/* Full-Width Background Utilities */

.full-width-bg-grey,
.full-width-bg-orange,
.full-width-bg-white {
  position: relative;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  box-sizing: border-box;
}

.full-width-bg-grey {
  background-color: var(--brand-dk-grey);
}

.full-width-bg-orange {
  background-color: var(--brand-orange);
}

.full-width-bg-white {
  background-color: var(--brand-white);
}

/* Columns */

.custom-cols .row > [class*="col-"],
.custom-cols .row > [class^="col"] {
  flex: 0 0 50% !important;
  max-width: 50% !important;
}

@media (max-width: 991px) {

  .custom-cols .row > [class*="col-"],
  .custom-cols .row > [class^="col"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

.custom-cols .row {
  --bs-columns: 2 !important;
}

/* Category Images */

.cat-square .category-list .category-item .category-image,
.cat-square .category-list .category-item img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 10px;
}

/* =========================
   Utility Classes
========================= */

/* Hide on Mobile */

@media (max-width: 767px) {

  .hide-mobile {
    display: none !important;
  }

  .header-menu .cd-dropdown-wrapper li.normal-mobile > a {
    font-weight: 400 !important;
    text-transform: none;
  }

  .btn,
  .bold-button,
  .full-width-btn {
    font-size: 12px;
    padding: 12px 26px;
    width: 100%;
    max-width: none;
    text-align: center;
    box-sizing: border-box;
  }

  /* Keep white outline CTA buttons compact on mobile */

  .btn.btn-outline-white {
    display: inline-block;
    width: auto;
    max-width: 100%;
  }
}

/* Hide on Tablet ≤991px */

@media (max-width: 991px) {

  .hide-tablet {
    display: none !important;
    font-weight: normal !important;
  }
}

/* Hide on Desktop ≥992px */

@media (min-width: 992px) {

  .hide-desktop {
    display: none !important;
  }
}

/* Typography Helpers */

.bold {
  font-weight: bold !important;
}

.uppercase {
  text-transform: uppercase !important;
}

.italic {
  font-style: italic !important;
}

.small {
  font-size: 0.875rem !important;
}

.large {
  font-size: 1.25rem !important;
}

.product-sku-label {
  background-color: #fff !important;
  color: #626362;
}

/* =========================
   Carousel / Owl
========================= */

.owl-nav {
  display: none !important;
}

.owl-dots {
  display: flex !important;
  justify-content: center;
  gap: 10px;
  margin-top: 15px;
}

.owl-dots .owl-dot span {
  width: 12px;
  height: 12px;
  display: block;
  border-radius: 50%;
  background-color: var(--brand-dk-grey) !important;
  transition: background-color 0.3s ease;
}

.owl-dots .owl-dot.active span {
  background-color: #fff !important;
  border: 2px solid var(--brand-dk-grey) !important;
}

.widget-carousel-no-dots .owl-dots {
  display: none !important;
}

/* =========================
   Product & Cart Layout
========================= */

.productsummary_container .productdetails .prod-code span {
  font-weight: 700;
}

.social-links {
  display: none;
}

.price-area:not(.owl-item *) {
  align-items: baseline;
}

.ex-cart .page-content .btn {
  font-size: 14px;
}

.ex-cart .page-content .btn.to-checkout {
  padding: 12px 24px;
}

.ex-cart .page-content .btn.show-more-info {
  display: none;
}

.ex-cart .page-content .btn.btn-media-full,
.ex-cart .page-content .btn.coupon_apply,
.ex-cart .page-content .cart-totals button.btn { 
  background-color: #fad8ab; 
  border: none; 
  color: var(--evo-brand-primary); 
}

/* =========================
   Header Section 2
========================= */

.headersection-2 {
  background-color: #fff !important;
}

/* =========================
   ECOMMDR-606
========================= */

.customertools .seller-reference-flyout {
  display: none;
}

.showquickview {
  display: none !important;
}

/* =========================
   Branch Details
========================= */

.widget-branch-team .imagecontent {
  display: none !important;
}

.ex-branch-details-widget {
  background-color: #626362;
  border: 1px solid #626362;
  border-radius: 0;
  padding: 10px;
}

/* ================================
   MAINE OXY SAFETY BLOG
================================ */

.safety-blog {
  font-size: 16px;
  line-height: 1.65;
}

.safety-blog p,
.safety-blog ul,
.safety-blog ol {
  font-size: 16px;
  line-height: 1.65;
}

.safety-blog p {
  margin: 0 0 16px;
}

.safety-blog ul,
.safety-blog ol {
  margin: 0 0 18px;
  padding-left: 24px;
}

.safety-blog li {
  margin-bottom: 8px;
}

/* Section Headings */

.safety-blog h2 {
  color: #eb8700;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 700;
  text-transform: uppercase;
  margin: 30px 0 14px;
}

.safety-blog h3 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  margin: 22px 0 8px;
}

.safety-blog hr {
  border: 0;
  border-top: 1px solid #dddddd;
  margin: 28px 0;
}

.safety-blog strong {
  font-weight: 700;
}

.safety-blog em {
  font-style: italic;
}

/* ================================
   FAQ SECTION
================================ */

.safety-faq-list {
  margin: 18px 0 28px;
}

.safety-faq-item {
  padding: 18px 0;
  border-bottom: 1px solid #dddddd;
}

.safety-faq-item:first-child {
  border-top: 1px solid #dddddd;
}

.safety-faq-item h3 {
  font-size: 17px;
  line-height: 1.4;
  font-weight: 700;
  margin: 0 0 8px;
}

.safety-faq-item p {
  margin: 0;
}

/* ================================
   SAFETY RESOURCE LINKS
================================ */

.safety-resources-list {
  margin: 20px 0 28px;
}

.safety-resource {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 0;
  border-bottom: 1px solid #dddddd;
}

.safety-resource:first-child {
  border-top: 1px solid #dddddd;
}

.safety-resource-content {
  flex: 1;
}

.safety-resource-title {
  display: block;
  font-weight: 700;
  margin-bottom: 3px;
}

.safety-resource-description {
  display: block;
  font-size: 14px;
  line-height: 1.45;
}

.safety-resource-button {
  display: inline-block;
  flex-shrink: 0;
  padding: 10px 18px;
  background: #eb8700;
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none !important;
  text-transform: uppercase;
  border-radius: 3px;
  transition: opacity 0.2s ease;
}

.safety-resource-button:hover,
.safety-resource-button:focus {
  opacity: 0.85;
  color: #ffffff !important;
}

/* ================================
   SAFETY BLOG MOBILE
================================ */

@media (max-width: 767px) {

  .safety-blog,
  .safety-blog p,
  .safety-blog ul,
  .safety-blog ol {
    font-size: 15px;
    line-height: 1.6;
  }

  .safety-blog h2 {
    font-size: 19px;
    line-height: 1.3;
    margin: 26px 0 12px;
  }

  .safety-blog h3 {
    font-size: 17px;
    line-height: 1.35;
  }

  .safety-blog ul,
  .safety-blog ol {
    padding-left: 21px;
  }

  .safety-blog hr {
    margin: 24px 0;
  }

  .safety-faq-item {
    padding: 16px 0;
  }

  .safety-faq-item h3 {
    font-size: 16px;
  }

  .safety-resource {
    display: block;
    padding: 16px 0;
  }

  .safety-resource-button {
    margin-top: 12px;
  }
}

/* =========================
   Blog Contact CTA
========================= */

.blog-contact-cta {
  padding: 34px 20px;
  text-align: center;
}

.blog-contact-cta-inner {
  max-width: 760px;
  margin: 0 auto;
}

.blog-contact-cta h2 {
  color: var(--brand-white);
  font-size: 22px;
  line-height: 1.25;
  font-weight: 700;
  text-transform: uppercase;
  margin: 0 0 10px;
}

.blog-contact-cta p {
  color: var(--brand-white);
  font-size: 16px;
  line-height: 1.65;
  margin: 0 0 18px;
}

.blog-contact-cta .btn {
  font-size: 13px;
  padding: 10px 18px;
}

@media (max-width: 767px) {

  .blog-contact-cta {
    padding: 28px 20px;
  }

  .blog-contact-cta h2 {
    font-size: 19px;
    line-height: 1.3;
  }

  .blog-contact-cta p {
    font-size: 15px;
    line-height: 1.6;
  }

  .blog-contact-cta .btn {
    font-size: 12px;
  }
}