/*
Theme Name: Kadence Child
Template: kadence
Version: 1.0.0
*/
/* ================================================================
   SX-70R REFACTORED COMPLETE STYLESHEET
   1. Global Typography & Resets
   2. Global Buttons & Action Isolation
   3. Sticky Header & Shadow
   4. Shop Category & Archive Loop
   5. Login, Register & Reset Forms
   6. My Account (Navigation & Content)
   7. Order Details & Order Tables
   8. Cart Page (Orders-Style Card Redesign - No Table Lines)
================================================================ */

/* ==========================================================
   1. 全局排版與基礎重置 (GLOBAL TYPOGRAPHY & RESETS)
   ========================================================== */
body, 
.site-container {
    color: #0f172a;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    line-height: 1.7;
}

h1, h2, h3, .entry-title {
    color: #0f172a;
    font-weight: 700;
    letter-spacing: -0.02em;
}

p {
    color: #334155;
    font-size: 16px;
    line-height: 1.8;
}

/* 僅針對內文與 WooCommerce 圖片做基礎重設，保護 Logo 與頭像 */
.entry-content img,
.woocommerce img {
    max-width: 100%;
    height: auto;
    border: none;
    box-shadow: none;
}

/* 特定背景圖全覆蓋 */
.entry-content .cinematic-wrapper .cinematic-bg-box img.cinematic-img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center !important; 
    border-radius: 0 !important;
}

/* 頁尾輕柔陰影 */
.site-footer,
#colophon {
    box-shadow: 0 -4px 6px -1px rgba(15, 23, 42, 0.04), 0 -10px 15px -3px rgba(15, 23, 42, 0.03) !important;
}


/* ==========================================================
   2. 全局按鈕規範 (GLOBAL BUTTONS & EXCLUSIONS)
   ========================================================== */
/* 全站通用長條按鈕（排除購物車小部件以防比例崩塌） */
.woocommerce a.button:not(.woocommerce-cart a.button):not(.woocommerce-orders-table a.button), 
.woocommerce button.button:not(.woocommerce-cart button.button):not(.woocommerce-orders-table button.button), 
.woocommerce input.button:not(.woocommerce-cart input.button),
.woocommerce #respond input#submit, 
.woocommerce-message .button.wc-forward,
.woocommerce .woocommerce-form-login.login .woocommerce-form-login__submit,
.woocommerce-ResetPassword .button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wc-block-components-product-button__button,
.wp-block-woocommerce-handpicked-products .wp-block-button__link,
.wp-block-woocommerce-handpicked-products .button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 52px !important;
    padding: 0 20px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-align: center !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
    border-radius: 10px !important;
    text-transform: none !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04) !important;
    transition: all 0.25s ease !important;
    margin: 15px 0 !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}

.woocommerce a.button:not(.woocommerce-cart a.button):not(.woocommerce-orders-table a.button):hover, 
.woocommerce button.button:not(.woocommerce-cart button.button):not(.woocommerce-orders-table button.button):hover, 
.woocommerce input.button:not(.woocommerce-cart input.button):hover,
.woocommerce #respond input#submit:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wc-block-components-product-button__button:hover,
.wp-block-woocommerce-handpicked-products .wp-block-button__link:hover,
.wp-block-woocommerce-handpicked-products .button:hover {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08) !important;
}


/* ==========================================================
   3. 頂部導覽列吸頂與陰影 (STICKY HEADER)
   ========================================================== */
.site-header,
#masthead,
.main-header-bar,
.ast-main-header-wrap,
header.site-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    background-color: #ffffff !important;
    border-bottom: 1px solid #eaeaea !important;
    box-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.04), 0 10px 15px -3px rgba(15, 23, 42, 0.03) !important;
    transition: box-shadow 0.2s ease !important;
}

/* 避讓管理員黑條 */
.admin-bar .site-header,
.admin-bar #masthead,
.admin-bar .main-header-bar,
.admin-bar .ast-main-header-wrap,
.admin-bar header.site-header {
    top: 32px !important;
}

@media screen and (max-width: 782px) {
    .admin-bar .site-header,
    .admin-bar #masthead,
    .admin-bar .main-header-bar,
    .admin-bar .ast-main-header-wrap,
    .admin-bar header.site-header {
        top: 46px !important;
    }
}

/* 手機版標題置中 */
@media (max-width: 768px) {
    #mobile-header .site-title,
    #mobile-header .site-title.vs-md-false {
        text-align: center !important;
        width: 100% !important;
        display: block !important;
    }
}


/* ==========================================================
   4. 商店商品列表與分類排版 (SHOP GRIDS & CATEGORIES)
   ========================================================== */
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title {
    font-size: 11px !important;
    line-height: 1.3 !important;
}

