/* ================================================================
   Cloud Drive UI — 百度云盘风格统一主题
   合并 design-system + harmony-theme，消除 !important 冲突
   ================================================================ */

/* --- CSS 变量 --- */
:root {
  --c-primary: #4e6ef2;
  --c-primary-light: #6b8cff;
  --c-primary-dark: #3d5bd9;
  --c-primary-50: rgba(78,110,242,.06);
  --c-primary-100: rgba(78,110,242,.10);
  --c-primary-200: rgba(78,110,242,.18);
  --c-accent: #00b8d9;
  --c-success: #10b981;
  --c-warning: #f59e0b;
  --c-danger: #ef4444;
  --c-info: #3b82f6;
  --bg-page: #f5f7fa;
  --bg-surface: #ffffff;
  --bg-sidebar: #ffffff;
  --text-primary: #1f2937;
  --text-secondary: #6b7280;
  --text-muted: #9ca3af;
  --border-light: #f0f0f0;
  --border-default: #e5e7eb;
  --border-strong: #d1d5db;
  --shadow-sm: 0 1px 3px rgba(0,0,0,.04);
  --shadow-md: 0 2px 8px rgba(0,0,0,.06);
  --shadow-lg: 0 4px 16px rgba(0,0,0,.08);
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-full: 9999px;
  --t-fast: .15s;
  --t-normal: .2s;
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
  --sidebar-width: 220px;
}

/* --- 全局重置 --- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-font-smoothing:antialiased}
body{font-family:var(--font-sans);color:var(--text-primary);background:var(--bg-page);line-height:1.5;min-height:100vh}
a{color:var(--c-primary);text-decoration:none}
input,button,textarea,select{font-family:inherit;font-size:inherit}
::selection{background:var(--c-primary-200);color:var(--c-primary-dark)}

/* --- 按钮 --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border:1px solid transparent;border-radius:var(--r-sm);font-weight:600;font-size:.875rem;cursor:pointer;transition:all var(--t-normal);white-space:nowrap}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--c-primary);color:#fff}
.btn-primary:hover{background:var(--c-primary-dark);box-shadow:0 2px 8px rgba(78,110,242,.3)}
.btn-secondary{background:var(--bg-surface);color:var(--text-primary);border-color:var(--border-default)}
.btn-secondary:hover{border-color:var(--c-primary);color:var(--c-primary)}
.btn-ghost{background:transparent;color:var(--text-secondary);border:none}
.btn-ghost:hover{color:var(--c-primary);background:var(--c-primary-50)}
.btn-danger{background:var(--c-danger);color:#fff}
.btn-sm{padding:5px 10px;font-size:.8rem;border-radius:var(--r-xs)}
.btn-lg{padding:12px 28px;font-size:1rem}
.btn:disabled{opacity:.5;cursor:not-allowed}

/* --- 表单 --- */
.form-group{display:flex;flex-direction:column;gap:4px}
.form-label{font-size:.8125rem;font-weight:600;color:var(--text-secondary)}
.form-input,.form-select{width:100%;padding:9px 14px;background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--r-sm);color:var(--text-primary);font-size:.9375rem;transition:border-color var(--t-fast)}
.form-input:focus{border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-primary-100);outline:none}
.form-input::placeholder{color:var(--text-muted)}

/* --- 卡片/面板 --- */
.card,.panel{background:var(--bg-surface);border:1px solid var(--border-light);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
.panel{padding:20px}
.panel-title{font-size:1.05rem;font-weight:700;margin-bottom:14px;color:var(--text-primary)}

/* --- 模态框 --- */
.modal-overlay{position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,.45);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:24px}
.modal-box{background:var(--bg-surface);border-radius:var(--r-xl);padding:0;box-shadow:var(--shadow-lg);width:90%;max-width:600px;max-height:90vh;overflow-y:auto;position:relative}

