/* --- 1. متغیرهای رنگی (پالت مدرن و مینیمال) --- */
:root {
    --kd-bg-body: #f8f9fa;       /* پس زمینه کلی */
    --kd-bg-white: #ffffff;      /* سفید خالص */
    --kd-primary: #3d7bf8;       /* آبی مدرن (مشابه دکمه مشاهده در تصویر) */
    --kd-primary-soft: #ecf3ff;  /* آبی خیلی کمرنگ برای پس‌زمینه */
    --kd-text-dark: #1e293b;     /* مشکی متمایل به سرمه‌ای (خوانایی بالا) */
    --kd-text-grey: #64748b;     /* خاکستری متعادل */
    --kd-border: #f1f5f9;        /* خطوط خیلی محو */
    --kd-shadow: 0 4px 20px -5px rgba(0,0,0,0.05); /* سایه نرم و مدرن */
    --kd-radius: 16px;           /* گردی گوشه‌ها */
    --kd-success: #10b981;       /* سبز موفق */
    --kd-success-bg: #d1fae5;
    --kd-warning: #f59e0b;       /* نارنجی هشدار */
    --kd-warning-bg: #fef3c7;
    --kd-danger: #ef4444;        /* قرمز خطا */
    --kd-danger-bg: #fee2e2;
}

/* ریست کلی برای پنل */
.woocommerce-account .woocommerce-MyAccount-content {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    font-family: inherit;
}

/* --- 2. کارت‌های اصلی (داشبورد) --- */
.kd-wrapper { direction: rtl; max-width: 100%; margin: 0 auto; }

.kd-card {
    background: var(--kd-bg-white);
    border: 1px solid var(--kd-border);
    border-radius: var(--kd-radius);
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: var(--kd-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* افکت هاور نرم برای زنده شدن پنل */
.kd-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.08);
}

