/* ===================================================================
   custom.css – webmessage
   Only: switch to Arial + black body text
   =================================================================== */

/* -------------------------------------------------------------------
   Fonts (no web import needed for Arial)
------------------------------------------------------------------- */
/* (Removed Instrument Sans import) */

/* -------------------------------------------------------------------
   Base / Reset
------------------------------------------------------------------- */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: #ffffff;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px;
  line-height: 1.5;
  color: #000000; /* black */
}

*, *::before, *::after { box-sizing: border-box; }

/* Force Login Page White */
body,
body.login,
.wdes-wrap-account-page {
  background-color: #ffffff !important;
  background-image: none !important;
}

/* Autofill fix */
input:-webkit-autofill {
  -webkit-text-fill-color: #000 !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
}

/* Links */
a { color: #000000 !important; text-decoration: none; }
a:hover, a:focus, a:active { color: #0000ff !important; text-decoration: underline; }
a:focus, a:focus img, .header .navbar-brand:focus { outline: none !important; box-shadow: none !important; border: none !important; }

/* -------------------------------------------------------------------
   Buttons (global)
------------------------------------------------------------------- */
/* Base */
.btn-primary,
button.btn.btn-primary,
a.btn.btn-primary,
input[type="submit"].btn.btn-primary {
  background-color: #0000ff !important;
  border-color: #0000ff !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  border-radius: 0px !important;
  box-shadow: none !important;
  text-decoration: none !important;          /* no underline by default */
}

/* Hover + focus: add underline */
.btn-primary:hover,
button.btn.btn-primary:hover,
a.btn.btn-primary:hover,
input[type="submit"].btn.btn-primary:hover,
.btn-primary:focus-visible,
button.btn.btn-primary:focus-visible,
a.btn.btn-primary:focus-visible,
input[type="submit"].btn.btn-primary:focus-visible {
  background-color: #0000ff !important;
  border-color: #0000ff !important;
  color: #ffffff !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;                /* nicer spacing */
  text-decoration-thickness: from-font;
}
/* Keep inputs white (default + focus) */
input.form-control,
textarea.form-control,
select.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
textarea,
select {
  background-color: #ffffff !important;
  border: 1px solid #DCE1E1 !important; /* your border color */
  color: #000000 !important;
  box-shadow: none !important;       /* kill BS/Theme shadows */
}

/* On focus: stay white (remove blue tint) */
input.form-control:focus,
textarea.form-control:focus,
select.form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus {
  background-color: #ffffff !important;
  border-color: #DCE1E1 !important;   /* keep or change if you want */
  outline: none !important;
  box-shadow: none !important;
}

/* Chrome/Safari autofill: remove colored background */
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: #000000 !important;
  transition: background-color 9999s ease-in-out 0s !important;
  box-shadow: 0 0 0px 1000px #ffffff inset !important;
  background-clip: content-box !important;
}

/* Firefox autofill */
input:-moz-autofill,
textarea:-moz-autofill,
select:-moz-autofill {
  box-shadow: 0 0 0px 1000px #ffffff inset !important;
  -moz-text-fill-color: #000000 !important;
}

/* If your theme adds a subtle blue via classes, neutralize it */
.bg-primary,
.bg-primary-subtle,
.has-primary,
.input-primary,
.form-control.bg-light,
.form-control.bg-primary,
.form-control.is-valid,
.form-control.is-invalid {
  background-color: #ffffff !important;
}

/* -------------------------------------------------------------------
   Tables
------------------------------------------------------------------- */
.table.table-list tbody tr:hover td { background: #F2F2F7 !important; color: #000000 !important; }
.table.table-list tbody td { color: #000000 !important; transition: .2s color ease; font-weight: 400 !important; }
.table-container .dataTables_wrapper table.table-list thead th.sorting_asc::after,
.table-container .dataTables_wrapper table.table-list thead th.sorting_desc::after { color: #496200 !important; }
.table-native tbody tr td.masspay-invoice-id{ color:#496200 !important; }

/* -------------------------------------------------------------------
   Inputs
------------------------------------------------------------------- */
input.form-control, select.form-control, textarea.form-control {
  color: #000000 !important;
  background: #fff !important;
  border: 1px solid #DCE1E1 !important;
  border-radius: 0px !important;
  box-shadow: none !important;
}
select.form-control, input.form-control { transition: all 0.2s ease; }

/* -------------------------------------------------------------------
   Headings
------------------------------------------------------------------- */
div.header-lined h1 {
  font-weight: 400; font-size: 24px; color: #000000 !important;
  padding: 10px 0; margin-bottom: 0; border-bottom: none;
}
strong { font-weight: 400 !important; }

/* Hide Page Headers & Announcements on account login page */
.wdes-wrap-account-page_main-article_heading .header-lined,
.wdes-wrap-account-page_main-article_heading .header-lined h1,
.wdes-wrap-account-page_main-article_heading .header-lined small,
.wdes-announcements-carousel .wdes-account-page-announcement-single {
  display: none !important; height: 0 !important; padding: 0 !important; margin: 0 !important; visibility: hidden !important;
}

/* -------------------------------------------------------------------
   Panels / Cards
------------------------------------------------------------------- */
.panel .panel-heading,
.client-home-panels .panel .panel-heading { background: #ffffff !important; }

/* Dashboard Buttons (footer) */
.panel.panel-sidebar > .panel-footer .btn,
.sidebar .panel > .panel-footer .btn {
  color: #000000 !important; background: #ffffff !important;
}
.panel.panel-sidebar > .panel-footer .btn:hover,
.sidebar .panel > .panel-footer .btn:hover {
  color: #496100 !important; background: #ffffff !important;
}

/* Domain Registration Panel title buttons (legacy home tiles) */
.panel[menuitemname="Register a New Domain"] .input-group-btn .btn-default,
.client-home-panels .panel[menuitemname="Register a New Domain"] .input-group-btn .btn-default {
  color: #0000ff !important; background: #ffffff !important;
}
.panel[menuitemname="Register a New Domain"] .input-group-btn .btn-default:hover,
.panel[menuitemname="Register a New Domain"] .input-group-btn .btn-default:focus,
.client-home-panels .panel[menuitemname="Register a New Domain"] .input-group-btn .btn-default:hover,
.client-home-panels .panel[menuitemname="Register a New Domain"] .input-group-btn .btn-default:focus {
  color: #496100 !important; background: #ffffff !important;
}
.panel[menuitemname="Register a New Domain"] .input-group-btn .btn-success,
.client-home-panels .panel[menuitemname="Register a New Domain"] .input-group-btn .btn-success {
  color: #0000ff !important; background: #ffffff !important;
}

/* -------------------------------------------------------------------
   Tiles (client home)
------------------------------------------------------------------- */
.tiles .tile,
.tiles .tile::before,
.tiles .tile::after,
.tiles .tile:hover,
.tiles .tile:hover::before,
.tiles .tile:hover::after { border: none !important; box-shadow: none !important; }
.tiles .tile .icon,
.tiles .tile i, .tiles .tile .fa, .tiles .tile [class*="fa-"] { display: none !important; }
.tiles .tile:nth-child(1){ background:#EBE5FD !important; }
.tiles .tile:nth-child(2){ background:#FFECE9 !important; }
.tiles .tile:nth-child(3){ background:#FEFCE8 !important; }
.tiles .tile:nth-child(4){ background:#F4FAFE !important; }
.tiles .tile .stat, .tiles .tile .title { color:#000000 !important; font-weight: normal; }
.tiles .tile:hover, .tiles .tile:hover a { border: 1px solid #0000ff !important; color: #0000ff !important; }

/* -------------------------------------------------------------------
   Alerts
------------------------------------------------------------------- */
.alert { border: none !important; box-shadow: none !important; }

.alert.alert-danger .btn:not(.close) {
  color: #ffffff !important;
  font-weight: 600 !important;
  background: #0000ff !important;
  border: none !important;
}

/* underline on hover (and for keyboard users) */
.alert.alert-danger .btn:not(.close):hover,
.alert.alert-danger .btn:not(.close):focus,
.alert.alert-danger .btn:not(.close):active,
.alert.alert-danger .btn:not(.close):focus-visible {
  color: #ffffff !important;
  background: #0000ff !important;
  border: none !important;
  text-decoration: underline !important;
  outline: 0 !important; /* optional */
}

/* -------------------------------------------------------------------
   Login / Account wrapper
------------------------------------------------------------------- */
.wdes-wrap-account-page,
.wdes-wrap-account-page > * {
  display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; width:100%;
}
.wdes-wrap-account-page { min-height:100vh !important; padding:20px; }
.wdes-wrap-account-page_header { margin-bottom: 20px; }
.wdes-wrap-account-page_header .phox-logo--light { height: 45px; }
.wdes-wrap-account-page_main_article {
  background:#fff !important; border:1px solid #DCE1E1 !important; border-radius:0px; padding:30px; max-width:600px; width:100%; box-shadow:none;
}
.wdes-wrap-account-page_main_article input,
.wdes-wrap-account-page_main_article button,
.wdes-wrap-account-page_main_article .form-control,
.wdes-wrap-account-page_main_article .input-group,
.wdes-wrap-account-page_main_article form { width:100%; color:#000000 !important; }
input#login.btn-primary { padding:10px 30px; }

/* Footer branding (login pages) */
.wdes-wrap-account-page p[style*="text-align:center"]{
  position:absolute; bottom:10px; left:50%; transform:translateX(-50%); width:100%; font-size:12px; text-align:center !important;
}

/* Language Dropdown */
.languages-list .dropdown-toggle.choose-language {
  color: #000000 !important; font-weight: 500; background: transparent; border: 1px solid #dce2da; border-radius: 6px; padding: 6px 12px; transition: all 0.3s ease;
}
.languages-list .dropdown-toggle.choose-language:hover {
  color: #0000ff !important; border-color: #496100 !important;
}
.languages-list .dropdown-menu li a { color: #000000 !important; transition: color 0.2s ease-in-out; }
.languages-list .dropdown-menu li a:hover { color: #0000ff !important; }

/* -------------------------------------------------------------------
   Sidebar links + Support palette
------------------------------------------------------------------- */
.sidebar .panel.panel-sidebar .list-group a.list-group-item,
.sidebar .panel .list-group a.list-group-item,
.wdes-page-order #order-phox .cart-sidebar .panel.panel-sidebar .list-group a.list-group-item,
.wdes-page-order #order-phox .cart-sidebar .panel .list-group a.list-group-item,
.sidebar-collapsed .panel.panel-sidebar .list-group a.list-group-item,
.sidebar-collapsed .panel .list-group a.list-group-item:hover {
  color: #0000ff !important;
}

/* Support (two attribute variants for theme compatibility) */
.sidebar-secondary [menuitemname="Support"] .panel-title,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item .sidebar-menu-item-icon,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item i,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item .sidebar-menu-item-icon {
  color: #000000 !important;
}
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item:hover,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item:focus,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item.active,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item:hover,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item:focus,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item.active {
  color: #0000ff !important;
}
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item:hover .sidebar-menu-item-icon,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item.active .sidebar-menu-item-icon,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item:hover i,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item.active i,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item:hover .sidebar-menu-item-icon,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item.active .sidebar-menu-item-icon {
  color: #0000ff !important;
}
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item,
.sidebar-secondary [menuitemname="Support"] .list-group > a.list-group-item .sidebar-menu-item-icon,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item,
.sidebar-secondary [menuItemName="Support"] .list-group .list-group-item .sidebar-menu-item-icon {
  transition: color .15s ease-in-out;
}

/* -------------------------------------------------------------------
   Status labels
------------------------------------------------------------------- */
.label-success { background:#ACE502 !important; color:#496200 !important; }
.panel[menuitemname="Active Products/Services"] .div-service-status .label-success,
.client-home-panels .panel[menuitemname="Active Products/Services"] .div-service-status .label-success { color: #496100 !important; }
span.label.status.status-active { color:#496200 !important; fill:#496200 !important; }
span.label.status.status-active svg { stroke:#496200 !important; fill:#496200 !important; }

/* Dropdown hover tint */
.dropdown-menu .dropdown-item:hover,
.dropdown-menu li.dropdown-item:hover,
.dropdown-menu > li > a:hover { color: #0000ff !important; }

/* -------------------------------------------------------------------
   cPanel panels
------------------------------------------------------------------- */
#cPanelPackagePanel .cpanel-package-details em,
#cPanelPackagePanel .cpanel-package-details h4 {
  font-weight: 400 !important; color: #000000 !important;
}
#cPanelPackagePanel .cpanel-package-details::before {
  color: #000000 !important; font-weight: 300 !important; opacity: 0.7 !important; font-size: 0px !important;
}
#cPanelPackagePanel {
  background: #ffffff !important; box-shadow: none !important; border: 1px solid #DCE1E1 !important;
  display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-align: center !important;
}
#cPanelUsagePanel {
  background-color: #ffffff !important; border: 1px solid #DCE1E1 !important; box-shadow: none !important; border-radius: 0px !important; padding: 20px !important; margin-top: 20px !important; text-align: center !important;
}
#cPanelUsagePanel .usage-title { color: #000000 !important; font-weight: 500 !important; font-size: 16px !important; }
#cPanelUsagePanel .text-muted { color: #000000 !important; font-size: 13px !important; }
#cPanelUsagePanel .cpanel-usage-stats { color: #000000 !important; }

/* Input-groups */
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:first-child>.btn-group:not(:first-child)>.btn,
.input-group-btn:first-child>.btn:not(:first-child),
.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group>.btn,
.input-group-btn:last-child>.dropdown-toggle {
  background-color: #ffffff !important; box-shadow: none !important; border: none !important;
}
.sidebar .panel.view-filter-btns .list-group-item:hover *, .wdes-page-order #order-phox .cart-sidebar .panel.view-filter-btns .list-group-item:hover *, .sidebar-collapsed .panel.view-filter-btns .list-group-item:hover * {
    color: #0000ff !important;
}
.sidebar .panel.view-filter-btns .list-group-item.active .badge, .wdes-page-order #order-phox .cart-sidebar .panel.view-filter-btns .list-group-item.active .badge, .sidebar-collapsed .panel.view-filter-btns .list-group-item.active .badge {
       background-color: #0000ff !important;
}
/* -------------------------------------------------------------------
   Banner (marketing)
------------------------------------------------------------------- */
.page-banner{
  background-color: #F7F7F7 !important;
  border-radius:0 !important;
  margin-top:-60px !important;   /* pulls the whole banner up */
}
.page-banner-wrapper{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:60px 50px;             /* keep padding normal (no negatives) */
  text-align:center;
}

.page-banner-wrapper h1, .page-banner-wrapper p { text-align: center; }
.page-banner .banner-thumb, .page-banner .banner-thumb svg { display: none !important; }
.page-banner .page-banner-wrapper { justify-content: center !important; }
.page-banner .banner-content { margin: 0 auto !important; text-align: center !important; }

/* -------------------------------------------------------------------
   Order Form (order-phox)
------------------------------------------------------------------- */

/* Domain search inputs */
.wdes-page-order #order-phox .form-control,
.wdes-page-order #order-phox textarea,
.wdes-page-order #order-phox .field {
  background:#fff !important; color:#000 !important;
  border:1px solid #DCE1E1 !important; border-radius:0px !important;
  font-family:'DM Sans', Arial, sans-serif !important; font-size:14px !important; font-weight:400 !important;
  padding:10px 10px !important; height:auto !important; min-width:20px; box-shadow:none !important; outline:none !important;
}

/* Domain register row (centered) */
.wdes-page-order #order-phox .domain-register-box{
  display:flex; align-items:center; justify-content:center; gap:12px; max-width:700px; margin:0 auto; padding:20px 0;
}
.wdes-page-order #order-phox .domain-register-box .form-control{
  padding:40px 10px !important; height:48px !important; border:0 !important; border-radius: 0px !important; box-shadow:none !important; min-width:320px;
}
.wdes-page-order #order-phox .domain-register-box .btn,
.wdes-page-order #order-phox #btnCheckAvailability{
  height:48px !important; padding:14px 24px !important; border-radius:0px !important; font-weight:900 !important;
  background:#0000ff !important; color:#ffffff !important; border:0 !important;
}

/* Mobile tweaks for domain register box */
@media (max-width: 767px){
  #order-phox .domain-register-box{ flex-direction:column !important; align-items:center; gap:12px; max-width:100% !important; padding:0 !important; margin:0 auto !important; }
  #order-phox .domain-register-box .form-control{ width:100% !important; max-width:420px !important; padding:16px 20px !important; font-size:16px !important; }
  #order-phox .domain-register-box #btnCheckAvailability,
  #order-phox .domain-register-box .domain-check-availability,
  #order-phox .domain-register-box .btn.btn-primary.domain-check-availability{
    width:auto !important; min-width:140px !important; padding:12px 18px !important; font-size:14px !important; border-radius:0px !important;
  }
}
#order-phox #frmDomainTransfer .panel .panel-body {
 background:#F2F2F7 !important; color:#000000 !important;
  border-radius:0px !important; 
}
/* Order Summary – right card */
#order-phox #orderSummary{
  background:#F2F2F7 !important; color:#000000 !important;
  border-radius:0px !important; padding:28px 24px !important;
  border:0 !important; box-shadow:none !important;
}
#order-phox #orderSummary .order-summary{
  background:transparent !important; border:0 !important; box-shadow:none !important; padding:0 !important;
}
#order-phox #orderSummary h1,
#order-phox #orderSummary h2,
#order-phox #orderSummary h3,
#order-phox #orderSummary .summary-container,
#order-phox #orderSummary .summary-container *,
#order-phox #orderSummary .amt,
#order-phox #orderSummary span{ color:#000000 !important; }
#order-phox #orderSummary .summary-container > *{ margin:6px 0 !important; }
#order-phox #orderSummary .summary-container hr{ border:0; border-top:0px solid #DAE5CC !important; margin:10px 0 !important; }
#order-phox #orderSummary .total-due-today .amt{ font-weight:400 !important; font-size:22px !important; line-height:1.2 !important; }
#order-phox #orderSummary .btn-add-to-cart,
#order-phox #orderSummary .btn,
#order-phox #orderSummary button[type="submit"],
#order-phox #orderSummary .wdes-phox-cart_btn{
  background:#0000ff !important; border-color:#0000ff !important; color:#ffffff !important;
  font-weight:400 !important; border-radius:0px !important; box-shadow:none !important;
}
#order-phox #orderSummary .btn-add-to-cart:hover,
#order-phox #orderSummary .btn:hover,
#order-phox #orderSummary button[type="submit"]:hover,
#order-phox #orderSummary .wdes-phox-cart_btn:hover{
  background:#0000ff !important; border-color:#0000ff !important; color:#ffffff !important;
}
/* Domain search/suggestions “Register a New Domain” look */
#order-phox .wdes-phox-domain-result .domain-checker-result-headline-content { 
    color: #496200 !important;
    font-size: 18px !important;
    }
#order-phox .wdes-phox-domain-result .domain-lookup-primary-results .headline i,
#order-phox .wdes-phox-domain-result .domain-lookup-primary-results .domain-checker-result-headline i {
  color: #0000ff !important; font-size: 40px !important;
}
#order-phox .wdes-phox-domain-result .domain-lookup-primary-results .domain-price .price {
  font-weight: 400 !important; color: #072032 !important; font-size: 16px !important;
}
#order-phox .section--suggested-domains .suggested-domains .domain-suggestion .domain,
#order-phox .section--suggested-domains .suggested-domains .domain-suggestion .price,
.suggested-domains .extension {
  color: #072032 !important; font-size: 16px !important; font-weight: 400 !important;
}
#order-phox .section--suggested-domains .suggested-domains .domain-suggestion .btn {
  color: #0000ff !important; background: #ffffff !important; border-color: #ffffff !important;
}

