/* =============================================================
   Opexmart-Style My Account CSS (Navy + Gold Dashboard)
   গন্তব্য: /wp-content/themes/astra-child/daraz-myaccount.css
   ============================================================= */

:root{
    --opex-navy: #10204f;
    --opex-navy-light: #16295f;
    --opex-gold: #f7b500;
    --opex-gold-dark: #e0a200;
    --opex-bg: #eef1f6;
    --opex-border: #e7e9ee;
    --opex-text-muted: #6b7280;
    --opex-green: #1fb672;
    --opex-orange: #f5a623;
    --opex-blue: #2f80ed;
    --opex-purple: #6c5ce7;
    --opex-red: #ff4d4d;
}

/* ---------------- Layout & WooCommerce Mapping ---------------- */
.woocommerce-account .woocommerce{
    background: var(--opex-bg);
    padding: 30px !important;
    display: flex !important;
    gap: 24px !important;
    align-items: flex-start !important;
    box-sizing: border-box !important;
}

.woocommerce-account .woocommerce::after{
    content:"";
    display:table;
    clear:both;
}

/* সাইডবার কন্টেইনার ফিক্স */
.woocommerce-MyAccount-navigation,
.opex-account-sidebar{
    width: 280px !important;
    flex-shrink: 0 !important;
    float: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* ডানপাশের মেইন কন্টেন্ট বক্স ফিক্স */
.woocommerce-MyAccount-content{
    flex-grow: 1 !important;
    background:#fff !important;
    border-radius:14px !important;
    padding:32px !important;
    box-shadow:0 1px 6px rgba(16,32,79,0.06) !important;
    overflow:hidden !important;
    float: none !important;
    width: auto !important;
    box-sizing: border-box !important;
}

/* ---------------- Profile Box ---------------- */
.opex-profile-box{
    background: linear-gradient(160deg, var(--opex-navy), var(--opex-navy-light));
    border-radius:14px;
    padding:28px 22px;
    text-align:center;
    color:#fff;
    margin-bottom:16px;
}

.opex-avatar{
    width:90px;
    height:90px;
    margin:0 auto 16px;
    border-radius:50%;
    border:3px solid var(--opex-gold);
    overflow:hidden;
}

.opex-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
}

.opex-profile-box h3{
    font-size:16px;
    font-weight:700;
    line-height:1.4;
    margin:0 0 6px;
    word-break:break-word;
    color:#ffffff !important;
}

.opex-profile-box p{
    font-size:13px;
    color:#c7cde3;
    margin:0 0 18px;
}

.opex-edit-profile-btn{
    display:inline-block;
    background:var(--opex-gold);
    color:var(--opex-navy) !important;
    font-weight:700;
    font-size:14px;
    padding:10px 26px;
    border-radius:24px;
    text-decoration:none;
    transition:background .2s ease;
}

.opex-edit-profile-btn:hover{
    background:var(--opex-gold-dark);
}

