/* SmartTeam shared layout fixes — 2026.09.06-r6 */
html,body{max-width:100%;overflow-x:hidden}
.shell,main,nav.rail{min-width:0}
/* Keep company and session details compact in the shared sidebar. */
nav.rail .brand b#brandCo{font-size:1.1rem;line-height:1.25}
nav.rail .sesbar .who{font-size:14px;min-width:0;overflow-wrap:anywhere}
nav.rail .sesbar button{font-size:14px;min-height:2rem}
#topActions{min-width:0;max-width:100%}
.sheetcard{
  align-self:center;
  width:100%;
  max-height:calc(100dvh - 2rem);
  overflow:auto;
  background:var(--surface);
  border:1px solid var(--rule);
  border-radius:6px;
  box-shadow:var(--shadow);
}
.sheetcard>header{
  position:sticky;top:0;z-index:2;
  display:flex;align-items:center;gap:.8rem;
  padding:1rem 1.3rem;
  background:var(--surface);
  border-bottom:1px solid var(--rule);
}
.sheetcard>header h2{flex:1;margin:0;font-family:var(--display);font-size:1.1rem}
.sheetcard>.body{padding:1.3rem}
.sheetcard>footer{
  position:sticky;bottom:0;z-index:2;
  display:flex;gap:.6rem;justify-content:flex-end;
  padding:.85rem 1.3rem;
  background:var(--surface);
  border-top:1px solid var(--rule);
}
label.fld textarea{
  width:100%;min-width:0;
  border:1px solid var(--rule);
  border-radius:3px;
  padding:.55rem;
  color:var(--ink);
  background:var(--surface);
  resize:vertical;
}
.company-imgpick{display:flex;flex-direction:column;gap:.35rem}
.company-imgpick>.lb{font-family:var(--mono);font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.company-imgdrop{min-height:7.25rem;border:2px dashed var(--rule);border-radius:5px;background:var(--surface-2);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;padding:.55rem;text-align:center;cursor:pointer}
.company-imgdrop.over{border-color:var(--accent);background:var(--accent-soft)}
.company-imgdrop:focus{outline:2px solid var(--accent);outline-offset:1px}
.company-imgdrop:focus-visible{border-color:var(--accent);background:var(--accent-soft)}
.company-imgdrop img{display:block;max-width:100%;height:3.7rem;object-fit:contain;border-radius:3px;background:#fff}
.company-imgdrop .empty{font-size:15px;color:var(--ink-3)}
.company-imgdrop .dropnote{font-size:15px;color:var(--ink-3);line-height:1.35}
.company-imgdrop .row{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center}
.company-savebar{display:flex;align-items:center;justify-content:flex-end;gap:.55rem;flex-wrap:wrap;
  margin-top:1rem;padding-top:1rem;border-top:1px solid var(--rule-soft)}
.company-savebar .hint{margin-inline-end:auto}

.co-preview-panel{margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--rule-soft)}
.co-preview-hd{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem .75rem;margin-bottom:.85rem}
.co-preview-hd b{font-size:.95rem}
.co-prev-viewport{overflow:hidden;background:#8a8f94;border:1px solid var(--rule);border-radius:4px;
  padding:6px 4px 8px;min-height:10rem}
.co-prev-iframe{background:transparent;pointer-events:auto}

label.print-opt{display:flex;flex-direction:row;align-items:center;gap:.6rem;margin:.4rem 0;cursor:pointer}
label.print-opt input[type=checkbox]{width:1.05rem;height:1.05rem;flex:0 0 auto;margin:0;padding:0;accent-color:var(--accent)}
label.print-opt>span{line-height:1.35;min-height:0;font-family:inherit;font-size:inherit}

@media(max-width:1200px){
  .topbar #topActions{flex:1 0 100%;width:100%}
}
@media(max-width:860px){
  .scrim{padding:.5rem}
  .sheetcard{max-height:calc(100dvh - 1rem);border-radius:6px}
  .sheetcard>.body{padding:1rem}
  .sheetcard>footer{padding:.75rem 1rem;flex-wrap:wrap}
  .sheetcard>footer .btn{flex:1;justify-content:center}
}
@media(max-width:520px){
  .sheetcard .g2,.sheetcard .g3{grid-template-columns:1fr}
  .topbar #topActions>.btn{flex:1 1 calc(50% - .5rem);justify-content:center}
}

/* Mobile navigation: keep system names and selectors readable. */
@media(max-width:860px){
  nav.rail{display:flex;flex-direction:column;align-items:stretch;gap:.65rem;overflow:visible}
  nav.rail .switcher{order:1;flex:0 0 auto;flex-wrap:nowrap;overflow-x:auto;padding:0 0 .15rem;scrollbar-width:thin}
  nav.rail .swhome,nav.rail .swtab{flex:0 0 auto;white-space:nowrap}
  nav.rail .brand{order:1}
  nav.rail .switcher{order:2}
  nav.rail .navlist{order:3;width:100%;overflow-x:auto;justify-content:space-around;padding:.1rem 0 0;scrollbar-width:thin}
  nav.rail .sesbar{order:4}
  nav.rail .navlist button{width:auto;flex:0 0 auto}
}


/* Toast — top center, never cover sticky sheetcard footers */
.toast{position:fixed!important;inset-block-start:1.2rem!important;inset-block-end:auto!important;
  inset-inline-start:50%!important;transform:translateX(-50%)!important;z-index:100!important;
  max-width:min(92vw,28rem);text-align:center;pointer-events:none}
/* รอบ 25: ข้อความแจ้ง (#toast ที่ใช้ซ้ำ) หายเองเมื่อหมดเวลา — เดิมไม่มีกฎซ่อน ข้อความจึงค้างบนจอ */
#toast.toast{transition:opacity .25s ease,visibility .25s}
#toast.toast:not(.show){opacity:0;visibility:hidden}

/* Lang pill — inline in topbar, never over header action buttons */
.topbar #i18nPill{position:static!important;top:auto!important;right:auto!important;
  flex:0 0 auto;align-self:center;margin-inline-start:.35rem;z-index:1!important}

/* Long-form modal scrolling: headers and actions stay visible. */
.scrim{padding:1rem;overflow:hidden}
.sheetcard,.drawer{display:flex;flex-direction:column;max-height:calc(100dvh - 2rem);overflow:hidden}
.sheetcard>header,.drawer>header,.sheetcard>footer,.drawer>footer{flex:0 0 auto}
.sheetcard>.body,.drawer>.body{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}
.sheetcard>footer,.drawer>footer{z-index:3;flex-wrap:wrap;background:var(--surface)}
@media(max-width:860px){
  .scrim{padding:.5rem}
  .sheetcard,.drawer{max-height:calc(100dvh - 1rem)}
}