/* V186 — mobile two-button rows, customer action colors, faithful homepage panel-header mock */

/* Homepage panel CTAs: always stay in one two-column row on phones. */
@media (max-width:680px){
  body.bk121-home .bk120-panel .bk120-head-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
    align-items:stretch!important;
  }
  body.bk121-home .bk120-panel .bk120-head-actions .bk120-btn{
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 8px!important;
    min-height:42px!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:normal!important;
    line-height:1.45!important;
    font-size:10.5px!important;
  }
}

/* my.* welcome actions: right button navy, left button coral, and side-by-side on mobile. */
.bk181-customer-portal .customer-welcome-actions{
  display:flex!important;
  flex-direction:row!important;
  gap:9px!important;
  align-items:stretch!important;
}
.bk181-customer-portal .customer-welcome-actions .btn{
  min-height:42px!important;
  margin:0!important;
  border-radius:12px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-weight:850!important;
  box-shadow:none!important;
}
html body.bk181-portal-page.bk181-customer-portal .customer-welcome .customer-welcome-actions > a.btn:first-child{
  background:#052259!important;
  background-color:#052259!important;
  border-color:#052259!important;
  color:#fff!important;
}
html body.bk181-portal-page.bk181-customer-portal .customer-welcome .customer-welcome-actions > a.btn:first-child:hover,
html body.bk181-portal-page.bk181-customer-portal .customer-welcome .customer-welcome-actions > a.btn:first-child:focus-visible{
  background:#0a3478!important;
  border-color:#0a3478!important;
  color:#fff!important;
}
html body.bk181-portal-page.bk181-customer-portal .customer-welcome .customer-welcome-actions > a.btn:last-child{
  background:#ff6f61!important;
  background-color:#ff6f61!important;
  border-color:#ff6f61!important;
  color:#fff!important;
}
html body.bk181-portal-page.bk181-customer-portal .customer-welcome .customer-welcome-actions > a.btn:last-child:hover,
html body.bk181-portal-page.bk181-customer-portal .customer-welcome .customer-welcome-actions > a.btn:last-child:focus-visible{
  background:#e75d51!important;
  border-color:#e75d51!important;
  color:#fff!important;
}
@media (max-width:680px){
  .bk181-customer-portal .customer-welcome-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
  }
  .bk181-customer-portal .customer-welcome-actions .btn{
    width:100%!important;
    min-width:0!important;
    padding-inline:8px!important;
    white-space:normal!important;
    text-align:center!important;
    line-height:1.45!important;
    font-size:10.5px!important;
  }
}

/* Homepage customer-panel mock: use the same dark public-site header language as the real portal. */
body.bk121-home .bk185-dashboard-mock .bk185-mock-top{
  height:64px!important;
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:18px!important;
  padding:9px 15px!important;
  background:linear-gradient(90deg,#041b49 0%,#052259 60%,#07326f 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.09)!important;
}
body.bk121-home .bk185-dashboard-mock .bk185-mock-brand{
  display:flex!important;
  align-items:center!important;
  width:auto!important;
  min-width:0!important;
  text-decoration:none!important;
}
body.bk121-home .bk185-dashboard-mock .bk185-mock-brand img{
  width:92px!important;
  height:38px!important;
  max-width:92px!important;
  max-height:38px!important;
  object-fit:contain!important;
  filter:none!important;
  padding:0!important;
  background:transparent!important;
}
body.bk121-home .bk186-mock-site-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:15px!important;
  min-width:0!important;
  overflow:hidden!important;
}
body.bk121-home .bk186-mock-site-nav span{
  color:rgba(255,255,255,.82)!important;
  font-size:7.2px!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
body.bk121-home .bk185-dashboard-mock .bk185-mock-account{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:38px!important;
  padding:4px 6px 4px 8px!important;
  border:1px solid rgba(255,255,255,.19)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
  white-space:nowrap!important;
}
body.bk121-home .bk186-mock-avatar{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.13);color:#fff;flex:0 0 auto}
body.bk121-home .bk186-mock-avatar svg{width:12px;height:12px}
body.bk121-home .bk186-mock-person{display:block;line-height:1.25}
body.bk121-home .bk186-mock-person small,body.bk121-home .bk186-mock-person strong{display:block}
body.bk121-home .bk186-mock-person small{font-size:5.8px;color:rgba(255,255,255,.62)}
body.bk121-home .bk186-mock-person strong{margin-top:2px;font-size:7px;color:#fff}
body.bk121-home .bk185-mock-account b{padding-right:6px;border-right:1px solid rgba(255,255,255,.18);font-size:6.2px;color:#ffb0a7;font-weight:900}
@media (max-width:680px){
  body.bk121-home .bk185-dashboard-mock .bk185-mock-top{
    height:54px!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    gap:8px!important;
    padding:7px 9px!important;
  }
  body.bk121-home .bk185-dashboard-mock .bk185-mock-brand img{
    width:70px!important;
    height:31px!important;
    max-width:70px!important;
    max-height:31px!important;
  }
  body.bk121-home .bk186-mock-site-nav{display:none!important}
  body.bk121-home .bk185-dashboard-mock .bk185-mock-account{min-height:32px!important;gap:5px!important;padding:3px 5px!important}
  body.bk121-home .bk186-mock-avatar{width:21px;height:21px}
  body.bk121-home .bk186-mock-avatar svg{width:10px;height:10px}
  body.bk121-home .bk186-mock-person small{font-size:5px}
  body.bk121-home .bk186-mock-person strong{font-size:6px}
  body.bk121-home .bk185-mock-account b{font-size:5.4px;padding-right:5px}
}
