/* terra-customer-css-phase2a-20260814
 * TERRA INDUSTRIES WEBSITE 2.0
 * Central customer-workspace styling owner.
 *
 * PHASE 2A STATUS: BRIDGE ONLY — NO VISUAL RULES YET.
 *
 * Future ownership:
 * - My Terra Account workspace/navigation
 * - account pricing / bulk pricing
 * - quote history
 * - profile/preferences/security
 * - customer forms/tables/cards
 *
 * Preserve existing functional JS selectors/classes.
 */

/* ==========================================================
   terra-final-sitewide-design-system-phase2j-v1-20260814
   CUSTOMER ACCOUNT — FINAL CLEAN WORKSPACE
========================================================== */
html body:has(.terra-workspace-shell--customer) > main.container{
  width:min(var(--terra-content-max),calc(100% - 48px)) !important;
  max-width:var(--terra-content-max) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
  box-sizing:border-box !important;
}

html body:has(.terra-workspace-shell--customer) > main.container :is(
  .customer-dashboard-hero,
  .terra-workspace-shell--customer,
  .terra-customer-quick-actions,
  .customer-dashboard-grid,
  .customer-dashboard-permissions,
  .customer-marketing-preferences,
  .customer-rfq-history
){
  width:100% !important;
  max-width:none !important;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box !important;
}

html body:has(.terra-workspace-shell--customer) .customer-dashboard-hero{
  margin:24px 0 18px !important;
  padding:22px 24px !important;
  border:1px solid var(--terra-line) !important;
  border-top:3px solid var(--terra-orange) !important;
  border-radius:var(--terra-radius) !important;
  background:#fff !important;
  box-shadow:var(--terra-shadow) !important;
}

html body:has(.terra-workspace-shell--customer) .customer-dashboard-hero h1{
  margin:0 0 7px !important;
  color:var(--terra-navy) !important;
  font-size:clamp(30px,3.4vw,42px) !important;
  line-height:1.07 !important;
}

html body:has(.terra-workspace-shell--customer) .terra-workspace-shell--customer{
  margin-bottom:18px !important;
}

html body:has(.terra-workspace-shell--customer) .terra-customer-quick-actions{
  margin:0 0 18px !important;
  padding:16px !important;
  border:1px solid var(--terra-line) !important;
  border-top:3px solid var(--terra-orange) !important;
  border-radius:var(--terra-radius) !important;
  background:#fff !important;
  box-shadow:var(--terra-shadow) !important;
}

html body:has(.terra-workspace-shell--customer) .terra-customer-quick-actions-heading{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin-bottom:12px !important;
}

html body:has(.terra-workspace-shell--customer) .terra-customer-quick-actions-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
}

html body:has(.terra-workspace-shell--customer) .terra-customer-action{
  display:grid !important;
  gap:5px !important;
  min-height:92px !important;
  padding:15px !important;
  border:1px solid var(--terra-line) !important;
  border-radius:8px !important;
  background:var(--terra-soft) !important;
  color:var(--terra-navy) !important;
  text-decoration:none !important;
  transition:border-color .15s ease,background .15s ease,transform .15s ease !important;
}

html body:has(.terra-workspace-shell--customer) .terra-customer-action:hover{
  border-color:var(--terra-orange) !important;
  background:var(--terra-soft-orange) !important;
  transform:translateY(-1px) !important;
}

html body:has(.terra-workspace-shell--customer) .terra-customer-action small{
  color:var(--terra-muted) !important;
  line-height:1.4 !important;
}

html body:has(.terra-workspace-shell--customer) .customer-dashboard-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:18px !important;
  margin:0 0 18px !important;
}

html body:has(.terra-workspace-shell--customer) :is(
  .customer-dashboard-card,
  .customer-dashboard-permissions,
  .customer-marketing-preferences,
  .customer-rfq-history
){
  margin:0 !important;
  padding:20px 22px !important;
  border:1px solid var(--terra-line) !important;
  border-radius:var(--terra-radius) !important;
  background:#fff !important;
  box-shadow:var(--terra-shadow) !important;
}

html body:has(.terra-workspace-shell--customer) .customer-dashboard-grid .customer-dashboard-card:first-child{
  border-top:3px solid var(--terra-orange) !important;
}

html body:has(.terra-workspace-shell--customer) .customer-profile-list{
  margin:12px 0 0 !important;
}