/* Billing-cycle discount pill — make text #496200 with strong specificity */
#order-phox .discount .discount-percent,
#order-phox span.label.discount-percent { color:#496200 !important; }
#order-phox .form-group-billingcycle-wrapper .form-check .form-check-label p.discount .label.discount-percent,
#order-phox .form-group-billingcycle-wrapper .form-check label.form-check-label p.discount span.label.discount-percent,
#order-phox .form-group-billingcycle-wrapper .form-check .content-radio-item p.discount .label.discount-percent,
#order-phox .form-check .form-check-label .content-radio-item p.discount .label.discount-percent { color:#496200 !important; }
#order-phox .form-group-billingcycle-wrapper .form-check .form-check-label p.discount .label.discount-percent *,
#order-phox .discount .label.discount-percent i,
#order-phox .discount .label.discount-percent .fa,
#order-phox .discount .label.discount-percent .fas { color:#496200 !important; }

/* “No Hosting! Click to Add” style */
#order-phox .domain-info-meta .label.label-danger{
  background:#fff !important; color:#d9534f !important; border:1px solid #d9534f !important; border-radius:6px !important;
}
/* Checkout button cart icon — make it smaller and align nicely */
#order-phox .btn-add-to-cart .added i[class*="fa-shopping-cart"],
#order-phox .suggested-domains .btn.product-domain .added i[class*="fa-shopping-cart"],
#order-phox #orderSummary .wdes-phox-cart_btn i[class*="fa-shopping-cart"] {
  font-size: 0.9em !important;   /* smaller than the text */
  line-height: 1 !important;
  vertical-align: -1px;           /* slight nudge for baseline */
  margin-right: 6px;              /* keep space before "Checkout" */
}

