/* ------------------------------------------------------ جدول------------------------------------------------------ */

/* --- رپ جدول --- */
.procode-table-wrap {
    background: #fff;
    border-radius: 10px;
    padding: 10px;
    border: 1px solid #e6e6e6;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* --- نوار بالا: سرچ + اسکرین‌شات --- */
.procode-toolbar {
    margin-bottom: 12px;
    width: 98.7%;
    display: grid;
    grid-template-columns: 7fr 1.5fr 1.5fr;
    align-items: center;
    gap:10px;
}

.procode-search {
    padding: 8px 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 14px;
    width: 220px;
}

.toolbar-procode-toltip {
    text-wrap-mode: nowrap;
    margin: 0 9px;
}

.procode-screenshot, .procode-pdf {
    background: #fff;
    border: 2px dashed #ff9a9a;
    /* خط‌چین صورتی/قرمز کمرنگ */
    color: #333;
    padding: 6px 10px;
    border-radius: 12px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: 0.2s;
}

.procode-screenshot:hover , .procode-pdf:hover {
    background: #fff5f5;
    /* هاور روشن */
    border-color: #ff7a7a;
}

.procode-screenshot svg,
.procode-screenshot img {
    width: 18px;
    height: 18px;
}


/* --- جدول --- */
.procode-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    color: #333;
    border-collapse: separate;
    border-spacing: 0;
}

/* --- هدر --- */
.procode-table thead th {
    background: #e53935;
    /* رنگ قرمز */
    color: #fff;
    font-weight: bold;
    padding: 10px 8px;
    border: none;
    text-align: center;
    position: sticky;
    top: 0;
    z-index: 10;
    font-size: 14px;
    white-space: nowrap;
}

.procode-table thead tr:first-child th:first-child {border-top-right-radius: 0 !important;}

.procode-table thead th .sort-icon {
    font-size: 12px;
    margin-right: 4px;
}

/* --- ردیف‌ها --- */
.procode-table td {
    border-bottom: 1px solid #f0f0f0;
    padding: 12px 8px;
    text-align: center;
    vertical-align: middle;
    background: #fff;
}

/* --- هاور روی ردیف --- */
.procode-table tbody tr:hover td {
    background: #f9f9f9;
}

/* --- تصاویر --- */
.procode-gallery-cell {
    display: flex;
    justify-content: center;
    align-items: center;
}

.procode-gallery-thumb {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #e5e5e5;
    background: #fafafa;
}

.procode-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.procode-gallery-count {
    position: absolute;
    bottom: 4px;
    right: 4px;
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 10px;
}

.procode-img-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
}

.procode-img-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.6);
}

.procode-img-modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90vw;
    max-height: 90vh;
    background: #fff;
    padding: 10px;
    border-radius: 10px;
}

.procode-img-modal-content img {
    max-width: 100%;
    max-height: 80vh;
    display: block;
}

.procode-img-modal-close {
    position: absolute;
    top: -10px;
    right: -10px;
    background: #000;
    color: #fff;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
}

/* ---  پاپ گالری--- */
.procode-img-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
}

.procode-img-modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}

.procode-img-modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90vw;
    max-height: 90vh;
    background: #fff;
    padding: 10px;
    border-radius: 10px;
}

.procode-img-modal-content img {
    max-width: 100%;
    max-height: 80vh;
    display: block;
}

.procode-img-modal-close {
    position: absolute;
    top: -10px;
    right: -10px;
    background: #000;
    color: #fff;
    width: 28px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
}
.procode-img-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.6);
    color: #fff;
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 20px;
}

.procode-img-nav.prev { left: -45px; }
.procode-img-nav.next { right: -45px; }

.procode-img-nav:hover {
    background: rgba(0,0,0,0.8);
}

/* --- نمایش divider --- */

.procode-divider-row{
    position: relative;
    height: 48px;
    background: #d9d9d9;
}
/* سلول داخل divider */
.procode-divider-row td {
    padding: 0;
    border: none;
}

/* متن وسطِ واقعی صفحه */
.procode-divider-row td::before {
    content: attr(data-title);
    position: sticky;
    left: 50%;
    transform: translateX(-50%);
    display: inline-block;
    font-weight: 600;
    color: #333;
    white-space: nowrap;
}

/* --- اسکرول داخلی --- */
.procode-scroll-main {
    position: relative;
    overflow: auto;
    max-height: 460px;
    border-radius: 8px;
    margin-top: -25px;
}

.procode-price-info{
    background: #bc3326;
    padding: 13px 10px 35px;
    width: 98.7%;
    border-radius: 15px 15px 0 0;
    color: #fff;
    font-size: 16px;
}

/* --- Load More --- */
.procode-load-more {
    margin: 14px auto 4px auto;
    padding: 10px 16px;
    background: none;
    color: #e53935;
    cursor: pointer;
    transition: 0.2s;
}
.procode-load-more:hover{background: none;}
.load-more img{width: 18px;height: 18px;margin-right: -12px;margin-bottom: -7px;}

/* ****************/
.procode-updated {
    background: #c6f6c6 !important;
    /* سبز ملایم */
    transition: background 0.4s;
}

.procode-loading {
    filter: blur(2px);
    pointer-events: none;
    opacity: 0.6;
    transition: 0.15s;
}







