/* ===================================================
   [680] ACCT-08_My-Account-Styling
   ===================================================
   🔧 แก้ 28 ก.ย. 2569 (G28_chat-11) · หน้าดูคำสั่งซื้อไม่ซ่อนบรรทัดสถานะแล้ว
   เดิมกฎข้อ 1 ซ่อน p / h2 / h3 ชั้นแรกของ .woocommerce-MyAccount-content ทุกหน้าย่อยของบัญชี
   หน้าดูคำสั่งซื้อ (view-order) จึงไม่มีบรรทัด "Order #… was placed on … and is currently …"
   และหัวข้อ "Order updates" (โน้ตทีมงานถึงลูกค้า) · สมาชิกไม่รู้ว่าออเดอร์อยู่สถานะไหน
   ตอนนี้ยกเว้นหน้าที่ body มีคลาส woocommerce-view-order (WooCommerce ใส่ให้หน้าย่อยเอง)
   หน้าอื่นซ่อนเหมือนเดิม (แดชบอร์ด · ประวัติคำสั่งซื้อ · ที่อยู่ ฯลฯ) · ม็อคอัพที่เจ้าของเว็บโอเค 18:59
   📌 ไฟล์ CSS ใส่แถวศูนย์เฝ้าระวังเองไม่ได้ (ยกเว้นตาม D16) · ตรวจด้วยตาที่หน้าดูคำสั่งซื้อจริง
   ===================================================
   🧹 ทำความสะอาด (2026-09-04): ลบ CSS ที่ยืนยันแล้วว่าไม่มีใครใช้ออก 3 จุด
   (ค้นทั้งเว็บ 236 snippet แล้วไม่มีไฟล์ไหนอื่นอ้างถึงคลาสเหล่านี้เลย):
   - .profile-hub-wrapper (ทั้ง 2 จุดที่เคยอยู่ใน section 1 และ 2) — ซากของ
     wrapper class เวอร์ชันเก่า ไม่มี HTML ไหนในเว็บใช้คลาสนี้เลย
   - ทั้ง section "3. แท็บเมนูสไตล์แอป" (.tms-app-tabs, .tms-tab-btn,
     .tms-tab-content, @keyframes fadeIn) — ซากของระบบแท็บเวอร์ชันเก่าก่อน
     ถูกแทนที่ด้วยไฟล์ 1324 (02-ACCOUNT-01-Tabs-Shell) ที่ใช้คลาสคนละชื่อ
     (.profile-tabs, .profile-tab-btn, .profile-tab-content) และมี
     @keyframes fadeIn ของตัวเองอยู่แล้ว (เช็คแล้วว่า 1324 ไม่ได้พึ่งพา
     @keyframes ชุดนี้เลย เป็นคนละชุดที่นิยามซ้ำกันเฉยๆ)
   - .settings-card / .settings-card-icon (เดิม section 5) — นิยามซ้ำกับที่
     มีอยู่แล้วในไฟล์ 1324 เอง (ค่าเดิมไม่ตรงกัน: ที่นี่เคยเป็น 2px dashed,
     ที่ 1324 ใช้ 1px solid) เช็คแล้วว่า HTML ที่ใช้คลาสนี้จริง (ไฟล์ 1537,
     แท็บ overview) render อยู่ภายใน 1324's tab shell เสมอ จึงมี CSS ของ
     1324 ครอบคลุมอยู่แล้วแน่นอน ไม่ต้องมีสำรองที่นี่อีก — เก็บของ 1324 ไว้
     เป็นตัวหลักตัวเดียว ลบตัวซ้ำที่นี่ทิ้ง

   ส่วนที่เหลือทั้งหมดยังใช้งานจริง:
   1-2: ซ่อนเมนู/ข้อความ WooCommerce เดิม + จัด flexbox ให้ tab shell (1324)
        วางเนื้อหาได้ถูกลำดับ
   4: ชุดสี .cute-blue/orange/purple/gold/green/pink — ใช้โดย shortcode
      อื่นๆ ในเว็บ (เช่น [my_wallet_dashboard] ที่ผูกกับแท็บ 1538)
   6: จัดตำแหน่ง/สไตล์ข้อความแจ้งเตือนของ WooCommerce ให้ลงมาอยู่ล่างสุด
   =================================================== */

/* 1. ซ่อนข้อความและเมนูของ WooCommerce ที่ไม่ได้ใช้ */
.woocommerce-MyAccount-navigation {
    display: none !important;
}
/* 🔧 28 ก.ย. ยกเว้นหน้าดูคำสั่งซื้อ (บรรทัดสถานะออเดอร์ + หัวข้อโน้ตทีมงาน ต้องเห็น) */
body:not(.woocommerce-view-order) .woocommerce-MyAccount-content > p,
body:not(.woocommerce-view-order) .woocommerce-MyAccount-content > h2,
body:not(.woocommerce-view-order) .woocommerce-MyAccount-content > h3 { 
    display: none !important; 
}

/* 2. จัดโครงสร้าง Flexbox ป้องกันแท็บกระโดดเวลาสลับหน้า */
.woocommerce-account .woocommerce,
.woocommerce-MyAccount-content {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    float: none !important;
}

/* 4. กล่องหมวดหมู่ต่างๆ นุ่มนวลน่ารัก */
.tms-wallet-section { 
    border-radius: 25px; 
    padding: 25px; 
    margin-bottom: 25px; 
    box-shadow: 0 8px 24px rgba(0,0,0,0.03); 
}
.tms-wallet-section-title { 
    font-size: 18px !important; 
    font-weight: bold; 
    margin: 0 0 20px 0 !important; 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    padding-bottom: 12px; 
}

/* 🎨 ธีมสีแยกตามหมวดหมู่ */
.cute-blue { background: #f6fcff; border: 2px solid #81ecec; }
.cute-blue .tms-wallet-section-title { color: #00cec9; border-bottom: 2px dashed #81ecec; }

.cute-orange { background: #fffaf6; border: 2px solid #fab1a0; }
.cute-orange .tms-wallet-section-title { color: #e17055; border-bottom: 2px dashed #fab1a0; }

.cute-purple { background: #fcf9ff; border: 2px solid #a29bfe; }
.cute-purple .tms-wallet-section-title { color: #6c5ce7; border-bottom: 2px dashed #a29bfe; }

.cute-gold { background: #fffdf5; border: 2px solid #ffeaa7; }
.cute-gold .tms-wallet-section-title { color: #fdcb6e; border-bottom: 2px dashed #ffeaa7; }

.cute-green { background: #f5fef9; border: 2px solid #55efc4; }
.cute-green .tms-wallet-section-title { color: #00b894; border-bottom: 2px dashed #55efc4; }

.cute-pink { background: #fff5fd; border: 2px solid #ff9ff3; }
.cute-pink .tms-wallet-section-title { color: #f368e0; border-bottom: 2px dashed #ff9ff3; }

/* 6. ย้ายการแจ้งเตือน WooCommerce (พวก Error/Success message) ลงไปด้านล่าง */
.woocommerce-notices-wrapper,
.woocommerce-info,
.woocommerce-message {
    order: 99 !important;
    margin-top: 25px !important;
    margin-bottom: 20px !important;
    border-radius: 15px !important;
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-left: 5px solid #0984e3 !important;
    font-size: 13px !important;
    color: #2d3436 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.03) !important;
}
.woocommerce-info .button,
.woocommerce-message .button {
    background: #0984e3 !important;
    color: #ffffff !important;
    border-radius: 20px !important;
    padding: 6px 16px !important;
    font-size: 12px !important;
    font-weight: bold !important;
    border: none !important;
}