/*
 * Styles for Project Features System (PFS) v1.1 - WYSIWYG Edition
 */

/* === Admin Meta Box Styles === */
#pfs-features-wrapper {
    padding: 10px;
}

.pfs-feature-row {
    display: flex;
    flex-wrap: wrap; /* برای نمایش بهتر در صفحات کوچک */
    gap: 15px;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    margin-bottom: 10px;
    background-color: #f9f9f9;
    align-items: flex-start; /* آیتم‌ها را از بالا تراز می‌کند */
}

.pfs-feature-row.empty-row {
    justify-content: center;
    color: #777;
    padding: 20px;
    border-style: dashed;
}

.pfs-input-group {
    display: flex;
    flex-direction: column;
}

.pfs-input-group label {
    font-weight: 600;
    font-size: 13px;
    margin-bottom: 5px;
    color: #222;
}

/* گروه عنوان */
.pfs-key-group {
    flex: 1 1 200px; /* انعطاف پذیری برای عرض */
}
.pfs-key-group input[type="text"] {
    width: 100%;
    padding: 8px;
}

/* گروه مقدار (ویرایشگر) */
.pfs-value-group {
    flex: 2 1 400px; /* فضای بیشتری به ویرایشگر اختصاص می‌دهد */
}
.pfs-value-group .wp-editor-wrap {
    width: 100%;
}

/* دکمه حذف */
.pfs-remove-feature {
    background-color: #f8d7da !important;
    border-color: #f5c6cb !important;
    color: #721c24 !important;
    align-self: center; /* دکمه حذف را در مرکز عمودی قرار می‌دهد */
    margin-top: 15px;
}

.pfs-remove-feature:hover {
    background-color: #f1b0b7 !important;
    border-color: #eea2aa !important;
}

#pfs-add-feature {
    margin-top: 10px;
}


/*
 * PFS Front-end Table Style - V2.1 (Polished & Fully Interactive)
 * این استایل فقط برای جدول در سایت است.
 */

/* === کانتینر اصلی جدول === */

selector{
            font-family: "IRANSansXFaNum", sans-serif !important;
}
.pfs-features-table-wrapper {
    margin: 0;
    width: 100%;
    border-radius: 0px;

    overflow: hidden;
    border: 1px solid #e2e8f0;
        
    /* کلید اصلی: فعال کردن اسکرول افقی */
    overflow-x: auto; 
    
    /* اسکرول نرم و روان در دستگاه‌های لمسی */
    -webkit-overflow-scrolling: touch;
}

/* === استایل اصلی جدول === */
.pfs-features-table {
    width: 100%;
    border-collapse: collapse;
font-family: "IRANSansXFaNum", sans-serif !important;
    font-size: 16px;
    text-align: right;
    background-color: #ffffff;
}
table {
    margin-bottom: 0 !important
}

/* === استایل سلول‌های هدر و محتوا (مشترک) === */
.pfs-features-table th,
.pfs-features-table td {
    padding: 10px 16px;
    vertical-align: center !important;
    border-bottom: 1px solid #e2e8f0; /* خط جداکننده بین همه ردیف‌ها */
    /* انیمیشن نرم برای تغییر رنگ */
    transition: background-color 0.2s ease-in-out;
}

/* === استایل اختصاصی هدر (ستون عنوان‌ها) === */
.pfs-features-table th {
    background-color: #f8fafc;
  font-family: "IRANSansXFaNum", sans-serif !important;
    color: #0f172a;
    font-weight: 600;
    width: 35%;
}

/* === استایل اختصاصی سلول‌های محتوا (مقادیر) === */
.pfs-features-table td {
    color: #475569;
}

/* === استایل ردیف‌های زوج (Zebra Striping) === */
.pfs-features-table tbody tr:nth-child(even) th {
    background-color: #fcfdfe; /* رنگ خیلی ملایم برای هدر ردیف زوج */
}
.pfs-features-table tbody tr:nth-child(even) td {
    background-color: #fcfdfe; /* رنگ خیلی ملایم برای محتوای ردیف زوج */
}

.pfs-features-table tbody tr:last-child th,
.pfs-features-table tbody tr:last-child td {
    border-bottom: none;
    margin-bottom: 0 !important;
} 
/* با کامنت کردن یا حذف کد بالا، خط در ردیف آخر باقی می‌ماند. */


/* === جادوی اصلی: افکت‌های هاور تعاملی (نسخه اصلاح شده) === */

/* 1. وقتی ماوس روی کل ردیف می‌رود، هم `th` و هم `td` هایلایت می‌شوند */
.pfs-features-table tbody tr:hover th,
.pfs-features-table tbody tr:hover td {
    background-color: #eff6ff; /* هایلایت کل ردیف با رنگ آبی بسیار ملایم */
}

/* 2. وقتی ماوس روی یک سلول خاص در ردیف هاور شده می‌رود */
.pfs-features-table tbody tr:hover th:hover,
.pfs-features-table tbody tr:hover td:hover {
    background-color: #dbeafe; /* هایلایت سلول خاص با رنگ کمی تیره‌تر */
    cursor: cell;
}


/* === استایل واکنش‌گرا برای موبایل (بدون تغییر) === */
@media (max-width:400x) {
   
}