/* full *****/
.procode-full-card{background:#fff;border:1px solid #eee;border-radius:9px;margin:0 0 9px;box-shadow:0 2px 10px rgba(0,0,0,.04);overflow:hidden}
.procode-full-row1{display:flex;gap:16px;align-items:center;padding:9px 14px;position: relative;gap: 9px;}
.procode-full-col{display:flex;flex-direction:column;justify-content:center}
.procode-full-col-side{width:160px;align-items: center;display: flex;}
.procode-full-col-main{flex:1;min-width:0}
.procode-full-img{width:120px;height:120px;object-fit:cover;border-radius:4px;display:block}
.procode-full-img.ph{width:120px;height:120px;background:#f2f2f2}
.procode-img-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
}
.procode-img-modal-img {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 92vw;
    max-height: 92vh;
    object-fit: contain;
    border-radius: 16px;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .45);
    z-index: 2;
    pointer-events: auto;
}
.procode-img-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .35);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    z-index: 1;
}
.procode-img-modal[hidden] {
    display: none !important;
}

.procode-img-modal-close {
    position: fixed;
    top: 24px;
    right: 24px;
    z-index: 3;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

body.procode-modal-open {overflow: hidden;}

.procode-full-row2 {
    overflow: hidden;
    transition: grid-template-rows .3s ease, opacity .2s ease;
    display: grid;
    
}

/* بسته */
.procode-full-row2.is-collapsed {
    grid-template-rows: 0fr;
    opacity: 0;
    padding: 0;
    border-top: none;
    transition: padding .2s ease, border-color .2s ease;
}

/* باز */
.procode-full-row2.is-open {
    grid-template-rows: 1fr;
    opacity: 1;
    padding: 14px;
}

.procode-full-row2-content {
    overflow: hidden;
}

.procode-full-title{font-weight:800;text-decoration:none;color:#111;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size: 15px;}
.procode-full-price{margin-top:6px;color:#444}
.procode-full-price-val{font-weight:900}
.procode-full-score{display:flex;gap:8px;align-items:center}
.procode-full-score-star{color:#f5b301;font-size: 30px;height: 25px;margin-top: -23px;}
.procode-full-toggle{margin-top:10px;background:#ef4444;color:#fff;border:0;border-radius:5px;padding:10px 12px;cursor:pointer;width:100%;}
.procode-full-toggle:hover{background: #ed4545;}
.procode-full-toggle:hover span{color: #212121;}
.procode-full-row2{padding:14px;border-top:1px solid #eee}
.procode-full-feature{background:#fafafa;border:1px solid #eee;border-radius:10px;padding:10px;display:flex;gap:10px;flex: 0 0 auto; min-width: 150px;}
.procode-product-link{color: #ed4545;}
.procode-product-link::after{content: ': ';}
.procode-full-features-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    padding-bottom: 8px;
}

.procode-full-features {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    align-items: stretch;
}


.procode-full-feature-more {
    min-width: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.procode-full-feature-ico{width:28px;height:28px;border-radius:8px;background:#fff;border:1px solid #eee;display:flex;align-items:center;justify-content:center}
.procode-full-feature-label{font-size:12px;color:#666}
.procode-full-feature-value{font-size:13px;font-weight:800;margin-top:3px}
.procode-full-more-wrap{margin-top:10px;text-align:center}
.procode-full-more{background:#e5e7eb;border:0;border-radius:10px;padding:10px 12px;cursor:pointer}
.procode-full-summary{margin-top:12px;line-height:1.9;color:#333}
.procode-full-summary p{text-align: justify;}
.procode-full-summary ul{display: grid;grid-template-columns: repeat(2, 1fr);gap: 10px;list-style: none;padding: 0;margin: 0;}
.procode-full-summary ul li{margin-bottom: 0 !important;border: 1px solid #ddd;border-radius: 8px;padding: 15px;text-align: center;background: #f7f7f7;box-sizing: border-box;}

.procode-full-summary .procode-summary-block ul{all:inherit;}
.procode-full-summary .procode-summary-block ul li{all:inherit;}

.procode-full-readmore{margin-top:12px}
.procode-full-readmore-btn{display:block;text-align:center;background:#ef4444;color:#fff;text-decoration:none;border-radius:6px;padding:9px;font-weight:900}
.procode-full-readmore-btn:hover{color: #212121;}
.procode-appropriate {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px;
    position: absolute;
    left: 15%;
    bottom: 25%;
}
.procode-appropriate-item {
    color: #333;
    font-size: 12px;
    padding: 4px 8px;
    line-height: 1.6;
    white-space: nowrap;
    height: 15px;
    display: flex;
    align-items: center;
    border-left: 1px solid;
}
.procode-appropriate .procode-appropriate-item:last-child{border-left: none;}
.procode-full-score-empty {font-size: 14px;}

@media (max-width: 768px) {
.procode-full-col-side {width: 22vw;}
.procode-full-score {display: block;}
.procode-full-toggle {padding:2px 6px; min-height:30px;}
.procode-full-score-empty , .procode-full-toggle-text , .procode-full-score{font-size: 11px;}
.procode-full-img , .procode-full-img.ph{width:90px;height: 90px;}
.procode-full-col-main{font-size: 14px;}
}