html body:has(.terra-workspace-shell--customer) .customer-profile-list > div{
  display:grid !important;
  grid-template-columns:minmax(130px,170px) minmax(0,1fr) !important;
  gap:14px !important;
  padding:9px 0 !important;
  border-bottom:1px solid var(--terra-line) !important;
}

html body:has(.terra-workspace-shell--customer) .customer-profile-list > div:last-child{
  border-bottom:0 !important;
}

html body:has(.terra-workspace-shell--customer) .customer-profile-list dt{
  color:var(--terra-muted) !important;
  font-size:12px !important;
  font-weight:900 !important;
}

html body:has(.terra-workspace-shell--customer) .customer-profile-list dd{
  margin:0 !important;
  color:var(--terra-navy) !important;
}

html body:has(.terra-workspace-shell--customer) :is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea
){
  min-height:var(--terra-control-height) !important;
  border:1px solid var(--terra-line-strong) !important;
  border-radius:7px !important;
  background:#fff !important;
  box-sizing:border-box !important;
}

html body:has(.terra-workspace-shell--customer) :is(button,.button-link,.terra-workspace-collapse-button){
  min-height:42px !important;
  border-radius:7px !important;
  font-weight:900 !important;
}

html body:has(.terra-workspace-shell--customer) .table-scroll{
  border:1px solid var(--terra-line) !important;
  border-radius:8px !important;
  overflow:auto !important;
}

html body:has(.terra-workspace-shell--customer) .table-scroll th{
  background:var(--terra-soft) !important;
  color:var(--terra-muted) !important;
}

