/* ============================================================================
 * 源码说明（public/assets/css/clone.css）
 * 公共补充样式（加载于原站 main.css 之后）。
 * 约定：新增组件统一 c- 前缀（c-btn/c-table/c-pager/c-tabs/c-card/c-modal/c-toast…），
 *       避免覆盖原站样式；布局容器 .container 宽 1300px。
 * 内容：布局工具类、按钮/表单/筛选条/表格/分页/空态/标签/Toast/弹窗/用户菜单/排行辅助/图表容器/卡片。
 * 修改指引：页面组专属样式放 pages2.css，后台样式放 /admin/admin.css。
 * ========================================================================== */

/* ============================================================
 * 1GM 克隆站 · 共享补充样式（在 main.css 之后加载）
 * 命名约定：新增组件统一使用 c- 前缀，避免覆盖原站样式
 * ============================================================ */

/* 布局 */
.container { width: 1300px; margin: 0 auto; }
.c-site-header { display: block; }
.c-main { min-height: 60vh; }
.c-page-section { margin-top: 24px; }
.c-hidden { display: none !important; }
.c-tc { text-align: center; }
.c-tr { text-align: right; }
.c-mt8 { margin-top: 8px; }
.c-mt16 { margin-top: 16px; }
.c-mb16 { margin-bottom: 16px; }
.c-muted { color: #999; }
.c-gold { color: #e0ab1e; }
.c-red { color: #ef6033; }

/* 按钮 */
.c-btn {
  display: inline-block; padding: 0 18px; height: 38px; line-height: 38px;
  border-radius: 4px; border: 1px solid transparent; background: #ef6033; color: #fff;
  font-size: 14px; font-weight: 700; cursor: pointer; text-align: center;
  transition: opacity .15s ease; vertical-align: middle; user-select: none;
}
.c-btn:hover { opacity: .88; color: #fff; }
.c-btn--ghost { background: #fff; border-color: #ddd; color: #333; }
.c-btn--ghost:hover { border-color: #ef6033; color: #ef6033; }
.c-btn--sm { height: 30px; line-height: 30px; padding: 0 12px; font-size: 12px; }
.c-btn--dark { background: #221510; border-color: #221510; }
.c-btn[disabled] { opacity: .5; cursor: not-allowed; }

/* 表单 */
.c-input, .c-select, .c-textarea {
  border: 1px solid #ddd; border-radius: 4px; height: 38px; padding: 0 12px;
  font-size: 14px; color: #333; outline: none; background: #fff; box-sizing: border-box;
}
.c-input:focus, .c-select:focus, .c-textarea:focus { border-color: #ef6033; }
.c-textarea { height: auto; padding: 10px 12px; resize: vertical; }
.c-form-row { display: flex; align-items: center; margin-bottom: 14px; }
.c-form-row > label { width: 96px; flex: none; color: #666; font-size: 14px; text-align: right; margin-right: 12px; }
.c-form-row > .c-form-field { flex: 1; }
.c-form-tip { color: #999; font-size: 12px; margin-top: 4px; }

/* 筛选条 */
.c-filter-bar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  padding: 16px 32px; background: #fff;
}
.c-filter-bar .c-filter-label { color: #666; font-size: 14px; }
.c-filter-bar .c-input { width: 260px; }
.c-filter-bar .c-select { width: 130px; }
.c-filter-bar .c-spacer { flex: 1; }

/* 通用数据表 */
.c-table { width: 100%; border-collapse: collapse; background: #fff; }
.c-table th, .c-table td { border: 1px solid #e5e5e5; padding: 9px 10px; font-size: 14px; color: #333; }
.c-table th { background: #faf7f2; font-weight: 700; color: #4a3b2a; white-space: nowrap; }
.c-table tr:hover td { background: #fffaf5; }
.c-table .c-table-empty { text-align: center; color: #999; padding: 40px 0; }
.c-table a { color: #ef6033; }

/* 分页 */
.c-pager { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 20px 0 8px; }
.c-pager button {
  min-width: 34px; height: 34px; padding: 0 10px; border: 1px solid #ddd; border-radius: 4px;
  background: #fff; color: #333; cursor: pointer; font-size: 14px;
}
.c-pager button:hover:not([disabled]) { border-color: #ef6033; color: #ef6033; }
.c-pager button.is-active { background: #ef6033; border-color: #ef6033; color: #fff; }
.c-pager button[disabled] { opacity: .45; cursor: not-allowed; }
.c-pager .c-pager-total { color: #999; font-size: 13px; margin-right: 8px; }

/* 加载 / 空状态 */
.c-loading, .c-empty { padding: 46px 0; text-align: center; color: #999; font-size: 14px; }
.c-loading:before {
  content: ''; display: inline-block; width: 16px; height: 16px; margin-right: 8px;
  border: 2px solid #ef6033; border-top-color: transparent; border-radius: 50%;
  vertical-align: -3px; animation: c-spin .7s linear infinite;
}
@keyframes c-spin { to { transform: rotate(360deg); } }

/* 标签 */
.c-tag {
  display: inline-block; padding: 0 8px; height: 22px; line-height: 22px; border-radius: 3px;
  background: #f4efe8; color: #8a6d3b; font-size: 12px;
}
.c-tag--red { background: #fdeeea; color: #ef6033; }
.c-tag--green { background: #e8f7ee; color: #1a9c53; }
.c-tag--gray { background: #f2f2f2; color: #888; }

/* Toast */
#c-toast-host { position: fixed; left: 50%; top: 90px; transform: translateX(-50%); z-index: 99999; }
.c-toast {
  min-width: 180px; max-width: 460px; margin-bottom: 10px; padding: 11px 20px;
  background: rgba(34, 21, 16, .92); color: #fff; border-radius: 6px; font-size: 14px;
  text-align: center; box-shadow: 0 6px 24px rgba(0,0,0,.2); transition: opacity .3s ease, transform .3s ease;
}
.c-toast--success { background: rgba(26, 156, 83, .94); }
.c-toast--error { background: rgba(214, 69, 38, .94); }
.c-toast.is-hide { opacity: 0; transform: translateY(-6px); }

/* 弹窗 */
.c-modal-mask {
  position: fixed; inset: 0; z-index: 9999; display: none; align-items: flex-start; justify-content: center;
  padding-top: 8vh; background: rgba(0,0,0,.5);
}
.c-modal-mask.is-open { display: flex; }
.c-modal-box { background: #fff; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.3); max-width: 92vw; }
.c-modal-head {
  display: flex; align-items: center; justify-content: space-between; padding: 16px 22px;
  border-bottom: 1px solid #eee; font-size: 17px; font-weight: 700; color: #333;
}
.c-modal-head .c-modal-close { color: #999; font-size: 22px; line-height: 1; text-decoration: none; }
.c-modal-head .c-modal-close:hover { color: #ef6033; }
.c-modal-body { padding: 20px 22px; max-height: 70vh; overflow: auto; }
.c-modal-foot { margin-top: 20px; text-align: right; }
.c-modal-foot .c-btn { margin-left: 10px; }

/* 游戏详情 */
.c-detail-title { color: #e0ab1e; background: #221510; padding: 10px 16px; border-radius: 4px; font-size: 18px; font-weight: 700; margin-bottom: 14px; }
.c-detail-table { width: 100%; border-collapse: collapse; }
.c-detail-table th, .c-detail-table td { border-bottom: 1px dashed #eee; padding: 10px 8px; font-size: 14px; text-align: left; vertical-align: top; word-break: break-all; }
.c-detail-table th { width: 110px; color: #888; font-weight: 400; white-space: nowrap; }

/* 用户菜单 */
.c-user-menu {
  position: absolute; z-index: 9999; width: 160px; background: #fff; border-radius: 6px;
  box-shadow: 0 8px 30px rgba(0,0,0,.18); padding: 6px 0; font-size: 14px;
}
.c-user-menu a, .c-user-menu__name { display: block; padding: 9px 16px; color: #333; }
.c-user-menu a:hover { background: #faf6f0; color: #ef6033; }
.c-user-menu__name { color: #e0ab1e; font-weight: 700; border-bottom: 1px solid #f0f0f0; }

/* 排行表格辅助 */
.c-rank-crown { height: 22px; vertical-align: middle; }
.c-rank-num { display: inline-block; width: 26px; height: 26px; line-height: 26px; border-radius: 50%; background: #f1e9dd; color: #8a6d3b; font-weight: 700; font-size: 13px; }
.c-rank-num--1 { background: #e60808; color: #fff; }
.c-rank-num--2 { background: #ef8b1f; color: #fff; }
.c-rank-num--3 { background: #d4a017; color: #fff; }

/* 折叠/说明 */
.c-section-title { font-size: 20px; font-weight: 700; color: #333; padding-left: 10px; border-left: 4px solid #ef6033; line-height: 1; margin: 26px 0 14px; }
.c-note { color: #999; font-size: 12px; line-height: 20px; }

/* 页内 tab */
.c-tabs { display: flex; gap: 4px; border-bottom: 2px solid #ef6033; margin-bottom: 16px; }
.c-tabs .c-tab {
  padding: 0 22px; height: 44px; line-height: 44px; background: #f6f4ef; color: #555;
  border-radius: 8px 8px 0 0; cursor: pointer; font-size: 15px; font-weight: 700; text-decoration: none;
}
.c-tabs .c-tab.is-active { background: #ef6033; color: #fff; }

/* 简单图表（Canvas 容器） */
.c-chart-panel { background: #fff; padding: 18px 22px; margin-bottom: 16px; }
.c-chart-panel h3 { font-size: 16px; color: #333; margin: 0 0 12px; }
.c-chart-panel canvas { display: block; width: 100%; }

/* 卡片网格 */
.c-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.c-card {
  background: #fff; border: 1px solid #eee; border-radius: 8px; padding: 20px;
  box-shadow: 0 2px 10px rgba(0,0,0,.03); transition: transform .15s ease, box-shadow .15s ease;
}
.c-card:hover { transform: translateY(-2px); box-shadow: 0 8px 26px rgba(0,0,0,.08); }
.c-card h4 { margin: 0 0 8px; font-size: 16px; color: #333; }
.c-card p { margin: 0; color: #888; font-size: 13px; line-height: 22px; }

/* ============================================================
 * 首页 / 广告排行页（frontend-core）
 * ============================================================ */
.main { position: relative; z-index: 1; }
.c-modal-open { overflow: hidden; }
.c-pager-dots { color: #999; padding: 0 4px; }

/* 首页 banner 广告条 */
.c-home-banner { display: block; margin: 10px 0 0; }
.c-home-banner img { display: block; width: 100%; }
.c-home-banner--app { margin: 10px 0; }
.c-home-tip-bar { display: flex; align-items: center; justify-content: center; gap: 32px; padding: 12px 0 0; color: #999; font-size: 13px; }

/* 首页广告查询头部说明图标 */
.cus-section__head-title .popover-container { margin-left: 6px; vertical-align: -3px; }
.cus-section__head-title .popover-trigger img { display: block; height: 18px; }
.cus-section__head-title .popover-text { max-width: 460px; }

/* 排行表格 */
.cus-table .c-table-empty { height: 160px; text-align: center; color: #999; font-size: 14px; }
.cus-table .c-loading-cell { height: 160px; text-align: center; color: #999; font-size: 14px; }
.cus-table .c-loading-cell:before {
  content: ''; display: inline-block; width: 14px; height: 14px; margin-right: 8px;
  border: 2px solid #ef6033; border-top-color: transparent; border-radius: 50%;
  vertical-align: -2px; animation: c-spin .7s linear infinite;
}
.cus-table tr.c-rank-row { cursor: pointer; }
.cus-table a.c-rank-name, .cus-table a.c-rank-cell { color: #333; }
.cus-table a.c-rank-name { font-weight: 700; }
.cus-table a.c-rank-name:hover, .cus-table a.c-rank-cell:hover { color: #ef6033; text-decoration: underline; }
.cus-table .c-rank-name-cell { text-align: center; }
.cus-table .c-rank-desc { text-align: left; }
.cus-table a.c-rank-detail { text-decoration: none; }
.cus-table .c-rank-price { color: #e60808; font-weight: 700; }
.cus-table td > img[src*="crown.gif"] { vertical-align: middle; }
.cus-table .btn-game, .cus-table .btn-site { cursor: pointer; }
.cus-table td .c-rank-num { vertical-align: middle; }
.ranking-table .rank-tool .rank-tab__item { text-decoration: none; }

/* 首页排行 tabs（.rank-tool 自带样式，补一点细节） */
.page-index .rank-tool { margin-top: 0; }
.rank-tool .rank-tab__item { text-decoration: none; }
.base-tag-group__tags > a { text-decoration: none; }
.base-tag-group__tags > a:hover { text-decoration: none; }

/* 广告排行页筛选 */
.c-adlist-filter { padding-top: 20px; padding-bottom: 18px; }
.c-adlist-filter .base-search-box > div.base-form-group { margin-bottom: 18px; }
.c-adlist-filter .base-search-box > div.base-form-group:last-of-type { margin-bottom: 18px; }
.c-adlist-filter .base-form-group__select { width: 132px; }
.c-adlist-filter .base-form-group__btn { width: 126px; }
.c-adlist-filter .c-filter-label { color: #606266; font-size: 14px; margin-right: 2px; white-space: nowrap; }
.c-adlist-filter .c-keyword-input { flex: 1; min-width: 300px; max-width: 560px; }
.c-adlist-filter .base-tag-group { margin-top: 2px; }
.c-adlist-filter .base-data-tips { margin-top: 20px; }
.c-adlist-filter .c-filter-active-tip { color: #999; font-size: 12px; line-height: 20px; margin-top: 10px; }
.c-adlist-tabs { padding: 22px 32px 0; background: #fff; }
.c-adlist-tabs .c-tabs { margin-bottom: 0; }
.c-adlist-tabs .c-tab { height: 44px; line-height: 44px; padding: 0 30px; }
.c-adlist-rank-section .c-rank-pager { background: #fff; border-top: 1px solid #eee; }
.c-adlist-summary { display: flex; align-items: center; justify-content: space-between; padding: 12px 32px 0; color: #999; font-size: 13px; }
.c-adlist-summary strong { color: #ef6033; font-size: 16px; margin: 0 2px; }

/* 联系我们弹窗（放入遮罩层后覆盖原 padding） */
.c-contact-modal__box { width: 640px; position: relative; background: #fff; border-radius: 8px; overflow: hidden; }
.c-contact-modal__box .contactUsModal { display: block; padding-bottom: 16px; background: transparent; }
.c-contact-modal__box .contactUsModal .modalContent ul { margin: 18px auto 12px; }
.c-contact-modal__close { position: absolute; right: 14px; top: 10px; z-index: 3; color: #999; font-size: 26px; line-height: 1; text-decoration: none; }
.c-contact-modal__close:hover { color: #ef6033; }

/* 右侧悬浮工具（3 项：1GM APP / 历史记录 / 回顶部） */
.floating-tools { right: max(12px, calc((100vw - 1300px) / 2 - 88px)); }
.floating-tools a.ft-btn { text-decoration: none; }
.floating-tools .ft-btn__icon--app {
  background-image: url('/content/images/logo.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 30px 30px;
}

/* ============================================================
 * 登录 / 注册页
 * ============================================================ */
.page-login .main { z-index: 1; }
.c-login-wrap { padding-bottom: 40px; }
.c-login-card {
  width: 540px; margin: 0 auto; background: #fff; border-radius: 14px;
  box-shadow: 0 24px 70px rgba(34, 21, 16, .22); overflow: hidden;
}
.c-login-brand {
  padding: 26px 32px 22px; text-align: center;
  background: linear-gradient(135deg, #2b1a11 0%, #221510 55%, #3b2517 100%);
}
.c-login-brand__logo { height: 46px; display: inline-block; vertical-align: middle; }
.c-login-brand__title { color: #e0ab1e; font-size: 21px; font-weight: 700; margin-top: 12px; letter-spacing: 1px; }
.c-login-brand__sub { color: #c0b091; font-size: 13px; margin-top: 6px; }
.c-login-tabs { display: flex; border-bottom: 1px solid #eee; }
.c-login-tab {
  flex: 1; height: 54px; line-height: 54px; text-align: center; font-size: 18px; font-weight: 700;
  color: #999; cursor: pointer; position: relative; text-decoration: none;
}
.c-login-tab.is-active { color: #ef6033; }
.c-login-tab.is-active:after {
  content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 64px; height: 3px; border-radius: 2px; background: #ef6033;
}
.c-login-body { padding: 26px 44px 10px; }
.c-login-form .c-form-row > label { width: 64px; }
.c-login-form .c-input { height: 46px; width: 100%; }
.c-login-submit {
  display: block; width: 100%; height: 50px; line-height: 50px; border: 0; border-radius: 8px;
  background: #ef6033; color: #fff; font-size: 18px; font-weight: 700; cursor: pointer;
  box-shadow: 0 10px 24px rgba(239, 96, 51, .28); margin-top: 6px;
}
.c-login-submit:hover { background: #ed4916; }
.c-login-submit[disabled] { opacity: .6; cursor: not-allowed; }
.c-login-error { min-height: 22px; line-height: 22px; color: #e6452c; font-size: 13px; }
.c-login-tips { text-align: right; color: #999; font-size: 14px; line-height: 22px; margin: 6px 0 14px; }
.c-login-tips a { color: #ef6033; cursor: pointer; }
.c-login-tips a:hover { text-decoration: underline; }
.c-login-foot { border-top: 1px dashed #eee; padding: 14px 32px 20px; text-align: center; color: #999; font-size: 12px; line-height: 20px; }
.c-login-foot a { color: #888; }
.c-login-note { width: 540px; margin: 16px auto 0; text-align: center; color: #fff; font-size: 13px; text-shadow: 0 1px 2px rgba(0,0,0,.35); }
.c-login-note a { color: #ffe9b0; }
.c-login-back { display: inline-block; margin-bottom: 14px; color: #fff; font-size: 14px; text-shadow: 0 1px 2px rgba(0,0,0,.4); }
.c-login-back:hover { color: #ffe9b0; }