/* gold theme — core CSS overrides.
   Neutralizes a core/css/dark.css rule here so the core stylesheet stays stock. */

/* ── Cross-resolution fit ─────────────────────────────────────────────────
   Safety nets so modals never exceed the screen (paired with the downscale
   auto-fit zoom in main.htm). The register form is the tallest.
   NOTE: the login card (.blue-main-card) is intentionally NOT clamped — the
   auto-fit zoom already scales it to fit, so a max-height here just forces an
   ugly inner scrollbar. */
.modal-dialog {
	max-height: 94vh;
}
.modal-dialog .modal-content {
	max-height: 94vh;
	overflow-y: auto;
}
/* (4K login-card upscale media queries removed — the global auto-fit zoom in
   main.htm now scales the whole UI up, so a separate card zoom would double-apply.) */

/* core dark.css pushes every .header-section down 1.4%; gold's glass nav is
   positioned by its own styles. */
.header-section {
	margin-top: 0;
}

/* Hide the scrollbar but keep scrolling (for the Games category sidebar etc.) —
   it still scrolls if the list is long, but no visible scrollbar; and when the
   list fits there's no scroll at all. */
.gg-hide-scrollbar {
	scrollbar-width: none;        /* Firefox */
	-ms-overflow-style: none;     /* old Edge/IE */
}
.gg-hide-scrollbar::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;                /* Chromium/CEF */
}

/* ── Checkout payment methods ─────────────────────────────────────────────
   shop-modal.htm ships these icon-only buttons with NO styles (a cash-only setup never rendered the block): the QR/balance svgs have no
   width/height attribute and inflate to the container. Give the block the
   gold card look and pin the icon size. Same classes serve the print modal. */
/* Gold action buttons (Done / Buy / Start / Active …) — dark, bold text.
   The default was white-on-accent which is low contrast on the bright gold,
   so the "Done"/"Buy" text was hard to read (matches the dark text the
   PLAY buttons already use). */
.client-btn-success {
	color: #14161c !important;
	font-weight: 700 !important;
}
/* The label is often an inner <span class="text-white"> (BUY / START / QR topup /
   Start session …) — Bootstrap's .text-white forces it white, and white on the
   bright gold glares. Force the label dark too so every gold button is readable. */
.client-btn-success .text-white,
.client-btn-success .lang,
.client-btn-success span {
	color: #14161c !important;
}

