/* ============================================================
 * X5 记录页（doing）内容区自适应样式（独立文件，避免与公共样式冲突）
 * ------------------------------------------------------------
 * 作用范围：所有规则限定在 :is(#ct:has(#moodfm),#ct.ct3_a) 内
 *          （moodfm_container 只存在于记录页，其他页面结构上不可能命中）
 * 加载位置：home/space_doing.php 模板内 <link>，仅记录页加载
 * 断点与 lewei 头部自适应对齐：
 *   ≤900px  左侧菜单卡与内容卡上下堆叠，菜单变横排 chips
 *   ≤768px  手机单列：留白收紧、图片/视频/iframe 流式缩放
 * ============================================================ */

/* ---- ≤1199.98px：lewei 自身响应式会把 .ct2_a 竖排（flex-direction:column），
        记录页要保持双卡横排，这里反制 ---- */
@media (max-width:1199.98px){
	:is(#ct:has(#moodfm),#ct.ct3_a){flex-direction:row;align-items:flex-start}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl{flex:0 0 200px;width:200px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .mn{flex:1 1 0;min-width:0}
}

/* ---- ≤900px：上下堆叠，菜单变横排 chips ---- */
@media (max-width:900px){
	:is(#ct:has(#moodfm),#ct.ct3_a){flex-direction:column;gap:12px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl{flex:none;width:auto;max-width:100%;box-sizing:border-box;align-self:stretch}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl ul{display:flex;flex-wrap:wrap;gap:4px 6px;margin:0;padding:0 10px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl li{flex:1 1 auto;min-width:0;height:36px;line-height:36px;padding:0 10px;text-align:center;border-radius:6px;background:var(--lewei-bg,#f7f8fa)}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl li span{float:none;display:inline;margin-left:6px;line-height:36px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl hr.da{display:none}
	:is(#ct:has(#moodfm),#ct.ct3_a) .mn{width:auto;max-width:100%;flex:none;align-self:stretch;padding:10px 12px;box-sizing:border-box}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .sd{flex:none;width:auto;max-width:100%;align-self:stretch;box-sizing:border-box;margin:0 0 12px;padding:10px 12px}
	/* 手机端 lewei 层有浮动规则会把内容列压塌 + overflow:hidden 裁掉动态流 —— 解除裁切 */
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn{overflow:visible}
}

/* ---- ≤768px：手机单列 ---- */
@media (max-width:768px){
	:is(#ct:has(#moodfm),#ct.ct3_a){padding:0 8px;box-sizing:border-box}
	/* 菜单 chips 更紧凑 */
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl ul{padding:0 6px;gap:3px 4px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl li{flex:1 1 40%;height:32px;line-height:32px;padding:0 6px;font-size:13px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl li span{margin-left:4px}
	:is(#ct:has(#moodfm),#ct.ct3_a) .appl li a img{width:14px;height:14px}
	/* 记录条目留白收紧 */
	:is(#ct:has(#moodfm),#ct.ct3_a) .doing_list_item{padding:12px 0}
	/* 图片 / 视频 / 嵌入（抖音等 iframe）流式缩放 */
	#ct .doing_images,
	#ct .doing_image,
	#ct .doing_image_item,
	#ct .doing_image_link,
	#ct .moodfm_container .image-list,
	#ct .moodfm_container .previewbigpic,
	#ct .moodfm_container .previewvideo{max-width:100%}
	#ct .doing_image img,
	#ct .doing_images img,
	#ct .doing_image_item img{max-width:100%;height:auto}
	#ct iframe{max-width:100%}
	#ct .moodfm_container .previewvideo video{width:100%;height:auto}
	/* 表情/图片/视频/帖子 图标行 与 发布按钮 保持同行（窄屏也放得下） */
	#ct .moodfm_div{flex-wrap:nowrap}
	/* 字数提示不溢出 */
	#ct .moodfm_container #mp_counter{max-width:100%}
	/* home 发表框（旧式两级表格结构，表单在 #mood_addform 内）手机端线性化：
	   起因：lewei 有 .pg_space .ct3_a .mn .bm #moodfm{max-width:10%} 和
	   .pg_space #mood_statusinput textarea{width:239px!important} 两条规则把表单掐死，
	   外加表格 min-content 溢出 + tbody 的 table-row-group 收缩 —— 全部反制 + 整体线性排布 */
	body.pg_space #ct.ct3_a .mn #moodfm{max-width:100% !important}
	body.pg_space #ct.ct3_a .mn #mood_statusinput{width:100% !important}
	body.pg_space #ct.ct3_a .mn #mood_statusinput textarea{width:100% !important;box-sizing:border-box;min-height:80px}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn table.mi{border:0 !important}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform table,
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn table.mi{display:block !important;width:100% !important;max-width:100% !important;border:0 !important}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform table tbody,
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform table tr,
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform table td,
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn table.mi tbody,
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn table.mi tr,
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn table.mi td{display:block !important;width:100% !important;max-width:100% !important}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform textarea{width:100% !important;box-sizing:border-box;min-height:80px}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform td.moodfm_input,:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform td#mood_statusinput{height:auto !important}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform td.moodfm_btn{display:block !important;width:100% !important;height:auto !important;padding:0 0 6px !important;margin:0 !important;line-height:0 !important;text-align:right}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform td.moodfm_btn button{margin:20px 0 12px !important}
	:is(#ct:has(#moodfm),#ct.ct3_a).ct3_a .mn #mood_addform{padding:0 !important;margin:0 !important}
}