/* Layout and icon assets only; themes.css remains the final color contract. */
.app-screen .sidebar-head { height:var(--topbar-height) !important; }
.app-screen.sidebar-collapsed .sidebar-head { height:var(--topbar-height) !important; }
.app-screen .sidebar-toggle { width:40px !important; height:40px !important; flex:none; border-radius:8px !important; }
.app-screen .sidebar-toggle::before {
  mask:url('../icons/chevron-left.svg') center / 20px 20px no-repeat;
  -webkit-mask:url('../icons/chevron-left.svg') center / 20px 20px no-repeat;
}
.ui-icon { display:inline-block; width:20px; height:20px; flex:none; background:currentColor; vertical-align:middle; }
/* Full SVG colors keep the inset seam dark, including on light surfaces. */
.ui-icon-folder { background:transparent url('../icons/folder.svg') center / contain no-repeat; mask:none; -webkit-mask:none; }
.ui-icon-folder-add { background:transparent url('../icons/folder-create.svg') center / contain no-repeat; mask:none; -webkit-mask:none; }
/* One two-tone paper asset remains legible on dark and light surfaces. */
.ui-icon-text-document { background:transparent url('../icons/file-paper.svg') center / contain no-repeat; }
.ui-icon-document { background:transparent url('../icons/file-blank.svg') center / contain no-repeat; }
.app-screen .legacy-drive-shell .upload-options-menu { width:180px; max-width:calc(100vw - 32px); padding:4px; border-radius:10px; }
.app-screen .legacy-drive-shell .upload-options-menu.open { gap:0; }
.app-screen .legacy-drive-shell .upload-option-item { min-height:40px; padding:8px 10px; justify-content:flex-start; gap:10px; font-weight:600; border-radius:6px; }
.legacy-drive-shell .section-header .ui-icon { width:20px; height:20px; }
.folder-tree-line .folder-tree-open { display:flex; align-items:center; gap:8px; min-width:0; text-align:left; }
.folder-tree-open .ui-file-symbol { --file-glyph-size:20px; }
.folder-entry .ui-file-symbol { --file-glyph-size:24px; }
.conflict-thumb.is-file-symbol { --file-glyph-size:40px; background:transparent; }
.conflict-thumb .conflict-file-type-image { width:40px; height:40px; object-fit:contain; }
.app-screen .legacy-drive-shell .drive-icon-action { width:40px !important; min-width:40px !important; padding:0 !important; gap:0 !important; }
.app-screen .legacy-drive-shell .drive-action-btn { font-weight:600 !important; }

/* One restrained file-type family in all densities; photo pixels are untouched. */
.legacy-drive-shell { --file-glyph-size:clamp(24px,2.4vw,32px); }
.legacy-drive-shell[data-view-mode=compact] { --file-glyph-size:20px; }
.legacy-drive-shell[data-view-mode=thumbnail] { --file-glyph-size:56px; }
.legacy-drive-shell .explorer-item { transition:background-color .15s,border-color .15s,box-shadow .15s; }
.legacy-drive-shell .explorer-item:hover { transform:none; }
.legacy-drive-shell :is(.file-info,.folder-info) { margin-left:0; }
.legacy-drive-shell :is(.folder-icon,.file-icon.word,.file-icon.excel,.file-icon.ppt,.file-icon.pdf,.file-icon.txt) { background:transparent !important; box-shadow:none; }
.legacy-drive-shell :is(.file-icon.word,.file-icon.excel,.file-icon.ppt,.file-icon.pdf) { background-position:center !important; background-repeat:no-repeat !important; background-size:var(--file-glyph-size) var(--file-glyph-size) !important; }
.legacy-drive-shell .file-icon.word { background-image:url('../icons/word.svg') !important; }
.legacy-drive-shell .file-icon.excel { background-image:url('../icons/excel.svg') !important; }
.legacy-drive-shell .file-icon.ppt { background-image:url('../icons/powerpoint.svg') !important; }
.legacy-drive-shell .file-icon.pdf { background-image:url('../icons/pdf.svg') !important; }
.legacy-drive-shell :is(.file-icon.word,.file-icon.excel,.file-icon.ppt,.file-icon.txt)>span { display:none; }
.ui-file-symbol { display:block; flex:none; width:var(--file-glyph-size,32px); height:var(--file-glyph-size,32px); background:currentColor; }
.ui-file-symbol.folder { background:transparent url('../icons/folder.svg') center / contain no-repeat; mask:none; -webkit-mask:none; }
/* Keep type classes for filtering; PDF and Office retain dedicated artwork. */
.legacy-drive-shell .file-icon:not(.word):not(.excel):not(.ppt):not(.pdf):not(.txt) { background:transparent url('../icons/file-blank.svg') center / var(--file-glyph-size) var(--file-glyph-size) no-repeat !important; box-shadow:none; }
.legacy-drive-shell .file-icon.txt { background:transparent url('../icons/file-paper.svg') center / var(--file-glyph-size) var(--file-glyph-size) no-repeat !important; box-shadow:none; }
.legacy-drive-shell .file-icon:not(.word):not(.excel):not(.ppt)>span { display:none; }
.ui-file-symbol.text { background:transparent url('../icons/file-paper.svg') center / contain no-repeat; }
.ui-file-symbol.document { background:transparent url('../icons/file-blank.svg') center / contain no-repeat; }
.file-visual { --file-glyph-size:32px; }
.file-visual[data-visual-kind] { color:var(--theme-text,var(--text)); background:var(--theme-control,var(--surface-2)); }
.file-visual[data-visual-kind]:not([data-visual-kind=image]):not([data-visual-kind=video]) { background:transparent; }
.file-visual .file-type-image { width:var(--file-glyph-size); height:var(--file-glyph-size); object-fit:contain; }
.library-page[data-view=compact] .file-visual { --file-glyph-size:24px; }
.library-page[data-view=thumbnail] .file-visual { --file-glyph-size:64px; }
.trash-page[data-view=compact] .file-visual { --file-glyph-size:24px; }
.trash-page[data-view=thumbnail] .file-visual { --file-glyph-size:64px; }

