/* *****************************************************
    ** Custom Stylesheet - DeepSeek Blue Theme **
    ** لون شعار DeepSeek: #4D6BFE              **
    ** تم إصلاح مشكلة النصوص البيضاء          **
    ***************************************************** */

/* ========================================= */
/* 1. ألوان DeepSeek الأساسية                */
/* ========================================= */
:root {
    --deepseek-blue: #4D6BFE;
    --deepseek-blue-dark: #3A56D4;
    --deepseek-blue-light: #6B85FE;
    --deepseek-border: rgba(77, 107, 254, 0.2);
}

/* ========================================= */
/* 2. إبقاء الخلفية كما هي (لا تغيير)       */
/* ========================================= */
body {
    /* لا نغير الخلفية - نتركها كما كانت */
    background-color: #f5f6fa !important;
    color: #2a2e36 !important;
}

/* ========================================= */
/* 3. تنسيق الحاويات - فقط إطار وخلفية      */
/* ========================================= */

/* تنسيق البطاقات - خلفية بيضاء مع إطار أزرق */
.card, 
.panel, 
.panel-default,
.panel-sidebar,
.single-promo-card, 
.single-service, 
.single-pricing-pack,
.single-pricing-pack-2,
.price-table,
.product-item,
.domain-item,
.store-promoted-product,
.upgrade .product,
.module-item,
.featured-product {
    background: #ffffff !important;
    border: 2px solid var(--deepseek-border) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06) !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important;
}

/* تأثير التمرير */
.card:hover, 
.panel:hover, 
.panel-default:hover,
.single-promo-card:hover, 
.single-service:hover, 
.single-pricing-pack:hover,
.price-table:hover,
.product-item:hover {
    border-color: #4D6BFE !important;
    box-shadow: 0 8px 40px rgba(77, 107, 254, 0.15) !important;
    transform: translateY(-4px) !important;
}

/* محتوى البطاقات - نصوص داكنة */
.card-body, 
.panel-body, 
.promo-body, 
.pricing-body,
.product-details,
.domain-details {
    background: transparent !important;
    color: #2a2e36 !important;
}

/* ========================================= */
/* 4. العناوين - لون داكن واضح              */
/* ========================================= */
.card h1, .card h2, .card h3, .card h4, .card h5,
.panel h1, .panel h2, .panel h3, .panel h4, .panel h5,
.product-title, .domain-title, .package-title,
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
    color: #1a1a2e !important;
    font-weight: 600 !important;
}

.card p, .panel p, .product-description,
p, .text-muted, .description {
    color: #2a2e36 !important;
    line-height: 1.7 !important;
}

/* ========================================= */
/* 5. النصوص الصغيرة والمعلومات             */
/* ========================================= */
small, .text_small, .text-muted, .text-secondary {
    color: #6c757d !important;
}

span, label, .label, .badge {
    color: #2a2e36 !important;
}

/* ========================================= */
/* 6. تنسيق جدول المقارنة                   */
/* ========================================= */

.price-table-container .price-table {
    background: #ffffff !important;
    border: 2px solid var(--deepseek-border) !important;
    border-radius: 16px !important;
}

.price-table-container .top-head {
    background: rgba(77, 107, 254, 0.06) !important;
    border-bottom: 2px solid var(--deepseek-border) !important;
    padding: 20px !important;
}

.price-table-container .top-head h4 {
    color: #1a1a2e !important;
}

.price-table-container .price {
    color: #4D6BFE !important;
    font-size: 28px !important;
    font-weight: 700 !important;
}

.price-table-container .price span {
    color: #4D6BFE !important;
}

.price-table-container .package-features li {
    color: #2a2e36 !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.price-table-container .package-features li i {
    color: #4D6BFE !important;
}

.price-table-container .package-features li b {
    color: #1a1a2e !important;
}

/* ========================================= */
/* 7. الأزرار - تنسيق DeepSeek              */
/* ========================================= */

