/* =========================================================
   20260919 理財規劃管理 (area.php / process_page.php load_listdata)
   人生區頁籤 + 說明摺疊 + 工具列搜尋 + 卡片式規劃清單
   前綴 arp_ 全部獨立，不影響其他頁面
   ========================================================= */

.arp_page{
	max-width:1180px;
	margin:0 auto;
	padding:6px 4px 30px;
	font-family:Arial, "Microsoft JhengHei", sans-serif;
	color:#1f2937;
	--arp-accent:var(--main-color);
	--arp-accent-soft:#e6f4fa;
}
.arp_page.arp_area1{ --arp-accent:#0f9b8e; --arp-accent-soft:#e3f6f3; }
.arp_page.arp_area2{ --arp-accent:#e07b00; --arp-accent-soft:#fff3e3; }

/* ---------- 人生區頁籤 ---------- */
.arp_tabs{
	display:flex;
	gap:4px;
	padding:4px;
	margin:0 0 16px;
	background:#eef1f5;
	border-radius:10px;
}
.arp_tab{
	flex:1 1 0;
	padding:10px 12px;
	border-radius:8px;
	text-align:center;
	font-size:15px;
	font-weight:600;
	color:#6b7280;
	text-decoration:none !important;
	cursor:pointer;
	user-select:none;
	transition:all .15s ease-in-out;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
}
.arp_tab:hover{ color:var(--main-color); }
.arp_tab.active{
	background:#fff;
	color:var(--arp-accent);
	box-shadow:0 1px 3px rgba(0,0,0,.08);
}
.arp_tab_num{
	min-width:20px;
	height:20px;
	padding:0 6px;
	border-radius:999px;
	background:#dfe4ea;
	color:#5b6472;
	font-size:11.5px;
	line-height:20px;
	font-weight:700;
}
.arp_tab.active .arp_tab_num{ background:var(--arp-accent); color:#fff; }
.arp_tab_sub{ font-size:12px; font-weight:400; color:#9aa3af; }
.arp_tab.active .arp_tab_sub{ color:#6b7280; }

/* ---------- 區域標題卡 ---------- */
.arp_hero{
	display:flex;
	align-items:flex-start;
	gap:16px;
	padding:18px 22px;
	margin:0 0 14px;
	background:#fff;
	border:1px solid #e3e8ee;
	border-left:5px solid var(--arp-accent);
	border-radius:12px;
	box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.arp_hero_icon{
	flex:0 0 46px;
	width:46px;
	height:46px;
	border-radius:12px;
	background:var(--arp-accent-soft);
	color:var(--arp-accent);
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:22px;
}
.arp_hero_body{ flex:1 1 auto; min-width:0; }
.arp_hero_title{
	display:flex;
	align-items:baseline;
	flex-wrap:wrap;
	gap:6px 10px;
	font-size:21px;
	font-weight:700;
	color:#111827;
	letter-spacing:1px;
	line-height:1.3;
}
.arp_hero_title small{
	font-size:13px;
	font-weight:600;
	color:var(--arp-accent);
	letter-spacing:.5px;
}
.arp_hero_info{
	margin:8px 0 0;
	font-size:14px;
	line-height:1.75;
	color:#4b5563;
	letter-spacing:.5px;
}
.arp_hero_stat{
	flex:0 0 auto;
	text-align:center;
	padding:8px 18px;
	border-radius:10px;
	background:#f7f9fb;
	border:1px solid #e9edf2;
}
.arp_hero_stat b{
	display:block;
	font-size:26px;
	line-height:1.1;
	color:var(--arp-accent);
}
.arp_hero_stat span{ font-size:12px; color:#6b7280; letter-spacing:1px; }

/* ---------- 說明 / 教學 摺疊列 ---------- */
.arp_help{
	margin:0 0 14px;
	border:1px solid #e3e8ee;
	border-radius:12px;
	background:#fff;
	overflow:hidden;
}
.arp_help_item + .arp_help_item{ border-top:1px solid #eef1f5; }
.arp_help_head{
	display:flex;
	align-items:center;
	gap:10px;
	padding:11px 16px;
	font-size:14px;
	font-weight:600;
	color:#374151;
	cursor:pointer;
	user-select:none;
	transition:background .15s;
}
.arp_help_head:hover{ background:#f7f9fb; }
.arp_help_head > i:first-child{
	width:28px;
	height:28px;
	border-radius:8px;
	background:#f1f4f8;
	color:var(--main-color);
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:14px;
}
.arp_help_item.hot .arp_help_head > i:first-child{ background:#fff3e3; color:#e07b00; }
.arp_help_head .arp_help_chev{
	margin-left:auto;
	color:#9aa3af;
	font-size:14px;
	transition:transform .25s;
}
.arp_help_head.active .arp_help_chev{ transform:rotate(180deg); }
.arp_help_body{
	max-height:0;
	overflow:hidden;
	transition:max-height .35s ease;
}
.arp_help_con{
	padding:4px 16px 16px 54px;
	font-size:14px;
	line-height:1.8;
	color:#4b5563;
	letter-spacing:.5px;
}
.arp_help_con a{ color:var(--main-color); text-decoration:underline; font-weight:600; }
.arp_help_quota{
	display:inline-flex;
	align-items:center;
	gap:6px;
	margin-top:8px;
	padding:5px 12px;
	border-radius:999px;
	background:#e6f4fa;
	color:#006b9a;
	font-size:13px;
	font-weight:600;
}
.arp_dl_btn{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:10px 20px;
	border-radius:8px;
	background:#e07b00;
	color:#fff !important;
	font-size:14.5px;
	font-weight:600;
	text-decoration:none !important;
	box-shadow:0 3px 8px rgba(224,123,0,.25);
	transition:all .15s;
}
.arp_dl_btn:hover{ background:#c96e00; transform:translateY(-1px); }

/* 補償公告（沿用 caption_v1_block 的語意，只調外觀） */
.arp_notice{
	margin:0 0 14px;
	padding:12px 16px;
	border-radius:10px;
	background:#fff8e1;
	border-left:4px solid #f5b400;
	color:#8a5a00;
	font-size:14px;
	line-height:1.75;
}

/* ---------- 工具列 ---------- */
.arp_toolbar{
	display:flex;
	align-items:center;
	gap:10px;
	flex-wrap:wrap;
	margin:0 0 12px;
}
.arp_toolbar_title{
	font-size:16px;
	font-weight:700;
	color:#111827;
	display:flex;
	align-items:center;
	gap:8px;
}
.arp_toolbar_title i{ color:var(--arp-accent); }
.arp_search{
	position:relative;
	flex:0 1 300px;
	min-width:200px;
	margin-left:auto;
}
.arp_search input{
	width:100%;
	height:38px;
	padding:0 32px 0 34px;
	border:1px solid #d9dee5;
	border-radius:8px;
	font-size:14px;
	color:#1f2937;
	background:#fff;
	outline:none;
	transition:border-color .15s;
}
.arp_search input:focus{ border-color:var(--main-color); box-shadow:0 0 0 3px rgba(0,122,176,.12); }
.arp_search > i{
	position:absolute;
	left:11px;
	top:50%;
	transform:translateY(-50%);
	color:#9aa3af;
	font-size:15px;
	pointer-events:none;
}
.arp_search_clear{
	position:absolute;
	right:8px;
	top:50%;
	transform:translateY(-50%);
	width:22px;
	height:22px;
	border-radius:50%;
	display:none;
	align-items:center;
	justify-content:center;
	color:#9aa3af;
	cursor:pointer;
	font-size:12px;
}
.arp_search_clear:hover{ background:#eef1f5; color:#374151; }
.arp_search.has_text .arp_search_clear{ display:flex; }
.arp_sort{
	position:relative;
	flex:0 0 auto;
}
.arp_sort > i{
	position:absolute;
	left:11px;
	top:50%;
	transform:translateY(-50%);
	color:#9aa3af;
	font-size:14px;
	pointer-events:none;
}
.arp_sort select{
	height:38px;
	padding:0 30px 0 32px;
	border:1px solid #d9dee5;
	border-radius:8px;
	background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%239aa3af' stroke-width='1.5'/></svg>") no-repeat right 11px center;
	font-size:13.5px;
	color:#374151;
	outline:none;
	cursor:pointer;
	-webkit-appearance:none;
	appearance:none;
	transition:border-color .15s;
}
.arp_sort select:hover{ border-color:#b9c3cf; }
.arp_sort select:focus{ border-color:var(--main-color); box-shadow:0 0 0 3px rgba(0,122,176,.12); }
.arp_count{
	font-size:13px;
	color:#6b7280;
	white-space:nowrap;
}
.arp_count b{ color:#111827; }

/* ---------- 按鈕 ---------- */
.arp_btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	height:34px;
	padding:0 14px;
	border-radius:8px;
	border:1px solid transparent;
	font-size:13.5px;
	font-weight:600;
	line-height:1;
	white-space:nowrap;
	cursor:pointer;
	user-select:none;
	transition:all .15s ease-in-out;
	text-decoration:none !important;
}
.arp_btn i{ font-size:14px; }
.arp_btn_primary{ background:var(--main-color); color:#fff; box-shadow:0 2px 6px rgba(0,122,176,.25); }
.arp_btn_primary:hover{ background:#00699a; transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,122,176,.3); }
.arp_btn_lg{ height:40px; padding:0 18px; font-size:14.5px; }
.arp_btn_light{ background:#fff; color:#374151; border-color:#d9dee5; }
.arp_btn_light:hover{ border-color:var(--main-color); color:var(--main-color); background:#f4fafd; }
.arp_btn_soft{ background:#f1f4f8; color:#374151; }
.arp_btn_soft:hover{ background:#e4e9ef; color:#111827; }
.arp_btn_teal{ background:#fff; color:#0f766e; border-color:#bfe3df; }
.arp_btn_teal:hover{ background:#e9f7f5; border-color:#0f9b8e; }
.arp_btn_amber{ background:#fff; color:#b45309; border-color:#f3d7a5; }
.arp_btn_amber:hover{ background:#fff7e8; border-color:#e07b00; }
.arp_btn_danger{ background:#fff; color:#b91c1c; border-color:#f3c5c5; }
.arp_btn_danger:hover{ background:#fef2f2; border-color:#dc2626; }
.arp_btn_ghost{ background:transparent; color:#6b7280; border-color:#d9dee5; }
.arp_btn_ghost:hover{ color:#111827; border-color:#9aa3af; }

/* ---------- 規劃卡片 ---------- */
.arp_list{
	display:flex;
	flex-direction:column;
	gap:12px;
}
.arp_card{
	background:#fff;
	border:1px solid #e3e8ee;
	border-radius:12px;
	box-shadow:0 2px 8px rgba(0,0,0,.04);
	transition:box-shadow .15s, border-color .15s;
	overflow:hidden;
}
.arp_card:hover{ border-color:#c9d3de; box-shadow:0 6px 18px rgba(0,0,0,.08); }
.arp_card.arp_hide{ display:none; }

.arp_card_head{
	display:flex;
	align-items:center;
	gap:12px;
	flex-wrap:wrap;
	padding:14px 18px 10px;
}
.arp_card_name{
	flex:1 1 260px;
	min-width:0;
	display:flex;
	align-items:center;
	gap:10px;
}
.arp_card_name .arp_idx{
	flex:0 0 auto;
	min-width:28px;
	height:28px;
	padding:0 8px;
	border-radius:8px;
	background:var(--arp-accent-soft);
	color:var(--arp-accent);
	font-size:12.5px;
	font-weight:700;
	display:flex;
	align-items:center;
	justify-content:center;
}
.arp_card_name h3{
	margin:0;
	font-size:17px;
	font-weight:700;
	color:#111827;
	letter-spacing:.5px;
	line-height:1.35;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.arp_card_dates{
	display:flex;
	gap:14px;
	flex-wrap:wrap;
	font-size:12.5px;
	color:#6b7280;
}
.arp_card_dates span{ display:inline-flex; align-items:center; gap:4px; }
.arp_card_dates i{ font-size:12px; color:#9aa3af; }

.arp_card_body{
	display:flex;
	flex-wrap:wrap;
	gap:10px 22px;
	padding:0 18px 12px;
}
.arp_people{
	flex:1 1 220px;
	min-width:0;
	display:flex;
	flex-direction:column;
	gap:5px;
	font-size:13.5px;
	color:#374151;
	padding:10px 12px;
	border-radius:8px;
	background:#f7f9fb;
}
.arp_people div{ display:flex; align-items:flex-start; gap:6px; line-height:1.5; }
.arp_people i{ color:#9aa3af; font-size:13px; margin-top:3px; }
.arp_people b{ color:#111827; font-weight:600; }
.arp_people em{ font-style:normal; color:#6b7280; flex:0 0 auto; }

.arp_stats{
	flex:2 1 420px;
	display:grid;
	grid-template-columns:repeat(5, minmax(0, 1fr));
	gap:8px;
}
.arp_stat{
	padding:8px 10px;
	border-radius:8px;
	background:#f7f9fb;
	border:1px solid #eef1f5;
	min-width:0;
}
.arp_stat span{
	display:block;
	font-size:11.5px;
	color:#6b7280;
	letter-spacing:.5px;
	margin-bottom:3px;
	white-space:nowrap;
}
.arp_stat b{
	display:block;
	font-size:14.5px;
	font-weight:700;
	color:#111827;
	font-variant-numeric:tabular-nums;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.arp_stat.is_zero b{ color:#b0b7c3; font-weight:500; }
.arp_stat.pos b{ color:#0f766e; }
.arp_stat.neg b{ color:#b45309; }

.arp_card_foot{
	display:flex;
	align-items:center;
	gap:8px;
	flex-wrap:wrap;
	padding:10px 18px 14px;
	border-top:1px solid #eef1f5;
	background:#fcfdfe;
}
.arp_actgroup{
	display:flex;
	align-items:center;
	gap:6px;
	flex-wrap:wrap;
}
.arp_actgroup_label{
	font-size:11.5px;
	color:#9aa3af;
	letter-spacing:1px;
	margin-right:2px;
	white-space:nowrap;
}
.arp_actsep{
	width:1px;
	height:22px;
	background:#e3e8ee;
	margin:0 4px;
}
.arp_act_del{ margin-left:auto; }

/* ---------- 空狀態 / 無搜尋結果 ---------- */
.arp_empty{
	padding:44px 20px;
	text-align:center;
	border:1px dashed #cfd6de;
	border-radius:12px;
	background:#fbfcfd;
	color:#6b7280;
}
.arp_empty i{ font-size:34px; color:#c4ccd6; display:block; margin-bottom:10px; }
.arp_empty h4{ margin:0 0 6px; font-size:16px; font-weight:700; color:#374151; }
.arp_empty p{ margin:0 0 16px; font-size:13.5px; line-height:1.7; }
.arp_nomatch{ display:none; }

.arp_footer{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	justify-content:center;
	margin-top:24px;
}

/* ---------- RWD ---------- */
@media screen and (max-width: 900px)
{
	.arp_stats{ grid-template-columns:repeat(3, minmax(0, 1fr)); }
}
@media screen and (max-width: 640px)
{
	.arp_page{ padding:4px 0 24px; }
	.arp_tabs{ flex-direction:column; }
	.arp_tab{ justify-content:space-between; }
	.arp_tab_sub{ display:none; }
	.arp_hero{ flex-wrap:wrap; padding:14px 16px; }
	.arp_hero_stat{ flex:1 1 100%; }
	.arp_help_con{ padding-left:16px; }
	.arp_search{ flex:1 1 100%; margin-left:0; }
	.arp_sort{ flex:1 1 100%; }
	.arp_sort select{ width:100%; }
	.arp_toolbar .arp_btn_lg{ flex:1 1 100%; }
	.arp_card_name h3{ white-space:normal; }
	.arp_stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
	.arp_card_foot{ flex-direction:column; align-items:stretch; }
	.arp_actgroup{ width:100%; }
	.arp_actgroup .arp_btn{ flex:1 1 calc(50% - 6px); }
	.arp_actsep{ display:none; }
	.arp_act_del{ margin-left:0; }
	.arp_act_del .arp_btn{ width:100%; }
}

/* =========================================================
   20261005 理財規劃歸戶（js/plan_group.js）
   前綴 pg_；只有理財規劃超過 50 筆的會員會看到
   ========================================================= */

/* ---------- 歸戶列 ---------- */
.pg_bar{
	margin:-4px 0 14px;
	padding:10px 12px;
	background:#fff;
	border:1px solid #e3e8ee;
	border-radius:12px;
	box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.pg_bar_row{ display:flex; align-items:center; gap:10px; min-width:0; }
.pg_bar_label{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	gap:6px;
	font-size:13px;
	font-weight:700;
	color:#374151;
	letter-spacing:1px;
	white-space:nowrap;
}
.pg_bar_label i{ color:var(--arp-accent); }
.pg_pills{
	flex:1 1 auto;
	min-width:0;
	display:flex;
	gap:6px;
	overflow-x:auto;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:thin;
	padding:2px;
}
.pg_pills::-webkit-scrollbar{ height:4px; }
.pg_pills::-webkit-scrollbar-thumb{ background:#d5dbe2; border-radius:4px; }
.pg_pill{
	flex:0 0 auto;
	display:inline-flex;
	align-items:center;
	gap:6px;
	height:34px;
	max-width:220px;
	padding:0 12px;
	border:1px solid #d9dee5;
	border-radius:999px;
	background:#fff;
	color:#374151;
	font-size:13.5px;
	font-weight:600;
	font-family:inherit;
	cursor:pointer;
	transition:all .15s ease-in-out;
}
.pg_pill span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pg_pill i{ font-size:13px; color:#9aa3af; }
.pg_pill em{
	font-style:normal;
	min-width:20px;
	height:20px;
	padding:0 6px;
	border-radius:999px;
	background:#eef1f5;
	color:#5b6472;
	font-size:11.5px;
	line-height:20px;
	text-align:center;
}
.pg_pill:hover{ border-color:var(--arp-accent); color:var(--arp-accent); }
.pg_pill.active{ background:var(--arp-accent); border-color:var(--arp-accent); color:#fff; box-shadow:0 2px 6px rgba(0,0,0,.12); }
.pg_pill.active i{ color:#fff; }
.pg_pill.active em{ background:rgba(255,255,255,.25); color:#fff; }
.pg_pill.is_u:not(.active){ border-style:dashed; color:#6b7280; }
.pg_pill_add{ color:var(--arp-accent); background:var(--arp-accent-soft); border-color:transparent; }
.pg_pill_add i{ color:var(--arp-accent); }
.pg_pill:focus-visible, .pg_tool:focus-visible, .pg_opt:focus-visible, .pg_ibtn:focus-visible, .pg_tag:focus-visible{ outline:2px solid var(--arp-accent); outline-offset:2px; }
.pg_tools{ flex:0 0 auto; display:flex; gap:6px; }
.pg_tool{
	display:inline-flex;
	align-items:center;
	gap:5px;
	height:34px;
	padding:0 12px;
	border:1px solid #d9dee5;
	border-radius:8px;
	background:#fff;
	color:#4b5563;
	font-size:13px;
	font-weight:600;
	font-family:inherit;
	cursor:pointer;
	white-space:nowrap;
}
.pg_tool:hover{ border-color:var(--main-color); color:var(--main-color); }
.pg_tool.on{ background:#111827; border-color:#111827; color:#fff; }
.pg_tool[disabled]{ opacity:.45; cursor:default; }
.pg_intro{
	display:flex;
	align-items:flex-start;
	gap:6px;
	margin-top:8px;
	padding:8px 10px;
	border-radius:8px;
	background:#f7f9fb;
	color:#6b7280;
	font-size:13px;
	line-height:1.6;
}
.pg_intro i{ color:var(--arp-accent); margin-top:3px; }
.pg_intro b{ color:#374151; }
.pg_empty{ margin-bottom:12px; }

/* ---------- 分段標題（全部檢視） ---------- */
.pg_sec{
	display:flex;
	align-items:center;
	gap:8px;
	margin:6px 0 -4px;
	padding:8px 4px;
	color:#111827;
	font-size:15px;
	cursor:pointer;
	user-select:none;
	border-bottom:2px solid var(--arp-accent-soft);
}
.pg_sec:first-child{ margin-top:0; }
.pg_sec b{ font-weight:700; letter-spacing:.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pg_sec_icon{ color:var(--arp-accent); }
.pg_sec.is_u .pg_sec_icon, .pg_sec.is_u b{ color:#6b7280; }
.pg_sec_num{ font-size:12.5px; color:#9aa3af; white-space:nowrap; }
.pg_sec_chev{ font-size:14px; color:#9aa3af; transition:transform .15s; }
.pg_sec.is_folded .pg_sec_chev{ transform:rotate(-90deg); }
.pg_sec:hover b{ color:var(--arp-accent); }
.arp_card.pg_folded{ display:none; }

/* ---------- 卡片 ---------- */
.pg_tag{
	flex:0 1 auto;
	display:inline-flex;
	align-items:center;
	gap:4px;
	max-width:180px;
	height:22px;
	padding:0 8px;
	border-radius:999px;
	background:var(--arp-accent-soft);
	color:var(--arp-accent);
	font-size:12px;
	font-weight:600;
	cursor:pointer;
	white-space:nowrap;
}
.pg_tag span{ overflow:hidden; text-overflow:ellipsis; }
.pg_tag i{ font-size:11px; }
.pg_tag:hover{ filter:brightness(.95); }
.pg_chk{
	display:none;
	flex:0 0 22px;
	width:22px;
	height:22px;
	border:2px solid #c4ccd6;
	border-radius:6px;
	background:#fff;
	color:#fff;
	align-items:center;
	justify-content:center;
	font-size:13px;
}
.pg_selecting .pg_chk{ display:inline-flex; }
.pg_selecting #show_list .arp_card{ cursor:pointer; }
.pg_selecting #show_list .arp_card *{ pointer-events:none; }
.pg_selecting #show_list .arp_card_foot{ opacity:.45; }
.pg_selecting #show_list .arp_card.pg_selected{ border-color:var(--arp-accent); box-shadow:0 0 0 2px var(--arp-accent); }
.pg_selecting #show_list .arp_card.pg_selected .pg_chk{ background:var(--arp-accent); border-color:var(--arp-accent); }

/* ---------- 多選操作列 ---------- */
.pg_selbar{
	position:fixed;
	left:50%;
	bottom:18px;
	transform:translateX(-50%);
	z-index:1500;
	display:flex;
	align-items:center;
	gap:8px;
	padding:10px 12px 10px 18px;
	background:#111827;
	color:#fff;
	border-radius:14px;
	box-shadow:0 10px 30px rgba(0,0,0,.25);
	max-width:calc(100% - 24px);
	font-family:Arial, "Microsoft JhengHei", sans-serif;
}
.pg_selbar_info{ font-size:14px; white-space:nowrap; margin-right:6px; }
.pg_selbar_info b{ font-size:17px; }
.pg_sb_btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:5px;
	height:40px;
	padding:0 14px;
	border:1px solid rgba(255,255,255,.25);
	border-radius:10px;
	background:transparent;
	color:#fff;
	font-size:14px;
	font-weight:600;
	font-family:inherit;
	cursor:pointer;
	white-space:nowrap;
}
.pg_sb_btn:hover{ background:rgba(255,255,255,.1); }
.pg_sb_btn[disabled]{ opacity:.4; cursor:default; }
.pg_sb_main{ background:var(--main-color); border-color:var(--main-color); }
.pg_sb_main:hover{ background:var(--main-color); filter:brightness(1.08); }
.pg_sb_done{ border-color:transparent; color:#cbd5e1; }
body.pg_has_selbar .arp_footer{ padding-bottom:80px; }

/* ---------- 底部抽屜 / 對話框 ---------- */
body.pg_lock{ overflow:hidden; }
#pg_sheet_wrap .pg_mask{
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	z-index:1990;
	background:rgba(17,24,39,.45);
	opacity:0;
	transition:opacity .2s;
}
#pg_sheet_wrap.show .pg_mask{ opacity:1; }
.pg_sheet{
	position:fixed;
	z-index:1991;
	left:50%;
	top:50%;
	width:440px;
	max-width:calc(100% - 32px);
	max-height:80vh;
	display:flex;
	flex-direction:column;
	background:#fff;
	border-radius:14px;
	box-shadow:0 20px 50px rgba(0,0,0,.25);
	font-family:Arial, "Microsoft JhengHei", sans-serif;
	color:#1f2937;
	transform:translate(-50%, -46%);
	opacity:0;
	transition:transform .2s, opacity .2s;
}
#pg_sheet_wrap.show .pg_sheet{ transform:translate(-50%, -50%); opacity:1; }
.pg_sheet_grip{ display:none; }
.pg_sheet_head{
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	gap:12px;
	padding:16px 18px 10px;
}
.pg_sheet_head b{ display:block; font-size:17px; color:#111827; letter-spacing:1px; }
.pg_sheet_sub{ display:block; margin-top:3px; font-size:13px; color:#6b7280; word-break:break-all; }
.pg_sheet_x{
	flex:0 0 36px;
	width:36px;
	height:36px;
	border:0;
	border-radius:8px;
	background:#f1f4f8;
	color:#4b5563;
	font-size:16px;
	cursor:pointer;
}
.pg_sheet_x:hover{ background:#e4e9ef; }
.pg_sheet_msg{
	display:none;
	margin:0 18px 8px;
	padding:8px 10px;
	border-radius:8px;
	background:#fef2f2;
	color:#b91c1c;
	font-size:13.5px;
}
.pg_sheet_body{ padding:0 18px 18px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.pg_new{ display:flex; gap:8px; margin:0 0 14px; }
.pg_new input, .pg_medit input{
	flex:1 1 auto;
	min-width:0;
	height:42px;
	padding:0 12px;
	border:1px solid #d9dee5;
	border-radius:8px;
	font-size:15px;
	font-family:inherit;
	outline:none;
}
.pg_new input:focus, .pg_medit input:focus{ border-color:var(--main-color); box-shadow:0 0 0 3px rgba(0,122,176,.12); }
.pg_new .arp_btn, .pg_medit .arp_btn, .pg_mdel .arp_btn{ height:42px; flex:0 0 auto; }
.pg_opts_label{ margin:0 0 6px; font-size:12px; color:#9aa3af; letter-spacing:1px; }
.pg_opts{ display:flex; flex-direction:column; gap:6px; }
.pg_opt{
	display:flex;
	align-items:center;
	gap:10px;
	width:100%;
	min-height:46px;
	padding:0 14px;
	border:1px solid #e3e8ee;
	border-radius:10px;
	background:#fff;
	color:#1f2937;
	font-size:15px;
	font-family:inherit;
	text-align:left;
	cursor:pointer;
}
.pg_opt > i:first-child{ color:var(--main-color); }
.pg_opt span{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pg_opt em{ font-style:normal; font-size:12.5px; color:#9aa3af; white-space:nowrap; }
.pg_opt_ck{ display:none; color:var(--main-color); }
.pg_opt:hover{ border-color:var(--main-color); background:#f4fafd; }
.pg_opt.is_cur{ border-color:var(--main-color); background:#e6f4fa; cursor:default; }
.pg_opt.is_cur .pg_opt_ck{ display:inline-block; }
.pg_opt_out{ margin-top:10px; color:#b91c1c; border-style:dashed; }
.pg_opt_out > i:first-child{ color:#b91c1c; }
.pg_opt_out:hover{ background:#fef2f2; border-color:#dc2626; }

/* 管理戶名 */
.pg_mlist{ display:flex; flex-direction:column; border:1px solid #e3e8ee; border-radius:10px; overflow:hidden; }
.pg_mrow + .pg_mrow{ border-top:1px solid #eef1f5; }
.pg_mview{ display:flex; align-items:center; gap:8px; padding:8px 8px 8px 14px; min-height:52px; }
.pg_mname{ flex:1 1 auto; min-width:0; }
.pg_mname b{ display:block; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pg_mname em{ font-style:normal; font-size:12px; color:#9aa3af; }
.pg_macts{ flex:0 0 auto; display:flex; gap:4px; }
.pg_ibtn{
	width:36px;
	height:36px;
	border:1px solid #e3e8ee;
	border-radius:8px;
	background:#fff;
	color:#4b5563;
	font-size:14px;
	cursor:pointer;
}
.pg_ibtn:hover{ border-color:var(--main-color); color:var(--main-color); }
.pg_ibtn[disabled]{ opacity:.3; cursor:default; }
.pg_ibtn_danger{ color:#b91c1c; }
.pg_ibtn_danger:hover{ border-color:#dc2626; color:#dc2626; background:#fef2f2; }
.pg_medit, .pg_mdel{ display:none; }
.pg_mrow.is_edit .pg_mview, .pg_mrow.is_del .pg_mview{ display:none; }
.pg_mrow.is_edit .pg_medit{ display:flex; gap:6px; padding:8px; }
.pg_mrow.is_del .pg_mdel{ display:block; padding:12px 14px; background:#fef2f2; }
.pg_mdel p{ margin:0 0 10px; font-size:14px; line-height:1.6; color:#7f1d1d; }
.pg_mdel div{ display:flex; gap:8px; }
.pg_mempty{ padding:18px; text-align:center; color:#9aa3af; font-size:13.5px; }
.pg_mnote{ display:flex; gap:6px; margin:12px 0 0; font-size:12.5px; line-height:1.6; color:#6b7280; }
.pg_mnote i{ margin-top:3px; }

/* ---------- 手機 ---------- */
@media screen and (max-width: 640px)
{
	/* 單排：左邊膠囊可橫向滑動，右邊兩顆圖示按鈕；固定在頂端只佔一排高度 */
	.pg_bar{ position:sticky; top:0; z-index:20; margin:-4px 0 12px; padding:6px; }
	.pg_bar_row{ gap:6px; }
	.pg_bar_label{ display:none; }
	.pg_pill{ height:44px; padding:0 14px; font-size:14.5px; }
	.pg_tool{ width:44px; height:44px; padding:0; justify-content:center; font-size:17px; }
	.pg_tool span{ display:none; }
	.arp_card_name{ flex-wrap:wrap; }
	.pg_tag{ max-width:100%; }

	.pg_selbar{ left:8px; right:8px; bottom:8px; transform:none; max-width:none; flex-wrap:wrap; padding:10px 10px calc(10px + env(safe-area-inset-bottom)); }
	.pg_selbar_info{ flex:1 1 auto; }
	.pg_sb_btn{ height:44px; }
	.pg_sb_main, .pg_selbar [data-act=out]{ flex:1 1 calc(50% - 4px); }
	body.pg_has_selbar .arp_footer{ padding-bottom:130px; }

	.pg_sheet{
		left:0;
		right:0;
		top:auto;
		bottom:0;
		width:auto;
		max-width:none;
		max-height:86vh;
		border-radius:16px 16px 0 0;
		transform:translateY(100%);
		opacity:1;
		padding-bottom:env(safe-area-inset-bottom);
	}
	#pg_sheet_wrap.show .pg_sheet{ transform:translateY(0); }
	.pg_sheet_grip{ display:block; width:40px; height:4px; margin:8px auto 0; border-radius:4px; background:#d5dbe2; }
	.pg_sheet_head{ padding-top:10px; }
	.pg_new input, .pg_medit input{ height:46px; font-size:16px; } /* 16px 避免 iOS 聚焦時自動放大 */
	.pg_new .arp_btn, .pg_medit .arp_btn, .pg_mdel .arp_btn{ height:46px; }
	.pg_opt{ min-height:50px; }
	.pg_ibtn{ width:40px; height:40px; }
}

/* =========================================================
   20261008 近期操作（js/plan_group.js pg_recent_*）
   標題沿用各戶的 .pg_sec、卡片是清單卡片的複本，排法與下方各戶一致
   ========================================================= */
.pg_recent{ margin:0 0 22px; }
.pg_recent .pg_rc_sec{ margin:0 0 8px; }
.pg_recent .pg_rc_sec .pg_sec_icon{ color:var(--arp-accent); }
.pg_recent.is_folded .pg_rc_cards{ display:none; }
.pg_recent.is_folded .pg_sec_chev{ transform:rotate(-90deg); }
.pg_rc_card{ border-left:3px solid var(--arp-accent); }

/* 卡片上的戶名標籤（未歸戶為灰色） */
.pg_rc_tag{
	flex:0 1 auto;
	display:inline-flex;
	align-items:center;
	gap:4px;
	max-width:180px;
	height:22px;
	padding:0 8px;
	border-radius:999px;
	background:var(--arp-accent-soft);
	color:var(--arp-accent);
	font-size:12px;
	font-weight:600;
	cursor:pointer;
	white-space:nowrap;
}
.pg_rc_tag i{ font-size:11px; }
.pg_rc_tag span{ overflow:hidden; text-overflow:ellipsis; }
.pg_rc_tag.is_u{ background:#eef1f4; color:#6b7280; }
.pg_rc_tag:hover{ filter:brightness(.95); }

/* 標頭日期列：最後使用、在清單中 */
.pg_rc_used{ color:var(--arp-accent); font-weight:600; }
.pg_rc_find{
	display:inline-flex;
	align-items:center;
	gap:4px;
	padding:0 8px;
	height:22px;
	border:1px solid #d5dde6;
	border-radius:999px;
	color:#4b5563;
	cursor:pointer;
	white-space:nowrap;
}
.pg_rc_find:hover{ border-color:var(--arp-accent); color:var(--arp-accent); }

/* 「在清單中」定位後原卡片閃一下 */
.arp_card.pg_flash{ animation:pg_flash 1.6s ease-out; }
@keyframes pg_flash{
	0%, 35%{ box-shadow:0 0 0 3px var(--arp-accent), 0 10px 24px -10px rgba(0,60,100,.35); }
	100%{ box-shadow:0 0 0 0 transparent; }
}