/* Components-specific overrides and responsive */

/* Table (admin) */
.data-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.data-table{width:100%;border-collapse:collapse;font-size:.875rem;min-width:500px}
.data-table th{text-align:left;padding:var(--space-2) var(--space-3);font-weight:600;color:var(--mute);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--hairline)}
.data-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--hairline);color:var(--body)}
.data-table tr:hover td{background:var(--soft)}
.data-table .actions{display:flex;gap:var(--space-2)}
.data-table .badge{display:inline-flex;padding:2px 8px;border-radius:var(--radius-full);font-size:.6875rem;font-weight:600}
.badge-admin{background:var(--accent-purple);color:#fff}
.badge-user{background:var(--soft);color:var(--body)}
.badge-disabled{background:var(--danger-soft);color:var(--danger)}

/* Tag/Type indicator */
.type-dot{width:8px;height:8px;border-radius:2px;display:inline-block;flex-shrink:0}
.type-image{background:#8b5cf6}
.type-doc{background:var(--primary)}
.type-video{background:#ec4899}
.type-audio{background:#14b8a6}
.type-archive{background:var(--accent-amber)}
.type-other{background:var(--mute)}

/* View toggle */
.view-toggle{display:flex;gap:2px;background:var(--soft);padding:2px;border-radius:var(--radius-sm)}
.view-btn{width:32px;height:32px;min-width:40px;min-height:40px;display:flex;align-items:center;justify-content:center;border:none;border-radius:4px;background:transparent;cursor:pointer;color:var(--mute);transition:all .15s}
.view-btn.active{background:var(--canvas);color:var(--ink);box-shadow:var(--shadow-xs)}

/* Sort select */
.sort-select{height:32px;min-height:40px;padding:0 var(--space-3);border:1px solid var(--hairline);border-radius:var(--radius-sm);font-size:.8125rem;background:var(--canvas);color:var(--body);cursor:pointer;outline:none}
.sort-select:focus{border-color:var(--primary)}

/* Switch toggle */
.switch{position:relative;display:inline-flex;width:44px;height:24px;flex-shrink:0}
.switch input{opacity:0;width:0;height:0}
.switch .slider{
  position:absolute;inset:0;background:var(--hairline);border-radius:var(--radius-full);
  cursor:pointer;transition:background .2s;
}
.switch .slider::before{
  content:'';position:absolute;left:2px;top:2px;width:20px;height:20px;
  background:#fff;border-radius:50%;transition:transform .2s;box-shadow:var(--shadow-xs);
}
.switch input:checked + .slider{background:var(--primary)}
.switch input:checked + .slider::before{transform:translateX(20px)}

/* Storage ring canvas */
.storage-ring-canvas{width:120px;height:120px;margin:0 auto}

/* File more button (mobile action trigger) */
.file-more-btn{
  position:absolute;bottom:var(--space-1);right:var(--space-1);
  width:28px;height:28px;min-width:36px;min-height:36px;
  border:none;border-radius:var(--radius-full);
  background:rgba(255,255,255,.8);backdrop-filter:blur(4px);
  color:var(--ink);font-size:1rem;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .15s;opacity:0;box-shadow:var(--shadow-xs);
}
.file-card:hover .file-more-btn,
.file-card .file-more-btn:focus{opacity:1}
.file-more-btn:hover{background:var(--canvas);box-shadow:var(--shadow-sm)}
@media(max-width:639px){.file-more-btn{opacity:1;width:32px;height:32px;bottom:var(--space-2);right:var(--space-2)}}

/* Mobile action sheet bottom */
.action-sheet-overlay{
  position:fixed;inset:0;z-index:300;
  background:rgba(15,23,42,.3);
  display:flex;align-items:flex-end;
  animation:fadeIn .2s ease;
}
.action-sheet{
  width:100%;background:var(--canvas);
  border-radius:var(--radius-xl) var(--radius-xl) 0 0;
  padding:var(--space-3) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom,0));
  box-shadow:0 -4px 24px rgba(0,0,0,.1);
  animation:sheetUp .25s ease;
}
.action-sheet .title{font-size:.875rem;font-weight:600;color:var(--ink);margin-bottom:var(--space-3);padding-bottom:var(--space-2);border-bottom:1px solid var(--hairline);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.action-sheet-item{
  display:flex;align-items:center;gap:var(--space-3);
  padding:var(--space-3) var(--space-2);font-size:.875rem;
  color:var(--body);border-radius:var(--radius-sm);cursor:pointer;
  transition:background .1s;min-height:44px;
}
.action-sheet-item:hover{background:var(--primary-soft);color:var(--primary)}
.action-sheet-item.danger{color:var(--danger)}
.action-sheet-item.danger:hover{background:var(--danger-soft)}
.action-sheet-cancel{
  margin-top:var(--space-2);padding:var(--space-3);
  text-align:center;font-size:.875rem;font-weight:600;color:var(--body);
  border-top:1px solid var(--hairline);cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:center;
}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

/* Mobile search bar */
.mobile-search{display:none;margin-bottom:var(--space-3)}
@media(max-width:639px){.mobile-search{display:block}}

/* Responsive breakpoints */
@media(max-width:1023px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
  .main{margin-left:0}
  .bento-grid{grid-template-columns:repeat(2,1fr)}
  .admin-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:639px){
  .sidebar{display:none}
  .main{margin-bottom:64px}
  .bottom-nav{
    display:flex;position:fixed;bottom:0;left:0;right:0;height:64px;
    background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur)) saturate(1.5);
    border-top:1px solid var(--glass-border);z-index:100;
    justify-content:space-around;align-items:center;padding:0 var(--space-2);
    padding-bottom:env(safe-area-inset-bottom,0);
  }
  .bottom-nav a{
    display:flex;flex-direction:column;align-items:center;gap:2px;
    padding:var(--space-1) var(--space-3);font-size:.625rem;color:var(--mute);
    text-decoration:none;min-width:56px;min-height:44px;justify-content:center;
  }
  .bottom-nav a svg{width:20px;height:20px}
  .bottom-nav a.active{color:var(--primary)}
  .bento-grid{grid-template-columns:1fr;grid-auto-rows:auto}
  .file-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-2)}
  .file-card .info .name{font-size:.75rem}
  .admin-grid{grid-template-columns:repeat(2,1fr)}
  .page{padding:var(--space-4) 0}
  .container{padding:0 var(--space-3)}
  .modal{padding:var(--space-4);margin:var(--space-3)}
  .topnav-search{display:none}
  .auth-card{padding:var(--space-5) !important}
  #logPagination{flex-direction:column;gap:var(--space-2)}
  #logPagination .btn{padding:0 var(--space-3);font-size:.75rem}

  .data-table{font-size:.8125rem}
  .data-table td,.data-table th{white-space:nowrap;padding:var(--space-2) var(--space-2)}

  /* 上传区域手机适配 */
  .drop-zone{padding:var(--space-6) var(--space-4)}
  .drop-zone .icon{font-size:1.75rem}

  /* 上传队列手机全宽 */
  .upload-queue{right:var(--space-3);left:var(--space-3);width:auto}

  /* 工具栏手机换行紧凑 */
  .toolbar{gap:var(--space-2)}

  /* Toast 手机居中 */
  .toast-container{right:var(--space-3);left:var(--space-3)}
  .toast{max-width:100%}

  /* 文件夹删除按钮在手机上不可点击的问题 - 改为点击弹出菜单 */
  .folder-chip{padding:var(--space-2) var(--space-3);font-size:.75rem}

  /* 面包屑手机缩小 */
  .breadcrumb{font-size:.75rem;gap:var(--space-1);overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .breadcrumb a{white-space:nowrap}
}