/* If the button uses .btn-lg, make the icon a touch smaller again */
#order-phox .btn-add-to-cart.btn-lg .added i[class*="fa-shopping-cart"] {
  font-size: 0.85em !important;
}
/* "Already Registered?" button on checkout */
#order-phox #btnAlreadyRegistered,
#order-phox button#btnAlreadyRegistered.btn,
#order-phox .btn.btn-info#btnAlreadyRegistered {
  background-color: #EEF3E9 !important;
  border-color: #EEF3E9 !important;
  color: #496200 !important;     /* text color */
  font-weight: 700 !important;   /* bold */
  box-shadow: none !important;
}

/* Keep the same look on hover/focus/active */
#order-phox #btnAlreadyRegistered:hover,
#order-phox #btnAlreadyRegistered:focus,
#order-phox #btnAlreadyRegistered:active,
#order-phox #btnAlreadyRegistered:active:focus {
  background-color: #E7EEDB !important;  /* subtle hover */
  border-color: #E7EEDB !important;
  color: #496200 !important;
  outline: none !important;
}
/* Mailing list toggle: "Yes" state — pale green bg + dark text (bold) */
#order-phox .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
  background-color: #EEF3E9 !important; /* replace default green */
  border-color: #EEF3E9 !important;
  color: #496200 !important;            /* text (Yes) */
  font-weight: 700 !important;          /* bold */
  text-shadow: none !important;
}