@media(max-width:900px){
  html body:has(.terra-workspace-shell--customer) > main.container{
    width:calc(100% - 44px) !important;
  }

  html body:has(.terra-workspace-shell--customer) .terra-customer-quick-actions-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media(max-width:620px){
  html body:has(.terra-workspace-shell--customer) > main.container{
    width:calc(100% - 28px) !important;
  }

  html body:has(.terra-workspace-shell--customer) :is(.terra-customer-quick-actions-grid,.customer-dashboard-grid){
    grid-template-columns:1fr !important;
  }

  html body:has(.terra-workspace-shell--customer) .customer-profile-list > div{
    grid-template-columns:1fr !important;
    gap:3px !important;
  }

  html body:has(.terra-workspace-shell--customer) .terra-customer-action{
    min-height:78px !important;
  }
}

/* ==========================================================
   terra-sitewide-button-colour-system-v1-20260823
   CUSTOMER / MY ACCOUNT ACTION COLOUR STANDARD

   Current Customer workspace surfaces are light:
   Terra navy -> Terra orange.
   Header/nav/footer and WhatsApp actions remain untouched.
========================================================== */

html body:has(.terra-workspace-shell--customer)
> main.container
:is(
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  a.button,
  a.button-link,
  a.small-button,
  a.terra-action,
  a.btn,
  [role="button"]
):not(.whatsapp-button):not(.terra-action--whatsapp):not(.terra-whatsapp-confirm-button):not([class*="whatsapp"]):not([href*="wa.me"]):not([href*="whatsapp.com"]){
  border-color:#1b283a!important;
  background:#1b283a!important;
  background-color:#1b283a!important;
  background-image:none!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

html body:has(.terra-workspace-shell--customer)
> main.container
:is(
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  a.button,
  a.button-link,
  a.small-button,
  a.terra-action,
  a.btn,
  [role="button"]
):not(.whatsapp-button):not(.terra-action--whatsapp):not(.terra-whatsapp-confirm-button):not([class*="whatsapp"]):not([href*="wa.me"]):not([href*="whatsapp.com"]):hover:not(:disabled),
html body:has(.terra-workspace-shell--customer)
> main.container
:is(
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  a.button,
  a.button-link,
  a.small-button,
  a.terra-action,
  a.btn,
  [role="button"]
):not(.whatsapp-button):not(.terra-action--whatsapp):not(.terra-whatsapp-confirm-button):not([class*="whatsapp"]):not([href*="wa.me"]):not([href*="whatsapp.com"]):focus-visible:not(:disabled){
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  background-image:none!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

html body:has(.terra-workspace-shell--customer)
> main.container
:is(.is-dark,.terra-dark,[class*="--dark"]) 
:is(
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  a.button,
  a.button-link,
  a.small-button,
  a.terra-action,
  a.btn,
  [role="button"]
):not(.whatsapp-button):not(.terra-action--whatsapp):not(.terra-whatsapp-confirm-button):not([class*="whatsapp"]):not([href*="wa.me"]):not([href*="whatsapp.com"]){
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

html body:has(.terra-workspace-shell--customer)
> main.container
:is(.is-dark,.terra-dark,[class*="--dark"]) 
:is(
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  a.button,
  a.button-link,
  a.small-button,
  a.terra-action,
  a.btn,
  [role="button"]
):not(.whatsapp-button):not(.terra-action--whatsapp):not(.terra-whatsapp-confirm-button):not([class*="whatsapp"]):not([href*="wa.me"]):not([href*="whatsapp.com"]):hover:not(:disabled),
html body:has(.terra-workspace-shell--customer)
> main.container
:is(.is-dark,.terra-dark,[class*="--dark"]) 
:is(
  button,
  input[type="submit"],
  input[type="button"],
  input[type="reset"],
  a.button,
  a.button-link,
  a.small-button,
  a.terra-action,
  a.btn,
  [role="button"]
):not(.whatsapp-button):not(.terra-action--whatsapp):not(.terra-whatsapp-confirm-button):not([class*="whatsapp"]):not([href*="wa.me"]):not([href*="whatsapp.com"]):focus-visible:not(:disabled){
  border-color:#1b283a!important;
  background:#1b283a!important;
  background-color:#1b283a!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

html body:has(.terra-workspace-shell--customer)
> main.container input[type="file"]::file-selector-button,
html body:has(.terra-workspace-shell--customer)
> main.container input[type="file"]::-webkit-file-upload-button{
  border-color:#1b283a!important;
  background:#1b283a!important;
  color:#ffffff!important;
}

html body:has(.terra-workspace-shell--customer)
> main.container input[type="file"]::file-selector-button:hover,
html body:has(.terra-workspace-shell--customer)
> main.container input[type="file"]::-webkit-file-upload-button:hover{
  border-color:#ff834f!important;
  background:#ff834f!important;
  color:#ffffff!important;
}

/* ==========================================================
   terra-workspace-modern-consistency-v2-20260823
   CUSTOMER / MY ACCOUNT — UNIFIED CURRENT-ERA SURFACE SYSTEM

   ORANGE IS AN ACCENT, NOT A DECORATIVE RAIL.
========================================================== */

html body:has(.terra-workspace-shell--customer){
  --terra-ui-surface:#ffffff;
  --terra-ui-soft:#f7f9fa;
  --terra-ui-line:#dce4e8;
  --terra-ui-line-strong:#c8d3d8;
  --terra-ui-radius:14px;
  --terra-ui-radius-sm:10px;
  --terra-ui-shadow:0 10px 30px rgba(27,40,58,.055);
  --terra-ui-shadow-soft:0 5px 18px rgba(27,40,58,.04);
  --terra-ui-gap:20px;
}

html body:has(.terra-workspace-shell--customer) > main.container{
  padding-top:28px!important;
  padding-bottom:44px!important;
}

html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-shell,
  .customer-dashboard-wrap,
  .customer-account-shell,
  .customer-profile-shell,
  .terra-customer-profile-workspace,
  .customer-pricing-shell,
  .bulk-pricing-shell
){
  margin-top:0!important;
  margin-bottom:0!important;
}

html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-shell,
  .customer-dashboard-wrap,
  .customer-account-shell,
  .customer-profile-shell,
  .terra-customer-profile-workspace,
  .customer-pricing-shell,
  .bulk-pricing-shell
) > *{
  margin-top:0!important;
  margin-bottom:0!important;
}

html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-shell,
  .customer-dashboard-wrap,
  .customer-account-shell,
  .customer-profile-shell,
  .terra-customer-profile-workspace,
  .customer-pricing-shell,
  .bulk-pricing-shell
) > * + *{
  margin-top:var(--terra-ui-gap)!important;
}

/* All Customer utility heroes, including Single/Bulk Pricing. */
html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-hero,
  .customer-pricing-shell > section.hero,
  .bulk-pricing-shell > section.hero,
  section.hero
){
  box-sizing:border-box!important;
  margin:0!important;
  padding:24px 26px!important;
  border:1px solid var(--terra-ui-line)!important;
  border-top:3px solid var(--terra-orange)!important;
  border-left:1px solid var(--terra-ui-line)!important;
  border-radius:var(--terra-ui-radius)!important;
  background:linear-gradient(145deg,#ffffff 0%,#fbfcfd 100%)!important;
  box-shadow:var(--terra-ui-shadow)!important;
}

html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-hero,
  .customer-pricing-shell > section.hero,
  .bulk-pricing-shell > section.hero,
  section.hero
) h1{
  margin:0 0 8px!important;
  color:var(--terra-navy)!important;
  font-size:clamp(32px,3.4vw,44px)!important;
  line-height:1.04!important;
  letter-spacing:-.025em!important;
}

html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-hero,
  .customer-pricing-shell > section.hero,
  .bulk-pricing-shell > section.hero,
  section.hero
) > p:last-child{
  max-width:760px!important;
  margin-bottom:0!important;
  color:#5d737c!important;
}