/* Metadata has a deliberate rhythm instead of splitting bytes or seconds. */
.legacy-drive-shell .file-meta { align-items:center; gap:12px; }
.legacy-drive-shell .file-meta .file-size { flex:none; white-space:nowrap; }
.legacy-drive-shell .file-modified,.legacy-drive-shell .folder-meta time { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.legacy-drive-shell[data-view-mode=thumbnail] .file-meta { display:grid; grid-template-columns:minmax(0,1fr); gap:2px; line-height:1.5; }
.legacy-drive-shell[data-view-mode=thumbnail] .file-info { min-width:0; }
.legacy-drive-shell[data-view-mode=thumbnail] .explorer-item { padding:0 !important; flex-wrap:nowrap; }
.legacy-drive-shell[data-view-mode=thumbnail] .item-main-area { width:100%; max-width:100%; padding:12px !important; }
.legacy-drive-shell[data-view-mode=thumbnail] .item-name-link { display:block; }
.legacy-drive-shell[data-view-mode=thumbnail] .item-option-btn { width:28px !important; height:28px !important; min-height:28px !important; right:8px; top:8px; }
.legacy-drive-shell .item-checkmark { border-radius:4px; border-color:var(--theme-muted,var(--muted)); background:var(--theme-control,var(--surface-2)); }
.legacy-drive-shell[data-view-mode=thumbnail] .item-checkmark { background:var(--theme-control,var(--surface-2)); }
.app-screen .legacy-drive-shell .item-main-area:hover { background:transparent; }
.share-page .share-tabs { gap:28px; }
.share-page .share-tabs a { padding:10px 0 12px; }

/* Keep the native, accessible picker, but make its button match every theme. */
input[type=file] { min-width:0; max-width:100%; padding:8px; }
input[type=file]::file-selector-button {
  margin-right:12px; padding:8px 12px; border:1px solid var(--theme-border,var(--line));
  border-radius:8px; background:var(--theme-surface-alt,var(--surface-2));
  color:var(--theme-text,var(--text)); font:inherit; font-weight:600; cursor:pointer;
}
input[type=file]::file-selector-button:hover { background:var(--theme-hover,var(--surface-3)); }
input[type=file]:focus-visible { outline:2px solid var(--theme-focus,var(--blue)); outline-offset:3px; }
input[type=file]:disabled::file-selector-button { cursor:not-allowed; opacity:.55; }
.version-other-types { border-top:1px solid var(--theme-border,var(--line)); padding-top:12px; }
.version-other-types summary { width:fit-content; cursor:pointer; color:var(--theme-muted,var(--muted)); font-weight:600; }
.version-other-types[open] .policy-list { margin-top:12px; }

/* Keep native select behavior; a thin themed chevron replaces the platform glyph. */
select:not([multiple]):not([size]) {
  appearance:none; -webkit-appearance:none; padding-right:40px !important;
  background-image:
    linear-gradient(45deg,transparent 42%,var(--theme-muted,var(--muted)) 42%,var(--theme-muted,var(--muted)) 58%,transparent 58%),
    linear-gradient(135deg,transparent 42%,var(--theme-muted,var(--muted)) 42%,var(--theme-muted,var(--muted)) 58%,transparent 58%);
  background-position:right 22px center,right 16px center;
  background-size:6px 6px; background-repeat:no-repeat;
}
.app-screen .nav-current {
  width:16px; height:16px; flex:none; margin-left:auto;
}
.app-screen .nav-current::before {
  content:""; display:block; width:16px; height:16px; background:currentColor;
  mask:url('../icons/chevron-left.svg') center / 16px 16px no-repeat;
  -webkit-mask:url('../icons/chevron-left.svg') center / 16px 16px no-repeat;
  transform:rotate(180deg);
}
@media(forced-colors:active) {
  select:not([multiple]):not([size]) { appearance:auto; background-image:none; }
}

@media(max-width:780px) {
  /* The mobile search/theme bar has two rows; drawer identity stays one row. */
  .app-screen .sidebar-head,.app-screen.sidebar-collapsed .sidebar-head { height:56px !important; }
}