/* Keep the same look on hover/focus while ON */
#order-phox .bootstrap-switch.bootstrap-switch-on
  .bootstrap-switch-handle-on.bootstrap-switch-success:hover,
#order-phox .bootstrap-switch.bootstrap-switch-on
  .bootstrap-switch-handle-on.bootstrap-switch-success:focus {
  background-color: #E7EEDB !important;
  border-color: #E7EEDB !important;
  color: #496200 !important;
}
/* ===== Fix: input icons and placeholder text overlapping ===== */

/* Left icon inside inputs (e.g., First Name) */
#order-phox .form-group.prepend-icon { position: relative; }

#order-phox .form-group.prepend-icon .field-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  line-height: 1;
  pointer-events: none;
  font-size: 14px;
  color: #9aa5b1;
}

#order-phox .form-group.prepend-icon .form-control,
#order-phox .form-group.prepend-icon .field {
  padding-left: 44px !important;  /* gives room for the icon */
}

/* Right icon inside inputs (if any) */
#order-phox .form-group.append-icon { position: relative; }

#order-phox .form-group.append-icon .field-icon {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

#order-phox .form-group.append-icon .form-control,
#order-phox .form-group.append-icon .field {
  padding-right: 44px !important;
}

/* Phone field (intl-tel-input/iti flag) — ensure padding clears the flag */
#order-phox .intl-tel-input input[type="tel"],
#order-phox .iti input[type="tel"],
#order-phox input[type="tel"].form-control {
  padding-left: 56px !important;
}