/* --- Toast --- */
.toast-container{position:fixed;top:20px;right:20px;z-index:99999;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.toast{display:flex;align-items:center;gap:10px;padding:10px 18px;background:var(--bg-surface);border:1px solid var(--border-light);border-radius:var(--r-md);box-shadow:var(--shadow-lg);font-size:.875rem;pointer-events:auto;transform:translateX(120%);transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.toast.show{transform:translateX(0)}
.toast-success{border-left:3px solid var(--c-success)}
.toast-error{border-left:3px solid var(--c-danger)}

/* --- 动画 --- */
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.anim-fade-in{animation:fadeIn .25s ease both}
.anim-fade-in-up{animation:fadeInUp .35s ease both}
.anim-delay-1{animation-delay:.05s}.anim-delay-2{animation-delay:.1s}.anim-delay-3{animation-delay:.15s}.anim-delay-4{animation-delay:.2s}

/* ================================================================
   登录后主界面 — 百度云盘风格
   ================================================================ */

/* --- 整体布局 --- */
.app-shell{display:flex!important;min-height:100vh;background:var(--bg-page)}
.app-shell.active{display:flex!important}

/* --- 侧边栏 --- */
.sidebar{
  position:sticky!important;top:0;left:0;width:var(--sidebar-width)!important;min-width:var(--sidebar-width)!important;
  height:100vh;max-height:100vh;overflow-y:auto;
  background:var(--bg-sidebar)!important;border-right:1px solid var(--border-light)!important;
  padding:16px 12px;display:flex;flex-direction:column;
  z-index:50;flex-shrink:0;
}
.site-branding{padding:12px 10px;margin-bottom:8px}
.site-title{font-size:1.1rem;font-weight:800;color:var(--text-primary);letter-spacing:-.02em}
.user-info{display:flex;align-items:center;gap:10px;padding:10px;margin-bottom:12px;border-bottom:1px solid var(--border-light)}
.avatar{
  width:36px;height:36px;border-radius:50%;
  background:var(--c-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:14px;flex-shrink:0;
}
.user-details h3{font-size:.875rem;font-weight:700;color:var(--text-primary);margin:0}
.user-details p{font-size:.75rem;color:var(--text-muted);margin:0}

/* --- 导航链接 --- */
.nav-links{list-style:none;padding:0;margin:4px 0;flex:1}
.nav-links li{margin:2px 0}
.nav-links a{
  display:flex;align-items:center;gap:8px;
  padding:9px 12px;border-radius:var(--r-sm);
  font-size:.875rem;font-weight:500;color:var(--text-secondary);
  transition:all var(--t-fast);text-decoration:none;border:none;background:none;
}
.nav-links a:hover{background:var(--c-primary-50);color:var(--c-primary)}
.nav-links a.active{background:var(--c-primary-50);color:var(--c-primary);font-weight:600}

/* --- 配额 --- */
.quota-display{padding:10px 12px;margin-top:auto;border-top:1px solid var(--border-light)}
.quota-title{font-size:.75rem;font-weight:600;color:var(--text-muted);margin-bottom:6px}
.quota-bar{height:4px;background:var(--border-light);border-radius:var(--r-full);overflow:hidden;margin-bottom:6px}
.quota-fill{height:100%;border-radius:var(--r-full);background:var(--c-primary);transition:width .5s ease}
.quota-info{font-size:.75rem;color:var(--text-secondary);display:flex;justify-content:space-between}
.quota-expire{font-size:.72rem;color:var(--c-success);margin-top:4px}

/* --- 退出按钮 --- */
.logout-btn{
  display:flex;align-items:center;gap:6px;width:100%;
  padding:8px 12px;margin-top:8px;border-radius:var(--r-sm);
  background:none;border:1px solid var(--border-light);
  font-size:.8125rem;font-weight:500;color:var(--text-muted);
  cursor:pointer;transition:all var(--t-fast);
}
.logout-btn:hover{background:rgba(239,68,68,.06);color:var(--c-danger);border-color:rgba(239,68,68,.15)}

/* --- 主内容区 --- */
.main-content{flex:1!important;min-width:0;padding:16px 20px;display:flex;flex-direction:column;gap:16px;overflow-y:auto}

/* --- 顶部 Banner --- */
.main-header{
  background:linear-gradient(135deg,var(--c-primary) 0%,#6366f1 50%,var(--c-accent) 100%);
  border-radius:var(--r-lg);padding:20px 24px;color:#fff;
  box-shadow:0 4px 16px rgba(78,110,242,.15);
}
.main-header h1{font-size:1.25rem;font-weight:800;margin-bottom:2px}
.main-header .subtitle{font-size:.8125rem;opacity:.85}

/* --- 上传区域 --- */
.drop-zone{
  border:2px dashed var(--border-default);border-radius:var(--r-lg);
  padding:32px 20px;text-align:center;cursor:pointer;
  background:var(--bg-surface);transition:all var(--t-normal);
}
.drop-zone:hover,.drop-zone.drag-over{
  border-color:var(--c-primary);background:var(--c-primary-50);
}
.drop-zone-icon{font-size:36px;margin-bottom:8px}
.drop-zone h3{font-size:.9375rem;font-weight:600;color:var(--text-primary);margin-bottom:4px}
.drop-zone p{font-size:.8125rem;color:var(--text-muted)}

/* --- 文件列表面板 --- */
#recordsSection,#sharesSection,#trashSection,#userSettingsSection,#uploadSection{
  background:var(--bg-surface)!important;border:1px solid var(--border-light)!important;
  border-radius:var(--r-lg);padding:20px;box-shadow:var(--shadow-sm);
}

/* --- 文件工具栏 --- */
.files-toolbar{
  display:flex;align-items:center;gap:8px;padding:8px 0;
  border-bottom:1px solid var(--border-light);margin-bottom:12px;flex-wrap:wrap;
}
.files-toolbar select,.files-toolbar input{
  padding:6px 10px;border:1px solid var(--border-default);
  border-radius:var(--r-sm);font-size:.8125rem;background:var(--bg-surface);
  color:var(--text-primary);
}
.files-toolbar select:focus,.files-toolbar input:focus{
  border-color:var(--c-primary);outline:none;
  box-shadow:0 0 0 2px var(--c-primary-100);
}

/* --- 文件列表行 --- */
.record-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:var(--r-sm);
  transition:background var(--t-fast);border:none;
  border-bottom:1px solid var(--border-light);background:transparent;
}
.record-item:hover{background:var(--c-primary-50)}
.record-item .record-name{font-size:.875rem;font-weight:500;color:var(--text-primary)}
.record-item .record-meta{font-size:.75rem;color:var(--text-muted)}

/* --- 网格视图（由 index.php 内联CSS .netdisk-* 定义） --- */
.records-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}

/* --- 文件夹列表 --- */
.folder-list{display:flex;gap:8px;padding:8px 0;flex-wrap:wrap}
.folder-item{
  display:flex;align-items:center;gap:6px;padding:6px 12px;
  border:1px solid var(--border-default);border-radius:var(--r-full);
  font-size:.8125rem;cursor:pointer;transition:all var(--t-fast);
  background:#ffffff;
}
.folder-item:hover{border-color:var(--c-primary);color:var(--c-primary);background:#ffffff}
.folder-item.active{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}
.folder-actions{display:flex;gap:4px;margin-left:auto}
.folder-actions button{
  display:inline-flex;align-items:center;justify-content:center;
  padding:6px 10px;border:1px solid #d1d5db;border-radius:10px;
  font-size:13px;cursor:pointer;transition:all .2s ease;
  background:#fff;color:#1f2937;box-shadow:0 1px 3px rgba(0,0,0,0.08);font-weight:500;
}
.folder-actions button:hover{background:#fff;border-color:#9ca3af;box-shadow:0 2px 8px rgba(0,0,0,0.12);transform:translateY(-1px);color:#1f2937}
.folder-actions button.danger{color:#dc2626;border-color:#fecaca}
.folder-actions button.danger:hover{background:#fee2e2;border-color:#dc2626}
/* --- 分页 --- */
.pagination{display:flex;align-items:center;justify-content:center;gap:4px;padding:12px 0}
.pagination button{
  padding:6px 10px;border:1px solid var(--border-default);
  border-radius:var(--r-xs);background:var(--bg-surface);
  font-size:.8125rem;cursor:pointer;transition:all var(--t-fast);color:var(--text-secondary);
}
.pagination button:hover{border-color:var(--c-primary);color:var(--c-primary)}
.pagination button.active{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}

/* --- 移动端菜单按钮 --- */
.mobile-menu-btn{
  display:none;position:static;width:40px;height:40px;border-radius:10px;
  border:1px solid var(--border-default,#d1d5db);background:var(--bg-surface,#fff);color:var(--text-primary,#374151);font-size:20px;
  cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,0.08);z-index:100;
}
@media(max-width:768px){
  .mobile-menu-btn{display:flex!important;align-items:center;justify-content:center}
}
.sidebar-overlay{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.3);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s,visibility .3s}

/* --- 暗黑模式样式已移除，强制使用白天模式 --- */

/* ================================================================
   响应式
   ================================================================ */


/* 桌面端文件网格：由 index.php 内联CSS定义 */
/* H5 mobile styles moved to index.php inline CSS */