/* 站内补丁：覆盖原版 CDN CSS 中与本站不一致的细节 */
/* 主色：咔咔约拍品牌粉 #ff7e5f（与原版 CDN 主色 #FF5457 区分；CDN 内未覆盖元素仍保留原版主色） */

/* SEO 专用：H1/H2 visually-hidden（screen-reader 可读，爬虫可见，不影响视觉布局） */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
/* 1) 全站主色：原版用 #FF5457，咔咔约拍品牌色 #ff7e5f（粉），统一为原版主色避免视觉跳变 */
/* Phase 7 调整为咔咔约拍独立配色 */
/* 2) logo 替换：原版的 .nav_logo img 是他们的横向 logo（124x40）， */
/* 咔咔约拍用 /i/logo.png（圆形 200x200），需缩小 + 圆形 */

.nav_logo img {
	width: auto !important;
	height: 40px !important;
	border-radius: 0;
}

/* 底部 footer logo（无白色版 PNG，用文字代替 → .footer_main_logo_text） */
.footer_main_logo { display: none; }
.footer_main_logo_text { display: block; }

/* 原版右上角 search 在没 logo 时也保持宽 200px，避免布局跳 */
.search { cursor: pointer; }

/* 兼容老 main.min.css 可能的冲突：咔咔约拍品牌主色 #ff7e5f */
/* .next_page 不在此覆盖：CDN common.css 已设红底白字（#FE5457/#FFF），
 若改成粉字会"粉底粉字"不可见，仅 hover 白字才看得见 */
.nav_tab_item.item_ed,
.index_yuepai_btn,
.weibo_follow_btn {
	color: #ff7e5f;
}
/* 选中筛选项视觉反馈：原版 CDN 原版 background:#FE5457 + color:#fff !important，
 若只改 color 不覆盖 background，会渲染成"粉底粉字"不可读——用户感知"点击没效果" */
.selects_rows_items .selected {
	background-color: #ff7e5f !important;
	color: #fff !important;
	border-color: #ff7e5f !important;
	font-weight: 600;
}
.index_yuepai_btn {
	background: #ff7e5f;
	color: #fff;
}

/* 右侧推荐作品：原版 CDN 默认 r_z_item_img 宽 100%，咔咔约拍图源比例可能不同 */
.r_z_item_img { object-fit: cover; }

/* 作品卡封面：原版 CDN .zp_item_img 只设 width:212px，无 height 无 object-fit
 → 用户上传图比例不一致（方图/横图/竖图），出现"上方留白""下方溢出文字区"。
 补 height 与 .zp_item_img_box 同高（282px）+ cover 裁剪铺满，与原版运营统一比例的视觉一致 */
.zuopin_item .zp_item_img {
	height: 282px;
	object-fit: cover;
}

/* 场地卡封面：原版 CDN .place_item_img 已设 400×224 但无 object-fit
 → 方图被横向拉伸、竖图被压扁。补 cover 按短边裁剪保持比例 */
.place_item .place_item_img {
	object-fit: cover;
}

