/* SPMC v0.11.79-safe — scoped final refinements. No global app/layout rules. */

/* 1) Visual Board / My Boards — phone-only usability */
@media (max-width: 700px){
  #board .spmc-board-template-menu{
    position:fixed!important;
    left:12px!important;right:12px!important;top:auto!important;
    bottom:calc(12px + env(safe-area-inset-bottom))!important;
    width:auto!important;min-width:0!important;
    max-height:min(72dvh,560px)!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;padding:12px!important;
    border-radius:18px!important;z-index:180!important;
    overscroll-behavior:contain;
  }
  #board .spmc-board-template-menu button{
    white-space:normal!important;min-height:58px!important;
    padding:10px!important;line-height:1.25!important;
  }
  #board .spmc-board-shell.sidebar-mobile-open::after{
    content:"";position:absolute;inset:0;background:rgba(15,23,42,.42);z-index:13;
  }
  #board .spmc-board-shell.sidebar-mobile-open .spmc-board-sidebar{z-index:15!important}
  #board .spmc-board-sidebar{width:min(86vw,310px)!important}
  #board .spmc-board-list-item{min-height:52px}
  #board .spmc-board-topbar{scrollbar-width:none}
  #board .spmc-board-topbar::-webkit-scrollbar{display:none}
  #board .spmc-board-canvas{min-height:420px}
}
@media (max-width: 390px){
  #board .spmc-board-template-menu{grid-template-columns:1fr!important}
}

/* 2) Tablet sidebar — compact/icons modes truly show icons only */
@media (min-width:768px) and (max-width:1199px){
  .app.sidebar-compact{grid-template-columns:76px minmax(0,1fr)!important}
  .app.sidebar-icons{grid-template-columns:64px minmax(0,1fr)!important}
  .app.sidebar-compact .sidebar,.app.sidebar-icons .sidebar{padding-inline:8px!important}
  .app.sidebar-compact .sidebar .brand h1,
  .app.sidebar-compact .sidebar .brand small,
  .app.sidebar-compact .sidebar .menu-title,
  .app.sidebar-icons .sidebar .brand h1,
  .app.sidebar-icons .sidebar .brand small,
  .app.sidebar-icons .sidebar .menu-title{display:none!important}
  .app.sidebar-compact .sidebar .nav-btn,
  .app.sidebar-icons .sidebar .nav-btn{
    font-size:0!important;justify-content:center!important;
    gap:0!important;padding-inline:6px!important;min-width:0!important;
  }
  .app.sidebar-compact .sidebar .nav-btn span,
  .app.sidebar-icons .sidebar .nav-btn span{font-size:22px!important;margin:0!important;flex:0 0 auto!important}
  .app.sidebar-compact .sidebar .brand,
  .app.sidebar-icons .sidebar .brand{justify-content:center!important;padding-inline:0!important}
}

/* 3) Mail reader overlay — phones only */
@media (max-width:700px){
  #mail .spmc-mail-reading-pane.spmc-mail-mobile-open{
    position:fixed!important;inset:calc(8px + env(safe-area-inset-top)) 8px calc(8px + env(safe-area-inset-bottom)) 8px!important;
    display:block!important;width:auto!important;height:auto!important;max-height:none!important;
    z-index:190!important;overflow:auto!important;background:var(--card,#fff)!important;
    border:1px solid var(--border,#dbe3ef)!important;border-radius:20px!important;
    box-shadow:0 24px 70px rgba(15,23,42,.38)!important;padding-top:52px!important;
  }
  #mail .spmc-mail-mobile-close{
    position:sticky;top:0;float:right;z-index:3;width:40px;height:40px;margin:-44px 4px 4px 0;
    border:1px solid var(--border);border-radius:12px;background:var(--card);color:var(--text);font-size:22px;cursor:pointer;
  }
  body.spmc-mail-reader-open{overflow:hidden!important}
}

