/* MX Drive UX polish — 2026-10-04 */

/* Header: keep branding compact, give search the freed storage space. */
.topbar{
  grid-template-columns:190px minmax(360px,1fr) auto!important;
  gap:16px!important;
}
.top-actions{width:100%!important;min-width:0!important}
.global-search{width:100%!important;max-width:none!important}
.drive-top-tools .storage-card{display:none!important}
.drive-top-tools{gap:8px!important}
.brand-copy strong{font-size:19px!important}

/* The horizontal filter pills are now represented by one compact dropdown. */
#filterBar{display:none!important}
.content-head{align-items:flex-start!important}
.content-head>div{min-width:0!important}
.content-head h1{margin:0 0 10px!important}
.drive-filter-dropdown{position:relative!important;display:inline-block!important;z-index:35!important}
.drive-filter-trigger{
  height:36px!important;min-width:104px!important;padding:0 12px!important;
  border:1px solid #2b3947!important;border-radius:9px!important;
  background:#0b131b!important;color:#d8e0e8!important;
  display:inline-flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;
  font-size:12px!important;font-weight:700!important;cursor:pointer!important;
}
.drive-filter-trigger:hover,.drive-filter-trigger[aria-expanded="true"]{
  border-color:#4a5968!important;background:#101a24!important;color:#fff!important;
}
.drive-filter-trigger .chev{font-size:10px!important;color:#8796a6!important;transition:transform .15s ease!important}
.drive-filter-trigger[aria-expanded="true"] .chev{transform:rotate(180deg)!important}
.drive-filter-menu{
  position:absolute!important;left:0!important;top:42px!important;width:178px!important;padding:6px!important;
  border:1px solid #2a3948!important;border-radius:11px!important;background:#10171f!important;
  box-shadow:0 18px 48px rgba(0,0,0,.45)!important;display:none!important;
}
.drive-filter-dropdown.open .drive-filter-menu{display:grid!important;gap:2px!important}
.drive-filter-option{
  width:100%!important;height:36px!important;padding:0 10px!important;border:0!important;border-radius:8px!important;
  background:transparent!important;color:#c8d1db!important;text-align:left!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  font-size:12px!important;font-weight:650!important;cursor:pointer!important;
}
.drive-filter-option:hover{background:#18232e!important;color:#fff!important}
.drive-filter-option.active{background:rgba(255,138,0,.12)!important;color:#ff9d1a!important}
.drive-filter-option .tick{opacity:0!important}
.drive-filter-option.active .tick{opacity:1!important}

/* Details drawer: clean fixed header, no awkward floating/overlap. */
.detail-section:not([hidden]){isolation:isolate!important}
.detail-card-head{position:sticky!important;top:0!important;z-index:12!important}
.close-detail{z-index:13!important}
.mx-file-tooltip{display:none!important}

/* Search stays visually dominant now that top storage is gone. */
@media(min-width:1051px){
  .global-search{min-width:420px!important}
}

@media(max-width:1050px){
  .topbar{grid-template-columns:170px minmax(250px,1fr) auto!important;gap:10px!important}
}

@media(max-width:760px){
  .drive-filter-trigger{height:35px!important;min-width:96px!important}
  .drive-filter-menu{width:170px!important}
  .brand-copy strong{font-size:15px!important}
}