/* 卡片多图横向滑动展示（避免溢出，参照原版视觉 + 加滑动能力） */
/* 原版 CDN 原版 .img_box.fl 是 flex nowrap 但没 overflow-x，超过容器宽度的图直接溢出 */
.img_box.fl {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: #ff7e5f transparent;
	padding-bottom: 8px;
}
.img_box.fl::-webkit-scrollbar { height: 6px; }
.img_box.fl::-webkit-scrollbar-thumb { background: #ff7e5f; border-radius: 3px; }
.img_box.fl::-webkit-scrollbar-track { background: transparent; }
.item_content_img {
	flex-shrink: 0;
	width: 178px;
	height: 178px;
	border-radius: 8px;
	object-fit: cover;
	margin-left: 12px;
}
.item_content_img:first-child { margin-left: 0; }

/* 板块留白：参照原版 common.css .page_main { padding: 92px 0 60px }
 fixed header 高 70px，padding-top 必须 ≥70px 否则被遮挡；原版用 92px（=header 70 + 22 留白） */
/* 不可设 gap：原版 .page_main_left 880 + .page_main_right 308 = 1188（容器 1200 - 12 内边距），
 一旦设 gap，左右栏会被压成 862/302，破坏 .zuopin_list 892 / .place_item 880 的固定宽度计算 */
.page_main { padding: 92px 0 60px; }
.page_main_left, .page_main_right { min-width: 0; }
/* 筛选区下边距：跟卡片瀑布流之间留呼吸感（原版原版偏紧） */
/* 不加 box-shadow：原版 .selects 是 plain 容器，加阴影会与原版视觉不一致 */
.selects { margin-bottom: 12px; }
/* 原版 .selects_rows 无边框分隔（computedStyle border-bottom: 0px none transparent）；
 main.min.css 给的 rgb(229,231,235) 灰色边线是脏样式，覆盖掉 */
.selects_rows { border-bottom: 0 !important; }
/* 卡片之间间距：原版 .item margin-top: 12px（参考 CDN index.css），保持一致不过度留白 */
.item { margin-top: 12px; }
.item:first-child { margin-top: 0; }

/* 城市筛选 0 张时的回退提示条（原版没这个，是我们额外加的兜底 UX） */
.city_fallback_tip {
	background: #FFF5F7;
	color: #ff7e5f;
	border: 1px solid #FFD0DA;
	border-radius: 6px;
	padding: 10px 14px;
	margin: 0 0 20px;
	font-size: 13px;
	line-height: 1.5;
}
/* 详情页/列表页底部留白，避免 footer 直接贴最后一张卡 */
.home-block { padding: 30px 0 60px; }

/* footer 二维码区：两张并排（小程序码 + 公众号码） */
/* 原 .f_m_qrcode 是 fl-ver 单列，改并排后需补两码之间的间距与字号统一 */
.f_m_qrcode { gap: 24px; }
.f_m_qrcode_item { width: 130px; }
.f_m_qrcode_item img { width: 130px; height: 130px; object-fit: contain; }
.f_m_qrcode_item div { margin-top: 8px; font-size: 13px; color: #666; text-align: center; }

/* ========== /cities.html 城市列表（参照原版 /ypcitys.html 视觉） ========== */
/* 原版 CDN common.css 未定义 .city_main 系列样式（其自家 main.min.css 才有），
 需在站内补丁自托管。原版原版用 #FE5457 主色，这里替换为咔咔约拍品牌粉 #ff7e5f。
 数值来源：probe-*visual 抓取脚本 抓取原版页面 computedStyle */
.city_main {
	background: #fff;
	padding: 20px 20px 0;
	margin: 25px 0 0;
	font-size: 14px;
	border-radius: 4px;
	box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
/* 原版原版用 div.city_title，没有特定字体大小，这里给它一个清晰的标题样式 */
.city_title {
	font-size: 18px;
	font-weight: bold;
	color: #333;
	padding-bottom: 15px;
	border-bottom: 1px solid #eee;
	margin-bottom: 5px;
}
.city_row {
	display: block;
	padding: 15px 0;
	border-bottom: 1px dashed #eee;
}
.city_row:last-child { border-bottom: none; }
/* 省份锚点：原版计算样式 width:76px, padding 6px 0, 浅粉底 + 主色边框 */
.province {
	display: inline-block;
	vertical-align: top;
	width: 76px;
	padding: 6px 0;
	text-align: center;
	background: #FFF5F7;
	border: 1px solid #ff7e5f;
	border-radius: 4px;
	color: #ff7e5f;
	font-weight: 600;
}
.province a { color: inherit; }
/* 城市列表容器：原版 width:1024px 是固定宽（其容器 1100px - 省份 76px），
 响应式下用 calc 自适应 */
.city_row_list {
	display: inline-block;
	vertical-align: top;
	width: calc(100% - 90px);
	padding: 6px 0 0 14px;
}
/* 单个城市锚点：原版 display:inline, padding-left:15px, color:#333 */
.city {
	display: inline-block;
	padding: 4px 15px 4px 0;
	color: #333;
	font-size: 14px;
	line-height: 1.8;
}
.city:hover { color: #ff7e5f; }

/* ========== 右下浮动按钮（参照原版首页 inline <style>，CDN common/index.css 均未定义） ========== */
/* 原版把 #page_right_fixed 的样式 inline 在 HTML <style> 里，不是 CDN CSS。
 抓取源：curl 原版首页 → <style> 块内规则。
 主色替换：原版 #FE5457 → 咔咔约拍 #ff7e5f。 */
#page_right_fixed {
	position: fixed;
	right: 10%;
	bottom: 100px;
	width: 60px;
	/* 3 个按钮 × 60px = 180px（原版 4 个按钮 × 60 = 240px，我们去掉了 download） */
	height: 180px;
	background-color: #FFFFFF;
	border-radius: 8px;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.08);
	z-index: 60;
}
.page_right_fixed_item {
	width: 60px;
	height: 60px;
	text-align: center;
	position: relative;
	cursor: pointer;
	/* docx5-3：图标居中 — 图标 PNG 原图 80x80，HTML width="40px" 是非法属性值（必须纯数字）被浏览器忽略，
	 按 80px 渲染导致偏左溢出；item 改 flex 居中，img 尺寸由 CSS 控制 */
	display: flex;
	align-items: center;
	justify-content: center;
}
.page_right_fixed_item > img {
	width: 40px;
	height: 40px;
}
/* hover 覆盖层：默认隐藏，悬浮时变粉底白字（原版视觉：整块 60x60 被主色覆盖） */
.page_right_fixed_hover {
	display: none;
	box-sizing: border-box;
	width: 60px;
	height: 60px;
	padding-top: 10px;
	background-color: #ff7e5f;
	color: #FFFFFF;
	font-size: 14px;
	line-height: 20px;
	position: absolute;
	top: 0;
	left: 0;
}
/* 单行文本居中（小程序）：原版用 padding-top:20px 视觉居中一行文字 */
.page_right_fixed_hover_aline { padding-top: 20px; }
/* 第一个/最后一个按钮的圆角与容器对齐（视觉连续） */
#fixed_item_miniapp_none { border-radius: 8px 8px 0 0; }
#fixed_item_totop_none { border-radius: 0 0 8px 8px; }
/* 二维码弹层：默认隐藏，悬浮时显示在按钮左侧（left:-154px） */
#fixed_item_miniapp_none_qrcode,
#fixed_item_kefu_none_qrcode {
	display: none;
	box-sizing: border-box;
	width: 146px;
	height: 168px;
	padding: 13px 13px 9px 13px;
	background-color: #FFFFFF;
	border-radius: 8px;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
	color: #333333;
	font-size: 12px;
	text-align: center;
	position: absolute;
	top: -50px;
	left: -154px;
}
.fixed_item_qrcode { margin-bottom: 9px; }
/* hover 触发显示：CSS-only，无 JS（原版原版同方案） */
#fixed_item_miniapp:hover #fixed_item_miniapp_none,
#fixed_item_miniapp:hover #fixed_item_miniapp_none_qrcode,
#fixed_item_kefu:hover #fixed_item_kefu_none,
#fixed_item_kefu:hover #fixed_item_kefu_none_qrcode,
#fixed_item_totop:hover #fixed_item_totop_none {
	display: block;
}

