/* Shell-only corrections: content modules keep their own navigation/layout. */
html body #commercial.mobile-app>header{
 display:flex;align-items:center;justify-content:flex-end;gap:12px;
 height:auto;min-height:64px;padding:10px 16px;isolation:isolate;
}
html body #commercial.mobile-app>header>img{margin-right:auto;flex-shrink:1;min-width:0}
html body #commercial.mobile-app>header>.agenda-invitation-bell{
 position:relative;inset:auto;flex:0 0 44px;order:1;
 display:grid;place-items:center;width:44px;min-height:44px;
 padding:0;font-size:14px;border:1px solid var(--ui-line,#e3d8e5);
 background:#fff;border-radius:10px;
}
html body #commercial.mobile-app>header>#logout-commercial{order:2;flex:0 0 auto;margin:0}
html body #commercial.mobile-app>header>#commercial-leadership-back{order:3}
html body .exec-top-actions>.agenda-invitation-bell{position:relative;inset:auto;margin:0}
html[data-app-loading] .agenda-invitation-bell{visibility:hidden}
html body #commercial.mobile-app>nav{padding-bottom:max(6px,env(safe-area-inset-bottom))}
.commercial-nav-compact-label{display:none}
html body #commercial.mobile-app>nav button:focus-visible,
html body #commercial.mobile-app>header button:focus-visible{outline:2px solid #80366e;outline-offset:2px}

