/*
Theme Name: Shopnin
Author: MD Safar Uddin
Description: A custom minimal E-commerce theme for Shopnin.
Version: 1.0
Text Domain: shopnin
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&display=swap');

/* --- 1. Global Styles --- */
body {
    font-family: 'Inter', sans-serif;
    margin: 0;
    padding: 0;
    color: #111;
}
a {
    text-decoration: none;
    color: #333;
    transition: color 0.3s ease;
}
a:hover {
    color: #ff6600;
}

/* --- 2. Layout & Container --- */
.container {
    max-width: 1200px; /* ডেস্কটপের জন্য নির্দিষ্ট সাইজ */
    margin: 0 auto;
    padding: 0 15px;
    width: 100%;
    box-sizing: border-box;
}

/* --- 3. Header Top (Logo, Search, Cart) --- */
.site-header {
    border-bottom: 1px solid #eee;
}
.header-top {
    padding: 25px 0;
}
.header-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Logo */
.site-branding { flex: 0 0 auto; }
.site-branding .site-title { font-size: 32px; font-weight: 800; margin: 0; }
/* Custom Logo Image Style */
.site-branding img.custom-logo {
    max-width: 190px; 
    height: auto;
    display: block;
}

/* Search */
.header-search { flex: 1; max-width: 600px; margin: 0 40px; }
.header-search form { display: flex; width: 100%; }
.header-search form input[type="search"] {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #ff6600;
    border-right: none;
    outline: none;
}
.header-search form button {
    background-color: #ff6600;
    color: #fff;
    border: 2px solid #ff6600;
    padding: 12px 25px;
    cursor: pointer;
    font-weight: bold;
}