.shop-payment-methods {
	display: flex;
	/* 不换行：结算弹窗内容区约 390px，原来 min-width:84px + 换行，5 种支付方式时 Pay later 被挤到第二行。
	   改为一行平分宽度，长标签在卡片内部折行（卡片等高） */
	flex-wrap: nowrap;
	gap: 8px;
}
.shop-payment-method {
	display: flex;
	flex-direction: column;          /* icon ABOVE label — cleaner, even cards */
	align-items: center;
	justify-content: center;
	gap: 9px;
	flex: 1 1 0;
	min-width: 0;                     /* 允许收窄到平分宽度，标签在卡片内折行 */
	min-height: 78px;                 /* floor, not a cap — 2-line labels grow the card */
	padding: 12px 4px;
	background: var(--gg-bg-card, #1c222b);
	border: 1px solid var(--gg-border, rgba(255, 255, 255, 0.08));
	border-radius: 14px;
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s, transform 0.15s;
}
.shop-payment-method:hover {
	border-color: rgba(255, 255, 255, 0.22);
	transform: translateY(-1px);
}
.shop-payment-method.active {
	border-color: var(--gg-accent);
	background: rgba(var(--gg-accent-rgb, 74,159,232), 0.12);
}
/* Modern Font Awesome payment icons — light by default, accent when selected */
.shop-payment-method .payment-fa-icon {
	font-size: 23px;
	line-height: 1;
	color: rgba(255, 255, 255, 0.62);
	transition: color 0.2s;
}
.shop-payment-method.active .payment-fa-icon { color: var(--gg-accent); }
/* Readable labels (were faint / unstyled) */
.shop-payment-method .shop-payment-label {
	margin: 0;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;                 /* was 1 — labels can wrap to 2 lines now */
	color: rgba(255, 255, 255, 0.85);
	/* was `nowrap`, which broke every non-English build: RU labels ("Кредитная карта",
	   "Оплатить позже") are ~2x the English and punched straight out of the card. Let them
	   wrap; the card is min-height'd and the row stretches, so 1- and 2-line cards still match. */
	white-space: normal;
	overflow-wrap: anywhere;          /* a single long word can't overflow either */
	text-align: center;
	cursor: pointer;
}
.shop-payment-method.active .shop-payment-label { color: #fff; }
/* Fallback sizing for any leftover inline icon */
.shop-payment-method svg,
.shop-payment-method .payment-icon {
	width: 24px;
	height: 24px;
	flex-shrink: 0;
}

/* ── Chat drawer reskin ───────────────────────────────────────────────────
   chat-drawer.htm came from the blue theme (GitHub-blue palette). It is fully
   driven by --cd-* variables; repaint them with the gold palette.
   html:root outranks the drawer's own :root block regardless of load order. */
html:root {
	--cd-bg: #171a1c;
	--cd-bg-dark: #121416;
	--cd-surface: #1c222b;
	--cd-hover: #232a35;
	--cd-border: rgba(255, 255, 255, 0.08);
	--cd-text: #d0d5dc;
	--cd-text-hi: #ffffff;
	--cd-muted: #8b949e;
	--cd-accent: var(--gg-accent);
	--cd-send: var(--gg-accent);
}
/* gold "sent" bubbles need dark text for contrast (drawer hardcodes #fff) */
#chatDrawerRoot .cd-bubble-row.sent .cd-btext {
	color: #14161c;
	font-weight: 500;
}

/* Balance History fits 7 columns ("Credit card" was wrapping in the default
   narrow dialog). */
.myModalBalanceHistory .modal-dialog {
	max-width: 680px;
}
.myModalBalanceHistory th {
	white-space: nowrap;
}

/* ── Header right cluster: now an in-flow flex child (was position-absolute) ──
   Drop the 12px top nudge that compensated for the old absolute positioning so
   it sits vertically centered in the header row. */
.header-right-info {
	margin-top: 0 !important;
}

/* ── Shop cart: compact quantity stepper ──────────────────────────────────
   `.qb-v9` / `.qv-v9` shipped with NO CSS (default-sized buttons), so the
   −/qty/+ stepper + price overflowed the narrow 286px cart card. Give them a
   compact, defined size and keep the price from being squeezed out. */
.shop-master-v9 .item-v9 {
	overflow: hidden;
}
.shop-master-v9 .qb-v9 {
	width: 26px;
	height: 26px;
	flex-shrink: 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background: rgba(255, 255, 255, 0.05);
	color: #fff;
	font-size: 12px;
	transition: background 0.15s;
}
.shop-master-v9 .qb-v9:hover {
	background: rgba(255, 255, 255, 0.12);
}
.shop-master-v9 .qv-v9 {
	min-width: 18px;
	text-align: center;
	font-weight: 700;
	color: #fff;
	font-size: 14px;
}
/* tighten the stepper gap and keep the price intact on the right */
.shop-master-v9 .item-v9 .d-flex[style*="gap: 10px"] {
	gap: 6px !important;
}
.shop-master-v9 .item-v9 .font-weight-bold.text-white:not(.text-truncate) {
	flex-shrink: 0;
	white-space: nowrap;
}
/* Long product names: let the name shrink and ellipsize (text-truncate needs
   min-width:0 inside a flex row), and keep the trash icon pinned. */
.shop-master-v9 .item-v9 .text-truncate {
	min-width: 0;
	flex: 1 1 auto;
}
.shop-master-v9 .item-v9 .fa-trash-alt {
	flex-shrink: 0;
}

/* ── Modal backdrop dimming ────────────────────────────────────────────────
   These modals are toggled by hand (`:style="display: ... block"`), so Bootstrap
   never injects its `.modal-backdrop` dimmer — the busy page behind showed
   straight through every dialog (worst on the Checkout over the shop grid).
   The `.modal` element is full-viewport when shown, so dim it directly. */
.modal.show {
	background: rgba(0, 0, 0, 0.6);
}

/* ═══════════════════════════════════════════════════════════════════════════
   客户端（libcef）CPU 治理 —— 见项目 CLAUDE.md「客户端（libcef）CPU 性能规范」
   客户端以 --disable-gpu --disable-gpu-compositing 启动，模糊、动画、视频全部由 CPU 做，
   玩游戏时 iCafeMenu 还在后台，直接跟游戏抢 CPU。
   ═══════════════════════════════════════════════════════════════════════════ */

/* 1. core/css/dark.css 的登录页"防烧屏"层：#page_login::before 整屏 backdrop-filter 的 60s 无限动画。
      本地按客户端参数实测登录页静置 CPU：101% → 1.4%（blue 主题同样受影响，属 core 问题，这里先在 gold 内压掉） */
#page_login::before {
	content: none !important;
	animation: none !important;
	backdrop-filter: none !important;
}

/* 2. 全局关闭毛玻璃（backdrop-filter）：软件渲染下每帧对背后全部像素做高斯运算，底下是视频时每一帧都要重算。
      与 purple 的 base.css 第 2 节相同做法。内联 style 里的 backdrop-filter 没有 !important，同样会被压掉 */
*, *::before, *::after {
	backdrop-filter: none !important;
	-webkit-backdrop-filter: none !important;
}