#order-phox .intl-tel-input .flag-container,
#order-phox .iti__flag-container {
  left: 12px !important;
}
/* ===== Phone field (intl-tel-input) – spacing & alignment fix ===== */
/* Base: inputs that have an icon on the left keep their 44px padding */
#order-phox .form-group.prepend-icon { position: relative; }
#order-phox .form-group.prepend-icon label.field-icon{
  position: absolute; left: 16px; top: 50%;
  transform: translateY(-50%); pointer-events: none; color: #9AA3AD;
}

/* Phone input: give it more left padding to clear the flag + dial code box */
#order-phox .intl-tel-input input.form-control,
#order-phox #inputPhone.form-control {
  padding-left: 96px !important;   /* was 44px; room for flag + “+234” */
}

/* Tidy up the flag/dial-code block so it sits snugly */
#order-phox .intl-tel-input.separate-dial-code .iti__flag-container {
  left: 12px; width: 72px !important;   /* consistent hitbox for flag area */
}
#order-phox .intl-tel-input.separate-dial-code .iti__selected-flag {
  padding-left: 12px; padding-right: 10px;
}
#order-phox .intl-tel-input.separate-dial-code .iti__selected-dial-code {
  margin-left: 4px; font-weight: 500; color: #072032;
}

/* Slightly reduce the font/line-height on the dial code so it aligns better */
#order-phox .intl-tel-input .iti__selected-dial-code {
  line-height: 1.2;
}