/* Cart */
.header-cart { flex: 0 0 auto; }
.cart-link { display: flex; align-items: center; gap: 10px; }
.cart-icon { font-size: 28px; }
.cart-details { display: flex; flex-direction: column; font-size: 14px; font-weight: bold; line-height: 1.2; }
.cart-total { color: #ff6600; }

/* --- 4. Header Bottom (Navigation Menu) --- */
.header-bottom {
    background-color: #fff;
    border-top: 1px solid #eee;
}
.nav-list {
    display: flex;
    gap: 30px;
    list-style: none;
    margin: 0;
    padding: 15px 0;
}
.nav-list li a {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: #333;
}
.nav-list li a:hover {
    color: #ff6600;
}

/* --- Dropdown Sub-menu Styling --- */
.nav-list li { position: relative; }
.nav-list .sub-menu {
    display: none; position: absolute; top: 100%; left: 0; background-color: #ffffff; min-width: 220px; box-shadow: 0 8px 20px rgba(0,0,0,0.1); padding: 10px 0; margin: 0; list-style: none; z-index: 999; border-top: 3px solid #ff6600;
}
.nav-list li:hover > .sub-menu { display: block; animation: fadeIn 0.3s ease; }
.nav-list .sub-menu li { width: 100%; }
.nav-list .sub-menu li a { display: block; padding: 10px 20px; font-size: 14px; font-weight: 400; text-transform: capitalize; color: #444; transition: all 0.2s ease; }
.nav-list .sub-menu li a:hover { background-color: #f9f9f9; color: #ff6600; padding-left: 25px; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* --- Mobile Responsive Fixes --- */
@media (max-width: 768px) {
    .header-flex { flex-wrap: wrap; }
    .site-branding { order: 1; flex: 1; }
    .header-cart { order: 2; flex: 0 0 auto; }
    .header-search { order: 3; flex: 0 0 100%; max-width: 100%; margin: 20px 0 0 0; }
    .nav-list { flex-wrap: wrap; gap: 15px; padding: 10px 0; }
}

/* --- 5. Main Content Area --- */
.site-main {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 15px;
    min-height: 50vh;
}
.page-title { font-size: 32px; font-weight: 600; margin-bottom: 30px; }
.post { margin-bottom: 40px; }
.post-title { font-size: 24px; font-weight: 600; margin-bottom: 10px; }
.post-content { font-size: 16px; color: #555; line-height: 1.6; }

/* --- 8. Hero Slider Styling --- */
.hero-slider-container { width: 100%; margin: 0 auto; border-bottom: 5px solid #eee; }
.myHeroSlider { width: 100%; max-width: 1920px; margin: 0 auto; }
.myHeroSlider .swiper-slide a { display: block; width: 100%; }
.myHeroSlider .swiper-slide img { width: 100%; height: auto; object-fit: cover; display: block; }
.myHeroSlider .swiper-button-next, .myHeroSlider .swiper-button-prev { color: #ffffff; background-color: rgba(0, 0, 0, 0.3); padding: 30px 20px; border-radius: 4px; transform: scale(0.6); }
.myHeroSlider .swiper-button-next:hover, .myHeroSlider .swiper-button-prev:hover { background-color: #ff6600; }
.myHeroSlider .swiper-pagination-bullet-active { background-color: #ff6600; }

/* --- 9. New Arrival Section --- */
.new-arrival-section { margin: 60px auto; padding: 0 15px; }
.section-title { text-align: center; font-size: 28px; font-weight: 600; margin-bottom: 40px; color: #111; text-transform: uppercase; }

/* --- WooCommerce Styling --- */
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 20px !important; margin: 0 !important; padding: 0 !important; }
.woocommerce ul.products li.product { width: 100% !important; max-width: 100% !important; margin: 0 !important; float: none !important; background: #fff; padding: 15px; box-sizing: border-box; border: 1px solid #eee; border-radius: 8px; transition: box-shadow 0.3s ease, transform 0.3s ease; text-align: center; }
.woocommerce ul.products li.product:hover { box-shadow: 0 10px 25px rgba(0,0,0,0.08); transform: translateY(-5px); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 16px; color: #111; }
.woocommerce ul.products li.product .price { color: #ff6600; font-size: 16px; font-weight: bold; }
.woocommerce span.onsale { background-color: #ff6600; border-radius: 4px; }

/* Product Image Uniform Size Fix */
.woocommerce ul.products li.product a img { width: 100% !important; height: 300px !important; object-fit: cover !important; object-position: top center; border-radius: 8px; margin-bottom: 5px; }

/* --- 10. Buy Now & Add to Cart Buttons Styling --- */
.woocommerce ul.products li.product .action-buttons-flex { display: flex; gap: 10px; justify-content: space-between; margin-top: 15px; }
.woocommerce ul.products li.product .action-buttons-flex .button { flex: 1; padding: 10px 5px !important; font-size: 13px !important; font-weight: 600 !important; border-radius: 4px !important; text-align: center; text-transform: uppercase; transition: all 0.3s ease !important; margin: 0 !important; border: none !important; cursor: pointer; display: flex; justify-content: center; align-items: center; }
.woocommerce ul.products li.product .action-buttons-flex .buy-now-button { background-color: #111 !important; color: #fff !important; border: 1px solid #111 !important; }
.woocommerce ul.products li.product .action-buttons-flex .buy-now-button:hover { background-color: #fff !important; color: #111 !important; transform: translateY(-3px); }
.woocommerce ul.products li.product .action-buttons-flex .add_to_cart_button { background-color: #ff6600 !important; color: #fff !important; border: 1px solid #ff6600 !important; }
.woocommerce ul.products li.product .action-buttons-flex .add_to_cart_button:hover { background-color: #fff !important; color: #ff6600 !important; transform: translateY(-3px); }

@media (max-width: 992px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 768px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: 15px !important; } .woocommerce ul.products li.product { padding: 10px; } }

/* --- 11. New 4-Column Footer Styling (FIXED) --- */
.site-footer {
    display: block !important; /* পুরোনো flex কনফ্লিক্ট সমাধান করা হলো */
    width: 100%;
    background-color: #ffffff;
    border-top: 1px solid #eee;
    padding: 60px 0 0 0;
    margin-top: 60px;
}
.site-footer .container { max-width: 1200px; margin: 0 auto; padding: 0 15px; width: 100%; box-sizing: border-box; }
.footer-widgets { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 40px; }
.footer-col { display: flex; flex-direction: column; }
.footer-logo { margin-bottom: 20px; }
.footer-logo img { max-width: 200px; height: auto; display: block; }
.footer-desc { font-size: 13px; color: #555; line-height: 1.6; margin: 0; }
.footer-heading { font-size: 16px; font-weight: 600; margin-top: 0; margin-bottom: 20px; color: #111; }
.contact-list { list-style: none !important; padding: 0; margin: 0; }
.contact-list li { font-size: 13px; color: #555; margin-bottom: 12px; display: flex; align-items: flex-start; gap: 10px; line-height: 1.4; }

/* কপিরাইট বার */
.footer-bottom {
    width: 100%;
    background-color: #fff;
    border-top: 1px solid #eee;
    padding: 20px 0;
    text-align: center;
    clear: both;
    display: block;
}
.footer-bottom p { margin: 0; font-size: 13px; color: #888; text-align: center; width: 100%; }

/* ফুটার মোবাইল রেসপন্সিভ */
@media (max-width: 992px) { .footer-widgets { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 576px) { .footer-widgets { grid-template-columns: 1fr; gap: 30px; } }



/* --- Account Icon & Header Actions Styling --- */
.header-actions {
    display: flex;
    align-items: center;
    gap: 25px; 
    flex: 0 0 auto;
}
.account-link {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #333;
    border-left: 2px solid #eee; 
    padding-left: 20px;
}
.account-icon {
    font-size: 26px; 
    transition: transform 0.3s ease, color 0.3s ease;
}
.account-link:hover .account-icon {
    color: #ff6600;
    transform: scale(1.1);
}
@media (max-width: 768px) {
    .header-actions { order: 2; flex: 0 0 auto; border-left: none; padding-left: 0; }
    .account-link { border-left: none; padding-left: 0; }
}








/* =========================================
   Ultimate Direct Checkout Fix (বামে ফর্ম, ডানে বিল)
========================================= */

/* ১. সব অপ্রয়োজনীয় ফিল্ড জোর করে মুছে ফেলা হলো */
#billing_company_field,
#billing_country_field,
#billing_address_2_field,
#billing_city_field,
#billing_state_field,
#billing_postcode_field,
#billing_last_name_field,
.woocommerce-additional-fields,
.woocommerce-shipping-fields {
    display: none !important;
}

/* ২. নাম ও ফোন নাম্বারের বক্স ফুল-উইডথ করা হলো */
#billing_first_name_field, 
#billing_phone_field {
    width: 100% !important;
    float: none !important;
}

/* ৩. চেকআউট পেজকে ডানে-বামে সুন্দর দুটি বক্সে ভাগ করা হলো */
.woocommerce-checkout .woocommerce {
    max-width: 1100px !important;
    margin: 0 auto !important;
}

.woocommerce-checkout form.checkout::before, 
.woocommerce-checkout form.checkout::after { 
    display: none !important; 
}

.woocommerce-checkout form.checkout {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: row !important; /* <--- ফর্ম বামে এবং বিল ডানে রাখার কোড */
    justify-content: space-between !important;
    align-items: flex-start !important;
    margin-top: 40px !important;
}

/* বাম পাশের ফর্ম বক্স (Customer Details) */
.woocommerce-checkout #customer_details {
    width: 48% !important;
    float: none !important;
    border: 1px solid #1f425d !important;
    padding: 30px !important;
    border-radius: 8px !important;
    background: #fff !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* ডান পাশের অর্ডার সামারি বক্স (Order Review) */
.woocommerce-checkout #order_review_heading { 
    display: none !important; 
}

.woocommerce-checkout #order_review {
    width: 48% !important;
    float: none !important;
    border: 1px solid #1f425d !important;
    padding: 30px !important;
    border-radius: 8px !important;
    background: #fff !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout .col2-set .col-1, 
.woocommerce-checkout .col2-set .col-2 { 
    width: 100% !important; 
    padding: 0 !important; 
    float: none !important;
}

/* ইনপুট বক্স ও বাটন ডিজাইন */
.woocommerce-checkout .form-row label { font-size: 14px; font-weight: 600; margin-bottom: 8px; display: block; color: #111; }
.woocommerce-checkout .form-row input,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea { 
    width: 100% !important; padding: 12px 15px !important; border: 1px solid #1f425d !important; 
    border-radius: 4px !important; box-sizing: border-box !important; outline: none !important; 
}

/* Place Order বাটন (কালো রঙের ডিজাইন) */
#place_order { 
    background-color: #000 !important; color: #fff !important; font-size: 20px !important; 
    font-weight: bold !important; padding: 15px !important; width: 100% !important; 
    border-radius: 4px !important; border: none !important; cursor: pointer !important; margin-top: 20px !important; transition: 0.3s ease !important; 
}
#place_order:hover { background-color: #ff6600 !important; }

/* মোবাইল স্ক্রিনের জন্য রেসপন্সিভ */
@media (max-width: 768px) {
    .woocommerce-checkout form.checkout { flex-direction: column !important; }
    .woocommerce-checkout #customer_details, 
    .woocommerce-checkout #order_review { width: 100% !important; padding: 20px !important; margin-bottom: 20px !important;}
}


/* =========================================
   8. SINGLE PRODUCT PAGE DESIGN (Modern Look)
========================================= */

/* মেইন লেআউট (বামে ছবি, ডানে বিস্তারিত) */
.woocommerce div.product {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #eee;
}

/* বাম পাশের ছবির গ্যালারি */
.woocommerce div.product div.images {
    width: 48% !important;
    margin-bottom: 40px;
}
.woocommerce div.product div.images img {
    border-radius: 8px;
    border: 1px solid #f5f5f5;
}

/* ডান পাশের প্রোডাক্ট ডিটেইলস */
.woocommerce div.product div.summary {
    width: 48% !important;
    margin-bottom: 40px;
}

/* টাইটেল এবং দামের ডিজাইন */
.woocommerce div.product .product_title {
    font-size: 32px;
    font-weight: 800;
    color: #111;
    margin-bottom: 15px;
    line-height: 1.2;
}
.woocommerce div.product p.price {
    color: #ff6600 !important;
    font-size: 26px !important;
    font-weight: bold;
    margin-bottom: 25px;
}

/* Add to Cart সেকশন (বাটন ও কোয়ান্টিটি) */
.woocommerce div.product form.cart {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-top: 30px;
    align-items: center;
    padding-top: 20px;
    border-top: 1px dashed #ddd;
}

/* কোয়ান্টিটি (পণ্য কমানো/বাড়ানোর বক্স) */
.woocommerce div.product form.cart .quantity input.qty {
    width: 80px;
    height: 50px;
    padding: 10px;
    border: 2px solid #eee;
    border-radius: 4px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    outline: none;
}

/* Add to cart বাটন */
.woocommerce div.product form.cart .single_add_to_cart_button {
    flex: 1;
    height: 50px;
    background-color: #000 !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    border: none !important;
    transition: 0.3s ease !important;
    cursor: pointer;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover {
    background-color: #ff6600 !important;
}

/* নিচের ডেসক্রিপশন ও রিভিউ ট্যাব */
.woocommerce div.product .woocommerce-tabs {
    width: 100%;
    margin-top: 30px;
    border-top: 1px solid #eee;
    padding-top: 30px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent;
    border: none;
    border-radius: 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #ff6600;
    border-bottom: 2px solid #ff6600;
}

/* মোবাইল রেসপন্সিভ */
@media (max-width: 768px) {
    .woocommerce div.product div.images, 
    .woocommerce div.product div.summary {
        width: 100% !important;
    }
    .woocommerce div.product .product_title {
        font-size: 24px;
    }
    .woocommerce div.product form.cart {
        flex-direction: column;
        align-items: stretch;
    }
    .woocommerce div.product form.cart .quantity input.qty {
        width: 100%;
        margin-bottom: 10px;
    }
}

// ==========================================
// ৯. ইনভয়েস ও থ্যাংক ইউ পেজে শুধু নাম ও ঠিকানা দেখানোর ম্যাজিক
// ==========================================
add_filter( 'woocommerce_localisation_address_formats', 'topshop_custom_address_format' );
function topshop_custom_address_format( $formats ) {
    // বাংলাদেশের (BD) ঠিকানায় শুধু নাম, বিস্তারিত ঠিকানা এবং দেশের নাম (Bangladesh) দেখাবে।
    // ডিফল্ট শহর বা জেলা (যেমন: Dhaka) আর কোথাও প্রিন্ট হবে না।
    $formats['BD'] = "{name}\n{address_1}\n{country}";
    return $formats;
}



/* =========================================
 /* =========================================
   ১৩. SINGLE PRODUCT PAGE DESIGN (লাল ও কালো বাটন)
========================================= */

.woocommerce div.product {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
}
.woocommerce div.product div.images { width: 48% !important; margin-bottom: 40px; }
.woocommerce div.product div.summary { width: 48% !important; margin-bottom: 40px; }

/* বাটন সেকশন ডিজাইন (পাশাপাশি) */
.woocommerce div.product form.cart {
    display: flex;
    flex-wrap: nowrap; /* এক লাইনে রাখার জন্য */
    gap: 10px;
    margin-top: 30px;
    align-items: center;
}

/* কোয়ান্টিটি বক্স */
.woocommerce div.product form.cart .quantity input.qty {
    width: 60px; height: 45px; border: 1px solid #ccc; 
    border-radius: 4px; font-size: 16px; font-weight: bold; text-align: center; outline: none;
}

/* Add to cart (কার্টে যোগ করুন) - লাল বাটন */
.woocommerce div.product form.cart .single_add_to_cart_button {
    flex: 1; height: 45px; background-color: #ff0000 !important; color: #fff !important; 
    font-size: 16px !important; font-weight: bold !important; border-radius: 4px !important; 
    border: none !important; transition: 0.3s ease !important; cursor: pointer;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover { background-color: #cc0000 !important; }

/* Buy Now (অর্ডার করুন) - কালো বাটন */
.woocommerce div.product form.cart .buy-now-button {
    flex: 1; height: 45px; background-color: #000000 !important; color: #fff !important; 
    font-size: 16px !important; font-weight: bold !important; border-radius: 4px !important; 
    border: none !important; transition: 0.3s ease !important; cursor: pointer; 
    display: flex; align-items: center; justify-content: center; text-decoration: none !important;
}
.woocommerce div.product form.cart .buy-now-button:hover { background-color: #333333 !important; }

/* ভিডিও লেআউট */
.topshop-product-video-wrapper { width: 100%; clear: both; }

/* মোবাইল রেসপন্সিভ */
@media (max-width: 768px) {
    .woocommerce div.product div.images, .woocommerce div.product div.summary { width: 100% !important; }
    .woocommerce div.product form.cart { flex-wrap: wrap; }
    .woocommerce div.product form.cart .single_add_to_cart_button, 
    .woocommerce div.product form.cart .buy-now-button { width: 100%; flex: none; margin-bottom: 10px; }
}

/* =========================================
   ১৪. সাইডবার/উইজেট এরিয়া চিরতরে হাইড করা
========================================= */
.woocommerce #secondary, 
.woocommerce #sidebar, 
.woocommerce .widget-area {
    display: none !important;
}

/* মেইন কন্টেন্টকে পুরো স্ক্রিন জুড়ে (100%) দেওয়া হলো */
.woocommerce #primary,
.woocommerce #content,
.woocommerce .site-main {
    width: 100% !important;
    float: none !important;
    margin: 0 auto !important;
}





/* =========================================
   কোয়ান্টিটি বক্স এবং বাটনগুলোর সাইজ একদম সমান করার ম্যাজিক
========================================= */
.woocommerce div.product form.cart {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important; 
    gap: 12px !important;
}

.woocommerce div.product form.cart .quantity {
    margin: 0 !important;
}

/* তিনটি বক্সেরই উচ্চতা (Height) একদম সমান 48px করে দেওয়া হলো */
.woocommerce div.product form.cart .quantity input.qty,
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart .buy-now-button {
    height: 48px !important; 
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 15px !important;
    border-radius: 4px !important;
}

/* কোয়ান্টিটি বক্সের ডিজাইন ফিক্স */
.woocommerce div.product form.cart .quantity input.qty {
    width: 70px !important;
    border: 1px solid #ccc !important;
    line-height: 46px !important; /* বর্ডারের জন্য 2px কম */
}

/* বাটনগুলোর লেখা একদম মাঝখানে আনার ফিক্স */
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart .buy-now-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 48px !important;
}

/* =========================================
   ১৮. বাটনের পজিশন পরিবর্তন (অর্ডার করুন আগে, কার্টে যোগ করুন পরে)
========================================= */

/* কোয়ান্টিটি বক্স থাকবে একদম প্রথমে (১ নম্বরে) */
.woocommerce div.product form.cart .quantity {
    order: 1 !important;
}

/* কালো 'অর্ডার করুন' বাটন চলে আসবে মাঝখানে (২ নম্বরে) */
.woocommerce div.product form.cart .buy-now-button {
    order: 2 !important;
}

/* লাল 'কার্টে যোগ করুন' বাটন চলে যাবে শেষে (৩ নম্বরে) */
.woocommerce div.product form.cart .single_add_to_cart_button {
    order: 3 !important;
}


/* =========================================
/* =========================================
   ১৯. My Account পেজের সুপার প্রিমিয়াম ড্যাশবোর্ড ডিজাইন
========================================= */

/* মেইন কন্টেইনারকে ফ্লেক্সবক্সে লক করা হলো যেন নিচে না নামে */
.woocommerce-account .woocommerce {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    gap: 30px !important;
    margin: 40px auto 60px !important;
    max-width: 1200px !important;
}

/* বাম পাশের সাইডবার মেনু */
.woocommerce-account .woocommerce-MyAccount-navigation {
    width: 30% !important;
    background: #ffffff !important;
    padding: 20px 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06) !important;
    border: 1px solid #f0f0f0 !important;
    box-sizing: border-box !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    border-bottom: 1px solid #f9f9f9 !important;
    transition: all 0.3s ease !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block !important;
    padding: 15px 30px !important;
    color: #444 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

/* হোভার এবং একটিভ স্টেট (খুবই স্মুথ ও প্রিমিয়াম লুক) */
.woocommerce-account .woocommerce-MyAccount-navigation ul li:hover a,
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    color: #ff6600 !important;
    padding-left: 40px !important;
    background: #fff8f5 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active {
    border-left: 4px solid #ff6600 !important;
}

/* ডান পাশের কন্টেন্ট এরিয়া */
.woocommerce-account .woocommerce-MyAccount-content {
    width: calc(70% - 30px) !important;
    background: #ffffff !important;
    padding: 40px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06) !important;
    border: 1px solid #f0f0f0 !important;
    box-sizing: border-box !important;
}

/* "পুরনো পাসওয়ার্ড" ঘরটি লুকিয়ে ফেলা */
.woocommerce-EditAccountForm .form-row:has(#password_current) {
    display: none !important;
}

/* ফর্মের ইনপুট এবং বাটনগুলোর মডার্ন ডিজাইন */
.woocommerce-account .woocommerce-MyAccount-content input[type="text"],
.woocommerce-account .woocommerce-MyAccount-content input[type="password"],
.woocommerce-account .woocommerce-MyAccount-content input[type="email"] {
    padding: 12px 15px !important;
    border-radius: 6px !important;
    border: 1px solid #e0e0e0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: 0.3s !important;
}

.woocommerce-account .woocommerce-MyAccount-content input:focus {
    border-color: #ff6600 !important;
    outline: none !important;
    box-shadow: 0 0 5px rgba(255,102,0,0.2) !important;
}

.woocommerce-account .woocommerce-MyAccount-content button[type="submit"] {
    background: #ff6600 !important;
    color: #fff !important;
    padding: 12px 30px !important;
    border-radius: 6px !important;
    border: none !important;
    font-size: 16px !important;
    font-weight: bold !important;
    transition: 0.3s !important;
    cursor: pointer !important;
    margin-top: 15px !important;
}

.woocommerce-account .woocommerce-MyAccount-content button[type="submit"]:hover {
    background: #e65c00 !important;
    box-shadow: 0 5px 15px rgba(255,102,0,0.3) !important;
}

/* মোবাইল ভার্সন ফিক্স (রেসপন্সিভ) */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce {
        flex-direction: column !important;
        gap: 20px !important;
    }
    .woocommerce-account .woocommerce-MyAccount-navigation {
        width: 100% !important;
        padding: 10px 0 !important;
    }
    .woocommerce-account .woocommerce-MyAccount-content {
        width: 100% !important;
        padding: 25px !important;
    }
}