/**
 * Bulk Discount Bundle - Full Optimized & Multilingual CSS
 * Includes: Responsive, Dark Mode, Elementor Compatibility, Print & Animations
 */

/* ==========================================
   Main Wrapper Styles
   ========================================== */
.bdb-bundle-wrapper {
    width: 100%;
    max-width: 100%;
    margin: 24px 0;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    /* حذف direction ثابت از اینجا برای هماهنگی با زبان */
}

/* هوشمندی جهت بر اساس زبان سایت */
body.rtl .bdb-bundle-wrapper { direction: rtl; }
body.ltr .bdb-bundle-wrapper { direction: ltr; }

/* ==========================================
   Intro Text
   ========================================== */
.bdb-intro-text {
    font-size: 16px;
    font-weight: 600;
    color: #2c3e50;
    margin: 0 0 16px 0;
    padding: 0;
    line-height: 1.6;
    text-align: center;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ==========================================
   Table Styles
   ========================================== */
.bdb-bundle-table {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    background: #fff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    table-layout: auto;
}
html:lang(en-US) .bdb-bundle-table{direction:ltr;}

.bdb-bundle-table thead {
    background: #2c3e50;
    color: #fff;
}

.bdb-bundle-table th,
.bdb-bundle-table td {
    padding: 12px 16px;
    border: 1px solid #dee2e6;
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
    /* تراز وسط برای هر دو زبان مناسب است، اما برای انگلیسی می‌توان تغییر داد */
    text-align: center;
}

body.ltr .bdb-bundle-table th,
body.ltr .bdb-bundle-table td {
    /* اگر در انگلیسی تراز چپ می‌خواهید، این خط را فعال کنید */
    /* text-align: left; */
}

.bdb-bundle-table th {
    font-weight: 600;
    font-size: 14px;
}

.bdb-bundle-table td {
    font-size: 15px;
}

.bdb-bundle-table tbody tr:last-child td {
    border-bottom: none !important;
}

.bdb-highlight-row {
    background: #e8f5e9;
    font-weight: 600;
}

/* ==========================================
   Button Styles
   ========================================== */
.bdb-bundle-button {
    display: block!important;
    width: 100%!important;
    max-width: 100%!important;
    padding: 16px 28px!important;
    background: #27ae60!important;
    color: #fff !important;
    text-decoration: none!important;
    border-radius: 12px!important;
    font-weight: 600!important;
    font-size: 16px!important;
    text-align: center!important;
    transition: all 0.3s ease!important;
    border: none!important;
    cursor: pointer!important;
    box-sizing: border-box!important;
    word-wrap: break-word!important;
}

.bdb-bundle-button:hover {
    background: #229954!important;

}

.bdb-bundle-button:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(39, 174, 96, 0.2);
}

.bdb-bundle-button:focus {
    outline: 2px solid #27ae60;
    outline-offset: 2px;
}

/* ==========================================
   WooCommerce Integration
   ========================================== */
.bdb-bundle-table .woocommerce-Price-amount,
.bdb-bundle-table .woocommerce-Price-currencySymbol {
    font-size: inherit;
}


/* ==========================================
   Container Overflow Fix
   ========================================== */
form.cart, 
.elementor-widget-container, 
.price-quantity {
    overflow: visible !important;
}

/* ==========================================
   Responsive Design (تمام بخش‌ها حفظ شده)
   ========================================== */
@media (max-width: 768px) {
    .bdb-bundle-wrapper { padding: 16px; margin: 20px 0; }
    .bdb-intro-text { font-size: 14px; margin-bottom: 12px; }
    .bdb-bundle-table { font-size: 13px; }
    .bdb-bundle-table th, .bdb-bundle-table td { padding: 10px 8px; font-size: 13px; }
    .bdb-bundle-button { padding: 14px 20px; font-size: 15px; border-radius: 10px; }
}

@media (max-width: 480px) {
    .bdb-bundle-wrapper { padding: 12px; margin: 16px 0; border-radius: 6px; }
    .bdb-intro-text { font-size: 13px; margin-bottom: 10px; line-height: 1.5; }
    .bdb-bundle-table { font-size: 11px; margin-bottom: 16px; }
    .bdb-bundle-table th, .bdb-bundle-table td { padding: 8px 5px; font-size: 11px; line-height: 1.4; }
    .bdb-bundle-table th { font-size: 12px; }
    .bdb-bundle-button { padding: 12px 16px; font-size: 14px; border-radius: 8px; }
}

@media (max-width: 360px) {
    .bdb-bundle-wrapper { padding: 10px; margin: 12px 0; }
    .bdb-intro-text { font-size: 12px; }
    .bdb-bundle-table { font-size: 10px; }
    .bdb-bundle-table th, .bdb-bundle-table td { padding: 6px 3px; font-size: 10px; }
    .bdb-bundle-button { padding: 10px 12px; font-size: 13px; }
}

/* ==========================================
   Elementor Compatibility
   ========================================== */
.elementor-widget-container .bdb-bundle-wrapper { margin-left: 0; margin-right: 0; }
.e-con .bdb-bundle-wrapper { max-width: 100%; }

/* ==========================================
   Print Styles
   ========================================== */
@media print {
    .bdb-bundle-wrapper { box-shadow: none; border: 1px solid #ccc; background: #fff; page-break-inside: avoid; }
    .bdb-bundle-button { display: none; }
    .bdb-bundle-table { box-shadow: none; }
}

/* ==========================================
   Accessibility & Dark Mode
   ========================================== */
.bdb-bundle-table:focus-within { outline: 2px solid #2c3e50; outline-offset: 2px; }

/*@media (prefers-color-scheme: dark) {*/
/*    .bdb-bundle-wrapper { background: #1e1e1e; }*/
/*    .bdb-intro-text { color: #e0e0e0; }*/
/*    .bdb-bundle-table { background: #2a2a2a; }*/
/*    .bdb-bundle-table th, .bdb-bundle-table td { border-color: #444; color: #e0e0e0; }*/
/*    .bdb-highlight-row { background: #2d4a2d; }*/
/*}*/

/* ==========================================
   Animation & Loading State
   ========================================== */
.bdb-bundle-wrapper { animation: bdbFadeIn 0.3s ease-in; }
@keyframes bdbFadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.bdb-bundle-wrapper.loading { opacity: 0.6; pointer-events: none; }
.bdb-bundle-wrapper.loading::after {
    content: ""; position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px;
    border: 4px solid #f3f3f3; border-top: 4px solid #27ae60; border-radius: 50%; animation: bdbSpin 1s linear infinite;
}
@keyframes bdbSpin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }