.mt-3{
    margin-top : 30px
}




#table-edit-page-used-instrument{
    width: 98%;
}

#table-edit-page-used-instrument .text-confirm{
    
    color: green;
    padding: 3px;

}


#table-edit-page-used-instrument .text-cancel{
    color: #a24;
    padding: 3px;
}

#table-edit-page-used-instrument .text-top-price{
    color: #dd8918;
    padding: 3px;
}

#table-edit-page-used-instrument .text-unknown{   
    padding: 3px;
    border-radius: 4px;
}


#table-edit-page-used-instrument th ,#table-edit-page-used-instrument td {
    width: 130px;
    text-align: center;
    border: 1px solid black;
    height: 40px;
}

 .tr-table{
    border: 1px solid black;
    
}

.number-used-instrument{
    width: 60px !important;
}

#form-element-list{
    max-width: 1000px;
    overflow: auto;
    font-size: 15px;
}

#form-element-list .form-element-img {
    margin-top:50px
}

#form-element-list .form-element-img img{
    max-width: 1000px;
    
    /*width: 100%;*/
}


.title-form-element-list{
    margin-top : 20px;
    margin-bottom: 8px;
    font-size: 17px;
    font-weight: bold;
}


#form-element-list textarea{
    max-width: 1000px;
    width: 100%;
    height: 200px;
}


div.pagination-atom{
    text-align: center;
    direction: ltr !important;
}

.pagination-atom a.marg , .pagination-atom span.marg{
    margin-right : 9px;
    margin-left: 9px;
}

.sub-form-page{
margin-top: 30px;
height: 50px;
color: white;
background-color: #09CAA7;
border-radius: 5px;
width: 180px;
border: 1px solid whitesmoke;
text-shadow: 1px 1px 1px #222;
font-size: 18px
}

@media(min-width:576){
}

@media(min-width:768px){

}

@media(min-width:992px){


}

@media(min-width:1200px){

}


    .sz-two-column-container {
    display: flex;
    flex-direction: column;
    gap: 40px; /* فاصله بیشتر بین دو بخش (قبلا 30 بود) */
    margin-top: 20px;
}

/* استایل کادر برای هر دو بخش */
.sz-column-docs, 
.sz-column-chat {
    background-color: #fff;
    border: 1px solid #b2b2b2; /* کادر دور بخش */
    border-radius: 10px;       /* گردی گوشه‌های کادر */
    padding: 25px;             /* فاصله داخلی محتوا از کادر */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03); /* یک سایه بسیار نرم برای زیبایی */
}