/* 行動版商店頂部 6 分類橫排 */
@media (max-width: 768px) {
    html body.woocommerce-shop #wrapper #inner-wrap #primary #main header.woocommerce-products-header .my-special-container .woocommerce ul.products {
        display: grid !important;
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        gap: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }
    html body.woocommerce-shop #wrapper #inner-wrap #primary #main header.woocommerce-products-header .my-special-container .woocommerce ul.products li.product-category {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    html body.woocommerce-shop #wrapper #inner-wrap #primary #main header.woocommerce-products-header .my-special-container .woocommerce ul.products li.product-category a img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
        margin: 0 auto !important;
    }
    html body.woocommerce-shop #wrapper #inner-wrap #primary #main header.woocommerce-products-header .my-special-container .woocommerce ul.products li.product-category .product-details {
        padding: 3px 1px !important;
        text-align: center !important;
    }
    html body.woocommerce-shop #wrapper #inner-wrap #primary #main header.woocommerce-products-header .my-special-container .woocommerce ul.products li.product-category .woocommerce-loop-category__title {
        font-size: 9px !important;
        line-height: 1.1 !important;
        padding: 0 !important;
        margin: 0 !important;
        white-space: normal !important;
        word-break: break-word !important;
        text-align: center !important;
    }
    html body.woocommerce-shop #wrapper #inner-wrap #primary #main header.woocommerce-products-header .my-special-container .woocommerce ul.products li.product-category .woocommerce-loop-category__title mark.count {
        display: block !important;
        font-size: 8px !important;
        line-height: 1 !important;
        margin-top: 2px !important;
    }
}


/* ==========================================================
   5. 登入與密碼重設表單 (LOGIN & RESET FORMS)
   ========================================================== */
.woocommerce-form-login.login {
    display: flex !important;
    flex-direction: column !important;
    margin-top: 20px !important;
    padding: 30px !important;
    background: #ffffff !important;
    border: 1px solid #e4e4e4 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
    max-width: 500px;
}

.woocommerce-ResetPassword.lost_reset_password {
    background-color: #ffffff !important;
    padding: 40px !important;
    border: 1px solid #e4e4e4 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
    max-width: 800px !important;
    margin: 40px auto !important;
}

.woocommerce-form-login__rememberme {
    display: flex !important;
    align-items: center !important;
    margin: 10px 0 !important;
    font-size: 15px !important;
}

/* 獨立登入頁面 (Page ID 9) */
@media (min-width: 992px) {
    body.page-id-9:not(.logged-in) .site-main {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        align-items: center !important;
        gap: 60px !important;
        max-width: 1000px !important;
        margin: 60px auto !important;
        padding: 50px !important;
        background-color: #ffffff !important;
        background-image: none !important;
        border-radius: 24px !important;
        box-shadow: 0 30px 90px rgba(0, 0, 0, 0.08) !important;
        border: 1px solid rgba(0, 0, 0, 0.04) !important;
    }
    body.page-id-9:not(.logged-in) form.woocommerce-form-login {
        background-color: transparent !important;
        padding: 0 !important;
        box-shadow: none !important;
        border: none !important;
        max-width: 100% !important;
        margin: 0 !important;
    }
    body.page-id-9:not(.logged-in) .site-main::after {
        content: "" !important;
        display: block !important;
        width: 100% !important;
        height: 480px !important;
        background-image: url('/wp-content/uploads/2026/09/Loginbg.jpg') !important;
        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
        border-radius: 16px !important;
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
    }
    body.page-id-9:not(.logged-in) .site-main .content-bg {
        background-color: transparent !important;
        box-shadow: none;
    }
    body.page-id-9:not(.logged-in) .woocommerce.cits-my-account h2 { 
        display: none !important; 
    }
}

@media (max-width: 991px) {
    body.page-id-9:not(.logged-in) .site-main {
        background-image: none !important;
        background-color: #ffffff !important;
    }
    body.page-id-9:not(.logged-in) form.woocommerce-form-login {
        background-color: rgba(255, 255, 255, 0.95);
        padding: 35px;
        border-radius: 8px;
    }
}

@media (max-width: 768px) {
    .woocommerce-form-login.login, 
    body.page-id-9:not(.logged-in) form.woocommerce-form-login {
        padding: 20px !important; 
        margin-top: 10px !important;
    }
    .woocommerce-ResetPassword.lost_reset_password {
        padding: 20px !important; 
        margin: 20px 10px !important; 
    }
}


/* ==========================================================
   6. 我的帳號 (MY ACCOUNT)
   ========================================================== */
.woocommerce-account .account-navigation-wrap {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 260px !important;
    margin: 0 auto !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
    border-radius: 8px !important;
    overflow: visible !important;
    width: 100% !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block !important;
    padding: 12px 20px !important;
    background-color: #ffffff !important;
    color: #334155 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
    transition: all 0.25s ease !important;
    text-align: center !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08) !important;
    color: #0f172a !important;
    background-color: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08) !important;
    transform: translateY(-2px) !important;
}

.woocommerce-account:not(.logged-in) .woocommerce { 
    display: block !important; 
}

.woocommerce-account:not(.logged-in) .woocommerce h2 {
    font-size: 36px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin-top: 25px !important;
    margin-bottom: 20px !important;
    text-transform: none !important;
    letter-spacing: -0.02em !important;
}

/* 電腦版左右雙欄佈局 */
@media (min-width: 769px) {
    .logged-in.woocommerce-account .woocommerce {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: flex-start !important;
    }
    .woocommerce-MyAccount-navigation {
        flex: 0 0 240px !important;
        max-width: 240px !important;
        min-width: 220px !important;
        margin: 30px 4% 0 2% !important;
        float: none !important;
    }
    .woocommerce-MyAccount-navigation ul li a { 
        white-space: nowrap !important; 
    }
    .woocommerce-MyAccount-content {
        flex: 1 !important;
        width: auto !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        padding: 30px !important;
        background: #ffffff;
        border: 1px solid #ebedf0;
        border-radius: 8px;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.03);
        float: none !important;
    }
    html body.woocommerce-account #wrapper #inner-wrap .woocommerce .woocommerce-MyAccount-content {
        margin-left: 15px !important;
        padding-top: 35px !important;
    }
}

/* 行動版我的帳號堆疊 */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce,
    .logged-in.woocommerce-account .woocommerce {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }
    .woocommerce-account .account-navigation-wrap,
    .woocommerce-account .woocommerce-MyAccount-navigation {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 0 20px 0 !important;
        float: none !important;
        box-sizing: border-box !important;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation ul {
        width: 100% !important;
        max-width: 100% !important;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation ul li a {
        width: 100% !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }
    .woocommerce-account .woocommerce-MyAccount-content {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        float: none !important;
        clear: both !important;
        padding: 16px 12px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }
    html body.woocommerce-account #wrapper #inner-wrap .woocommerce .woocommerce-MyAccount-content {
        margin-top: 25px !important;
        padding-top: 20px !important;
    }
}


/* ==========================================================
   7. 訂單明細與列表表格 (ORDER DETAILS & ORDERS TABLE - 完整修正版)
   ========================================================== */
.woocommerce-order-details br { 
    display: none !important; 
}

.woocommerce-order-details {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
}

.woocommerce-order-details table.shop_table { 
    width: 100% !important; 
    display: table !important; 
}

.woocommerce-customer-details { 
    width: 100% !important; 
    display: block !important; 
}

.woocommerce-order-details .button, 
.woocommerce-order-details a.button,
.woocommerce-order-details .order-again .button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: 1 !important;
    width: auto !important;
    min-height: 40px !important;
    padding: 0 18px !important;
    font-size: 14px !important;
    margin: 5px 10px 5px 0 !important;
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04) !important;
}

/* --- 電腦版訂單表格行與按鈕 (769px 以上，文字絕對居中) --- */
@media (min-width: 769px) {
    .woocommerce-MyAccount-content .woocommerce-orders-table {
        width: 100% !important;
        table-layout: auto !important;
        border-collapse: collapse !important;
    }
    .woocommerce-MyAccount-content .woocommerce-orders-table th,
    .woocommerce-MyAccount-content .woocommerce-orders-table td {
        vertical-align: middle !important;
        border-bottom: 1px solid #f1f5f9 !important;
        padding: 16px 12px !important;
        font-size: 14px !important;
        white-space: nowrap !important;
    }
    .woocommerce-orders-table__cell-order-actions {
        display: table-cell !important;
        white-space: nowrap !important;
        text-align: left !important;
    }
    
    /* 電腦版操作按鈕：解決文字偏上偏左，確保水平與垂直嚴格居中 */
    .woocommerce-orders-table__cell-order-actions .button,
    .woocommerce-MyAccount-content .woocommerce-orders-table a.button {
        display: inline-flex !important;
        align-items: center !important;     /* 垂直置中 */
        justify-content: center !important; /* 水平置中 */
        text-align: center !important;      /* 文字置中 */
        line-height: 1 !important;          /* 消除多餘行高基線偏移 */
        width: auto !important;
        min-width: 84px !important;
        min-height: 36px !important;
        height: 36px !important;            /* 固定高度等距 */
        padding: 0 16px !important;
        font-size: 13.5px !important;
        font-weight: 600 !important;
        border-radius: 6px !important;
        background-color: #f1f5f9 !important;
        color: #1e293b !important;
        border: 1px solid #e2e8f0 !important;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
        margin: 4px 8px 4px 0 !important;
        vertical-align: middle !important;
        box-sizing: border-box !important;
    }
    .woocommerce-orders-table__cell-order-actions .button:hover,
    .woocommerce-MyAccount-content .woocommerce-orders-table a.button:hover {
        background-color: #e2e8f0 !important;
        color: #0f172a !important;
        border-color: #cbd5e1 !important;
        box-shadow: 0 4px 10px rgba(15, 23, 42, 0.06) !important;
    }
    .woocommerce-orders-table__cell-order-actions .button:last-child {
        margin-right: 0 !important;
    }
}