/* Customer Account nav. */
html body:has(.terra-workspace-shell--customer) .terra-workspace-shell--customer{
  border:1px solid var(--terra-ui-line)!important;
  border-radius:var(--terra-ui-radius)!important;
  background:#fff!important;
  box-shadow:var(--terra-ui-shadow-soft)!important;
}

html body:has(.terra-workspace-shell--customer) .terra-workspace-link,
html body:has(.terra-workspace-shell--customer) .terra-workspace-group > summary{
  border-radius:9px!important;
}

/* Quick Actions is a neutral utility surface — no orange rail. */
html body:has(.terra-workspace-shell--customer) .terra-customer-quick-actions{
  margin:0!important;
  padding:20px 22px!important;
  border:1px solid var(--terra-ui-line)!important;
  border-top:1px solid var(--terra-ui-line)!important;
  border-left:1px solid var(--terra-ui-line)!important;
  border-radius:var(--terra-ui-radius)!important;
  background:linear-gradient(145deg,#ffffff 0%,#fbfcfd 100%)!important;
  box-shadow:var(--terra-ui-shadow-soft)!important;
}

/* One ordinary Customer card system. */
html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-card,
  .customer-dashboard-permissions,
  .customer-marketing-preferences,
  .customer-rfq-history,
  .customer-profile-card,
  .customer-access-card,
  .customer-pricing-card,
  .bulk-pricing-card,
  .card
){
  box-sizing:border-box!important;
  margin:0!important;
  padding:22px 24px!important;
  border:1px solid var(--terra-ui-line)!important;
  border-top:1px solid var(--terra-ui-line)!important;
  border-left:1px solid var(--terra-ui-line)!important;
  border-radius:var(--terra-ui-radius)!important;
  background:var(--terra-ui-surface)!important;
  box-shadow:var(--terra-ui-shadow-soft)!important;
}

html body:has(.terra-workspace-shell--customer) .customer-dashboard-grid{
  gap:var(--terra-ui-gap)!important;
  margin:0!important;
}

/* Eyebrow is the orange accent. */
html body:has(.terra-workspace-shell--customer) .eyebrow,
html body:has(.terra-workspace-shell--customer) .terra-workspace-eyebrow{
  margin:0 0 7px!important;
  color:var(--terra-orange)!important;
  font-size:11px!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:.11em!important;
  text-transform:uppercase!important;
}

html body:has(.terra-workspace-shell--customer) .section-heading{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin:0 0 16px!important;
}

html body:has(.terra-workspace-shell--customer)
:is(
  .customer-dashboard-card,
  .customer-dashboard-permissions,
  .customer-marketing-preferences,
  .customer-rfq-history,
  .customer-profile-card,
  .customer-access-card,
  .customer-pricing-card,
  .bulk-pricing-card,
  .card
) h2{
  margin-top:0!important;
  margin-bottom:8px!important;
  color:var(--terra-navy)!important;
  font-size:clamp(21px,2vw,25px)!important;
  line-height:1.15!important;
  letter-spacing:-.015em!important;
}

/* Permission/address subsurfaces. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-dashboard-permissions,.customer-address-list) > *{
  border-color:var(--terra-ui-line)!important;
  border-radius:var(--terra-ui-radius-sm)!important;
  background:#fbfcfd!important;
}

/* Tables. */
html body:has(.terra-workspace-shell--customer)
:is(.table-scroll,.terra-customer-rfq-scroll,.bulk-pricing-table-wrap){
  border:1px solid var(--terra-ui-line)!important;
  border-radius:var(--terra-ui-radius-sm)!important;
  background:#fff!important;
  overflow:auto!important;
}