/* ========== docx #8：网页背景灰（与原版一致，凸显白底卡片） ========== */
/* 仅 PC 站点 body；不影响 .page_main 自身布局。卡片已自带 #fff 背景，灰底铺底视觉更清晰 */
body { background: #f5f5f5; }
/* 详情/列表主体白色容器：原版 CDN 未定义 .page_main_left 背景，自托管白底避免灰底渗透 */
.page_main_left > .detail_main,
.page_main_left > .user_banner,
.page_main_left > .user_tabs,
.page_main_left > .user_posts { background: #fff; }

/* ========== docx #11：统一 .kkyp_chip 组件（身份/城市/实名/担保 chip 跨页一致） ========== */
/* 参照原版：身份 chip 浅粉底+白字（实际为浅粉底+主色字，更易读），城市 chip 浅灰底+深字 */
/* 用法：<span class="kkyp_chip kkyp_chip--identity">摄影师</span> */
.kkyp_chip {
	display: inline-flex; align-items: center; gap: 4px;
	padding: 3px 10px; border-radius: 12px;
	font-size: 12px; line-height: 1.4;
	background: #f0f0f0; color: #555;
	white-space: nowrap;
}
.kkyp_chip--identity { background: #fff0f4; color: #ff7e5f; }
.kkyp_chip--city { background: #e6f4ff; color: #1890ff; }
.kkyp_chip--certified { background: #fff4e6; color: #ff9500; }
.kkyp_chip--theme {
	background: #fff; color: #ff7e5f;
	border: 1px solid #ff7e5f;
}
.kkyp_chip img { width: 12px; height: 12px; }

/* ========== docx3 #3：发布/登录/注册/下一页 按钮主题色与 app 主色 #ff7e5f 一致 ========== */
/* 上次 GLM 漏改：原版 CDN common.css 给 .nav_add/.nav_login/.nav_register/.next_page
 默认背景是原版红 #FE5457，需在站内补丁覆盖为咔咔约拍品牌粉 #ff7e5f。
 注意：CDN 已设 color:#fff，所以这里只覆盖背景色即可 */
.nav_add,
.nav_login,
.nav_register,
.next_page {
	background: #ff7e5f !important;
	background-color: #ff7e5f !important;
	border-color: #ff7e5f !important;
	color: #fff !important;
}
/* hover 加深 8%，保持可点击反馈；颜色值与 .index_yuepai_btn:hover 一致 */
.nav_add:hover,
.nav_login:hover,
.nav_register:hover,
.next_page:hover {
	background: #ff6a47 !important;
	background-color: #ff6a47 !important;
	border-color: #ff6a47 !important;
	color: #fff !important;
}

/* ========== docx5 #4：实名/担保/VIP 文字标签（对齐小程序），替代头像 V 标与 icon_real 小图 ==========
 已实名=绿底白字，已担保=蓝底白字，VIP/SVIP=橙底红字（app vip-style #fde6d2+red） */
.kkyp_tag {
	display: inline-block;
	padding: 1px 8px;
	border-radius: 4px;
	font-size: 12px;
	line-height: 1.6;
	margin-left: 4px;
	vertical-align: middle;
	white-space: nowrap;
}
.kkyp_tag.tag_certified { background: #4cd964; color: #fff; }
.kkyp_tag.tag_insured { background: #409eff; color: #fff; }
.kkyp_tag.tag_vip { background: #fde6d2; color: red; font-weight: 700; }

/* ========== docx5 #3：右侧"最新约拍"缩略图变形修复 ==========
 md common.css 只给 .r_z_item_img 固定 120x120、无裁剪策略，非方图被拉伸变形；
 box 固定方形 + overflow hidden + img 铺满 cover 裁剪，与图源比例无关（最新约拍/最新作品/最新场地同规则）。
 关键：item 是 .fl flex 行（display:flex !important + nowrap），box 作为 flex item 默认 flex-shrink:1，
 文字长时 box 被挤压变窄 → 各条目图片宽度不一；必须 flex-shrink:0 锁死 120px */
.r_z_item_img_box { width: 120px; height: 120px; overflow: hidden; flex-shrink: 0; }
.r_z_item_img { width: 100%; height: 100%; object-fit: cover; display: block; }