/* --- 行動版卡片化訂單項目 (768px 以下：隱藏 Actions 標籤，按鈕自動適應防溢出) --- */
@media (max-width: 768px) {
    .woocommerce-orders-table.shop_table_responsive,
    .woocommerce-orders-table.shop_table_responsive tbody,
    .woocommerce-orders-table.shop_table_responsive tr {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        border: none !important;
    }
    .woocommerce-orders-table.shop_table_responsive thead {
        display: none !important; 
    }
    .woocommerce-orders-table.shop_table_responsive tr {
        margin-bottom: 16px !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 12px !important; 
        background: #ffffff !important;
        padding: 12px 16px !important; 
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important; 
        box-sizing: border-box !important;
    }
    
    /* 普通欄位數據行：左右兩端對齊 */
    .woocommerce-orders-table.shop_table_responsive tr th,
    .woocommerce-orders-table.shop_table_responsive tr td {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 8px 2px !important; 
        font-size: 13.5px !important;
        color: #1e293b !important;
        text-align: right !important;
        border: none !important;
        border-bottom: 1px solid #f1f5f9 !important;
        background: transparent !important;
    }

    /* 單號行頂部虛線與標籤 */
    .woocommerce-orders-table.shop_table_responsive tr th.woocommerce-orders-table__cell-order-number,
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-number {
        padding-top: 2px !important;
        padding-bottom: 10px !important;
        margin-bottom: 4px !important;
        border-bottom: 1px dashed #cbd5e1 !important;
        font-size: 15px !important;
        font-weight: 700 !important;
    }
    .woocommerce-orders-table.shop_table_responsive tr th.woocommerce-orders-table__cell-order-number a,
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-number a {
        color: #1e293b !important;
        background: #f1f5f9 !important;
        border: 1px solid #e2e8f0 !important;
        padding: 3px 10px !important;
        border-radius: 6px !important;
        text-decoration: none !important;
        font-weight: 700 !important;
    }

    /* 訂單總金額加粗醒目 */
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-total .amount {
        font-weight: 700 !important;
        color: #e63946 !important;
        font-size: 14.5px !important;
    }

    .woocommerce-orders-table.shop_table_responsive tr th:last-child,
    .woocommerce-orders-table.shop_table_responsive tr td:last-child {
        border-bottom: none !important;
        padding-bottom: 2px !important;
    }

    /* 偽元素標籤 (Order, Date, Status, Total) */
    .woocommerce-orders-table.shop_table_responsive tr th::before,
    .woocommerce-orders-table.shop_table_responsive tr td::before {
        content: attr(data-title);
        font-weight: 600;
        font-size: 13px;
        color: #64748b;
        text-align: left;
        flex-shrink: 0;
        margin-right: 12px;
    }

    /* Actions 容器：整行滿寬排布 */
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-actions {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 6px !important;
        width: 100% !important;
        padding: 10px 0 2px 0 !important;
        border-bottom: none !important;
        box-sizing: border-box !important;
    }

    /* 關鍵：徹底隱藏行動端的 Actions: 文字標籤 */
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-actions::before {
        display: none !important;
        content: none !important;
    }

    /* 行動版按鈕樣式：多按鈕均勻填充寬度，文字居中，絕不溢出邊界 */
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-actions .button {
        display: inline-flex !important;
        flex: 1 1 auto !important;  /* 自適應平分整行寬度 */
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        line-height: 1 !important;
        min-height: 32px !important;
        height: 32px !important;
        padding: 0 4px !important;
        font-size: 11.5px !important;
        font-weight: 600 !important;
        border-radius: 6px !important;
        background-color: #f1f5f9 !important;
        color: #1e293b !important;
        border: 1px solid #e2e8f0 !important;
        margin: 0 !important;
        box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    /* 單按鈕（如 View）靠右對齊，避免過度拉伸 */
    .woocommerce-orders-table.shop_table_responsive tr td.woocommerce-orders-table__cell-order-actions .button:only-of-type {
        flex: 0 0 auto !important;
        min-width: 68px !important;
        padding: 0 14px !important;
        margin-left: auto !important;
    }
}

/* ==========================================================
   8. 购物车页面：Orders 同款卡片流重构 (CART REDESIGN - 完整版)
   ========================================================== */

/* --- 桌面版比例 (65% : 35%) 与粘性定位 --- */
@media screen and (min-width: 1025px) {
    .woocommerce-cart .kadence-woo-cart-form-wrap {
        display: flex !important;
        align-items: flex-start !important;
        gap: 32px !important;
    }
    .woocommerce-cart .kadence-woo-cart-form-wrap > form.woocommerce-cart-form {
        float: none !important;
        width: 65% !important;
        padding-right: 0 !important;
    }
    .woocommerce-cart .kadence-woo-cart-form-wrap .cart-collaterals {
        float: none !important;
        width: 35% !important;
        position: sticky !important;
        top: 90px !important;
    }
}

/* 隐藏冗余的 Cart Summary 标题 */
.woocommerce-cart-form .cart-summary h2 {
    display: none !important;
}

/* 彻底抹除原表格所有横向线条与默认背景 */
.woocommerce-cart table.shop_table,
.woocommerce-cart table.shop_table thead,
.woocommerce-cart table.shop_table tbody,
.woocommerce-cart table.shop_table tr,
.woocommerce-cart table.shop_table th,
.woocommerce-cart table.shop_table td {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 隐藏传统表头 */
.woocommerce-cart table.cart thead {
    display: none !important;
}

/* 仅精准移除商品卡片内的伪元素，绝不误伤其他区域 */
.woocommerce-cart table.cart tr td::before {
    display: none !important;
    content: none !important;
}

/* --- PC 端：商品卡片整行动力学居中对齐 --- */
@media screen and (min-width: 769px) {
    .woocommerce-cart table.cart tbody tr.cart_item {
        display: flex !important;
        align-items: center !important; 
        background: #ffffff !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 12px !important;
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
        margin-bottom: 16px !important;
        padding: 16px 20px !important;
        gap: 16px !important;
        transition: all 0.25s ease !important;
        box-sizing: border-box !important;
    }

    .woocommerce-cart table.cart tbody tr.cart_item td {
        display: flex !important;
        align-items: center !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        line-height: 1.4 !important;
    }

    /* 1. 缩略图 */
    .woocommerce-cart table.cart td.product-thumbnail {
        order: 1 !important;
        flex: 0 0 64px !important;
    }

    /* 2. 商品名称 */
    .woocommerce-cart table.cart td.product-name {
        order: 2 !important;
        flex: 1 1 200px !important;
        text-align: left !important;
    }

    /* 3. 单价 */
    .woocommerce-cart table.cart td.product-price {
        order: 3 !important;
        flex: 0 0 auto !important;
        color: #64748b !important;
        font-size: 14px !important;
        margin-left: auto !important;
        padding: 0 10px !important;
    }

    /* 4. 数量框 */
    .woocommerce-cart table.cart td.product-quantity {
        order: 4 !important;
        flex: 0 0 auto !important;
        margin: 0 10px !important;
    }

    /* 5. 小计金额 */
    .woocommerce-cart table.cart td.product-subtotal {
        order: 5 !important;
        flex: 0 0 80px !important;
        justify-content: flex-end !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #1e293b !important;
    }

    /* 6. 删除按钮 */
    .woocommerce-cart table.cart td.product-remove {
        order: 6 !important;
        flex: 0 0 28px !important;
        justify-content: flex-end !important;
        margin-left: 10px !important;
    }
}

/* PC 与 移动端通用元素样式 */
.woocommerce-cart table.cart td.product-thumbnail img {
    width: 64px !important;
    height: 64px !important;
    border-radius: 8px !important;
    border: 1px solid #f1f5f9 !important;
    object-fit: cover !important;
    display: block !important;
}

.woocommerce-cart table.cart td.product-name a {
    color: #1e293b !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    line-height: 1.4 !important;
}

.woocommerce-cart table.cart td.product-name a:hover {
    color: #0f172a !important;
}

.woocommerce-cart table.cart td.product-quantity .quantity {
    display: flex !important;
    align-items: center !important;
}

.woocommerce-cart table.cart td.product-quantity .quantity input.qty {
    width: 48px !important;
    height: 36px !important;
    line-height: 36px !important;
    text-align: center !important;
    padding: 0 !important;
    border-radius: 6px !important;
    border: 1px solid #e2e8f0 !important;
    background: #ffffff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    box-shadow: none !important;
}

.woocommerce-cart table.cart td.product-remove a.remove {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 26px !important;
    height: 26px !important;
    line-height: 1 !important;
    color: #94a3b8 !important;
    background-color: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 50% !important;
    font-size: 16px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.woocommerce-cart table.cart td.product-remove a.remove:hover {
    background-color: #fee2e2 !important;
    color: #ef4444 !important;
    border-color: #fecaca !important;
}

.woocommerce-cart table.cart tbody tr.cart_item:hover {
    border-color: #cbd5e1 !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08) !important;
    transform: translateY(-2px) !important;
}

/* --- 优惠券与更新操作区 --- */
.woocommerce-cart table.cart td.actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 15px 0 25px 0 !important;
    gap: 12px !important;
    background: transparent !important;
}

.woocommerce-cart table.cart td.actions .coupon {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.woocommerce-cart table.cart td.actions .coupon .input-text {
    width: 180px !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 14px !important;
    font-size: 13.5px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce-cart table.cart td.actions > .button {
    display: inline-flex !important;
    width: auto !important;
    min-height: 42px !important;
    height: 42px !important;
    padding: 0 18px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
    border: 1px solid #e2e8f0 !important;
    margin: 0 !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
}

.woocommerce-cart table.cart td.actions .coupon .button:hover,
.woocommerce-cart table.cart td.actions > .button:hover {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.06) !important;
    transform: translateY(-1px) !important;
}

/* --- 右侧/底部结算看板 (Cart totals)：精准右对齐与间距规范 --- */
.woocommerce-cart .cart-collaterals,
.woocommerce-cart .cart_totals {
    margin-bottom: 20px !important; /* 底部保留 20px 间距，不粘底 */
}

.woocommerce-cart .cart_totals {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 24px !important;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
}

.woocommerce-cart .cart_totals h2 {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    margin: 0 0 16px 0 !important;
    letter-spacing: -0.01em !important;
}

.woocommerce-cart .cart_totals table.shop_table {
    width: 100% !important;
    margin-bottom: 20px !important;
}

/* 结算单各行：顶部对齐 */
.woocommerce-cart .cart_totals table.shop_table tr {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important; /* 关键：顶部对齐，防止Shipment标题下沉 */
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 12px 0 !important;
}

/* 左侧标题列 (Subtotal, Shipment, Tax, Total) */
.woocommerce-cart .cart_totals table.shop_table tr th {
    display: block !important;
    flex: 0 0 90px !important;
    color: #64748b !important;
    font-weight: 600 !important;
    text-align: left !important;
    padding: 0 !important;
    border: none !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* 右侧内容列：统一右对齐 */
.woocommerce-cart .cart_totals table.shop_table tr td {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important; /* 关键：内部所有内容强制靠右 */
    text-align: right !important;
    flex: 1 1 auto !important;
    padding: 0 !important;
    border: none !important;
    color: #1e293b !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
}

/* 彻底修复“统一费率”未右对齐 */
.woocommerce-cart .cart_totals ul#shipping_method {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

.woocommerce-cart .cart_totals ul#shipping_method li {
    display: flex !important;
    justify-content: flex-end !important; /* 费率行靠最右 */
    align-items: center !important;
    margin-bottom: 4px !important;
    padding: 0 !important;
}

.woocommerce-cart .cart_totals ul#shipping_method li label {
    display: inline-block !important;
    text-align: right !important;
    margin: 0 !important;
}

/* 地址描述文本与修改链接靠右 */
.woocommerce-cart .cart_totals .woocommerce-shipping-destination {
    margin: 6px 0 !important;
    text-align: right !important;
    color: #334155 !important;
    font-size: 13.5px !important;
    line-height: 1.4 !important;
}

.woocommerce-cart .cart_totals .shipping-calculator-button {
    text-align: right !important;
    display: inline-block !important;
    font-size: 13px !important;
    color: #2563eb !important;
    text-decoration: underline !important;
    margin-top: 4px !important;
}

/* 屏蔽移动端结算单内重复生成的伪元素标题 */
.woocommerce-cart .cart_totals table.shop_table_responsive tr td::before {
    display: none !important;
}

/* 总金额样式 */
.woocommerce-cart .cart_totals tr.order-total th,
.woocommerce-cart .cart_totals tr.order-total td {
    border-bottom: none !important;
    padding-top: 14px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.woocommerce-cart .cart_totals tr.order-total .amount {
    font-size: 18px !important;
    color: #e63946 !important;
}

/* 前往结账大按钮 */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;
    background-color: #1e293b !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin-top: 12px !important;
    transition: all 0.2s ease !important;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background-color: #0f172a !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}


/* ==========================================================
   移动端专用布局 (< 768px)：严格 3列 x 2行 网格
   ========================================================== */
@media screen and (max-width: 768px) {
    .woocommerce-cart #inner-wrap,
    .woocommerce-cart .content-container,
    .woocommerce-cart .cart_totals {
        margin-bottom: 20px !important;
    }

    /* 移动端卡片：
       第一行：图(64px) | 标题(自适应) | 叉号(自适应靠右)
       第二行：数量(靠左) | 单价(居中) | 小计(靠右) */
    .woocommerce-cart table.cart tbody tr.cart_item {
        display: grid !important;
        grid-template-columns: 64px 1fr auto !important; 
        grid-template-areas: 
            "thumb title remove"
            "qty price total" !important;
        align-items: center !important; 
        gap: 16px 12px !important;      
        padding: 16px !important;
        background: #ffffff !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 12px !important;
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
        margin-bottom: 16px !important;
    }

    .woocommerce-cart table.cart tbody tr.cart_item td {
        display: flex !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
        line-height: 1.4 !important;
    }

    /* 第一行：左 - 缩略图 */
    .woocommerce-cart table.cart td.product-thumbnail {
        grid-area: thumb !important;
    }

    /* 第一行：中 - 商品名称 */
    .woocommerce-cart table.cart td.product-name {
        grid-area: title !important;
        justify-content: flex-start !important;
        text-align: left !important;
        width: 100% !important;
    }

    /* 第一行：右 - 删除按钮 */
    .woocommerce-cart table.cart td.product-remove {
        grid-area: remove !important;
        justify-content: flex-end !important;
    }

    /* 第二行：左 - 数量输入 */
    .woocommerce-cart table.cart td.product-quantity {
        grid-area: qty !important;
        justify-content: flex-start !important;
    }
    
    .woocommerce-cart table.cart td.product-quantity .quantity input.qty {
        width: 50px !important; 
        height: 34px !important;
        line-height: 34px !important;
        padding: 0 !important;
    }

    /* 第二行：中 - 单价居中显示 */
    .woocommerce-cart table.cart td.product-price {
        grid-area: price !important;
        display: flex !important;
        justify-content: center !important;
        color: #64748b !important;
        font-size: 14px !important;
        padding: 0 !important;
    }

    /* 第二行：右 - 总价小计 */
    .woocommerce-cart table.cart td.product-subtotal {
        grid-area: total !important;
        justify-content: flex-end !important; 
        text-align: right !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        color: #1e293b !important;
    }

    /* 优惠券与更新操作区移动端全宽 */
    .woocommerce-cart table.cart td.actions .coupon {
        width: 100% !important;
        display: flex !important;
        gap: 8px !important;
    }
    .woocommerce-cart table.cart td.actions .coupon .input-text {
        flex: 1 1 auto !important;
        width: 0 !important;
    }
    .woocommerce-cart table.cart td.actions .coupon .button {
        flex: 0 0 auto !important;
    }
    .woocommerce-cart table.cart td.actions > .button {
        width: 100% !important;
    }
}

/* ==========================================================
   9. 结账页面：Your Order 订单审查区卡片化重构 (CHECKOUT REDESIGN)
   ========================================================== */

/* 1. 标题美化 */
h3#order_review_heading {
    font-size: 16px !important; /* 原18px，微调收敛 */
    font-weight: 700 !important;
    color: #1e293b !important;
    margin: 30px 0 14px 0 !important;
    border: none !important;
}

/* 2. 整个 Review 区块转为白底浮动卡片，并对底部增加 20px 间距 */
.woocommerce-checkout #order_review {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 20px 18px !important; /* 适度收窄内边距，释放横向空间 */
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04) !important;
    margin-bottom: 20px !important; /* 底部保留 20px 间距 */
    box-sizing: border-box !important;
}