/* زر رئيسي */
.btn-primary,
.btn-success,
.btn-search,
.primary-solid-btn,
.order-button,
a.btn.btn-primary,
.btn-deepseek {
    background: linear-gradient(135deg, #4D6BFE, #3A56D4) !important;
    border: none !important;
    color: #ffffff !important;
    padding: 12px 32px !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 20px rgba(77, 107, 254, 0.3) !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-search:hover,
.primary-solid-btn:hover,
.order-button:hover,
a.btn.btn-primary:hover {
    background: linear-gradient(135deg, #6B85FE, #4D6BFE) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 30px rgba(77, 107, 254, 0.5) !important;
    color: #ffffff !important;
}

/* زر ثانوي - حدود */
.btn-secondary,
.outline-btn,
.btn-outline-primary {
    background: transparent !important;
    color: #4D6BFE !important;
    border: 2px solid #4D6BFE !important;
    padding: 12px 32px !important;
    border-radius: 50px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.btn-secondary:hover,
.outline-btn:hover,
.btn-outline-primary:hover {
    background: #4D6BFE !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 20px rgba(77, 107, 254, 0.3) !important;
}

/* ========================================= */
/* 8. حقل البحث عن النطاقات                 */
/* ========================================= */

.domain-search-field .form-control,
#domainsearch .form-control {
    background: #ffffff !important;
    border: 2px solid var(--deepseek-border) !important;
    border-radius: 50px 0 0 50px !important;
    color: #1a1a2e !important;
    padding: 14px 24px !important;
    height: auto !important;
    font-size: 16px !important;
}

.domain-search-field .form-control:focus,
#domainsearch .form-control:focus {
    border-color: #4D6BFE !important;
    box-shadow: 0 0 30px rgba(77, 107, 254, 0.15) !important;
    outline: none !important;
}

.domain-search-field .form-control::placeholder {
    color: #6c757d !important;
    opacity: 0.7 !important;
}

.domain-search-field .btn,
#domainsearch .btn {
    background: linear-gradient(135deg, #4D6BFE, #3A56D4) !important;
    border: 2px solid #4D6BFE !important;
    border-radius: 0 50px 50px 0 !important;
    color: #ffffff !important;
    padding: 14px 32px !important;
    font-weight: 600 !important;
}

.domain-search-field .btn:hover,
#domainsearch .btn:hover {
    background: #3A56D4 !important;
}

/* ========================================= */
/* 9. صناديق اختيار النطاق                  */
/* ========================================= */

.domain-selection-options .option,
.domain-selector .option {
    background: #ffffff !important;
    border: 2px solid var(--deepseek-border) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    transition: all 0.3s ease !important;
}

.domain-selection-options .option:hover,
.domain-selector .option:hover {
    border-color: #4D6BFE !important;
    box-shadow: 0 0 30px rgba(77, 107, 254, 0.1) !important;
}

.domain-selection-options .option.active,
.domain-selector .option.active {
    border-color: #4D6BFE !important;
    background: rgba(77, 107, 254, 0.05) !important;
    box-shadow: 0 0 40px rgba(77, 107, 254, 0.1) !important;
}

.domain-selection-options .option label {
    color: #1a1a2e !important;
}

/* ========================================= */
/* 10. الجداول                              */
/* ========================================= */

.table {
    background: #ffffff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

.table thead th {
    background: rgba(77, 107, 254, 0.06) !important;
    color: #1a1a2e !important;
    border-bottom: 2px solid var(--deepseek-border) !important;
    padding: 16px !important;
}

.table tbody td {
    color: #2a2e36 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
    padding: 14px 16px !important;
}

.table tbody tr:hover {
    background: rgba(77, 107, 254, 0.03) !important;
}

/* ========================================= */
/* 11. القوائم المنسدلة                     */
/* ========================================= */

.dropdown-menu {
    background: #ffffff !important;
    border: 1px solid var(--deepseek-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1) !important;
}

.dropdown-menu li a {
    color: #2a2e36 !important;
    padding: 10px 20px !important;
    transition: all 0.2s ease !important;
}

.dropdown-menu li a:hover {
    background: rgba(77, 107, 254, 0.06) !important;
    color: #4D6BFE !important;
}

/* ========================================= */
/* 12. شريط التنقل                          */
/* ========================================= */

.navbar-main .navbar-nav > li > a {
    color: #2a2e36 !important;
    transition: all 0.3s ease !important;
}

.navbar-main .navbar-nav > li > a:hover {
    color: #4D6BFE !important;
}

.navbar-main .navbar-nav > .active > a {
    color: #4D6BFE !important;
}

/* ========================================= */
/* 13. التذييل                              */
/* ========================================= */

#footer {
    background: #ffffff !important;
    border-top: 2px solid var(--deepseek-border) !important;
}

.footer-nav-wrap h4 {
    color: #1a1a2e !important;
}

.footer-nav-wrap ul li a {
    color: #2a2e36 !important;
    opacity: 0.8 !important;
}

.footer-nav-wrap ul li a:hover {
    color: #4D6BFE !important;
    opacity: 1 !important;
}

.footer-bottom {
    background: #f8f9fa !important;
    border-top: 1px solid var(--deepseek-border) !important;
}

.copyright-text {
    color: #2a2e36 !important;
}

/* ========================================= */
/* 14. التنبيهات                            */
/* ========================================= */

.alert {
    background: #ffffff !important;
    border: 1px solid var(--deepseek-border) !important;
    border-radius: 12px !important;
    color: #1a1a2e !important;
}

.alert-success {
    border-color: #00C9A7 !important;
    background: rgba(0, 201, 167, 0.05) !important;
}

.alert-danger {
    border-color: #FF6B6B !important;
    background: rgba(255, 107, 107, 0.05) !important;
}

.alert-warning {
    border-color: #FFD93D !important;
    background: rgba(255, 217, 61, 0.05) !important;
}

.alert-info {
    border-color: #4D6BFE !important;
    background: rgba(77, 107, 254, 0.05) !important;
}

/* ========================================= */
/* 15. علامات التبويب                       */
/* ========================================= */

.nav-tabs {
    border-bottom: 2px solid var(--deepseek-border) !important;
}

.nav-tabs .nav-link {
    color: #2a2e36 !important;
    border: none !important;
    padding: 12px 24px !important;
    font-weight: 500 !important;
}

.nav-tabs .nav-link:hover {
    color: #4D6BFE !important;
    background: rgba(77, 107, 254, 0.04) !important;
}

.nav-tabs .nav-link.active {
    color: #4D6BFE !important;
    background: transparent !important;
    border-bottom: 3px solid #4D6BFE !important;
}

.tab-content {
    background: #ffffff !important;
    border-radius: 0 0 16px 16px !important;
    padding: 24px !important;
    border: 2px solid var(--deepseek-border) !important;
    border-top: none !important;
}

/* ========================================= */
/* 16. الشريط الجانبي                       */
/* ========================================= */

.sidebar .panel,
.sidebar-secondary .panel {
    background: #ffffff !important;
    border: 2px solid var(--deepseek-border) !important;
    border-radius: 16px !important;
}

.sidebar .panel-heading,
.sidebar-secondary .panel-heading {
    background: rgba(77, 107, 254, 0.06) !important;
    color: #1a1a2e !important;
    border-bottom: 2px solid var(--deepseek-border) !important;
    padding: 16px 20px !important;
}

.sidebar .panel-body,
.sidebar-secondary .panel-body {
    padding: 20px !important;
    color: #2a2e36 !important;
}

.sidebar .panel-footer,
.sidebar-secondary .panel-footer {
    background: #f8f9fa !important;
    border-top: 1px solid var(--deepseek-border) !important;
    padding: 16px 20px !important;
}

/* ========================================= */
/* 17. تنسيق خاص لصفحة الباقة               */
/* ========================================= */

#order-premium_comparison .price-table {
    background: #ffffff !important;
    border: 2px solid var(--deepseek-border) !important;
    border-radius: 16px !important;
}

