/* ══════════════════════════════════════════════════════
   Iranian Marketplace – Frontend Styles
   ══════════════════════════════════════════════════════ */

/* ── متغیرها ──────────────────────────────────────── */
:root {
    --irmp-primary:   #e2411e;
    --irmp-primary-d: #c43518;
    --irmp-success:   #4caf50;
    --irmp-warning:   #ff9800;
    --irmp-danger:    #e53935;
    --irmp-text:      #333;
    --irmp-muted:     #777;
    --irmp-border:    #ddd;
    --irmp-bg:        #f8f9fa;
    --irmp-radius:    8px;
}

/* ── داشبورد ──────────────────────────────────────── */
.irmp-dashboard {
    background: #fff;
    padding: 24px;
    border-radius: var(--irmp-radius);
    box-shadow: 0 1px 3px rgba(0,0,0,.06);
    direction: rtl;
    font-family: inherit;
    text-align: right;
}

.irmp-dashboard-header {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--irmp-border);
    text-align: right;
}
.irmp-dashboard-header h2 { margin: 0 0 4px; font-size: 1.3rem; color: var(--irmp-text); text-align: right; }
.irmp-dashboard-header p  { margin: 0; color: var(--irmp-muted); font-size: .9rem; text-align: right; }

/* ── تب‌ها ──────────────────────────────────────────── */
.irmp-tabs { display: flex; gap: 4px; margin-bottom: 20px; border-bottom: 2px solid var(--irmp-border); flex-wrap: wrap; }
.irmp-tab  { padding: 8px 18px; text-decoration: none; color: var(--irmp-text); border-radius: 6px 6px 0 0; font-size: .9rem; transition: background .2s; }
.irmp-tab:hover  { background: var(--irmp-bg); }
.irmp-tab.active { color: #fff; background: var(--irmp-primary); pointer-events: none; }

/* ── محتوای تب ─────────────────────────────────────── */
.irmp-tab-content h3,
.irmp-tab-content h4 {
    text-align: right;
    color: var(--irmp-text);
}
.irmp-tab-content h3 { font-size: 1.1rem; margin: 0 0 16px; }
.irmp-tab-content h4 { font-size: 1rem;   margin: 0 0 10px; }

/* ── جدول ──────────────────────────────────────────── */
.irmp-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.irmp-table th, .irmp-table td { padding: 10px 12px; border: 1px solid var(--irmp-border); text-align: right; vertical-align: middle; }
.irmp-table thead th { background: var(--irmp-bg); font-weight: 600; }
.irmp-table tbody tr:hover { background: #fafafa; }

/* ── برچسب وضعیت ────────────────────────────────── */
.irmp-status { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: .82rem; font-weight: 600; }
.irmp-status-pending  { background: #fff3e0; color: #e65100; }
.irmp-status-approved { background: #e8f5e9; color: #2e7d32; }
.irmp-status-rejected { background: #ffebee; color: #b71c1c; }

/* ── فرم محصول ─────────────────────────────────────── */
.irmp-product-form .form-row { margin-bottom: 14px; }
.irmp-product-form label { display: block; margin-bottom: 4px; font-weight: 500; font-size: .9rem; text-align: right; }
.irmp-product-form input[type=text],
.irmp-product-form input[type=file],
.irmp-product-form textarea,
.irmp-product-form select { width: 100%; padding: 8px 10px; border: 1px solid var(--irmp-border); border-radius: 6px; font-size: .9rem; box-sizing: border-box; direction: rtl; }
.irmp-product-form input[type=text]:focus,
.irmp-product-form textarea:focus { border-color: var(--irmp-primary); outline: none; box-shadow: 0 0 0 2px rgba(226,65,30,.15); }
.form-row-half { display: inline-block; width: calc(50% - 8px); vertical-align: top; }
.form-row-half + .form-row-half { margin-right: 12px; }
.irmp-multiselect { min-height: 120px; }

/* ── بخش ویژگی‌ها ──────────────────────────────────── */
.irmp-attributes-section { margin: 20px 0; padding: 16px; background: var(--irmp-bg); border-radius: var(--irmp-radius); border: 1px solid var(--irmp-border); }
.irmp-attributes-section h4 { margin: 0 0 6px; font-size: 1rem; color: var(--irmp-text); text-align: right; }
.irmp-attributes-section .description { margin: 0 0 12px; color: var(--irmp-muted); font-size: .85rem; text-align: right; }
.irmp-attr-table { width: 100%; border-collapse: collapse; }
.irmp-attr-table th, .irmp-attr-table td { padding: 7px 10px; border: 1px solid var(--irmp-border); text-align: right; }
.irmp-attr-table thead th { background: #eee; font-size: .85rem; }
.irmp-attr-table .irmp-attr-name  { width: 40%; }
.irmp-attr-table .irmp-attr-value { width: 55%; }
.irmp-attr-table input[type=text] { border: none; width: 100%; padding: 4px 6px; background: transparent; font-size: .88rem; }
.irmp-attr-table input[type=text]:focus { outline: none; }

/* نام ویژگی‌های پیش‌فرض – کم‌رنگ‌تر از متن عادی */
.irmp-attr-predefined .irmp-attr-name {
    cursor: not-allowed;
    color: #aaa;
    font-style: italic;
    opacity: 0.65;
    font-weight: normal;
    background: #f5f5f5;
}

/* نام ویژگی‌های سفارشی – عادی */
.irmp-attr-name-custom {
    background: transparent !important;
    color: var(--irmp-text) !important;
    opacity: 1 !important;
    font-style: normal !important;
}

/* دکمه حذف ردیف ویژگی */
.irmp-remove-attr-row {
    background: none; border: none; cursor: pointer;
    color: var(--irmp-muted); padding: 2px 6px; font-size: 1rem;
    border-radius: 4px; transition: color .2s, background .2s;
    line-height: 1;
}
.irmp-remove-attr-row:hover {
    color: #fff;
    background: var(--irmp-danger);
}
#irmp-add-attr { font-size: .85rem; padding: 4px 12px; }

/* ── دکمه‌ها ────────────────────────────────────────── */
.irmp-submit-btn, .button.alt.irmp-submit-btn {
    background: var(--irmp-primary); color: #fff; border: none; padding: 10px 24px;
    border-radius: var(--irmp-radius); cursor: pointer; font-size: .95rem; transition: background .2s;
}
.irmp-submit-btn:hover { background: var(--irmp-primary-d); }
.irmp-btn-delete, .irmp-btn-danger { background: #fff0f0 !important; color: var(--irmp-danger) !important; border-color: #ffcdd2 !important; }
.irmp-btn-delete:hover, .irmp-btn-danger:hover { background: var(--irmp-danger) !important; color: #fff !important; }

/* ── نوتیس ─────────────────────────────────────────── */
.irmp-notice { background: var(--irmp-bg); border-right: 4px solid var(--irmp-primary); padding: 14px 18px; border-radius: var(--irmp-radius); margin: 12px 0; text-align: right; direction: rtl; }
.irmp-notice-warning { border-right-color: var(--irmp-warning); }
.irmp-admin-note { color: var(--irmp-danger); font-style: italic; }
.irmp-text-muted { color: var(--irmp-muted); }

/* ── پروفایل ──────────────────────────────────────── */
.irmp-profile-table th { width: 180px; font-weight: 500; background: var(--irmp-bg); text-align: right; }
.irmp-profile-table td { text-align: right; }
.irmp-profile-form label { text-align: right; display: block; }

/* ══════════════════════════════════════════════════════
   اطلاعات فروشنده در صفحه تکی محصول
   [irmp_product_vendor]
   ══════════════════════════════════════════════════════ */
.irmp-product-vendor-box {
    background: #fafafa;
    border: 1px solid var(--irmp-border);
    border-right: 4px solid var(--irmp-primary);
    border-radius: var(--irmp-radius);
    padding: 14px 16px;
    margin: 12px 0;
    direction: rtl;
    font-size: .9rem;
}
.irmp-vendor-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-start;
}
.irmp-vendor-primary {
    flex: 1;
    min-width: 180px;
}
.irmp-vendor-secondary {
    flex: 1;
    min-width: 180px;
    border-right: 1px solid var(--irmp-border);
    padding-right: 12px;
}
.irmp-vendor-info-line {
    margin-bottom: 6px;
    line-height: 1.6;
}
.irmp-vendor-info-line:last-child { margin-bottom: 0; }
.irmp-label {
    font-weight: 600;
    color: var(--irmp-text);
    margin-left: 4px;
}
.irmp-store-link {
    color: var(--irmp-primary);
    text-decoration: none;
    font-weight: 500;
}
.irmp-store-link:hover { text-decoration: underline; }
.irmp-other-stores { font-size: .88rem; color: var(--irmp-text); }
.irmp-other-store-link {
    color: var(--irmp-primary);
    text-decoration: none;
}
.irmp-other-store-link:hover { text-decoration: underline; }

/* ── توضیحات محصول (shortcode) ──────────────────────── */
.irmp-product-description,
.irmp-product-short-description {
    direction: rtl;
    text-align: right;
    font-size: .95rem;
    line-height: 1.7;
    color: var(--irmp-text);
    margin: 12px 0;
}

/* ══════════════════════════════════════════════════════
   صفحه ثبت‌نام چند مرحله‌ای فروشنده
   ══════════════════════════════════════════════════════ */

.irmp-vendor-register {
    max-width: 700px;
    margin: 0 auto;
    direction: rtl;
    font-family: inherit;
}

/* ── نوار مراحل ────────────────────────────────────── */
.irmp-steps-bar {
    display: flex;
    align-items: center;
    margin-bottom: 32px;
    padding: 20px 0 10px;
}
.irmp-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    flex: 1;
    text-align: center;
}
.irmp-step-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #e0e0e0;
    color: #888;
    font-size: 1rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .3s, color .3s;
}
.irmp-step.active  .irmp-step-circle { background: var(--irmp-primary); color: #fff; box-shadow: 0 2px 8px rgba(226,65,30,.3); }
.irmp-step.done    .irmp-step-circle { background: var(--irmp-success); color: #fff; }
.irmp-step-label { font-size: .8rem; color: var(--irmp-muted); }
.irmp-step.active  .irmp-step-label { color: var(--irmp-primary); font-weight: 600; }
.irmp-step.done    .irmp-step-label { color: var(--irmp-success); }
.irmp-step-connector { flex: 0.5; height: 3px; background: #e0e0e0; margin-bottom: 20px; border-radius: 2px; }
.irmp-step-connector.done { background: var(--irmp-success); }

/* ── مرحله ۱ ────────────────────────────────────────── */
.irmp-step1 .irmp-step-intro {
    background: var(--irmp-bg);
    border-radius: var(--irmp-radius);
    padding: 20px;
    margin-bottom: 20px;
    border-right: 4px solid var(--irmp-primary);
    text-align: right;
}
.irmp-step1 .irmp-step-intro h2 { margin: 0 0 8px; font-size: 1.1rem; text-align: right; }
.irmp-step1 .irmp-step-intro p  { margin: 0 0 6px; color: var(--irmp-text); font-size: .9rem; text-align: right; }
.irmp-otp-note { color: var(--irmp-warning) !important; font-size: .85rem !important; }

/* ── فرم مرحله ۲ ──────────────────────────────────── */
.irmp-register-step h2 { font-size: 1.2rem; margin-bottom: 8px; text-align: right; }
.irmp-register-step > p { color: var(--irmp-muted); margin-bottom: 20px; font-size: .9rem; text-align: right; }

/* پنل‌های چند مرحله‌ای JS */
.irmp-panel { display: none; animation: irmpFadeIn .3s ease; }
.irmp-panel.irmp-panel-active { display: block; }
@keyframes irmpFadeIn { from { opacity:0; transform:translateX(12px); } to { opacity:1; transform:translateX(0); } }
.irmp-panel-content {
    background: #fff;
    border: 1px solid var(--irmp-border);
    border-radius: var(--irmp-radius);
    padding: 24px;
    text-align: right;
}
.irmp-panel-content h3 { margin: 0 0 18px; font-size: 1rem; padding-bottom: 10px; border-bottom: 1px solid var(--irmp-border); text-align: right; }

/* کارت‌های انتخاب نوع فروشنده */
.irmp-vendor-type-cards { display: flex; gap: 16px; margin-bottom: 24px; }
.irmp-type-card {
    flex: 1;
    border: 2px solid var(--irmp-border);
    border-radius: var(--irmp-radius);
    padding: 20px 16px;
    cursor: pointer;
    text-align: center;
    transition: border-color .2s, box-shadow .2s;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    position: relative;
}
.irmp-type-card input[type=radio] { position: absolute; opacity: 0; }
.irmp-type-card:hover, .irmp-type-card.selected {
    border-color: var(--irmp-primary);
    box-shadow: 0 0 0 2px rgba(226,65,30,.2);
}
.irmp-type-card.selected { background: #fff8f6; }
.irmp-card-icon  { font-size: 2rem; }
.irmp-card-title { font-weight: 600; font-size: .95rem; color: var(--irmp-text); }
.irmp-card-desc  { font-size: .8rem; color: var(--irmp-muted); }

/* فیلدهای فرم در مرحله ۲ */
.irmp-vendor-step2-form .form-row { margin-bottom: 16px; }
.irmp-vendor-step2-form label { display: block; margin-bottom: 4px; font-weight: 500; font-size: .9rem; text-align: right; }
.irmp-vendor-step2-form .input-text,
.irmp-vendor-step2-form textarea,
.irmp-vendor-step2-form input[type=file] {
    width: 100%;
    padding: 9px 11px;
    border: 1px solid var(--irmp-border);
    border-radius: 6px;
    font-size: .9rem;
    box-sizing: border-box;
    transition: border-color .2s;
    direction: rtl;
    text-align: right;
}
.irmp-vendor-step2-form .input-text:focus,
.irmp-vendor-step2-form textarea:focus { border-color: var(--irmp-primary); outline: none; box-shadow: 0 0 0 2px rgba(226,65,30,.12); }
.irmp-vendor-step2-form .description { font-size: .8rem; color: var(--irmp-muted); margin-top: 4px; display: block; text-align: right; }

/* ناوبری بین پنل‌ها */
.irmp-panel-nav { margin-top: 20px; display: flex; gap: 10px; align-items: center; }
.irmp-prev-panel { margin-right: auto; }

/* نوار زیر مراحل (sub-steps) */
.irmp-substeps {
    text-align: center;
    margin-top: 12px;
    font-size: .8rem;
    color: var(--irmp-muted);
}
.irmp-substep { cursor: pointer; padding: 2px 6px; border-radius: 4px; transition: color .2s; }
.irmp-substep.active { color: var(--irmp-primary); font-weight: 600; }
.irmp-substep-sep { margin: 0 4px; color: #ccc; }

/* ══════════════════════════════════════════════════════
   صفحه ورود اختصاصی فروشندگان [irmp_vendor_login]
   ══════════════════════════════════════════════════════ */
.irmp-vendor-login-footer {
    text-align: center;
    margin-top: 20px;
    font-size: .9rem;
    color: var(--irmp-muted);
    direction: rtl;
}
.irmp-vendor-login-footer a {
    color: var(--irmp-primary);
    text-decoration: none;
    font-weight: 500;
    margin-right: 4px;
}
.irmp-vendor-login-footer a:hover { text-decoration: underline; }

/* ── responsive ─────────────────────────────────────── */
@media (max-width: 600px) {
    .irmp-vendor-type-cards { flex-direction: column; }
    .irmp-steps-bar { gap: 0; }
    .irmp-step-connector { display: none; }
    .irmp-step-label { font-size: .7rem; }
    .form-row-half { display: block; width: 100%; }
    .form-row-half + .form-row-half { margin-right: 0; }
    .irmp-attr-table .irmp-attr-name { width: auto; }
    .irmp-dashboard { padding: 14px; }
    .irmp-vendor-row { flex-direction: column; }
    .irmp-vendor-secondary { border-right: none; border-top: 1px solid var(--irmp-border); padding-right: 0; padding-top: 8px; }
}