/**
 * assets/css/footer-full.css — পাবলিক ফুটারের (app/templates/footer.php,
 * PART 36-এ রিবিল্ড হওয়া `.webbazarbd-new-footer` মার্কআপ) রেসপনসিভ CSS।
 * PART 37 এ নতুন তৈরি — home-v01.css/primary-style.css সাইট-ওয়াইড ও বিশাল
 * (home-v01.css মূলত Elementor widget-hash-নির্দিষ্ট CSS, সরাসরি এডিট করা
 * ঝুঁকিপূর্ণ) বলে সেগুলো স্পর্শ না করে, hero-banner.css/about-us.css/
 * services-section.css এর মতো এই সেকশনের নিজস্ব আলাদা স্কোপড ফাইলের একই
 * কনভেনশন অনুসরণ করে বানানো হলো।
 *
 * *** কনফ্লিক্ট নোট (গুরুত্বপূর্ণ) ***
 * এই ফাইল লেখার আগে assets/css/*.css গ্রেপ করে PART 36-এ ব্যবহৃত সব নতুন
 * ক্লাস-নাম (footer-brand, footer-quick-links, footer-contact, footer-heading,
 * footer-address, footer-phone, footer-email, footer-brand-logo,
 * footer-description, footer-contact-list) চেক করা হয়েছে — কোথাও আগে থেকে
 * সংজ্ঞায়িত নেই। তবে PART 36-এ *পুনর্ব্যবহৃত* (নতুন না) `.footer-links`
 * ক্লাসের একটা কনফ্লিক্ট পাওয়া গেছে: assets/css/about-us.css এ একটা
 * অসম্পর্কিত/মৃত ফুটার-মকআপের `.footer-links`/`.footer-links li a`/
 * `.footer-links li a:hover` সিলেক্টর আছে (শুধু about-us পেজে লোড হয়, কিন্তু
 * সেই পেজেও এই একই app/templates/footer.php require হয়) — আর header.php-তে
 * এই ফাইলের <link> about-us.css এর *আগে* বসানো হচ্ছে (single-page.css এর পরে,
 * about-us.css $extra_css লুপে সবার শেষে লোড হয়), তাই শুধু সোর্স-অর্ডারে ভরসা
 * করলে about-us.css জিতে যেত। এড়াতে নিচের সব সিলেক্টর ইচ্ছাকৃতভাবে
 * `.webbazarbd-new-footer` র‍্যাপারসহ নেস্টেড/মাল্টি-ক্লাস রাখা হয়েছে যাতে
 * স্পেসিফিসিটি সবসময় about-us.css এর সিঙ্গল/ডাবল-ক্লাস রুলের চেয়ে বেশি থাকে
 * (কোনো !important লাগেনি) — about-us.css এর একটা লাইনও এডিট করা হয়নি।
 *
 * ব্রেকপয়েন্ট (Bootstrap 5 গ্রিড কনভেনশন অনুসরণ, প্রজেক্ট আগে থেকেই
 * bootstrap.min.css লোড করে): ≥992px ডেস্কটপ (৩-কলাম), 576px-991px ট্যাবলেট
 * (২-কলাম), <576px মোবাইল (১-কলাম স্ট্যাক, মার্কআপ-অর্ডার অনুযায়ী: ব্র্যান্ড →
 * কুইক লিংক → যোগাযোগ → কপিরাইট)।
 *
 * কালার নোট: footer_background_color/footer_text_color (wb_site_settings)
 * এখনো এই নতুন ক্লাসগুলোতে ওয়্যার করা হয়নি (এই PART-এ app/templates/footer.php
 * স্পর্শ করা বারণ ছিল) — তাই নিচে সেন্সিবল স্ট্যাটিক ফলব্যাক কালার (ডার্ক
 * ব্যাকগ্রাউন্ড + হালকা টেক্সট) দেওয়া হলো যাতে খালি চোখে ফুটারটা এখনই ঠিকঠাক
 * দেখায়; ডাইনামিক কালার ওয়্যারিং ভবিষ্যতের একটা PART-এর কাজ (CLAUDE.md দ্রষ্টব্য)।
 */

