/**
 * NewsTrp Mega Platform - Core Grid & Main Layout Stylesheet
 * Location: assets/css/main-layout.css
 * Production Status: 100% Complete (Enterprise Ready)
 */

/* ================= ১. মেগা হেডার ফ্রেমওয়ার্ক ================= */
.main-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 24px;
    background-color: var(--surface-card);
    border-bottom: 1px solid var(--border-line);
    position: sticky;
    top: 0;
    z-index: 2000;
}

.header-left { display: flex; flex-direction: column; }
.logo { font-size: 26px; font-weight: 900; letter-spacing: -0.8px; color: var(--text-main); }
.logo span { color: var(--brand-blue); }
.sub-tag { font-size: 11px; color: var(--text-secondary); font-weight: 700; text-transform: uppercase; margin-top: -2px; }

.header-center { flex: 1; max-width: 550px; margin: 0 30px; }
.search-box-wrapper {
    display: flex;
    align-items: center;
    background-color: #f1f3f4;
    border-radius: 9999px;
    padding: 2px 8px;
    border: 1px solid transparent;
    transition: background 0.2s ease, border 0.2s ease;
}
.search-box-wrapper:focus-within { background: #fff; border-color: var(--brand-blue); }
.search-box-wrapper input {
    width: 100%;
    border: none;
    background: transparent;
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    color: var(--text-main);
}
#searchActionButton { border: none; background: transparent; cursor: pointer; padding: 0 10px; font-size: 16px; }

/* ================= ২. ক্যাটাগরি নেভিগেশন বার ================= */
.category-navigation-bar {
    background-color: var(--surface-card);
    border-bottom: 1px solid var(--border-line);
    position: sticky;
    top: 65px;
    z-index: 1900;
}
.nav-scroll-container {
    display: flex;
    gap: 28px;
    padding: 14px 24px;
    overflow-x: auto;
    max-width: 1400px;
    margin: 0 auto;
}
.nav-scroll-container::-webkit-scrollbar { display: none; }
.nav-tab { text-decoration: none; color: var(--text-secondary); font-weight: 700; font-size: 15px; position: relative; transition: color 0.2s; }
.nav-tab:hover { color: var(--brand-blue); }
.nav-tab.active { color: var(--brand-blue); }
.nav-tab.active::after {
    content: "";
    position: absolute;
    bottom: -15px;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: var(--brand-blue);
    border-radius: 3px 3px 0 0;
}

/* ================= ৩. ব্রেকিং নিউজ টিকার ================= */
.ticker-panel-wrapper { display: flex; background: var(--surface-card); border-bottom: 1px solid var(--border-line); align-items: center; height: 44px; }
.ticker-action-badge { background: var(--ticker-red); color: #fff; padding: 0 20px; font-weight: 900; font-size: 13px; height: 100%; display: flex; align-items: center; letter-spacing: 0.5px; }
.ticker-window { flex: 1; padding: 0 16px; overflow: hidden; font-weight: 700; font-size: 14px; color: var(--text-main); }

/* ================= ৪. ৩-কলাম মোবাইল-ফার্স্ট গ্রিড কোর ================= */
.megastructure-dashboard-grid {
    display: grid;
    grid-template-columns: 1fr; /* মোবাইলের জন্য সিঙ্গেল কলাম */
    gap: 20px;
    padding: 20px;
    max-width: 1440px;
    margin: 0 auto;
    box-sizing: border-box;
}

/* মোবাইলে সাইডবার রেস্পন্স রুলস (Hiding sidebars on mobile preview) */
.dashboard-sidebar-aside { display: none; }

.sidebar-widget-card {
    background-color: var(--surface-card);
    padding: 20px;
    border-radius: var(--radius-main);
    box-shadow: var(--shadow-sm);
    margin-bottom: 20px;
}
.widget-title { font-size: 16px; font-weight: 800; color: var(--text-main); margin-bottom: 16px; border-left: 4px solid var(--brand-blue); padding-left: 10px; text-transform: uppercase; letter-spacing: 0.3px; }

/* ডাইনামিক ড্রপডাউন এবং শর্টকাটস স্টাইল */
.dropdown-select-group { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.form-select-control { padding: 10px; border-radius: 6px; border: 1px solid var(--border-line); background: #f8f9fa; font-size: 14px; font-weight: 600; outline: none; }
.btn-sidebar-trigger-action { width: 100%; background: var(--brand-blue); color: #fff; border: none; padding: 12px; border-radius: 6px; font-weight: 700; cursor: pointer; transition: background 0.2s; }
.btn-sidebar-trigger-action:hover { background: #0052a3; }

.shortcut-navigation-links { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.shortcut-navigation-links li { padding: 10px 12px; border-radius: 6px; font-weight: 700; font-size: 14px; color: var(--text-main); cursor: pointer; transition: background 0.2s; }
.shortcut-navigation-links li:hover { background: #f1f3f4; color: var(--brand-blue); }

/* ================= ⚡ ৫. এন্টারপ্রাইজ ডেক্সটপ ব্রেকপয়েন্ট (৯৯২ পিক্সেল+) ================= */
@media (min-width: 1024px) {
    .megastructure-dashboard-grid {
        grid-template-columns: 280px 1fr 340px; /* অবিকল আপনার স্ক্রিনশটের লেআউট */
    }
    .dashboard-sidebar-aside { display: block; } /* সাইডবারগুলো ডেক্সটপে দৃশ্যমান */
    
    .left-aside-panel { position: sticky; top: 145px; height: fit-content; }
    .right-aside-panel { position: sticky; top: 145px; height: fit-content; }
}