/* 彻底清除旧表格线条与背景 */
.woocommerce-checkout .woocommerce-checkout-review-order-table,
.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table td {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* 3. 表格行全部 Flex 化，左右两端精准对齐 */
.woocommerce-checkout .woocommerce-checkout-review-order-table tr {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 10px 0 !important; /* 减小行上下间距，更紧凑 */
}

/* 表头文字小巧淡雅 */
.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
    color: #94a3b8 !important;
    font-size: 11.5px !important; /* 原13px */
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-bottom: 2px solid #f1f5f9 !important;
    padding-bottom: 8px !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table td {
    display: block !important;
    width: auto !important;
    text-align: left !important;
    line-height: 1.4 !important;
}

/* 左侧列 (费用项目名称) */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th {
    flex: 1 !important;
    color: #64748b !important;
    font-size: 13px !important; /* 原14px */
    font-weight: 600 !important;
    padding-right: 12px !important;
}

/* 商品名称字体 */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name {
    color: #1e293b !important;
    font-size: 13px !important; /* 原14px+ */
    font-weight: 500 !important;
}

/* 商品数量 (x 2) 淡化字号微缩 */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name strong.product-quantity {
    color: #94a3b8 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* 右侧列 (各项金额) */
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
    text-align: right !important;
    color: #1e293b !important;
    font-size: 13px !important; /* 原14px */
    font-weight: 600 !important;
}

/* 4. 总计行 (Total) */
.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total {
    border-bottom: none !important;
    padding-top: 14px !important;
    padding-bottom: 4px !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total th {
    font-size: 14.5px !important; /* 原16px */
    font-weight: 700 !important;
    color: #1e293b !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table tr.order-total td .amount {
    font-size: 16.5px !important; /* 原18px，更耐看且不撑版面 */
    font-weight: 700 !important;
    color: #e63946 !important;
}

/* 5. 支付方式容器 (Payment) */
.woocommerce-checkout #payment {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    margin-top: 18px !important;
}

/* 支付选项列表：统一圆角外框 */
.woocommerce-checkout #payment ul.payment_methods {
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

/* 单个支付选项行 */
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
    border-bottom: 1px solid #e2e8f0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:last-child {
    border-bottom: none !important;
}