/* 4) Slides presentation options — scoped to Slides */
#officeSlides .spmc-slide-presentation-options{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
#officeSlides .spmc-slide-presentation-options input[type=number]{width:88px;min-height:40px}
#officeSlides .spmc-slide-audio-label{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
#officeSlides .spmc-slide-audio-label input{display:none}
@media(max-width:700px){#officeSlides .spmc-slide-presentation-options{width:100%;overflow-x:auto;flex-wrap:nowrap}}

/* 5) World Directory reference links */
#directory .spmc-wd-reference-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
#directory .spmc-wd-reference-links a{text-decoration:none}

/* v0.11.80 surgical corrections --------------------------------------- */
/* My Boards: phone template chooser as a true full-screen gallery. */
@media (max-width:700px){
  #board .spmc-board-template-menu{
    position:fixed!important;inset:0!important;width:100%!important;height:100dvh!important;
    max-height:none!important;border:0!important;border-radius:0!important;padding:calc(58px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom))!important;
    background:var(--surface,#fff)!important;z-index:22000!important;overflow-y:auto!important;
    grid-template-columns:1fr!important;gap:12px!important;
  }
  #board .spmc-board-template-menu.show{display:grid!important}
  #board .spmc-board-template-menu::before{
    content:"Choose a board template";position:fixed;left:0;right:0;top:0;height:calc(50px + env(safe-area-inset-top));
    padding:calc(13px + env(safe-area-inset-top)) 54px 10px 16px;background:var(--surface,#fff);border-bottom:1px solid var(--border,#dbe3ee);
    color:var(--text,#172033);font-weight:800;font-size:17px;z-index:22001;box-sizing:border-box;
  }
  #board .spmc-board-template-menu .spmc-board-template-close{
    position:fixed!important;right:10px!important;top:calc(7px + env(safe-area-inset-top))!important;width:40px!important;height:40px!important;
    min-height:40px!important;padding:0!important;border-radius:12px!important;display:grid!important;place-items:center!important;
    font-size:24px!important;text-align:center!important;z-index:22002!important;background:var(--surface,#fff)!important;
  }
  #board .spmc-board-template-menu button:not(.spmc-board-template-close){
    display:grid!important;grid-template-columns:72px minmax(0,1fr)!important;align-items:center!important;gap:14px!important;
    min-height:92px!important;padding:12px 14px!important;border-radius:16px!important;white-space:normal!important;text-align:left!important;
    font-size:16px!important;font-weight:750!important;line-height:1.25!important;
  }
  #board .spmc-board-template-thumb{
    width:72px;height:66px;border-radius:12px;border:1px solid var(--border,#dbe3ee);background:linear-gradient(145deg,var(--soft,#eef2ff),var(--surface,#fff));
    display:grid;place-items:center;font-size:30px;box-shadow:inset 0 0 0 5px rgba(255,255,255,.35);
  }
  #board .spmc-board-template-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
  #board .spmc-board-template-copy small{display:block;color:var(--muted,#64748b);font-size:12px;font-weight:500;line-height:1.35}
}

/* Portrait tablets: user can expand or collapse the main menu; landscape untouched. */
@media (min-width:768px) and (max-width:900px) and (orientation:portrait) and (min-height:601px){
  #sidebarToggle{display:grid!important;place-items:center!important}
  .app{grid-template-columns:230px minmax(0,1fr)!important}
  .app.sidebar-compact{grid-template-columns:76px minmax(0,1fr)!important}
  .app.sidebar-icons{grid-template-columns:64px minmax(0,1fr)!important}
  .app.sidebar-compact .sidebar .brand>div:last-child,
  .app.sidebar-icons .sidebar .brand>div:last-child,
  .app.sidebar-compact .sidebar .menu-title,
  .app.sidebar-icons .sidebar .menu-title{display:none!important}
  .app.sidebar-compact .sidebar .nav-btn,
  .app.sidebar-icons .sidebar .nav-btn{justify-content:center!important;font-size:0!important;padding-inline:6px!important;gap:0!important}
  .app.sidebar-compact .sidebar .nav-btn span:first-child,
  .app.sidebar-icons .sidebar .nav-btn span:first-child{display:grid!important;width:42px!important;font-size:21px!important;margin:0!important}
  .app.sidebar-compact .sidebar .nav-btn span:not(:first-child),
  .app.sidebar-icons .sidebar .nav-btn span:not(:first-child){display:none!important}
  .app:not(.sidebar-compact):not(.sidebar-icons) .sidebar .brand>div:last-child,
  .app:not(.sidebar-compact):not(.sidebar-icons) .sidebar .menu-title{display:block!important}
  .app:not(.sidebar-compact):not(.sidebar-icons) .sidebar .nav-btn{justify-content:flex-start!important;font-size:12px!important}
}