@media (min-width: 768px) {
    .sz-two-column-container {
        flex-direction: row;
        align-items: flex-start;
    }

    .sz-column-docs {
        flex: 1; /* عرض برابر */
    }

    .sz-column-chat {
        flex: 1; /* عرض برابر */
    }
}

        .sz-header-container { display: flex; justify-content: space-between; margin-top:18px; align-items: center; margin-bottom: 25px; flex-wrap: wrap; gap: 15px; }
        .sz-header-title { margin: 0; font-size: 18px; }
        
        /* استایل‌های دکمه جدید */
        .sz-btn-new { display: inline-flex; align-items: center; background: #1bc09f; color: #fff; border-radius: 4px; text-decoration: none; font-size: 14px; font-weight: bold; overflow: hidden; transition: 0.3s; }
        .sz-btn-new:hover { background: #16a085; color: #fff; }
        .sz-btn-text { padding: 8px 15px; }
        .sz-btn-icon { background: #1dd2af; padding: 8px 12px; display: flex; align-items: center; justify-content: center; }
        .sz-btn-icon img { width: 22px; height: 22px; object-fit: contain; /* برای اطمینان از سفید بودن آیکون در صورت نیاز */ filter: brightness(0) invert(1); }
        
        .sz-table { width: 100%; border-collapse: collapse; border: 1px solid #eee; font-size: 13px; text-align: center; margin-bottom: 20px; }
        .sz-table th, .sz-table td { border: 1px solid #eee; padding: 12px; }
        .sz-table thead tr { background-color: #fcfcfc; }
        
        .sz-status-approved { color: green; font-weight: bold; }
        .sz-status-pending { color: rgb(208, 85, 41); }
        
        .sz-action-btn { padding: 5px 10px; font-size: 11px; background: rgb(228,250,248); color: #222; border: 1px solid gray; border-radius: 4px; text-decoration: none; display: inline-block; transition: 0.3s; }
        .sz-action-btn:hover { background: #d1f2eb; }
        
        .sz-badge { background: red; color: #fff; border-radius: 50%; padding: 2px 7px; font-size: 10px; margin-left: 5px; animation: blinker 1s linear infinite; display: inline-block; }
        .sz-doc-section { background: #fcfcfc; padding: 20px; text-align: right; }
        
        @keyframes blinker { 50% { opacity: 0; } }

        /* استایل‌های واکنش‌گرا برای موبایل */
        @media screen and (max-width: 768px) {
            .sz-table thead { display: none; }
            .sz-table tbody tr { display: block; margin-bottom: 15px; border: 1px solid #ddd; border-radius: 8px; overflow: hidden; }
            .sz-table tbody td { display: flex; justify-content: space-between; align-items: center; border: none; border-bottom: 1px solid #eee; padding: 10px 15px; text-align: left; }
            .sz-table tbody td::before { content: attr(data-label); font-weight: bold; color: #555; }
            .sz-table tbody td:last-child { border-bottom: none; justify-content: center; } 
            
            .sz-table td[colspan="6"] { display: block; padding: 15px !important; text-align: right; }
            .sz-table td[colspan="6"]::before { content: none; }
        }


        .sz-status-badge {
            padding: 4px 10px;
            border-radius: 4px;
            font-size: 12px;
            color: #fff;
            font-weight: bold;
            display: inline-block;
        }

        .sz-status-pending {
            background-color: #f39c12;
        }

        .sz-status-approved {
            background-color: #27ae60;
        }

        .sz-status-rejected {
            background-color: #e74c3c;
        }

        .sz-admin-comment {
            font-size: 12px;
            color: #555;
            background: #fff3cd;
            padding: 8px 10px;
            border-right: 3px solid #ffc107;
            margin-top: 8px;
            border-radius: 3px;
            line-height: 1.6;
        }

        .sz-doc-table {
            width: 100%;
            background: #fff;
            margin-bottom: 20px;
            border-collapse: collapse;
            border: 1px solid #eee;
        }

        .sz-doc-table th {
            background: #f8f9fa;
            text-align: right;
            padding: 12px 10px;
            border-bottom: 2px solid #eee;
        }

        .sz-doc-table td {
            vertical-align: middle;
            padding: 12px 10px;
            border-bottom: 1px solid #eee;
        }

        .drop-area {
            border: 2px dashed #27ae60;
            padding: 30px;
            text-align: center;
            border-radius: 8px;
            cursor: pointer;
            background: rgb(216, 246, 238);
            transition: 0.3s;
        }

        .drop-area.dragover {
            background: #e8f5e9;
            border-color: #2ecc71;
        }

        .file-item {
            background: #f9fafc;
            padding: 10px;
            border-radius: 6px;
            margin-top: 10px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border: 1px solid #ddd;
        }

        .remove {
            color: red;
            cursor: pointer;
            font-size: 13px;
            font-weight: bold;
        }

        .notice {
            font-size: 13px;
            color: #666;
            margin-bottom: 15px;
            line-height: 1.8;
            background: #fdfdfd;
            padding: 10px;
            border: 1px solid #eee;
        }

        .button-download {
            color: #262626;
            font-weight: bold;
            border: 1px solid gray;
            padding: 5px 10px;
            border-radius: 5px;
            background: rgb(228, 250, 248);
            font-size: 12px;
            text-decoration: none;
            display: inline-block;
            margin: auto;
        }