html body:has(.terra-workspace-shell--customer) table thead th{
  background:var(--terra-ui-soft)!important;
  color:#49616c!important;
  border-bottom-color:var(--terra-ui-line-strong)!important;
}

html body:has(.terra-workspace-shell--customer) table tbody tr:hover td{
  background:#fbfcfd!important;
}

/* Runtime Show/Hide presentation remains retired. */
html body:has(.terra-workspace-shell--customer) .terra-workspace-collapse-button{
  display:none!important;
}

@media(max-width:720px){
  html body:has(.terra-workspace-shell--customer) > main.container{
    padding-top:20px!important;
    padding-bottom:32px!important;
  }

  html body:has(.terra-workspace-shell--customer)
  :is(
    .customer-dashboard-hero,
    .customer-pricing-shell > section.hero,
    .bulk-pricing-shell > section.hero,
    section.hero
  ){
    padding:20px!important;
  }

  html body:has(.terra-workspace-shell--customer)
  :is(
    .customer-dashboard-card,
    .customer-dashboard-permissions,
    .customer-marketing-preferences,
    .customer-rfq-history,
    .customer-access-card,
    .customer-pricing-card,
    .bulk-pricing-card,
    .card
  ){
    padding:18px!important;
  }

  html body:has(.terra-workspace-shell--customer) .section-heading{
    display:grid!important;
    gap:12px!important;
  }
}/* V2.3 SURGICAL — CUSTOMER DASHBOARD + PRICING RHYTHM */
html body:has(.terra-workspace-shell--customer):has(.customer-dashboard-hero)
> main.container > * + *{
  margin-top:20px!important;
}
html body:has(.terra-workspace-shell--customer) .customer-dashboard-hero{
  border-top:3px solid var(--terra-orange)!important;
}
html body:has(.terra-workspace-shell--customer):has(.customer-dashboard-hero)
.customer-dashboard-grid > .customer-dashboard-card,
html body:has(.terra-workspace-shell--customer):has(.customer-dashboard-hero)
> main.container > .customer-dashboard-card,
html body:has(.terra-workspace-shell--customer):has(.customer-dashboard-hero)
.customer-access-card,
html body:has(.terra-workspace-shell--customer):has(.customer-dashboard-hero)
.customer-marketing-preferences,
html body:has(.terra-workspace-shell--customer):has(.customer-dashboard-hero)
.customer-rfq-history{
  border-top:1px solid var(--terra-ui-line)!important;
}
html body:has(.terra-workspace-shell--customer) .terra-customer-quick-actions{
  border-top:1px solid var(--terra-ui-line)!important;
}
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs{
  margin:0!important;
}
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs + :is(.customer-pricing-card,.bulk-pricing-card){
  margin-top:20px!important;
}
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-card,.bulk-pricing-card){
  border-top:1px solid var(--terra-ui-line)!important;
}

/* -------------------------------------------------------------------------------------------------
   terra-customer-pricing-subtabs-phase2c-v1-20260827
   CUSTOMER PRICING — TERRA SEGMENTED MODE CONTROL
-------------------------------------------------------------------------------------------------- */

html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs{
  display:inline-grid!important;
  grid-template-columns:minmax(112px,auto) minmax(150px,auto)!important;
  gap:0!important;
  width:auto!important;
  max-width:100%!important;
  margin:0!important;
  padding:3px!important;
  border:1px solid var(--terra-ui-line)!important;
  border-radius:9px!important;
  background:#f8f7e5!important;
  box-shadow:none!important;
  overflow:hidden!important;
  vertical-align:top!important;
}

html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a{
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  height:40px!important;
  min-height:40px!important;
  margin:0!important;
  padding:0 16px!important;
  border:1px solid transparent!important;
  border-radius:6px!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  color:#1b283a!important;
  -webkit-text-fill-color:#1b283a!important;
  font-weight:900!important;
  line-height:1!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  transition:
    background-color .16s ease,
    border-color .16s ease,
    color .16s ease!important;
}