/* Mobile: a bit less left padding (flag block is narrower on small screens) */
@media (max-width: 480px){
  #order-phox .intl-tel-input input.form-control,
  #order-phox #inputPhone.form-control {
    padding-left: 88px !important;
  }
}
/* ===== Password strength / progress bars – brand colors =====
   Dark fill: #072032
   Light stripes: #EEF3E9
   (Scoped to order form so other pages stay untouched) */

/* Base fill color */
#order-phox .progress .progress-bar,
#order-phox .progress-bar,
#order-phox #passwordStrengthMeterBar,
#order-phox #passwordStrengthMeterBar.progress-bar-success {
  background-color: #072032 !important;
  border-color: #072032 !important;
}

/* Two-tone stripe overlay */
#order-phox .progress-bar-striped,
#order-phox .progress-striped .progress-bar,
#order-phox #passwordStrengthMeterBar.progress-bar-striped {
  background-image: repeating-linear-gradient(
    45deg,
    #EEF3E9 0,
    #EEF3E9 12.5%,
    transparent 12.5%,
    transparent 25%
  ) !important;
  background-size: 1rem 1rem !important; /* keep stripes crisp */
}

/* Optional: make the empty track match your light brand color
#order-phox .progress {
  background-color: #EEF3E9 !important;
}
*/
/* ===========================================================
   FINAL OVERRIDES (place at the very end of custom.css)
   Purpose: unify colors, spacing, and small UI fixes.
   Safe to keep everything else above; just remove older
   versions of these same rules to avoid duplication.
   =========================================================== */

/* A) “Save 15%” discount pill — text/icon color */
#order-phox .discount .discount-percent,
#order-phox span.label.discount-percent { color: #496200 !important; }
#order-phox .discount .discount-percent i,
#order-phox .discount .discount-percent .fa,
#order-phox .discount .discount-percent .fas { color: #496200 !important; }

/* B) “Already Registered?” button */
#btnAlreadyRegistered.btn.btn-info{
  background: #EEF3E9 !important;
  color: #496200 !important;
  font-weight: 700 !important;
  border: 1px solid #DAE5CC !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}
#btnAlreadyRegistered.btn.btn-info:hover{
  background: #E6EFDE !important;
  color: #496200 !important;
}