/* 支付选项标题栏 (Cards、PayPal 等) */
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label {
    padding: 12px 14px !important; /* 缩小上下内边距，原16px */
    margin: 0 !important;
    background: #f8fafc !important;
    color: #1e293b !important;
    font-size: 13.5px !important; /* 统一缩小字号，避免设备拥挤 */
    font-weight: 600 !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
}

/* 支付图标尺寸适度微调对齐 */
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label img {
    max-height: 20px !important; /* 防止个别网关图标过大撑开高度 */
}

/* 单选圆圈间距 */
.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method > label::before {
    margin-right: 10px !important;
    margin-left: 0 !important;
    border-color: #cbd5e1 !important;
}

.woocommerce-checkout #payment ul.payment_methods li.wc_payment_method input[type="radio"]:checked + label {
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.02) !important;
}

/* 支付展开内容区 (Payment Box 描述与输入框) */
.woocommerce-checkout #payment div.payment_box {
    background: #ffffff !important;
    border: none !important;
    padding: 0 14px 14px 14px !important;
    margin: 0 !important;
    box-shadow: none !important;
    color: #64748b !important;
    font-size: 12.5px !important; /* 说明文本从14px降到12.5px */
    line-height: 1.45 !important;
}

.woocommerce-checkout #payment div.payment_box::before {
    display: none !important;
}

