/* TAQA STORE V267 — Account mobile surgical fixes only.
   Scope: customer account mobile header + overview metadata chips.
   Desktop and every other page remain untouched. */

@media (max-width:760px){
  /* Fix 1: the desktop account action cluster must never leak into the native mobile header. */
  body.customer-account-v130 .ca-topbar.v232-topbar > .ca-top-actions,
  body.customer-account-v130 .ca-topbar.v232-topbar > .ca-logo,
  body.customer-account-v130 .ca-topbar.v232-topbar > .v232-topbar-title{
    display:none!important;
    visibility:hidden!important;
  }

  body.customer-account-v130 .ca-topbar.v232-topbar{
    display:flex!important;
    align-items:center!important;
  }

  body.customer-account-v130 .ca-topbar.v232-topbar > .v234-mobile-head{
    display:grid!important;
    width:100%!important;
    grid-template-columns:42px minmax(0,1fr) 42px!important;
    align-items:center!important;
    gap:8px!important;
  }

  /* Fix 2: legacy descendant span styling was turning the nested icon wrappers
     inside the two profile chips into extra pills. Style only direct chips and
     explicitly neutralize the icon wrapper. */
  body.customer-account-v130 .v234-user-meta{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    align-items:stretch!important;
  }

  body.customer-account-v130 .v234-user-meta > span{
    min-width:0!important;
    width:100%!important;
    min-height:34px!important;
    padding:0 10px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    border-radius:10px!important;
    background:rgba(255,255,255,.035)!important;
    color:#9ca8a1!important;
    font-size:11px!important;
    font-weight:700!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
  }

  body.customer-account-v130 .v234-user-meta .v250-account-icon{
    display:inline-grid!important;
    place-items:center!important;
    width:16px!important;
    height:16px!important;
    min-width:16px!important;
    min-height:16px!important;
    padding:0!important;
    margin:0!important;
    flex:0 0 16px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:var(--v234-green,#39e66b)!important;
    overflow:visible!important;
  }

  body.customer-account-v130 .v234-user-meta .v250-account-icon > i,
  body.customer-account-v130 .v234-user-meta .v250-account-icon > svg{
    width:14px!important;
    height:14px!important;
    min-width:14px!important;
    min-height:14px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
}