/* C) Newsletter YES toggle (Bootstrap Switch) */
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success{
  background: #EEF3E9 !important;
  color: #496200 !important;
  font-weight: 700 !important;
}
.bootstrap-switch .bootstrap-switch-label{ background: transparent !important; }
.bootstrap-switch{ border-color: #DAE5CC !important; }

/* D) Input fields with leading icons: add spacing so label/icon
      and placeholder don’t collide */
.form-group.prepend-icon .field{ position: relative !important; }
.form-group.prepend-icon .field .field-icon,
.form-group.prepend-icon .field [class*="fa-"],
.form-group.prepend-icon .field i.fa{
  position: absolute; left: 14px; top: 50%;
  transform: translateY(-50%);
  color: #8A99A3;
}
.form-group.prepend-icon .field .form-control{
  padding-left: 40px !important;
}

/* E) Phone number box (intl-tel-input/separate dial code) alignment */
#order-phox .intl-tel-input.separate-dial-code.allow-dropdown input[type="tel"],
#order-phox .iti--separate-dial-code input[type="tel"]{
  padding-left: 92px !important;   /* makes room for flag + dial code */
}
#order-phox .intl-tel-input .selected-flag,
#order-phox .iti__flag-container{ width: 84px !important; }
#order-phox .intl-tel-input .selected-flag .iti__selected-dial-code,
#order-phox .iti__selected-dial-code{ margin-left: 6px !important; }

/* F) Checkout/cart icon size (smaller) */
#orderSummary .btn .fa-shopping-cart,
.domain-lookup-primary-results .btn-add-to-cart .fa-shopping-cart,
.wdes-phox-cart_btn .fa-shopping-cart{
  font-size: 14px !important;
  line-height: 1 !important;
  vertical-align: -1px;
}

/* G) Progress bars — ONLY #072032 (fill) and #EEF3E9 (track) */
#order-phox .progress{
  background: #EEF3E9 !important;
  box-shadow: none !important;
}
#order-phox .progress .progress-bar,
#order-phox #passwordStrengthMeterBar{
  background-color: #072032 !important;
  background-image: none !important; /* kill theme gradients */
  box-shadow: none !important;
}
#order-phox .progress .progress-bar.progress-bar-striped{
  background-image: repeating-linear-gradient(
    45deg,
    #072032 0 10px,
    #EEF3E9 10px 20px
  ) !important;
}
#order-phox .progress .progress-bar.active{ animation: none !important; }
/* === Solid progress bars (no stripes) ====================== */
/* Track */
#order-phox .progress{
  background-color: #EEF3E9 !important;
  box-shadow: none !important;
}

/* Fill (make it a single color) */
#order-phox .progress .progress-bar,
#order-phox #passwordStrengthMeterBar.progress-bar{
  background-color: #ACE404 !important;   /* the solid dark bar */
  background-image: none !important;      /* kill stripes/gradients */
  box-shadow: none !important;
}

/* Kill any theme “striped/active” overlays & animations */
#order-phox .progress .progress-bar.progress-bar-striped,
#order-phox .progress .progress-bar.active,
#order-phox #passwordStrengthMeterBar.progress-bar.progress-bar-striped{
  background-image: none !important;
  animation: none !important;
}
/* Checkout security padlock: smaller + brand color */
#order-phox .checkout-security-msg i.fa-lock,
#order-phox .checkout-security-msg .fa-lock,
.checkout-security-msg i.fa-lock {
  color: #ACE404 !important;
  font-size: 18px !important;         /* smaller icon */
  line-height: 1 !important;
  margin: 0 8px 0 0 !important;        /* space after icon */
  float: none !important;              /* undo theme float */
  vertical-align: middle !important;   /* align with text */
}

/* (Optional) keep message and icon nicely aligned */
#order-phox .checkout-security-msg {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
/* Checkout security padlock: smaller + brand color */
#order-phox .checkout-security-msg i.fa-lock,
#order-phox .checkout-security-msg .fa-lock,
.checkout-security-msg i.fa-lock {
  color: #ACE404 !important;
  font-size: 18px !important;         /* smaller icon */
  line-height: 1 !important;
  margin: 0 8px 0 0 !important;        /* space after icon */
  float: none !important;              /* undo theme float */
  vertical-align: middle !important;   /* align with text */
}