#order-premium_comparison .top-head {
    background: rgba(77, 107, 254, 0.06) !important;
    border-bottom: 2px solid var(--deepseek-border) !important;
}

#order-premium_comparison h4 {
    color: #1a1a2e !important;
}

#order-premium_comparison .price {
    color: #4D6BFE !important;
}

#order-premium_comparison .price span {
    color: #4D6BFE !important;
}

#order-premium_comparison .order-button {
    background: linear-gradient(135deg, #4D6BFE, #3A56D4) !important;
    border-radius: 50px !important;
    color: #ffffff !important;
}

#order-premium_comparison .order-button:hover {
    box-shadow: 0 4px 20px rgba(77, 107, 254, 0.4) !important;
}

#order-premium_comparison .package-features li {
    color: #2a2e36 !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

#order-premium_comparison .package-features li i {
    color: #4D6BFE !important;
}

#order-premium_comparison .package-features li b {
    color: #1a1a2e !important;
}

/* ========================================= */
/* 18. شريط التمرير                         */
/* ========================================= */

::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
}

::-webkit-scrollbar-track {
    background: #f5f6fa !important;
}

::-webkit-scrollbar-thumb {
    background: #4D6BFE !important;
    border-radius: 10px !important;
}

::-webkit-scrollbar-thumb:hover {
    background: #6B85FE !important;
}

::selection {
    background: #4D6BFE !important;
    color: #ffffff !important;
}

/* ========================================= */
/* 19. إخفاء المسافات الزائدة               */
/* ========================================= */

.pricing-feature-list br,
.package-features br {
    display: none !important;
}

/* ========================================= */
/* 20. تحسينات للشاشات الصغيرة              */
/* ========================================= */

@media (max-width: 768px) {
    .card-body, .panel-body, .promo-body, .pricing-body {
        padding: 1.5rem !important;
    }
    
    .domain-search-field .form-control {
        border-radius: 50px !important;
        margin-bottom: 12px !important;
    }
    
    .domain-search-field .btn {
        border-radius: 50px !important;
        width: 100% !important;
    }
}

/* ========================================= */
/* 1. إجبار الأعمدة الأربعة على الوقوف بجانب بعضها */
/* ========================================= */
#order-premium_comparison .price-table-container ul {
    display: flex !important;
    flex-wrap: wrap !important;
    margin: 0 -10px !important; /* تعويض المسافات */
    padding: 0 !important;
    list-style: none !important;
}

#order-premium_comparison .price-table-container > ul > li {
    flex: 0 0 25% !important; /* كل عمود يأخذ 25% من العرض (4 أعمدة) */
    max-width: 25% !important;
    padding: 0 20px !important; /* مسافة بين الأعمدة */
    margin-bottom: 20px !important;
    box-sizing: border-box !important;
}

/* لجعل الأعمدة 2 في الأجهزة اللوحية */
@media (max-width: 991px) {
    #order-premium_comparison .price-table-container > ul > li {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
}

/* لجعل العمود 1 في الجوال */
@media (max-width: 575px) {
    #order-premium_comparison .price-table-container > ul > li {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* إخفاء حقل الدفع بالبطاقة بالكامل */
.existingCardInfo {
    display: none !important;
}