/* === PC Mypage Modern Design System === */
.mp-pc { max-width:100%; }
.mp-pc * { box-sizing:border-box; }

/* Page Hero */
.mp-pc .mp-head { display:flex; align-items:center; gap:14px; padding:22px 24px; margin-bottom:18px; background:linear-gradient(135deg,#fff 0%,#fff7f5 100%); border:1px solid #f2dcd5; border-left:4px solid #e42500; border-radius:12px; }
.mp-pc .mp-head .mp-ico { flex:none; width:46px; height:46px; border-radius:12px; background:linear-gradient(135deg,#e42500,#c21f00); color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; box-shadow:0 6px 16px rgba(228,37,0,.25); }
.mp-pc .mp-head h2 { margin:0; font-size:20px; font-weight:800; color:#1a1a1a; letter-spacing:-.4px; }
.mp-pc .mp-head p { margin:3px 0 0; font-size:13px; color:#777; }

/* Pill Tabs (replacing .sub_tab) */
.mp-pc .mp-tabs, .sub_tab.cash, .sub_tab { display:flex !important; gap:8px !important; margin:0 0 18px !important; padding:6px !important; background:#f5f5f5 !important; border-radius:12px !important; list-style:none !important; border:none !important; }
.mp-pc .mp-tabs li, .sub_tab.cash li, .sub_tab li { flex:1 !important; margin:0 !important; padding:0 !important; background:none !important; border:none !important; }
.mp-pc .mp-tabs li a, .sub_tab.cash li a, .sub_tab li a { display:flex !important; align-items:center; justify-content:center; height:44px !important; padding:0 14px !important; font-size:14px !important; font-weight:700 !important; color:#777 !important; text-decoration:none !important; border-radius:9px !important; transition:all .2s ease !important; background:none !important; border:none !important; letter-spacing:-.2px; }
.mp-pc .mp-tabs li a:hover, .sub_tab.cash li a:hover, .sub_tab li a:hover { color:#e42500 !important; background:rgba(228,37,0,.06) !important; }
.mp-pc .mp-tabs li.on a, .sub_tab.cash li.on a, .sub_tab li.on a { color:#fff !important; background:linear-gradient(135deg,#e42500,#c21f00) !important; box-shadow:0 4px 12px rgba(228,37,0,.3) !important; }

/* Card container */
.mp-pc .mp-card { background:#fff; border:1px solid #ececec; border-radius:14px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.03); }

/* Modern table (mp-tbl + global .order_list override) */
.mp-pc .mp-tbl, .order_list { width:100% !important; border-collapse:separate !important; border-spacing:0 !important; background:#fff; border:1px solid #ececec; border-radius:14px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.03); }
.mp-pc .mp-tbl thead th, .order_list thead th { padding:15px 12px !important; font-size:13px !important; font-weight:700 !important; color:#555 !important; background:#fafafa !important; border-bottom:1px solid #ededed !important; text-align:center; letter-spacing:-.2px; }
.mp-pc .mp-tbl tbody td, .order_list tbody td { padding:16px 12px !important; font-size:13.5px !important; color:#333 !important; border-bottom:1px solid #f3f3f3 !important; text-align:center; vertical-align:middle; }
.mp-pc .mp-tbl tbody tr:last-child td, .order_list tbody tr:last-child td { border-bottom:none !important; }
.mp-pc .mp-tbl tbody tr, .order_list tbody tr { transition:background-color .18s ease; }
.mp-pc .mp-tbl tbody tr:hover, .order_list tbody tr:hover { background:#fcfcfc; }

.mp-pc .mp-code { font-family:ui-monospace,monospace; font-size:12px; color:#888; letter-spacing:.2px; }
.mp-pc .mp-title { text-align:left !important; font-weight:700; color:#1a1a1a; font-size:14px; letter-spacing:-.2px; }
.mp-pc .mp-period { color:#666; font-size:12.5px; white-space:nowrap; }
.mp-pc .mp-price { font-weight:800; color:#1a1a1a; font-size:14px; }
.mp-pc .mp-price small { display:block; font-size:11px; color:#999; font-weight:500; margin-top:2px; }
.mp-pc .mp-pay { color:#555; font-size:12.5px; line-height:1.5; }

/* Status badges */
.mp-pc .mp-badge { display:inline-flex; align-items:center; justify-content:center; padding:6px 12px; font-size:12px; font-weight:800; border-radius:20px; letter-spacing:-.2px; line-height:1; white-space:nowrap; }
.mp-pc .mp-badge.active { background:#e7f7ee; color:#0d8a3f; border:1px solid #bfe9ce; }
.mp-pc .mp-badge.warn { background:#fff4e0; color:#c87300; border:1px solid #ffe0b0; }
.mp-pc .mp-badge.done { background:#f0f0f0; color:#777; border:1px solid #e0e0e0; }
.mp-pc .mp-badge.cancel { background:#fde8e8; color:#c21f00; border:1px solid #f7c8c8; }
.mp-pc .mp-split { display:inline-block; margin-top:8px; font-size:11.5px; color:#e42500; font-weight:700; text-decoration:none; padding:4px 9px; background:#fff5f3; border:1px solid #f7d6cc; border-radius:6px; transition:all .2s ease; }
.mp-pc .mp-split:hover { background:#e42500; color:#fff; border-color:#e42500; }

/* Empty state */
.mp-pc .mp-empty { padding:80px 20px; text-align:center; }
.mp-pc .mp-empty .em-ico { font-size:48px; margin-bottom:14px; opacity:.3; }
.mp-pc .mp-empty .em-msg { font-size:15px; color:#999; font-weight:600; letter-spacing:-.2px; }

/* Withdraw notices (.myout_area) */
.mp-pc .myout_area, .myout_area { background:#fff; border:1px solid #ececec; border-radius:14px; padding:32px 36px !important; box-shadow:0 2px 10px rgba(0,0,0,.03); }
.myout_area > p:first-child { margin:0 0 24px; padding:18px 20px; background:#fff7f5; border-left:3px solid #e42500; border-radius:8px; color:#555; font-size:14px; line-height:1.7; }
.myout_area strong { display:block; margin:20px 0 8px; padding:10px 14px; background:#fafafa; border-radius:8px; font-size:14.5px; font-weight:800; color:#1a1a1a; letter-spacing:-.2px; }
.myout_area strong span { color:#e42500; font-weight:800; }
.myout_area > p { margin:0 0 10px; padding:0 14px; font-size:13px; color:#666; line-height:1.7; }

/* Pager */
.mp-pc .mp-pager { margin-top:24px; text-align:center; }