/* 隐私政策说明字级精简 */
.woocommerce-checkout .woocommerce-privacy-policy-text p {
    font-size: 12px !important;
    line-height: 1.5 !important;
    color: #64748b !important;
    margin-bottom: 8px !important;
}

/* 6. 下单按钮 (高度与字号同步微调) */
.woocommerce-checkout #place_order {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important; /* 原52px，微降更精致 */
    background-color: #1e293b !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important; /* 原16px */
    font-weight: 600 !important;
    margin-top: 18px !important;
    padding: 0 !important;
    transition: all 0.2s ease !important;
}

.woocommerce-checkout #place_order:hover {
    background-color: #0f172a !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08) !important;
}

/* 7. 移动端间距与伪元素清理 */
@media screen and (max-width: 768px) {
    .woocommerce-checkout #order_review,
    .woocommerce-checkout .woocommerce-checkout-review-order {
        margin-bottom: 20px !important;
    }
    
    .woocommerce-checkout .shop_table_responsive tr td::before,
    .woocommerce-checkout .shop_table_responsive tbody th::before {
        display: none !important;
    }
}

.single-product div.product form.cart {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    margin-bottom: 20px !important;
}
form.checkout_coupon {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 16px !important;
}
/* ========================================================
   WooCommerce 訂單完成頁 (Order Received) 精緻字型版 - 完整版
   ======================================================== */