/* (Optional) keep message and icon nicely aligned */
#order-phox .checkout-security-msg {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
/* Success check icon/text color (Enable, etc.) */
#order-phox .text-success,
#order-phox i.fa-check,
#order-phox .fa-check,
#order-phox .fas.fa-check,
#order-phox .fa-check-circle,
#order-phox .fas.fa-check-circle {
  color: #496200 !important;
  fill: #496200 !important;   /* for SVG-based icons */
  stroke: #496200 !important; /* in case stroke is used */
}
/* Success check icon/text color (Enable, etc.) */
#order-phox .text-success,
#order-phox i.fa-check,
#order-phox .fa-check,
#order-phox .fas.fa-check,
#order-phox .fa-check-circle,
#order-phox .fas.fa-check-circle {
  color: #496200 !important;
  fill: #496200 !important;   /* for SVG-based icons */
  stroke: #496200 !important; /* in case stroke is used */
}
/* Force "Enable" checkmark + any success check icons to #496200 */
#order-phox .text-success,
#order-phox .text-success i,
#order-phox .text-success .fa,
#order-phox .text-success .fas,
#order-phox .text-success [class^="fa-"],
#order-phox .text-success [class*=" fa-"],
#order-phox i.fa-check,
#order-phox i.fas.fa-check,
#order-phox i.far.fa-check,
#order-phox i.fal.fa-check,
#order-phox i.fab.fa-check,
#order-phox .fa-check-circle,
#order-phox .fas.fa-check-circle,
#order-phox .far.fa-check-circle,
#order-phox .fal.fa-check-circle {
  color: #496200 !important;
  fill: #496200 !important;   /* covers SVG-based icons */
  stroke: #496200 !important; /* just in case stroke is used */
}
section#header {
  background-color: #0000ff !important;     
}    
.section#header .wdes-header section#main-menu .navbar-main {    
  color: #496200 !important;    
} 
section#header .wdes-header section#main-menu .navbar-main .navbar-nav .wdes-menu-item-link, section#header .wdes-header section#main-menu .navbar-main .navbar-nav .dropdown > button {
  color: #ffffff !important;    
} 
section#header .wdes-header section#main-menu .navbar-main .navbar-nav .dropdown-menu {
  border-radius:0 !important;    
}    
/* Force dropdown items to be blue and show a blue underline on hover/focus/active */
.dropdown-menu a.dropdown-item,
.dropdown-menu .dropdown-item,
.dropdown-menu li.dropdown-item,
.dropdown-menu > li > a,
.languages-list .dropdown-menu a.dropdown-item,
.languages-list .dropdown-menu .dropdown-item,
section#header .wdes-header .navbar-main .navbar-nav .dropdown-menu a.dropdown-item {
  color: #0000ff !important;
  text-decoration: none !important;
  border-bottom: none !important;
}





/* Force dropdown items to be blue and show a blue underline on hover/focus/active */
.dropdown-menu a.dropdown-item,
.dropdown-menu .dropdown-item,
.dropdown-menu li.dropdown-item,
.dropdown-menu > li > a,
.languages-list .dropdown-menu a.dropdown-item,
.languages-list .dropdown-menu .dropdown-item,
section#header .wdes-header .navbar-main .navbar-nav .dropdown-menu a.dropdown-item {
  color: #0000ff !important;
  font-weight: 400 !important; /* make text normal weight */
  text-decoration: none !important;
  border-bottom: none !important;
}

/* Match dropdown items with top menu font style */
.dropdown-menu a.dropdown-item,
.dropdown-menu .dropdown-item,
.dropdown-menu li.dropdown-item,
.dropdown-menu > li > a,
.languages-list .dropdown-menu a.dropdown-item,
.languages-list .dropdown-menu .dropdown-item,
section#header .wdes-header .navbar-main .navbar-nav .dropdown-menu a.dropdown-item {
  color: #0000ff !important;
  font-family: inherit !important;    /* inherit same font as navbar */
  font-size: 14px !important;         /* adjust to same size as top menu */
  font-weight: 400 !important;        /* same thickness */
  line-height: 1.5 !important;        /* spacing like navbar */
  text-decoration: none !important;
  border-bottom: none !important;
  background: none !important;
}

/* Hover / focus / active */
.dropdown-menu a.dropdown-item:hover,
.dropdown-menu .dropdown-item:hover,
.dropdown-menu li.dropdown-item:hover,
.dropdown-menu > li > a:hover,
.dropdown-menu a.dropdown-item:focus,
.dropdown-menu .dropdown-item:focus,
.dropdown-menu li.dropdown-item:focus,
.dropdown-menu > li > a:focus,
.dropdown-menu a.dropdown-item:active,
.dropdown-menu .dropdown-item:active,
.dropdown-menu li.dropdown-item:active,
.dropdown-menu > li > a:active,
.languages-list .dropdown-menu a.dropdown-item:hover,
section#header .wdes-header .navbar-main .navbar-nav .dropdown-menu a.dropdown-item:hover {
  color: #0000ff !important;
  font-weight: 400 !important; 
  font-size: 14px !important; 
  text-decoration: underline !important;
  text-decoration-color: #0000ff !important;
  text-underline-offset: 3px !important;
  text-decoration-thickness: 1px !important;
  outline: none !important;
  background: none !important;
}







section#header .wdes-header section#main-menu .navbar-main .navbar-nav 
.wdes-menu-item.wdes-top-menu-item-icon-show .dropdown > button i,
section#header .wdes-header section#main-menu .navbar-main .navbar-nav 
.wdes-menu-item.wdes-top-menu-item-icon-show .dropdown > a i,
section#header .wdes-header section#main-menu .navbar-main .navbar-nav 
.wdes-menu-item.wdes-top-menu-item-icon-show .dropdown > button svg,
section#header .wdes-header section#main-menu .navbar-main .navbar-nav 
.wdes-menu-item.wdes-top-menu-item-icon-show .dropdown > a svg {
  color: #ffffff !important;   /* for font icons */
  fill: #ffffff !important;    /* for SVG icons */
}
    

    
/* Nameservers input b*