/* v0.11.81 — My Boards template gallery portal (phone + tablet only). */
@media (max-width:1199px){
  body.spmc-board-template-open{overflow:hidden!important}
  body>.spmc-board-template-menu.spmc-board-template-portal{
    position:fixed!important;inset:0!important;display:none!important;
    width:100vw!important;height:100dvh!important;max-height:none!important;min-width:0!important;
    padding:calc(66px + env(safe-area-inset-top)) 18px calc(22px + env(safe-area-inset-bottom))!important;
    margin:0!important;border:0!important;border-radius:0!important;
    background:var(--bg,#f5f7fb)!important;z-index:2147483000!important;
    overflow-y:auto!important;overscroll-behavior:contain!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;
    box-sizing:border-box!important;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal.show{display:grid!important}
  body>.spmc-board-template-menu.spmc-board-template-portal::before{
    content:"Choose a board template";position:fixed;left:0;right:0;top:0;
    height:calc(56px + env(safe-area-inset-top));padding:calc(16px + env(safe-area-inset-top)) 64px 12px 18px;
    background:var(--card,#fff);border-bottom:1px solid var(--border,#dbe3ee);color:var(--text,#172033);
    font-size:18px;font-weight:800;z-index:2147483001;box-sizing:border-box;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-close{
    position:fixed!important;right:12px!important;top:calc(8px + env(safe-area-inset-top))!important;
    width:42px!important;height:42px!important;min-height:42px!important;padding:0!important;
    display:grid!important;place-items:center!important;border:1px solid var(--border,#dbe3ee)!important;
    border-radius:13px!important;background:var(--card,#fff)!important;color:var(--text,#172033)!important;
    font-size:25px!important;line-height:1!important;z-index:2147483002!important;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal button:not(.spmc-board-template-close){
    display:grid!important;grid-template-rows:minmax(128px,20vw) auto!important;grid-template-columns:1fr!important;
    gap:12px!important;min-height:238px!important;padding:12px!important;white-space:normal!important;text-align:left!important;
    border:1px solid var(--border,#dbe3ee)!important;border-radius:18px!important;background:var(--card,#fff)!important;
    color:var(--text,#172033)!important;box-shadow:0 8px 24px rgba(15,23,42,.08)!important;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-preview{
    position:relative!important;display:block!important;width:100%!important;height:100%!important;min-height:128px!important;
    border:1px solid var(--border,#dbe3ee)!important;border-radius:13px!important;overflow:hidden!important;
    background-color:#f8fafc!important;background-image:linear-gradient(#e5eaf2 1px,transparent 1px),linear-gradient(90deg,#e5eaf2 1px,transparent 1px)!important;
    background-size:12px 12px!important;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-preview i{
    position:absolute!important;display:block!important;border-radius:5px!important;
    border:1px solid rgba(71,85,105,.18)!important;background:hsl(calc(42 + var(--n)*52) 82% 87%)!important;
    box-shadow:0 2px 5px rgba(15,23,42,.08)!important;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-preview em{
    position:absolute;right:7px;bottom:6px;font-size:18px;font-style:normal;background:rgba(255,255,255,.9);border-radius:8px;padding:3px 6px;
  }
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-copy{display:flex!important;flex-direction:column!important;gap:5px!important;min-width:0!important}
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-copy strong{font-size:16px!important;line-height:1.2!important}
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-copy small{display:block!important;color:var(--muted,#64748b)!important;font-size:12px!important;line-height:1.35!important}
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-use{
    align-self:flex-start;margin-top:4px;padding:7px 10px;border-radius:9px;background:var(--primary,#6366f1);color:#fff;font-size:12px;font-weight:800;
  }
}
@media (max-width:700px){
  body>.spmc-board-template-menu.spmc-board-template-portal{grid-template-columns:1fr!important;gap:14px!important;padding-inline:12px!important}
  body>.spmc-board-template-menu.spmc-board-template-portal button:not(.spmc-board-template-close){grid-template-rows:minmax(150px,36vw) auto!important;min-height:260px!important}
}
@media (max-width:700px) and (orientation:landscape){
  body>.spmc-board-template-menu.spmc-board-template-portal{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding-top:calc(58px + env(safe-area-inset-top))!important;gap:10px!important}
  body>.spmc-board-template-menu.spmc-board-template-portal button:not(.spmc-board-template-close){grid-template-rows:100px auto!important;min-height:205px!important;padding:9px!important}
  body>.spmc-board-template-menu.spmc-board-template-portal .spmc-board-template-copy small{display:none!important}
}