.woocommerce-order-received .woocommerce-order {
    max-width: 820px;
    margin: 0 auto;
}

/* 1. 成功橫幅提示框（字號縮小約20%） */
.woocommerce-order-received .woocommerce-notice--success {
    background: #f0fdf4 !important;
    color: #166534 !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: 13px !important; /* 原 16px */
    font-weight: 600 !important;
    text-align: center !important;
    margin-bottom: 20px !important;
}

/* 2. 頂部訂單概覽卡片：清除預設浮動並命名網格區塊 */
.woocommerce-order-received ul.order_details {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 20px 18px !important;
    list-style: none !important;
    margin: 0 0 24px 0 !important;
    box-sizing: border-box !important;
}

/* 徹底清除 Kadence 預設的 float 與間距污染 */
.woocommerce-order-received ul.order_details li {
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    font-size: 11px !important; /* 原 13px */
    color: #64748b !important;
    text-transform: none !important;
}

.woocommerce-order-received ul.order_details li strong {
    display: block !important;
    font-size: 12.5px !important; /* 原 15px */
    font-weight: 700 !important;
    color: #0f172a !important;
    margin-top: 3px !important;
    word-break: break-word !important;
    white-space: normal !important;
}

/* 命名各個項目的網格代號 */
.woocommerce-order-received ul.order_details li.order  { grid-area: ord !important; }
.woocommerce-order-received ul.order_details li.date   { grid-area: dat !important; }
.woocommerce-order-received ul.order_details li.email  { grid-area: eml !important; }
.woocommerce-order-received ul.order_details li.total  { grid-area: tot !important; }
.woocommerce-order-received ul.order_details li.method { grid-area: pay !important; }

/* 支付方式頂部額外增加 10px 邊距，並靠右對齊 */
.woocommerce-order-received ul.order_details li.method {
    margin-top: 10px !important;
    text-align: right !important;
}

/* --- 電腦版 (769px 以上)：前4項等分在第1行，支付方式在第2行右下角 --- */
@media (min-width: 769px) {
    .woocommerce-order-received ul.order_details {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important;
        grid-template-areas: 
            "ord dat eml tot"
            ".   .   .   pay" !important;
        gap: 12px 18px !important;
    }
}

/* --- 手機端 (768px 以下)：標準 2x2 網格，支付方式固定在第3行右下角 --- */
@media (max-width: 768px) {
    .woocommerce-order-received ul.order_details {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-areas: 
            "ord dat"
            "eml tot"
            ".   pay" !important;
        gap: 12px 12px !important;
    }

    /* 手機端購物地址卡片上下垂直排列 */
    .woocommerce-order-received .woocommerce-columns--addresses {
        flex-direction: column !important;
    }
}

/* 3. 訂單詳情與商品表格卡片化（整體字號收緊約20%） */
.woocommerce-order-received .woocommerce-order-details,
.woocommerce-order-received .woocommerce-customer-details {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px 18px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03);
    box-sizing: border-box;
}

.woocommerce-order-received h2.woocommerce-order-details__title,
.woocommerce-order-received h2.woocommerce-column__title {
    font-size: 14px !important; /* 原 17px */
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 12px 0 !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

.woocommerce-order-received table.order_details {
    margin-bottom: 0 !important;
    border-collapse: collapse !important;
    width: 100% !important;
}

.woocommerce-order-received table.order_details th,
.woocommerce-order-received table.order_details td {
    padding: 10px 0 !important;
    border-color: #f1f5f9 !important;
    font-size: 12px !important; /* 原 14px */
}

/* 控制產品名稱寬度，避免侵入右側金額 */
.woocommerce-order-received table.order_details th.product-name,
.woocommerce-order-received table.order_details td.product-name {
    width: 68% !important;
    max-width: 68% !important;
    padding-right: 14px !important;
    text-align: left !important;
    box-sizing: border-box !important;
    line-height: 1.45 !important;
}

.woocommerce-order-received table.order_details th.product-total,
.woocommerce-order-received table.order_details td.product-total {
    width: 32% !important;
    text-align: right !important;
    white-space: nowrap !important;
}

.woocommerce-order-received table.order_details tfoot th {
    font-weight: 600 !important;
    color: #475569 !important;
    text-align: left !important;
}

.woocommerce-order-received table.order_details tfoot td {
    text-align: right !important;
}

.woocommerce-order-received table.order_details tfoot tr:last-child th,
.woocommerce-order-received table.order_details tfoot tr:last-child td {
    font-size: 13.5px !important; /* 原 16px */
    font-weight: 700 !important;
    color: #0f172a !important;
}

/* 4. 帳單與配送地址排版 */
.woocommerce-order-received .woocommerce-columns--addresses {
    display: flex !important;
    gap: 16px !important;
}

.woocommerce-order-received .woocommerce-column {
    flex: 1 1 0% !important;
    float: none !important;
    width: 100% !important;
    margin-bottom: 0 !important;
}

.woocommerce-order-received address {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    font-style: normal !important;
    font-size: 11.5px !important; /* 原 13.5px */
    line-height: 1.55 !important;
    color: #475569 !important;
}

/* 标题与编辑链接左对齐 */
.woocommerce-account .addresses .title {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
    margin-bottom: 12px !important;
}