/* Active mode: Terra navy, not solid orange. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active{
  border-color:#1b283a!important;
  background:#1b283a!important;
  background-color:#1b283a!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

/* Inactive hover/focus: orange accent with white text. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:not(.is-active):hover,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:not(.is-active):focus-visible{
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  outline:none!important;
}

/* Active hover/focus stays active; subtle orange outline signals interaction without swapping state colour. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active:hover,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active:focus-visible{
  border-color:#ff834f!important;
  background:#1b283a!important;
  background-color:#1b283a!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  outline:none!important;
}

/* Keep the first pricing card rhythm consistent beneath the segmented control. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs + :is(.customer-pricing-card,.bulk-pricing-card){
  margin-top:18px!important;
}

@media(max-width:620px){
  html body:has(.terra-workspace-shell--customer)
  :is(.customer-pricing-shell,.bulk-pricing-shell)
  > .customer-pricing-mode-tabs{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    width:100%!important;
  }

  html body:has(.terra-workspace-shell--customer)
  :is(.customer-pricing-shell,.bulk-pricing-shell)
  > .customer-pricing-mode-tabs > a{
    width:100%!important;
    padding:0 10px!important;
    text-align:center!important;
  }
}

/* -------------------------------------------------------------------------------------------------
   terra-customer-pricing-subtabs-phase2c-v1-1-20260827
   PRICING MODE BUTTONS — MATCH CHECK PRICES BUTTON BEHAVIOUR
-------------------------------------------------------------------------------------------------- */

/* Remove the yellow/off-white segmented-container treatment entirely. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:center!important;
  gap:8px!important;
  width:auto!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:visible!important;
}

/* Both mode buttons use the same Terra navy base state as Check Prices. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active{
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:0!important;
  height:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:0 16px!important;
  border:1px solid #1b283a!important;
  border-radius:7px!important;
  background:#1b283a!important;
  background-color:#1b283a!important;
  background-image:none!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  font-weight:900!important;
  line-height:1!important;
  text-align:center!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  transition:
    background-color .16s ease,
    border-color .16s ease,
    color .16s ease!important;
}

/* Active page: subtle orange outline only; base remains navy. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active{
  border-color:#ff834f!important;
}

/* Exact Check Prices interaction: navy -> orange on hover/focus. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:hover,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:focus-visible,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active:hover,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active:focus-visible{
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  background-image:none!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  outline:none!important;
}

/* Keep the content card tucked cleanly below the buttons. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs + :is(.customer-pricing-card,.bulk-pricing-card){
  margin-top:18px!important;
}

@media(max-width:620px){
  html body:has(.terra-workspace-shell--customer)
  :is(.customer-pricing-shell,.bulk-pricing-shell)
  > .customer-pricing-mode-tabs{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    width:100%!important;
  }

  html body:has(.terra-workspace-shell--customer)
  :is(.customer-pricing-shell,.bulk-pricing-shell)
  > .customer-pricing-mode-tabs > a,
  html body:has(.terra-workspace-shell--customer)
  :is(.customer-pricing-shell,.bulk-pricing-shell)
  > .customer-pricing-mode-tabs > a.is-active{
    width:100%!important;
    padding:0 10px!important;
  }
}

/* -------------------------------------------------------------------------------------------------
   terra-customer-pricing-subtabs-phase2c-v1-2-20260827
   PRICING MODE ACTIVE STATE + SPACING
-------------------------------------------------------------------------------------------------- */

/* Give the pricing mode controls breathing room below the main account navigation. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs{
  margin-top:10px!important;
  gap:8px!important;
}

/* Inactive mode = Terra navy. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:not(.is-active){
  border-color:#1b283a!important;
  background:#1b283a!important;
  background-color:#1b283a!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

/* Active mode = Terra orange. Clear, visible state — no outline-only treatment. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active{
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}

/* Inactive hover/focus follows the site button behaviour: navy -> orange. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:not(.is-active):hover,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a:not(.is-active):focus-visible{
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  outline:none!important;
}

/* Active stays orange on hover/focus so the selected mode remains unmistakable. */
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active:hover,
html body:has(.terra-workspace-shell--customer)
:is(.customer-pricing-shell,.bulk-pricing-shell)
> .customer-pricing-mode-tabs > a.is-active:focus-visible{
  border-color:#ff834f!important;
  background:#ff834f!important;
  background-color:#ff834f!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  outline:none!important;
}

/* terra-mobile-account-hub-global-nav-layer-v1-20260830
   Keep the customer Account Hub below the global mobile navigation while
   body.nav-open is active. Closed-menu customer layout is unchanged. */
@media (max-width:1024px){
  html body.nav-open:has(.terra-workspace-shell--customer) > main.container{
    position:relative!important;
    z-index:0!important;
  }

  html body.nav-open:has(.terra-workspace-shell--customer) .terra-workspace-shell--customer{
    z-index:0!important;
  }
}