/* --- 3. پروفایل کاربری (طراحی تمیز) --- */
.kd-profile-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.kd-avatar-row { display: flex; align-items: center; gap: 15px; }
.kd-avatar-row img {
    width: 65px; height: 65px; border-radius: 50%;
    border: 3px solid var(--kd-bg-body);
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.kd-user-details h3 { font-size: 1.1rem; font-weight: 800; color: var(--kd-text-dark); margin: 0 0 5px 0; }
.kd-user-details .kd-phone { font-size: 0.85rem; color: var(--kd-text-grey); background: var(--kd-bg-body); padding: 2px 8px; border-radius: 6px; }

/* دکمه ویرایش کوچک */
.kd-edit-mini {
    width: 35px; height: 35px; border-radius: 10px;
    background: var(--kd-bg-body); color: var(--kd-text-grey);
    display: flex; align-items: center; justify-content: center;
    transition: all 0.2s;
}
.kd-edit-mini:hover { background: var(--kd-primary); color: #fff; }

/* --- 4. کیف پول (استایل Inline مدرن) --- */
.kd-wallet-inline {
    background: linear-gradient(135deg, #fff8e1 0%, #fff 100%);
    border: 1px solid #fff3cd;
    border-radius: 14px; padding: 15px;
    display: flex; justify-content: space-between; align-items: center;
}
.kd-balance-num { font-size: 1.2rem; font-weight: 900; color: var(--kd-text-dark); }
.kd-add-btn-small {
    background: var(--kd-text-dark); color: #fff !important;
    padding: 8px 16px; border-radius: 8px; font-size: 0.8rem;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

/* --- 5. گرید آمار (Stats Grid) --- */
.kd-stats-grid {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; margin-bottom: 30px;
}
.kd-stat-item {
    background: var(--kd-bg-white);
    border-radius: 16px; padding: 15px 5px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-decoration: none !important;
    box-shadow: var(--kd-shadow);
    transition: all 0.2s; border: 1px solid transparent;
}
.kd-stat-item:hover { transform: translateY(-3px); border-color: var(--kd-primary); }

.kd-stat-icon {
    width: 45px; height: 45px; border-radius: 14px; margin-bottom: 10px;
    display: flex; align-items: center; justify-content: center; font-size: 1.2rem;
    position: relative;
}
.kd-stat-item span { font-size: 0.8rem; color: var(--kd-text-grey); font-weight: 600; }

/* رنگ‌های آیکون‌ها */
.processing { background: var(--kd-primary-soft); color: var(--kd-primary); }
.on-hold { background: var(--kd-warning-bg); color: var(--kd-warning); }
.completed { background: var(--kd-success-bg); color: var(--kd-success); }
.returned { background: var(--kd-danger-bg); color: var(--kd-danger); }

/* --- 6. لیست منو (مشابه اپلیکیشن) --- */
.kd-menu-list ul { padding: 0; margin: 0; list-style: none; }
.kd-menu-list li a {
    display: flex; align-items: center; padding: 18px 0;
    border-bottom: 1px solid var(--kd-border);
    color: var(--kd-text-dark); font-weight: 500; transition: padding 0.2s;
}
.kd-menu-list li:last-child a { border-bottom: none; }
.kd-menu-list li a:hover { padding-right: 10px; color: var(--kd-primary); }

.kd-list-icon {
    width: 36px; height: 36px; background: var(--kd-bg-body);
    border-radius: 10px; display: flex; align-items: center; justify-content: center;
    margin-left: 15px; color: var(--kd-text-grey);
}
.kd-menu-list li a:hover .kd-list-icon { background: var(--kd-primary); color: #fff; }

/* --- 7. جدول سفارشات (مهم: تبدیل به استایل تصویر شما) --- */
/* حذف استایل‌های پیش‌فرض زشت */
table.shop_table, table.my_account_orders {
    border: none !important;
    border-collapse: separate !important;
    border-spacing: 0 10px !important; /* فاصله بین ردیف‌ها */
    width: 100%;
}
table.shop_table thead th {
    font-size: 0.85rem; color: var(--kd-text-grey); font-weight: normal;
    padding: 10px; border: none; background: transparent;
}
/* تبدیل هر ردیف به یک کارت سفید تمیز */
table.shop_table tbody tr {
    background: var(--kd-bg-white);
    box-shadow: var(--kd-shadow);
    border-radius: 12px;
}
table.shop_table tbody td {
    border: none !important;
    padding: 18px 15px !important;
    vertical-align: middle;
    font-size: 0.9rem; color: var(--kd-text-dark);
}
/* گوشه‌های گرد برای اولین و آخرین سلول هر ردیف */
table.shop_table tbody td:first-child { border-top-right-radius: 12px; border-bottom-right-radius: 12px; }
table.shop_table tbody td:last-child { border-top-left-radius: 12px; border-bottom-left-radius: 12px; }

/* استایل دکمه "مشاهده" (دقیقاً مثل تصویر) */
table.shop_table .woocommerce-button, 
.woocommerce-button.view {
    background: var(--kd-primary) !important;
    color: #fff !important;
    padding: 8px 18px !important;
    border-radius: 8px !important;
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    box-shadow: 0 4px 10px rgba(61, 123, 248, 0.3) !important;
    border: none !important;
}
table.shop_table .woocommerce-button:hover {
    background: #2563eb !important; transform: translateY(-2px);
}

/* استایل وضعیت‌ها (Badge) مثل تصویر */
.order-status {
    padding: 6px 12px; border-radius: 8px; font-size: 0.8rem; font-weight: 700; display: inline-block;
}
/* وضعیت‌های مختلف */
.order-status.status-completed { background: var(--kd-success-bg); color: var(--kd-success); }
.order-status.status-processing { background: var(--kd-primary-soft); color: var(--kd-primary); }
.order-status.status-on-hold { background: var(--kd-warning-bg); color: var(--kd-warning); }
.order-status.status-cancelled, .order-status.status-failed { background: var(--kd-danger-bg); color: var(--kd-danger); }

/* --- 8. هدر داخلی صفحات --- */
.kmc-header-bar {
    background: var(--kd-bg-white); border-radius: var(--kd-radius);
    padding: 15px 20px; margin-bottom: 25px;
    box-shadow: var(--kd-shadow); border: 1px solid var(--kd-border);
}
.kmc-back-btn {
    border: none; background: var(--kd-bg-body);
}

/* --- 9. مخفی‌سازی‌ها و تمیزکاری نهایی --- */
.woocommerce-pagination { margin-top: 20px; text-align: center; }
.woocommerce-pagination .page-numbers { border: none; }
.woocommerce-pagination .page-numbers li span.current {
    background: var(--kd-primary); color: #fff; border-radius: 8px;
}
