/*
Theme Name: Codzan
Theme URI: https://abzarwp.com
Description: قالب اختصاصی، مستقل و بهینه وگ‌کالا؛ طراحی و توسعه: AbzarWP.Com، وب‌سایت codzan.ir، تلفن 09019191071
Author: AbzarWP.Com
Author URI: https://abzarwp.com
Developer Phone: 09019191071
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
Text Domain: codzan
*/

/* Normalize WoodMart breadcrumb delimiters to one slash without side spacing. */
.wd-breadcrumbs .wd-delimiter {
  font-size: 0 !important;
  margin-inline: 0 !important;
}
.wd-breadcrumbs .wd-delimiter::after {
  content: "/" !important;
  display: inline-block;
  font-size: 14px;
}

/* ==============================
   1. تنظیمات کلی و فونت
   ============================== */
body {
  font-family: 'Vazirmatn', 'IRANSans', sans-serif;
  color: #333;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  text-align: right;
  direction: rtl;
}

.sku-label {
  font-weight: bold;
  color: #00446A;
}

/* ==============================
   2. مخفی کردن نوار قدیمی VOG
   ============================== */
#vog-sticky-cart { display: none !important; }

/* ==============================
   3. لودر (Loading)
   ============================== */
/* مخفی کردن لودر پیش‌فرض */
.wd-loader-overlay, .wd-loading, .loading::before, .loading::after {
    display: none !important; opacity: 0 !important;
}
/* استایل لودر اختصاصی ما */
.vog-loading-overlay {
    display: none; /* توسط JS کنترل می‌شود */
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    z-index: 999999999;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    align-items: center; justify-content: center;
    flex-direction: column;
}
.vog-spinner {
    width: 60px; height: 60px;
    border: 4px solid rgba(0, 68, 106, 0.1);
    border-top: 4px solid #00446A;
    border-radius: 50%;
    animation: vogSpin 0.8s linear infinite;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
@keyframes vogSpin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

/* ==============================
   4. کانتینر اصلی و کنترل‌ها (VOG Wrapper)
   ============================== */
.vog-wrapper {
    font-family: 'IRANSans', 'Tahoma', sans-serif;
    direction: rtl;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    padding: 20px;
    max-width: 1250px;
    margin: 20px auto;
    position: relative;
    min-height: 500px;
}

/* کنترل‌های بالا (جستجو، تعداد، پیجینیشن) */
.vog-top-controls {
    display: flex; justify-content: space-between; align-items: center;
    gap: 10px; margin-bottom: 20px; background-color: #00446A;
    padding: 10px 15px; border-radius: 14px; color: #fff; flex-wrap: wrap;
}
.vog-total-info {
    background: #fff; color: #00446A; padding: 0 15px;
    border-radius: 8px; font-weight: bold; font-size: 13px;
    height: 40px; display: flex; align-items: center; white-space: nowrap;
}

/* صفحه‌بندی */
#vog-pagination-container { flex-grow: 1; display: flex; justify-content: center; }
.vog-pagination-container { display: flex; align-items: center; gap: 4px; direction: rtl; }
.vog-page-link {
    width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
    background: #fff; color: #333; border-radius: 6px; border:1px solid #ccc;
    cursor: pointer; font-weight: bold; font-size: 14px;
}
.vog-page-link:hover { background: #eee; }
.vog-page-link.active {
    background: #FFDE38; color: #00446A; border-color: #FFDE38;
    transform: scale(1.1); z-index: 2; box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* باکس پرش */
.vog-jump-box { display: flex; align-items: center; margin-right: 10px; background: rgba(255,255,255,0.2); padding: 3px; border-radius: 6px; }
.vog-jump-btn { height: 32px; padding: 0 10px; background: #FFDE38; border: none; border-radius: 4px; cursor: pointer; font-weight: bold; color: #00446A; font-size: 12px; margin-left: 5px; }
.vog-jump-input { width: 40px !important; height: 32px !important; text-align: center; border: none; border-radius: 4px; font-weight: bold; color: #00446A; font-size: 14px; background: #fff; padding: 0; }

/* جستجو */
.vog-search-wrapper { display: flex; align-items: center; gap: 8px; width: 300px; }
.vog-search-input {
    width: 100%; height: 40px; padding: 0 10px; border-radius: 6px;
    border: 2px solid #FFDE38 !important; font-weight: bold;
    background: #fff !important; color: #00446A !important;
}

/* ==============================
   5. لیست محصولات و آکاردئون
   ============================== */
.vog-row-box {
    background: #fff; border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    padding: 15px; margin-bottom: 15px; border: 1px solid #eee;
}
.vog-row-header { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.vog-prod-info { display: flex; align-items: center; gap: 15px; flex-grow: 1; }

/* عکس محصول - بدون برش */
.vog-prod-img {
    width: 80px !important; height: 80px !important;
    object-fit: contain !important;
    border-radius: 8px; border: 1px solid #eee; padding: 2px;
}
.vog-prod-title { font-size: 16px; font-weight: bold; color: #003453; text-decoration: none; }
.vog-toggle-btn {
    background: #fff; color: #00446A; border: 2px solid #00446A;
    padding: 8px 15px; border-radius: 8px; cursor: pointer;
    font-weight: bold; display: flex; align-items: center; gap: 5px;
}
.vog-toggle-btn:hover { background: #00446A; color: #fff; }
.vog-acc-body { display: none; margin-top: 15px; border-top: 1px dashed #ddd; padding-top: 15px; }

/* ==============================
   6. جدول داخلی (استایل جدید V9)
   ============================== */
.vog-v7-table { width: 100%; border-collapse: separate; border-spacing: 0; }

/* هدر جدول - سرمه‌ای */
.vog-v7-table th {
    background: #00446A; color: #fff; padding: 12px;
    font-size: 14px; text-align: center; border: none;
}
.vog-v7-table th:first-child { border-top-right-radius: 8px; border-bottom-right-radius: 8px; }
.vog-v7-table th:last-child { border-top-left-radius: 8px; border-bottom-left-radius: 8px; }

/* راست‌چین کردن محتوای جدول */
.vog-v7-table td {
    padding: 10px; border-bottom: 1px solid #eee;
    text-align: right;
    vertical-align: middle; color: #333;
}

/* --- تغییرات مهم: بزرگ کردن فونت قیمت‌ها در جدول --- */
/* تمام مبالغ (Unit Price) */
.vog-v7-table td .amount,
.vog-v7-table td .woocommerce-Price-amount {
    font-size: 18px; /* بزرگتر شد */
    font-weight: 800; /* ضخیم‌تر شد */
    color: #333;
}

/* مبلغ کل سطر (معمولا در ستون آخر یا بولد شده) - بسیار واضح */
.vog-v7-table tr td:last-child .amount, 
.vog-v7-table td strong .amount {
    font-size: 21px !important; /* خیلی بزرگتر */
    font-weight: 900 !important;
    color: #00446A !important; /* سرمه ای وگ کالا برای تمایز */
    background: rgba(0, 68, 106, 0.05); /* یک هاله خیلی کمرنگ پشت مبلغ */
    padding: 2px 6px;
    border-radius: 4px;
}

/* رنگی شدن یکی در میان (Zebra) - آبی ملایم */
.vog-v7-table tbody tr:nth-child(even) td {
    background-color: #eaf6fb;
}
.vog-v7-table tbody tr:nth-child(odd) td {
    background-color: #fff;
}

/* باکس تعداد - استایل زرد جدید */
.vog-qty-box {
    display: flex; align-items: center; justify-content: center;
    background: #FFDE38; /* زرد */
    border-radius: 6px; padding: 3px;
    width: 130px; margin: 0 auto; height: 40px; direction: ltr;
}
.vog-qty-box button {
    width: 35px; height: 100%; background: transparent;
    border: none; font-weight: 900; font-size: 18px;
    cursor: pointer; color: #000;
}
.vog-qty-box input {
    width: 50px !important; height: 32px !important;
    text-align: center; border: none !important;
    font-weight: 900; color: #000 !important;
    font-size: 16px; background: #fff !important; /* اینپوت سفید */
    border-radius: 4px !important; margin: 0 2px;
}

/* دکمه افزودن - تغییرات */
.vog-add-btn {
    background: #FFDE38; /* تغییر به رنگ زرد وگ کالا */
    color: #00446A; /* تغییر رنگ متن به سرمه‌ای */
    border: none; padding: 0 20px;
    border-radius: 5px; 
    cursor: pointer; font-weight: bold;
    height: 38px; min-width: 100px; transition: 0.2s;
}
.vog-add-btn:hover { background: #e6c630; } 
.vog-add-btn.disabled { opacity: 0.6; cursor: not-allowed; }

/* رسپانسیو موبایل */
@media(max-width:991px) {
    .vog-top-controls { flex-direction: column; gap: 10px; }
    .vog-search-wrapper, .vog-total-info, #vog-pagination-container { width: 100%; justify-content: center; }
    .vog-prod-title { font-size: 14px; }
    .vog-row-header { flex-direction: column; align-items: flex-start; }
    .vog-toggle-btn { width: 100%; justify-content: center; margin-top: 10px; }
    .vog-v7-table thead { display: none; }
    .vog-v7-table tr {
        display: block; margin-bottom: 15px;
        border: 1px solid #ddd; border-radius: 8px; overflow: hidden;
        background: #fff !important;
    }
    .vog-v7-table td {
        display: flex; justify-content: space-between; align-items: center;
        text-align: left; border: none; border-bottom: 1px solid #eee;
        width: 100%; background: #fff !important;
    }
    .vog-v7-table td::before { content: attr(data-label); font-weight: bold; color: #666; }
    
    /* استایل قیمت در موبایل هم بزرگ بماند */
    .vog-v7-table td .amount { font-size: 17px; }
}
/* ==========================================================================
   VOG KALA TABLE STYLES - UPDATE COLUMN
   ========================================================================== */

/* تنظیم عرض ستون‌ها */
.vog-product-table th.vog-th-date,
.vog-product-table td.vog-td-date {
    width: 120px; /* عرض فیکس برای تاریخ */
    text-align: center;
}

/* استایل بدنه سلول تاریخ */
.vog-td-date {
    vertical-align: middle !important;
}

/* استایل دکمه/بج تاریخ */
.vog-date-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background-color: #f0f4f8;
    color: #555;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    border: 1px solid #e1e8ed;
    white-space: nowrap;
}

.vog-date-badge .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    color: #888;
}

/* رنگ سبز برای تاریخ‌های خیلی جدید (اختیاری) */
/* اگر بخواهید می‌توانید با جاوا اسکریپت کلاس اضافه کنید، اما استایل ساده بالا کافیست */

/* ریسپانسیو */
@media (max-width: 1200px) {
    .vog-date-badge {
        font-size: 12px;
        padding: 4px 8px;
    }
}
/* ==============================================
   VOG KALA - UPDATE DATE & ATTRIBUTES STYLES
   ============================================== */

/* استایل ستون تاریخ در دسکتاپ */
.vog-date-cell {
    font-size: 13px !important; /* سایز کوچک (درخواست جدید) */
    font-weight: normal;        /* ضخامت نرمال */
    color: #666;                /* رنگ خاکستری تیره */
    direction: ltr;             /* چینش چپ به راست برای اعداد تاریخ */
    white-space: nowrap;        /* جلوگیری از شکستن خط */
    vertical-align: middle;
}

/* استایل تاریخ در موبایل */
.vog-m-date-row {
    font-size: 12px;
    color: #888;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed #eee;
    text-align: right;
    display: flex;
    align-items: center;
    gap: 5px;
}
.vog-m-date-row span {
    font-weight: bold;
    color: #555;
}

/* استایل مشخصات فنی (که خط تیره دارند) */
.vog-att-text {
    font-size: 13px;
    color: #333;
    line-height: 1.6;
}
/* --- VogKala Date Column Styles --- */

/* استایل سلول تاریخ در دسکتاپ */
.vog-date-cell {
    font-size: 12px !important; /* سایز کوچک طبق درخواست */
    color: #777;
    font-weight: normal;
    white-space: nowrap;
    direction: ltr; /* برای نمایش صحیح اسلش‌ها */
    text-align: center !important;
}

/* هدر ستون تاریخ */
th.vog-date-header {
    width: 90px; /* عرض ثابت برای ستون تاریخ */
    text-align: center !important;
}

/* استایل تاریخ در موبایل */
.vog-m-date {
    font-size: 11px;
    color: #888;
    background: #f5f5f5;
    padding: 2px 6px;
    border-radius: 4px;
    display: inline-block;
    margin-top: 5px;
    border: 1px solid #eee;
}

/* اصلاح ریسپانسیو جدول برای دسکتاپ */
@media (min-width: 992px) {
    .vog-v7-table th, .vog-v7-table td {
        vertical-align: middle;
    }
}
