/* Butter Operations 8.5.1 - login is usable on actual 360 x 780 Android screens. */
.login-shell{grid-template-areas:"brand form" "support form";grid-template-columns:minmax(0,1fr) minmax(0,440px);column-gap:clamp(30px,5vw,84px);row-gap:12px;align-items:center}
.login-intro{grid-area:brand;align-self:end}
.login-panel{grid-area:form;align-self:center}
.login-shell>.support-under-brand{grid-area:support;align-self:start;margin:0;padding:4px 25px 0;width:100%}
.login-shell>.support-under-brand .support-logo-row{gap:12px}
.login-shell>.support-under-brand .support-logo-link{display:flex;align-items:center;max-width:46%;height:55px;min-height:55px}
.login-shell>.support-under-brand img.support-logo{height:50px!important;max-height:50px!important;max-width:160px!important;width:auto!important;object-fit:contain!important;background:#fff}
.login-brand-logo{max-width:100%;height:auto;max-height:190px;object-position:center}
@media(max-width:820px){
  .login-screen{min-height:100dvh;padding:16px 12px;display:flex;align-items:center;justify-content:center}
  .login-shell{display:flex!important;flex-direction:column;justify-content:center;align-items:center;gap:14px;width:min(440px,100%);min-height:calc(100dvh - 32px);margin:auto}
  .login-intro{order:1;display:flex!important;flex-direction:column;align-items:center!important;text-align:center;width:100%;align-self:stretch;padding:2px 8px 0!important}
  .login-intro .login-brand-logo{display:block!important;width:min(226px,78%)!important;max-height:86px!important;object-fit:contain;object-position:center;margin:0 auto 8px!important}
  .login-intro>p{margin:0;max-width:310px;line-height:1.5!important;font-size:.82rem!important}
  .login-panel{order:2;display:block!important;align-self:stretch!important;width:100%;margin:0!important;padding:22px 20px!important;border-radius:19px!important;box-shadow:0 15px 45px rgba(9,44,88,.13)}
  .login-panel .panel-heading{margin-bottom:14px!important}
  .login-panel label{margin-bottom:12px}
  .login-panel input{min-height:46px;font-size:16px!important}
  .login-panel .login-help-actions{gap:4px}
  .login-shell>.support-under-brand{order:3;align-self:stretch;width:100%;padding:0 8px!important;margin:3px 0 0!important;text-align:center}
  .login-shell>.support-under-brand>span{margin-bottom:4px!important;font-size:.62rem!important;letter-spacing:.08em}
  .login-shell>.support-under-brand .support-logo-row{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:10px}
  .login-shell>.support-under-brand .support-logo-link{flex:0 1 140px;min-width:0;height:45px!important;min-height:45px!important;max-width:48%;justify-content:center}
  .login-shell>.support-under-brand .support-logo-link img.support-logo{display:block!important;height:42px!important;max-height:42px!important;width:100%!important;max-width:145px!important;object-fit:contain!important;border:0;border-radius:8px;padding:3px 6px;background:#fff}
  #loginScreen .login-legal{margin-top:10px}
  #loginScreen .login-help-actions button{font-size:.84rem}
}
@media(max-width:385px){.login-screen{padding:10px 11px}.login-shell{min-height:calc(100dvh - 20px);gap:10px}.login-panel{padding:17px 15px!important}.login-intro .login-brand-logo{max-height:72px!important;width:min(205px,75%)!important}.login-intro>p{font-size:.78rem!important}}
@media(max-height:660px) and (max-width:820px){.login-shell{justify-content:flex-start;min-height:0}.login-intro .login-brand-logo{max-height:66px!important}.login-panel{padding:15px 18px!important}}
/* The agent's per-item amendment button must be touch-friendly and accessible. */
.bo851-amend-button{display:inline-flex;gap:8px;align-items:center;justify-content:center}
.bo851-amend-note{padding:12px 14px;border-left:4px solid #347ac1;border-radius:10px;background:var(--accent-soft);color:var(--text);line-height:1.5;margin:4px 0 14px}
.bo851-amend-help{font-size:.85rem;color:var(--muted);line-height:1.5}
@media(max-width:820px){.bo851-amend-button{min-height:46px!important;flex:1 1 155px}.bo851-amend-form .form-actions{display:flex;flex-direction:column-reverse}.bo851-amend-form .form-actions .btn{width:100%;min-height:48px}}

.bo851-agent-compact{display:none}
@media(max-width:820px){
 #appShell[data-role="agent"] #mainContent .timeline{display:none!important}
 .bo851-agent-compact{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px;background:var(--surface-2);border:1px solid var(--line);border-radius:13px;margin:12px 0}
 .bo851-agent-compact>div{display:flex;flex-direction:column;gap:3px;min-width:0}
 .bo851-agent-compact small{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800}
 .bo851-agent-compact strong{font-size:.95rem;color:var(--text)}
 .bo851-agent-compact span{font-size:.75rem;color:var(--muted)}
 .bo851-agent-compact .btn{min-height:42px;flex:none}
 #appShell[data-role="agent"] .bo85-agent-hero+section.card{border-radius:17px}
}
/* The old modal's sticky action toolbar overlapped form fields on small phones. */
@media(max-width:820px){
 .modal-body .bo851-amend-form .form-actions{position:static!important;display:flex!important;flex-direction:column-reverse!important;align-items:stretch!important;justify-content:flex-start!important;gap:9px!important;height:auto!important;min-height:0!important;margin-top:16px!important;padding:12px 0 10px!important;background:var(--surface)!important}
 .modal-body .bo851-amend-form .form-actions .btn{display:block!important;width:100%!important;min-height:48px!important;height:auto!important;flex:0 0 auto!important;line-height:1.35!important;padding:12px!important}
 .bo851-amend-form .form-grid{gap:12px!important}
}


/* 8.5.2 clean mobile polish */
#bo842-side-version,#bo842-build-badge,.bo842-deploy-stamp{display:none !important;}
.bo85-reset-note{margin:8px 0 4px;color:var(--muted);}
.bo85-inline-actions{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px !important;}
.bo85-inline-actions .btn{width:100% !important;min-height:46px !important;}
#appShell[data-role="agent"] .bo85-hero-kicker,.bo85-agent-hero .bo85-hero-kicker{display:none !important;}
.bo85-agent-hero p{margin-bottom:12px;}
@media (max-width:820px){
  .nav-open{display:none !important;}
  .topbar-left{gap:10px;}
  .topbar h2{font-size:1rem;}
  .sidebar{width:min(280px,84vw);}
  .bo85-security-panel p,.bo85-order-management p,.notice-banner,.bo842-profile-hero .status-chip{display:none !important;}
  .bo85-reset-ident{padding:12px; margin-bottom:12px;}
  .bo85-reset-icon{width:38px;height:38px;font-size:1.2rem;}
  .bo85-reset-ident strong{font-size:1rem;}
  .bo85-reset-success{text-align:left;}
  .bo85-reset-success h3{margin:0 0 10px;}
  .bo85-credentials{margin:12px 0;}
  .modal{width:min(560px,100%) !important;}
  .modal-body .form-actions.bo85-inline-actions{display:grid !important;grid-template-columns:1fr 1fr !important;flex-direction:row !important;}
}
@media (max-width:420px){
  .modal-body .form-actions.bo85-inline-actions{grid-template-columns:1fr !important;}
}