.webbazarbd-new-footer {
    --footer-bg: #16181d;
    --footer-text: rgba(255, 255, 255, 0.75);
    --footer-heading: #ffffff;
    --footer-link: rgba(255, 255, 255, 0.75);
    --footer-link-hover: #ffffff;
    --footer-border: rgba(255, 255, 255, 0.1);
    --footer-social-bg: rgba(255, 255, 255, 0.08);
    --footer-social-bg-hover: #0072ed;

    background-color: var(--footer-bg);
    color: var(--footer-text);
    padding: 56px 0 0;
    font-size: 15px;
}

.webbazarbd-new-footer .footer-top {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px 40px;
}

/* --- ব্র্যান্ড কলাম --- */
.webbazarbd-new-footer .footer-brand-logo {
    max-height: 48px;
    width: auto;
    display: block;
    margin-bottom: 16px;
}

.webbazarbd-new-footer .footer-brand-logo-text {
    display: inline-block;
    font-size: 22px;
    font-weight: 700;
    color: var(--footer-heading);
    margin-bottom: 16px;
}

.webbazarbd-new-footer .footer-brand .footer-description {
    line-height: 1.7;
    margin: 0 0 20px;
    color: var(--footer-text);
}

.webbazarbd-new-footer .footer-brand .social-icons {
    display: flex;
    gap: 10px;
}

.webbazarbd-new-footer .footer-brand .social-icons a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--footer-social-bg);
    color: var(--footer-heading);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color 0.25s ease;
}

.webbazarbd-new-footer .footer-brand .social-icons a:hover {
    background-color: var(--footer-social-bg-hover);
}

/* --- হেডিং (কুইক লিংক + যোগাযোগ কলাম শেয়ার করে) --- */
.webbazarbd-new-footer .footer-heading {
    font-size: 18px;
    font-weight: 600;
    color: var(--footer-heading);
    margin: 0 0 20px;
    position: relative;
    padding-bottom: 10px;
}

.webbazarbd-new-footer .footer-heading::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 36px;
    height: 2px;
    background-color: var(--footer-social-bg-hover);
}

/* --- কুইক লিংক কলাম --- */
.webbazarbd-new-footer .footer-quick-links .footer-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.webbazarbd-new-footer .footer-quick-links .footer-links li {
    margin-bottom: 12px;
}

.webbazarbd-new-footer .footer-quick-links .footer-links li a {
    color: var(--footer-link);
    text-decoration: none;
    transition: color 0.25s ease, padding-left 0.25s ease;
    display: inline-block;
}

.webbazarbd-new-footer .footer-quick-links .footer-links li a:hover {
    color: var(--footer-link-hover);
    padding-left: 6px;
    text-decoration: underline;
}

/* --- যোগাযোগ কলাম --- */
.webbazarbd-new-footer .footer-contact-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.webbazarbd-new-footer .footer-contact-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    line-height: 1.6;
}

.webbazarbd-new-footer .footer-contact-list li i {
    color: var(--footer-social-bg-hover);
    margin-top: 4px;
    flex-shrink: 0;
}

.webbazarbd-new-footer .footer-contact-list li a {
    color: var(--footer-link);
    text-decoration: none;
    transition: color 0.25s ease;
}

.webbazarbd-new-footer .footer-contact-list li a:hover {
    color: var(--footer-link-hover);
    text-decoration: underline;
}

/* --- কপিরাইট বার (বিদ্যমান footer-bottom, PART 36 থেকে অপরিবর্তিত মার্কআপ) --- */
.webbazarbd-new-footer .footer-bottom {
    border-top: 1px solid var(--footer-border);
    padding: 18px 20px;
    text-align: center;
    font-size: 13px;
    color: var(--footer-text);
}

/* === ট্যাবলেট: 576px - 991px — ২ কলাম (ব্র্যান্ড পুরো সারি, কুইক লিংক +
       যোগাযোগ পাশাপাশি) === */
@media (max-width: 991px) {
    .webbazarbd-new-footer .footer-top {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
    }

    .webbazarbd-new-footer .footer-brand {
        grid-column: 1 / -1;
    }
}

/* === মোবাইল: <576px — ১ কলাম স্ট্যাক (মার্কআপ-অর্ডার: ব্র্যান্ড → কুইক লিংক →
       যোগাযোগ → কপিরাইট) === */
@media (max-width: 575px) {
    .webbazarbd-new-footer {
        padding-top: 40px;
    }

    .webbazarbd-new-footer .footer-top {
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 0 20px 32px;
    }

    .webbazarbd-new-footer .footer-brand {
        grid-column: auto;
    }

    .webbazarbd-new-footer .footer-brand .social-icons {
        justify-content: flex-start;
    }
}