/* ---------------- Sidebar Menu (ভাঙা বর্ডার ও এলাইনমেন্ট ফিক্স) ---------------- */
.woocommerce-MyAccount-navigation ul,
.opex-account-nav ul{
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

.woocommerce-MyAccount-navigation ul li,
.opex-account-nav ul li{
    margin-bottom: 0 !important;
    padding: 0 !important;
    height: auto !important;
    line-height: normal !important;
    background: transparent !important;
    border: none !important;
}

.woocommerce-MyAccount-navigation ul li a,
.opex-account-nav ul li a{
    display:flex !important;
    align-items:center !important;
    gap:12px !important;
    padding:16px 20px !important;
    background:#fff !important;
    border-radius:14px !important;
    box-shadow:0 1px 6px rgba(16,32,79,0.06) !important;
    color:var(--opex-navy) !important;
    font-size:15px !important;
    font-weight:600 !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    transition:all .2s ease !important;
    height: auto !important;
    line-height: 1.2 !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

.opex-menu-icon,
.woocommerce-MyAccount-navigation ul li a::before {
    display:inline-flex !important;
    color:var(--opex-navy) !important;
    margin: 0 !important;
}

.woocommerce-MyAccount-navigation ul li a:hover,
.opex-account-nav ul li a:hover{
    background:#f5f6fa !important;
}

/* অ্যাক্টিভ স্টেট ম্যাপিং */
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.active a,
.opex-account-nav ul li.is-active a{
    background:var(--opex-gold) !important;
    color:var(--opex-navy) !important;
    box-shadow:0 4px 10px rgba(247,181,0,0.35) !important;
}

/* ---------------- Dashboard Content ---------------- */
.opex-dashboard h2{
    font-size:28px;
    font-weight:800;
    color:var(--opex-navy);
    margin:0 0 10px;
}

.opex-dashboard-desc{
    color:var(--opex-text-muted);
    font-size:14.5px;
    line-height:1.6;
    max-width:720px;
    margin:0 0 28px;
}

.opex-section-title{
    font-size:19px;
    font-weight:700;
    color:var(--opex-navy);
    margin:0 0 16px;
}

/* ---------------- Stat Cards (শপইঞ্জিন গ্রিড ফিক্স) ---------------- */
/* প্লাগইনের ভাঙা কন্টেইনারকে গ্রিড করা */
.woocommerce-MyAccount-content > div:nth-of-type(1),
.shopengine-order-statistics,
.opex-stats-grid{
    display:grid !important;
    grid-template-columns:repeat(4,1fr) !important;
    gap:18px !important;
    margin-bottom:34px !important;
    width: 100% !important;
}

/* প্রতিটি কার্ডের ভেতরের কন্টেন্ট ফ্লেক্স করা */
.woocommerce-MyAccount-content > div:nth-of-type(1) > div,
.shopengine-stat-card,
.opex-stat-card{
    background: #fff !important;
    border:1px solid var(--opex-border) !important;
    border-radius:14px !important;
    padding:22px !important;
    text-align:left !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    box-sizing: border-box !important;
}

/* আইকনকে গোল বক্সে রূপান্তর */
.woocommerce-MyAccount-content > div:nth-of-type(1) > div i,
.woocommerce-MyAccount-content > div:nth-of-type(1) > div svg,
.shopengine-stat-icon,
.opex-stat-icon{
    width:48px !important;
    height:48px !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin-bottom:16px !important;
    order: 1 !important;
}

/* আইকন ব্যাকগ্রাউন্ড কালার */
.woocommerce-MyAccount-content > div:nth-of-type(1) > div:nth-child(1) i, .opex-icon-purple{ background:#ece9fd !important; color:var(--opex-purple) !important; }
.woocommerce-MyAccount-content > div:nth-of-type(1) > div:nth-child(2) i, .opex-icon-orange{ background:#fdf1de !important; color:var(--opex-orange) !important; }
.woocommerce-MyAccount-content > div:nth-of-type(1) > div:nth-child(3) i, .opex-icon-blue{ background:#e5f0ff !important; color:var(--opex-blue) !important; }
.woocommerce-MyAccount-content > div:nth-of-type(1) > div:nth-child(4) i, .opex-icon-green{ background:#e2f8ee !important; color:var(--opex-green) !important; }

/* সংখ্যা ফিক্স */
.woocommerce-MyAccount-content > div:nth-of-type(1) > div font,
.woocommerce-MyAccount-content > div:nth-of-type(1) > div span:first-of-type,
.shopengine-stat-number,
.opex-stat-number{
    font-size:26px !important;
    font-weight:800 !important;
    color:var(--opex-navy) !important;
    line-height:1 !important;
    margin-bottom:6px !important;
    display: block !important;
    order: 2 !important;
}

/* টেক্সট লেবেল ফিক্স */
.woocommerce-MyAccount-content > div:nth-of-type(1) > div p,
.woocommerce-MyAccount-content > div:nth-of-type(1) > div span:last-of-type,
.shopengine-stat-label,
.opex-stat-label{
    font-size:13.5px !important;
    color:var(--opex-text-muted) !important;
    margin: 0 !important;
    order: 3 !important;
}

/* ---------------- Recent Orders Table ---------------- */
.woocommerce-orders-table,
.opex-orders-table-wrap{
    border:1px solid var(--opex-border) !important;
    border-radius:14px !important;
    overflow:hidden !important;
    width: 100% !important;
    margin-top: 15px !important;
}

.woocommerce-orders-table,
.opex-recent-orders-table{
    width:100% !important;
    border-collapse:collapse !important;
}

.woocommerce-orders-table thead tr,
.opex-recent-orders-table thead tr{
    background:#f7f8fb !important;
}

.woocommerce-orders-table th,
.opex-recent-orders-table th{
    text-align:left !important;
    padding:14px 20px !important;
    font-size:13px !important;
    font-weight:700 !important;
    color:var(--opex-navy) !important;
    text-transform:uppercase !important;
    letter-spacing:.3px !important;
    border: none !important;
}

.woocommerce-orders-table td,
.opex-recent-orders-table td{
    padding:16px 20px !important;
    font-size:14px !important;
    border-top:1px solid var(--opex-border) !important;
    color:#333 !important;
}

.woocommerce-orders-table td a,
.opex-recent-orders-table a{
    color:var(--opex-blue) !important;
    font-weight:600 !important;
    text-decoration:none !important;
}

/* উকমার্স অর্ডার স্ট্যাটাস ব্যাজ */
.woocommerce-orders-table__cell-order-status span,
.opex-status-badge{
    display:inline-block !important;
    padding:5px 14px !important;
    border-radius:20px !important;
    font-size:12px !important;
    font-weight:700 !important;
    color:#fff !important;
    background:var(--opex-blue) !important;
}

.woocommerce-orders-table button.view,
.woocommerce-button.view,
.opex-view-btn{
    display:inline-block !important;
    padding:7px 18px !important;
    border-radius:20px !important;
    background:var(--opex-navy) !important;
    color:#fff !important;
    font-size:13px !important;
    font-weight:600 !important;
    text-decoration: none !important;
}

/* ---------------- Responsive (মোবাইলে ২ কলাম ১০০% ফিক্সড কোড) ---------------- */
@media (max-width: 991px) {
    .woocommerce-account .woocommerce { 
        display: block !important;
        padding: 15px !important; 
    }
    
    .woocommerce-MyAccount-navigation, 
    .opex-account-sidebar { 
        width: 100% !important; 
        float: none !important;
        margin-right: 0 !important;
        margin-bottom: 24px !important;
    }

    .woocommerce-MyAccount-content {
        width: 100% !important;
        float: none !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }

    /* স্ট্যাট কার্ডের মেইন রুট বক্সকে গ্রিড করা */
    .woocommerce-MyAccount-content > div:nth-of-type(1), 
    .shopengine-order-statistics, 
    .opex-stats-grid { 
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; 
        gap: 12px !important;
        width: 100% !important;
        float: none !important;
        clear: both !important;
    }

    /* কার্ডগুলোর ওপর অন্য কোনো প্লাগইনের জোর খাটানো বন্ধ করার জন্য */
    .woocommerce-MyAccount-content > div:nth-of-type(1) > div,
    .shopengine-stat-card,
    .opex-stat-card {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }
}

@media (max-width: 480px) {
    .woocommerce-MyAccount-content > div:nth-of-type(1) > div,
    .shopengine-stat-card,
    .opex-stat-card {
        padding: 15px 12px !important;
    }
    .woocommerce-MyAccount-content > div:nth-of-type(1) > div font,
    .shopengine-stat-number,
    .opex-stat-number {
        font-size: 22px !important;
    }
}