/* 2.1 关掉模糊后，常驻可见的半透明面板底下内容会直接透上来，补深底色保证可读 */
.header-menu {
	background: rgba(13, 17, 23, 0.88) !important;
}
.blue-main-card {
	background: rgba(32, 34, 38, 0.92) !important;
}
#home_member_info {
	background: rgba(15, 23, 42, 0.78) !important;
}
.ss-stat-pill,
.ss-icon-btn {
	background: rgba(13, 17, 23, 0.75) !important;
}
.start-session-card-body {
	background: rgba(22, 27, 34, 0.92) !important;
}
.gg-floating-dock {
	background: rgba(15, 23, 42, 0.9) !important;
}
.gg-cmdp-overlay,
.gg-shortcuts-overlay {
	background: rgba(0, 0, 0, 0.8) !important;
}

/* 3. 整屏 filter：游戏详情页背景。filter: blur/brightness 作用在整屏图片/视频上，视频每一帧都要过一遍滤镜；
      改成黑底 + opacity 压暗（opacity 在软件渲染下也有快速路径），去掉模糊 */
.gg-detail-bg {
	background: #000;
}
.gg-detail-bg video {
	filter: none !important;
	opacity: 0.45;
}
.gg-detail-bg-img {
	filter: none !important;
	opacity: 0.3;
}

/* 4. 常驻 infinite 动画：只要有一个在跑，浏览器每帧都会醒来
      - 剩余 ≤5 分钟的时间胶囊闪烁：正好是玩家在游戏里的最后 5 分钟，改成闪 3 次就停（颜色保持告警色）
      - 排行榜皇冠发光、活动 "going" 小圆点：改为静态
      - 骨架屏流光：网吧游戏列表为空时骨架会一直显示，改为静态占位 */
.header-time-left.urgency-crit {
	animation-iteration-count: 3 !important;
}
.podium-item.first .crown-icon,
.gge-badge.going .gge-dot,
.gg-skeleton-card,
.gg-skeleton-pill {
	animation: none !important;
}

/* 5. 游戏卡片：一屏几十张，悬停时同时跑一串过渡（边框、阴影、遮罩、海报缩放），鼠标划过一排卡片时
      移入移出的卡片都在动。卡片内一律去掉过渡，悬停效果保留、瞬间切换 */
.game-item,
.game-item * {
	transition: none !important;
}
/* 悬停时海报 transform: scale(1.05)：会被 transform 缩放的元素要单独成层，否则每次都要重新光栅化整张海报
   （规范第 4 条，只给会动的元素加） */
.game-item .game-image img {
	will-change: transform;
}

/* 6. 关机/重启按钮：由 core 的 theme-bootstrap.js 统一挂到 body（#icc-power-bar，按 CP 的 client_power_buttons
      决定显示哪几个），gold 原来自己在登录页/锁屏/首页各放一份，已删除。这里只把 core 的按钮改成 gold 的样式 */
#icc-power-bar {
	padding: 0 0 32px 40px;
}
#icc-power-bar .icc-power-btn {
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: rgba(10, 12, 16, 0.55);
	border: 1px solid rgba(255, 255, 255, 0.09);
	color: rgba(255, 255, 255, 0.62);
	font-size: 18px;
}
#icc-power-bar .icc-power-btn + .icc-power-btn {
	margin-left: 10px;
}
#icc-power-bar .icc-power-btn-reboot:hover {
	color: rgb(var(--gg-accent-rgb, 212, 175, 55));
	border-color: rgba(var(--gg-accent-rgb, 212, 175, 55), 0.55);
	background: rgba(var(--gg-accent-rgb, 212, 175, 55), 0.1);
}
#icc-power-bar .icc-power-btn-shutdown:hover {
	color: #f26d6d;
	border-color: rgba(242, 109, 109, 0.55);
	background: rgba(242, 109, 109, 0.1);
}

/* ═══ start-session 页 ═══ */
/* 背景层（start-session.htm 的 .gg-ss-bg）：原来整页是 var(--gg-bg) 纯色，从登录页过来像突然黑屏 */
.gg-ss-bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	overflow: hidden;
	pointer-events: none;
}
.gg-ss-bg video,
.gg-ss-bg iframe,
.gg-ss-bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	background-size: cover;
	background-position: center;
}
.gg-ss-bg-scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(rgba(13, 17, 23, 0.55), rgba(13, 17, 23, 0.85));
}

/* 当前时段不可用的 offer 按钮（Off hours）：圆角、字体跟 client-btn-success（Active / Buy / Start 等按钮）对齐
   （原来继承了 rounded-4 的胶囊圆角和正文 Inter 字体）；颜色保持 gold 原样——主题强调色底、深色字、整体 0.65 透明 */