@media(min-width:1100px){
 html body #commercial.mobile-app>header{
  position:sticky;top:0;z-index:30;background:var(--ui-bg,#f6f6f9);
  min-height:64px;padding:10px 32px;border:0;
 }
 html body #commercial.mobile-app>header>img{display:none}
 html body #commercial.mobile-app>main{padding-top:16px;min-height:calc(100dvh - 64px)}
}
@media(max-width:1099px){
 html body #commercial.mobile-app>nav{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:stretch;gap:2px;min-height:76px;padding:5px 4px max(5px,env(safe-area-inset-bottom));
 }
 html body #commercial.mobile-app>nav button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;min-width:0;min-height:64px;padding:7px 2px;
  font-size:clamp(9px,2.6vw,12px);line-height:1.2;
 }
 html body #commercial.mobile-app>nav button>span{max-width:100%;overflow-wrap:anywhere;line-height:1.25}
 html body #commercial.mobile-app>nav .commercial-nav-full-label{display:none}
 html body #commercial.mobile-app>nav .commercial-nav-compact-label{display:inline}
 html body #commercial.mobile-app>nav button svg{width:21px;height:21px;flex:none}
 html body #commercial.mobile-app>main{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
 html body #commercial.mobile-app>header #logout-commercial{padding:10px!important;min-height:44px}
 html body #commercial.mobile-app>header #logout-commercial svg{width:18px;height:18px;flex:none}
}
@media(max-width:350px){
 html body #commercial.mobile-app>header{gap:8px;padding-inline:12px}
 html body #commercial.mobile-app>header>img{max-width:90px}
 html body #commercial.mobile-app>header #logout-commercial{font-size:11px!important;gap:5px}
}
/* Keep the close action visible when an invitation contains a long objective. */
dialog.agenda-invitations-dialog{max-height:calc(100dvh - 24px);overscroll-behavior:contain}
.agenda-invitations-dialog>header{position:sticky;top:-22px;z-index:2;background:#fff;padding-block:8px;margin-bottom:8px}
.agenda-invitations-dialog>header h2{min-width:0;overflow-wrap:anywhere;margin:8px 0;line-height:1.3}
.agenda-invitations-dialog>header [data-close]{flex:0 0 44px;width:44px;min-height:44px;padding:0;font-size:24px;line-height:1}
.agenda-invitations-dialog button{min-height:44px}
.agenda-invitation-item strong,.agenda-invitation-item p,.agenda-participant>span{overflow-wrap:anywhere}
@media(max-width:600px){.agenda-invitations-dialog>header{top:-16px}.agenda-invitations-dialog footer button{flex:1 1 120px}}

/* Explicit placement prevents auto-grid from putting the daily quota beside
   the title, or squeezing an entire product workspace into a header column. */
html body #commercial #personal-results{
 display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"heading" "filters" "quota" "content";
 align-items:start;gap:18px;min-width:0;
}
html body #commercial #personal-results>.personal-results-title{grid-area:heading;display:block;min-width:0;padding:0;background:transparent}
html body #commercial #personal-results>.personal-results-filter{grid-area:filters;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) max-content;align-items:end;margin:0;min-width:0}
html body #commercial #personal-results>.personal-results-filter label{width:auto;min-width:0}
html body #commercial #personal-results>.personal-results-filter button{white-space:nowrap;min-width:max-content;min-height:44px;padding:10px 14px;font-size:13px;line-height:1.4}
html body #commercial #personal-results>.visit-quota{grid-area:quota;width:100%;max-width:none;margin:0}
html body #commercial #personal-results>[data-results-content]{grid-area:content;min-width:0}
html body #commercial #personal-products{display:block;min-width:0;width:100%}
html body #commercial #personal-products.hidden{display:none!important}
html body #commercial .personal-products-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:0;margin-bottom:20px;background:transparent}
html body #commercial .personal-products-title>div{min-width:0;flex:1 1 220px}
html body #commercial .personal-products-title h1{margin:0;white-space:normal;word-break:normal;overflow-wrap:normal}
html body #commercial .personal-products-title p{font-size:13px;line-height:1.5;color:#807085;margin:6px 0 0}
html body #commercial .personal-products-title button{font:inherit;font-size:13px;padding:9px 12px;min-height:44px;border:1px solid #e3d8e5;border-radius:9px;background:white;color:#80366e;cursor:pointer}
html body #commercial [data-personal-products]{min-width:0;width:100%}
html body #commercial #personal-products .product-sales>header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;padding:0;background:transparent;margin:0 0 12px}
html body #commercial #personal-products .product-sales>header h2{margin:0;font-size:18px}
html body #commercial #personal-products .product-sales>header>span{grid-column:1/-1}
html body #commercial #personal-products .product-sales>header button{white-space:nowrap;min-height:44px;font-size:12px}
html body #commercial.mobile-app>nav>.commercial-nav-more{display:none}
.commercial-more-dialog{box-sizing:border-box;width:min(440px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;border:1px solid #e3d8e5;border-radius:16px;padding:18px;background:#fff;color:#352b40;box-shadow:0 20px 70px #23142630;font:14px/1.5 Manrope,Arial,sans-serif}
.commercial-more-dialog::backdrop{background:#23142670}
.commercial-more-dialog>header{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:14px}
.commercial-more-dialog h2{font-size:20px;line-height:1.3;margin:5px 0}
.commercial-more-dialog p{font-size:12px;color:#807085;margin:0}
.commercial-more-dialog button{font:inherit;color:#80366e;background:white;border:1px solid #e3d8e5;border-radius:10px;min-height:48px;cursor:pointer}
.commercial-more-dialog [data-close-more]{width:44px;min-height:44px;flex:none;padding:0;font-size:24px}
.commercial-more-dialog [role=navigation]{display:grid;gap:8px}
.commercial-more-dialog [data-more-view]{display:flex;align-items:center;gap:12px;padding:14px;text-align:left}
.commercial-more-dialog [data-more-view] svg{flex:none;width:21px;height:21px}
.commercial-more-dialog [aria-current=page]{background:#f4eaf2;font-weight:700}
.commercial-more-dialog button:hover{background:#faf5f9}
.commercial-more-dialog button:focus-visible{outline:2px solid #80366e;outline-offset:2px}
@media(min-width:1100px){
 html body #commercial #personal-results{grid-template-columns:minmax(0,1fr) minmax(340px,440px);grid-template-areas:"heading filters" "quota quota" "content content"}
}
@media(max-width:1099px){
 html body #commercial.mobile-app>nav>.commercial-nav-secondary{display:none!important}
 html body #commercial.mobile-app>nav>.commercial-nav-more{display:flex}
 html body #commercial.mobile-app>nav{min-height:68px}
 html body #commercial.mobile-app>nav button{min-height:56px;font-size:clamp(10px,2.8vw,12px)}
}
@media(max-width:600px){.commercial-more-dialog{margin:auto auto 12px}.personal-products-title>button{align-self:flex-start}}
