@charset "utf-8";
/* =========================================================
   游戏大厅样式（themes/default/game_list.php）
   依赖：common.css
   ========================================================= */

/* ================= 右栏 ================= */
.col_main{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.gl_hd{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;
  background:linear-gradient(180deg,rgba(243,179,74,.08),rgba(243,179,74,.02));border-bottom:1px solid var(--line)}
.gl_hd h1{font-size:16px;color:#f6ecdc;font-weight:bold;position:relative;padding-left:11px}
.gl_hd h1::before{content:"";position:absolute;left:0;top:3px;bottom:3px;width:3px;border-radius:2px;
  background:linear-gradient(180deg,var(--gold),#c8871f)}
.gl_hd .box{font-size:13px;color:var(--gold)}
.gl_hd .box:hover{color:var(--gold2)}

/* 分类页签 */
.gl_tabs{display:flex;align-items:center;gap:2px;padding:0 12px;border-bottom:1px solid var(--line);
  background:rgba(243,179,74,.02);overflow-x:auto}
.gl_tab{flex:none;height:40px;line-height:40px;padding:0 18px;font-size:13.5px;color:#a89b8c;
  border-bottom:2px solid transparent;white-space:nowrap}
.gl_tab:hover{color:var(--gold2)}
.gl_tab.cur{color:var(--gold);font-weight:bold;border-bottom-color:var(--gold);background:rgba(243,179,74,.08)}

/* 字母排序筛选（单选） */
.gl_filter{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:10px 16px;border-bottom:1px solid var(--line)}
.gl_fl{height:26px;line-height:24px;padding:0 12px;border-radius:13px;font-size:12px;color:#a89b8c;
  border:1px solid var(--line2);white-space:nowrap;transition:color .2s,border-color .2s}
.gl_fl:hover{color:var(--gold2);border-color:var(--gold)}
.gl_fl.cur{color:#2a1a06;font-weight:bold;border-color:transparent;
  background:linear-gradient(180deg,#f9dfa0,#e0a93c)}

/* 游戏卡片 */
.gl_list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px}
.gl_card{display:flex;gap:12px;padding:12px;border-radius:8px;background:#1b1613;border:1px solid rgba(255,255,255,.05);
  transition:border-color .2s,transform .2s}
.gl_card:hover{border-color:var(--line2);transform:translateY(-2px)}
.gl_cover{flex:none;width:72px;height:72px;border-radius:8px;overflow:hidden;background:#0b0908;display:block}
.gl_cover img{width:100%;height:100%;object-fit:cover;display:block}
.gl_cover .ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-size:24px;font-weight:bold;color:#2a1a06;background:linear-gradient(135deg,#f9dfa0,#d19a2e)}
.gl_info{flex:1;min-width:0;display:flex;flex-direction:column}
.gl_name{font-size:15px;font-weight:bold;color:#f0e5d3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gl_name:hover{color:var(--gold2)}
.gl_meta{font-size:12px;color:#8d8177;line-height:20px;margin-top:3px}
.gl_meta b{font-weight:normal;color:#b0a293}
.gl_meta .attr{color:#c9a86a}
.gl_acts{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:8px;flex-wrap:wrap}
.gl_acts a,.gl_acts span{height:26px;line-height:26px;padding:0 12px;border-radius:4px;font-size:12px;white-space:nowrap}
.gl_play{color:#2a1a06;font-weight:bold;background:linear-gradient(180deg,#f9dfa0,#e0a93c)}
.gl_play:hover{filter:brightness(1.06)}

.gl_empty{text-align:center;color:var(--muted);font-size:13px;padding:70px 0}

/* 分页 */
.gl_pg{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;padding:6px 16px 20px}
.gl_pg .pg_btn{min-width:34px;height:34px;line-height:34px;padding:0 10px;text-align:center;border-radius:5px;
  font-size:13px;color:#c3b7a8;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}
.gl_pg .pg_btn:hover{color:var(--gold2);border-color:var(--line2);background:rgba(243,179,74,.1)}
.gl_pg .pg_cur{color:#2a1a06;font-weight:bold;border-color:transparent;background:linear-gradient(180deg,#f9dfa0,#e0a93c)}
.gl_pg .pg_info{font-size:12px;color:var(--muted);margin-left:6px}
.gl_pg .pg_info b{color:var(--gold);font-weight:bold}

/* ================= 响应式（游戏大厅） ================= */
@media (max-width:860px){
  .gl_list{grid-template-columns:1fr}
}
@media (max-width:560px){
  .gl_hd{height:auto;min-height:48px;flex-wrap:wrap;gap:4px;padding:6px 12px}
  .gl_list{padding:12px;gap:10px}
  .gl_cover{width:64px;height:64px}
  .gl_name{font-size:14px}
  .gl_pg .pg_info{width:100%;text-align:center;margin:4px 0 0}
}