#page_start_session .btn-start-session.btn-secondary,
#page_start_session .btn-start-session:disabled:not(.client-btn-success) {
	border-radius: 12px !important;
	font-family: 'Rajdhani', 'Rubik', sans-serif !important;
	background: var(--gg-accent) !important;
	border: none !important;
	box-shadow: none !important;
	opacity: 0.65 !important;
	cursor: not-allowed;
}
#page_start_session .btn-start-session.btn-secondary span,
#page_start_session .btn-start-session.btn-secondary .text-white {
	color: #14161c !important;
	font-family: inherit !important;
}

/* ═══ 锁屏（main.htm #page_lock）═══ */
/* 原来 style.css 给 #page_lock 写死 rgba(13,17,23,0.95) 纯色底，锁屏看不到任何背景；
   现在由 .gg-lock-bg 画背景（跟随 CP 设置）+ 暗色遮罩，跟 purple 一样透出压暗的网吧背景 */
#page_lock {
	background: transparent !important;
}
.gg-lock-bg {
	position: absolute;
	inset: 0;
	z-index: -1;
	overflow: hidden;
	pointer-events: none;
}
.gg-lock-bg video,
.gg-lock-bg iframe,
.gg-lock-bg-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	background-size: cover;
	background-position: center;
}
.gg-lock-bg-default {
	background-image: url('../images/home-bg.jpg');
}
.gg-lock-bg-scrim {
	position: absolute;
	inset: 0;
	background: rgba(13, 17, 23, 0.72);
}
/* 解锁卡片：原来没设宽度、底色变量 --gg-glass 在 gold 里不存在，卡片透明且缩成内容宽度，
   密码框和按钮只有别的主题的三分之一宽。跟 admin 密码弹窗（.blue-main-card，400px）统一 */
#page_lock .unlock-form-div {
	width: 400px;
	max-width: 90vw;
	background: rgba(32, 34, 38, 0.92) !important;
	border: 1px solid rgba(148, 163, 184, 0.14) !important;
	border-radius: 16px !important;
	box-shadow: 0 28px 64px rgba(0, 0, 0, 0.55);
	padding: 36px 32px !important;
}
#page_lock #unlockForm .client-form-row {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}
#page_lock #unlockForm .password-wrapper {
	position: relative;
	width: 100%;
}
#page_lock .unlock-input {
	width: 100%;
	height: 48px;
}

/* 首页新闻卡片右下角的链接二维码（home.htm .news-qr），qrcode.js 默认生成 256px，缩放进容器 */
.gg-nws-slide .news-qr {
	position: absolute;
	right: 10px;
	bottom: 10px;
	z-index: 2;
	width: 84px;
	height: 84px;
	padding: 4px;
	background: #fff;
	border-radius: 6px;
}
.gg-nws-slide .news-qr canvas,
.gg-nws-slide .news-qr img {
	width: 100% !important;
	height: 100% !important;
}

/* 商品"仅限成人"角标（shop.htm .adult-only，跟 icafemenu/blue/purple 同一个 🔞 字符） */
.product-card-v9 .adult-only {
	position: absolute;
	top: 22px;
	right: 22px;
	z-index: 2;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	font-style: normal;
}
.product-card-v9 .adult-only::before {
	content: "\01F51E";
	font: bold 22px/1 'Arial Black', sans-serif;
}

/* ═══ 省电模式下的入场动画 ═══
   core 的省电模式（core/css/theme-tokens.css，有程序在运行时给 <html> 加 icafe-power-save）把所有动画
   冻在当前帧（animation-play-state: paused），本意是停掉装饰性动画省 CPU。gold 的页面切换、弹窗、游戏详情页等
   用的是从 opacity:0 开始的入场动画，新出现的元素会被冻在第一帧——页面一片空白、弹窗看不见，直到关掉那个程序。
   这里在省电模式下直接关掉这些入场动画，元素立即以最终状态显示（只是少了约 0.2s 的淡入）；
   退出省电模式后入场动画照常。core 只给 sweet-alert / toast 开了同类例外，blue/purple 没有这类动画所以不受影响。 */
html.icafe-power-save #page-home.d-flex,
html.icafe-power-save #page-game.d-flex,
html.icafe-power-save #page-shop.d-flex,
html.icafe-power-save #page-event.d-flex,
html.icafe-power-save #page-rank.d-flex,
html.icafe-power-save .modal.show .modal-dialog,
html.icafe-power-save .gg-detail-enter,
html.icafe-power-save .premium-dropdown,
html.icafe-power-save .home-continue-playing,
html.icafe-power-save .gg-shortcuts-overlay,
html.icafe-power-save .gg-shortcuts-card,
html.icafe-power-save .gg-cmdp-overlay,
html.icafe-power-save .gg-cmdp-card,
html.icafe-power-save .gg-empty-state,
html.icafe-power-save .gg-session-summary {
	animation: none !important;
}