/**
 * MultiEarnBD — Night mode (Light / Dark / System)
 * ==========================================================================
 * এই ফাইলটি সবার শেষে লোড হয় (main.css/style.css এর পরে), তাই override
 * করতে পারে। সব স্টাইল [data-bs-theme="dark"] এর ভেতরে থাকে — অর্থাৎ light
 * মোডে এই ফাইলটির কোনো প্রভাব নেই (শূন্য ঝুঁকি)।
 *
 * স্তরভেদে কী কী কভার করা হয়েছে:
 *   ১) শেয়ারড ভ্যারিয়েবল + চাঁদ-আইকন switcher      → সব লেআউট
 *   ২) NiceAdmin (user + admin ড্যাশবোর্ড) override
 *   ৩) Landing (frontend) override  — ভ্যারিয়েবল-ভিত্তিক
 *   ৪) Third-party (SweetAlert2, Quill, Summernote WYSIWYG)
 *   ৫) Print/receipt → জোর করে Light
 * ==========================================================================
 */

/* --------------------------------------------------------------------------
   ১) শেয়ারড ভ্যারিয়েবল (light + dark)
   -------------------------------------------------------------------------- */
:root {
    --me-bg: #f6f9ff;
    --me-surface: #ffffff;
    --me-surface-2: #f8f9fa;
    --me-border: #e3e9f3;
    --me-text: #444444;
    --me-heading: #012970;
    --me-muted: #7b8794;
    --me-link: #4154f1;
    --me-primary: #4154f1;
    --me-shadow: 0 4px 20px rgba(1, 41, 112, .08);
    --me-shadow-lg: 0 10px 35px rgba(1, 41, 112, .12);
    --me-switch-bg: rgba(15, 23, 42, .08);
    --me-switch-bg-hover: rgba(15, 23, 42, .16);
}

[data-bs-theme="dark"] {
    color-scheme: dark;

    --me-bg: #0f1116;
    --me-surface: #171a21;
    --me-surface-2: #1d2129;
    --me-border: #2b313d;
    --me-text: #c9d1de;
    --me-heading: #e9eef8;
    --me-muted: #94a0b4;
    --me-link: #9aa8ff;
    --me-primary: #7c8cff;
    --me-shadow: 0 6px 22px rgba(0, 0, 0, .5);
    --me-shadow-lg: 0 14px 40px rgba(0, 0, 0, .6);
    --me-switch-bg: rgba(255, 255, 255, .14);
    --me-switch-bg-hover: rgba(255, 255, 255, .26);
}

/* --------------------------------------------------------------------------
   ১.১) Night mode switcher (চাঁদ আইকন + ৩-মোড মেনু)
   -------------------------------------------------------------------------- */
.theme-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    color: inherit;
    line-height: 1;
}

.theme-switcher-btn,
.theme-switcher-caret {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 34px;
    padding: 0 8px;
    border: 0;
    border-radius: 8px;
    background: var(--me-switch-bg);
    color: inherit; /* হেডারের যেকোনো রঙে খাপ খাবে (সাদা / গাঢ় teal) */
    font-size: 16px;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.theme-switcher-btn { border-top-right-radius: 0; border-bottom-right-radius: 0; padding-right: 6px; }
.theme-switcher-caret { border-top-left-radius: 0; border-bottom-left-radius: 0; padding-left: 4px; font-size: 11px; }
.theme-switcher-caret i { transition: transform .2s ease; }

.theme-switcher-btn:hover,
.theme-switcher-caret:hover { background: var(--me-switch-bg-hover); color: inherit; }
.theme-switcher-btn:active { transform: scale(.94); }
.theme-switcher-btn:focus-visible,
.theme-switcher-caret:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }

/* বর্তমান মোড অনুযায়ী শুধু একটি আইকন দেখাবে (JS চলার আগে চাঁদ) */
.theme-icon-dark { display: inline-block; }
.theme-icon-light, .theme-icon-system { display: none; }
[data-theme-mode="light"] .theme-icon-dark,
[data-theme-mode="system"] .theme-icon-dark { display: none; }
[data-theme-mode="light"] .theme-icon-light { display: inline-block; }
[data-theme-mode="system"] .theme-icon-system { display: inline-block; }

.theme-switcher.is-open .theme-switcher-caret i { transform: rotate(180deg); }

/* মেনু */
.theme-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 168px;
    padding: 6px;
    border: 1px solid var(--me-border);
    border-radius: 10px;
    background: var(--me-surface);
    box-shadow: var(--me-shadow-lg);
    z-index: 1080;
    display: none;
}

.theme-switcher.is-open .theme-menu { display: block; }

.theme-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--me-text);
    font-size: 13.5px;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}

.theme-menu-item i { font-size: 15px; color: var(--me-muted); }
.theme-menu-item:hover { background: var(--me-surface-2); color: var(--me-heading); }
.theme-menu-item.is-active { background: var(--me-primary); color: #fff; }
.theme-menu-item.is-active i { color: #fff; }

/* লেআউটভেদে বসানোর জায়গা */
.navmenu .theme-switcher-li { display: flex; align-items: center; margin-left: 6px; }
.header-nav .theme-switcher-item,
.topbar .theme-switcher-item { display: flex; align-items: center; }

@media (max-width: 575px) {
    .theme-switcher-btn, .theme-switcher-caret { height: 32px; font-size: 15px; }
}

/* --------------------------------------------------------------------------
   ১.২) Base + scrollbar
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] body { background: var(--me-bg); color: var(--me-text); }
[data-bs-theme="dark"] a { color: var(--me-link); }
[data-bs-theme="dark"] a:hover { color: #b9c2ff; }

[data-bs-theme="dark"] h1, [data-bs-theme="dark"] h2, [data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4, [data-bs-theme="dark"] h5, [data-bs-theme="dark"] h6 {
    color: var(--me-heading);
}

[data-bs-theme="dark"] hr { border-color: var(--me-border); opacity: .35; }
[data-bs-theme="dark"] ::selection { background: var(--me-primary); color: #fff; }

[data-bs-theme="dark"] ::-webkit-scrollbar { width: 10px; height: 10px; }
[data-bs-theme="dark"] ::-webkit-scrollbar-track { background: #12141a; }
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #333a48;
    border-radius: 8px;
    border: 2px solid #12141a;
}
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #465064; }

/* --------------------------------------------------------------------------
   ২) NiceAdmin (user ড্যাশবোর্ড + admin প্যানেল) override
   মূল ফাইল: public/design/css/style.css
   -------------------------------------------------------------------------- */

/* Header (মূল টেমপ্লেটে #008374) */
[data-bs-theme="dark"] .header {
    background-color: #0f2f2b;
    box-shadow: 0 2px 14px rgba(0, 0, 0, .45);
}

[data-bs-theme="dark"] .header .logo span,
[data-bs-theme="dark"] .logo span { color: #eaf3f2 !important; }

[data-bs-theme="dark"] .header-nav .nav-link,
[data-bs-theme="dark"] .header .toggle-sidebar-btn { color: #e6eeed; }

[data-bs-theme="dark"] .header-nav .nav-profile .dropdown-toggle { color: #e6eeed; }

/* Sidebar */
[data-bs-theme="dark"] .sidebar {
    background-color: var(--me-surface);
    box-shadow: 0 0 20px rgba(0, 0, 0, .5);
    scrollbar-color: #3a4150 transparent;
}

[data-bs-theme="dark"] .sidebar-nav .nav-link { color: #c3cbdb; background: transparent; }
[data-bs-theme="dark"] .sidebar-nav .nav-link i { color: #8d9ab1; }

[data-bs-theme="dark"] .sidebar-nav .nav-link:not(.collapsed),
[data-bs-theme="dark"] .sidebar-nav .nav-link:hover,
[data-bs-theme="dark"] .sidebar-nav .nav-link.active {
    color: #ffffff;
    background: rgba(124, 140, 255, .16);
}

[data-bs-theme="dark"] .sidebar-nav .nav-link:not(.collapsed) i,
[data-bs-theme="dark"] .sidebar-nav .nav-link:hover i,
[data-bs-theme="dark"] .sidebar-nav .nav-link.active i { color: var(--me-primary); }

[data-bs-theme="dark"] .sidebar-nav .nav-content a { color: #b9c2d3; }
[data-bs-theme="dark"] .sidebar-nav .nav-content a:hover,
[data-bs-theme="dark"] .sidebar-nav .nav-content a.active { color: #ffffff; }
[data-bs-theme="dark"] .sidebar-nav .nav-content a i { color: #6f7b90; }

/* Main / Page title */
[data-bs-theme="dark"] #main { background: transparent; }
[data-bs-theme="dark"] .pagetitle h1, [data-bs-theme="dark"] .pagetitle h2 { color: var(--me-heading); }
[data-bs-theme="dark"] .pagetitle .breadcrumb { background: transparent; }
[data-bs-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { color: var(--me-muted); }

/* Card */
[data-bs-theme="dark"] .card {
    background-color: var(--me-surface);
    border: 1px solid var(--me-border);
    box-shadow: var(--me-shadow);
    color: var(--me-text);
}

[data-bs-theme="dark"] .card-title,
[data-bs-theme="dark"] .card-header h5,
[data-bs-theme="dark"] .card-header .card-title { color: var(--me-heading); }

[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text);
}

/* Table / DataTable */
[data-bs-theme="dark"] .table { color: var(--me-text); border-color: var(--me-border); }
[data-bs-theme="dark"] .table > :not(caption) > * > * { border-color: var(--me-border); background-color: transparent; }
[data-bs-theme="dark"] .table thead th,
[data-bs-theme="dark"] .table-light,
[data-bs-theme="dark"] .table > thead { background-color: var(--me-surface-2) !important; color: var(--me-heading); }
[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * { background-color: var(--me-surface-2); color: var(--me-heading); }
[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * { color: var(--me-text); }

[data-bs-theme="dark"] .datatable-wrapper .datatable-container,
[data-bs-theme="dark"] .datatable-selector,
[data-bs-theme="dark"] .datatable-input,
[data-bs-theme="dark"] .datatable-dropdown label {
    background-color: var(--me-surface-2);
    color: var(--me-text);
    border-color: var(--me-border);
}

[data-bs-theme="dark"] .datatable-pagination a,
[data-bs-theme="dark"] .datatable-pagination button { color: var(--me-text) !important; }
[data-bs-theme="dark"] .datatable-pagination .datatable-active a,
[data-bs-theme="dark"] .datatable-pagination .datatable-active button {
    background-color: var(--me-primary);
    color: #fff !important;
}

/* Form */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select,
[data-bs-theme="dark"] textarea.form-control {
    background-color: var(--me-surface-2);
    border: 1px solid var(--me-border);
    color: var(--me-text);
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background-color: var(--me-surface-2);
    border-color: var(--me-primary);
    color: #ffffff;
    box-shadow: 0 0 0 .2rem rgba(124, 140, 255, .25);
}

[data-bs-theme="dark"] .form-control::placeholder { color: #7c8698; }
[data-bs-theme="dark"] .input-group-text { background-color: var(--me-surface-2); border-color: var(--me-border); color: var(--me-muted); }
[data-bs-theme="dark"] .form-label, [data-bs-theme="dark"] label { color: var(--me-text); }
[data-bs-theme="dark"] .form-check-input { background-color: var(--me-surface-2); border-color: var(--me-border); }
[data-bs-theme="dark"] .form-text, [data-bs-theme="dark"] .text-muted { color: var(--me-muted) !important; }

/* Dropdown / Modal / List group / Tabs */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--me-surface);
    border: 1px solid var(--me-border);
    box-shadow: var(--me-shadow-lg);
}

[data-bs-theme="dark"] .dropdown-item { color: var(--me-text); }
[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus { background-color: var(--me-surface-2); color: var(--me-heading); }
[data-bs-theme="dark"] .dropdown-header { color: var(--me-muted); }
[data-bs-theme="dark"] .dropdown-divider { border-color: var(--me-border); }

[data-bs-theme="dark"] .modal-content { background-color: var(--me-surface); border: 1px solid var(--me-border); color: var(--me-text); }
[data-bs-theme="dark"] .modal-header, [data-bs-theme="dark"] .modal-footer { border-color: var(--me-border); }
[data-bs-theme="dark"] .modal-title { color: var(--me-heading); }
[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

[data-bs-theme="dark"] .list-group-item { background-color: var(--me-surface); border-color: var(--me-border); color: var(--me-text); }

[data-bs-theme="dark"] .nav-tabs-bordered .nav-link { color: var(--me-muted); }
[data-bs-theme="dark"] .nav-tabs-bordered .nav-link.active { background-color: var(--me-surface-2); border-color: var(--me-border); color: var(--me-heading); }

/* Utilities & ছোট এলিমেন্ট */
[data-bs-theme="dark"] .bg-white { background-color: var(--me-surface) !important; }
[data-bs-theme="dark"] .bg-light { background-color: var(--me-surface-2) !important; }

/* .text-dark → শুধু নিরপেক্ষ (neutral) সারফেসে হালকা হবে।
   হালকা/হলুদ ব্যাকগ্রাউন্ড থাকলে (bg-warning/bg-info/...) গাঢ়ই থাকবে —
   নাহলে হলুদ বাটনে ধূসর টেক্সট হয়ে যায় (সেকশন ৯.৭ দেখুন)। */
[data-bs-theme="dark"] .text-dark:not(.bg-warning):not(.bg-info):not(.bg-light):not(.bg-white):not(.bg-success):not(.bg-danger):not(.bg-primary):not(.bg-secondary) {
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .border, [data-bs-theme="dark"] .border-top, [data-bs-theme="dark"] .border-bottom,
[data-bs-theme="dark"] .border-start, [data-bs-theme="dark"] .border-end { border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .btn-light { background-color: var(--me-surface-2); border-color: var(--me-border); color: var(--me-text); }
[data-bs-theme="dark"] .btn-outline-dark { color: var(--me-text); border-color: var(--me-border); }

/* শুধু হালকা/সাদা ব্যাজ ডার্ক হবে — `badge bg-warning text-dark` স্পর্শ করা যাবে না
   (নাহলে হলুদ ব্যাজটাই হারিয়ে যায়) */
[data-bs-theme="dark"] .badge.bg-light { background-color: var(--me-surface-2) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .bg-dark-light { background-color: var(--me-surface-2) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .shadow, [data-bs-theme="dark"] .shadow-sm, [data-bs-theme="dark"] .shadow-lg { box-shadow: var(--me-shadow) !important; }
[data-bs-theme="dark"] code, [data-bs-theme="dark"] pre { color: #8ff0d0; }
[data-bs-theme="dark"] .footer { color: var(--me-muted); }
[data-bs-theme="dark"] .footer .copyright, [data-bs-theme="dark"] .footer .credits { color: var(--me-muted); }
[data-bs-theme="dark"] .back-to-top { background: var(--me-primary); color: #fff; }

/* --------------------------------------------------------------------------
   ৩) Landing (frontend) override — মূল টেমপ্লেটটি CSS ভ্যারিয়েবল-ভিত্তিক,
   তাই শুধু ভ্যারিয়েবল ওভাররাইড করলেই প্রায় পুরো পেজ ডার্ক হয়ে যায়।
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] {
    --background-color: #0f1116;   /* পুরো সাইটের ব্যাকগ্রাউন্ড */
    --default-color: #c9d1de;      /* সাধারণ টেক্সট */
    --heading-color: #e9eef8;      /* হেডিং */
    --surface-color: #171a21;      /* কার্ড/বক্স */
    --contrast-color: #ffffff;
    --nav-color: #e9eef8;
    --nav-hover-color: #7fe3d0;
    --nav-mobile-background-color: #171a21;
    --nav-dropdown-background-color: #1d2129;
    --nav-dropdown-color: #c9d1de;
    --nav-dropdown-hover-color: #7fe3d0;
}

/* ব্র্যান্ড-হেডার (মূল টেমপ্লেটে #008374) → ডার্কে গাঢ় টিল */
[data-bs-theme="dark"] .header { --background-color: #0f2f2b; --heading-color: #ffffff; }
[data-bs-theme="dark"] .topbar { background-color: #0b2320; }

/* হালকা সেকশন (light-background) → ডার্ক সেকশন */
[data-bs-theme="dark"] .light-background { --background-color: #12151b; --surface-color: #171a21; }

/* ফুটার + লোডিং স্ক্রিন (সাদা preloader = জঘন্য সাদা ঝলক) */
[data-bs-theme="dark"] .footer { background-color: #0c0e13; }
[data-bs-theme="dark"] #preloader { background: #0f1116 !important; }
[data-bs-theme="dark"] .scroll-top { background-color: var(--me-primary); color: #fff; }

/* সাধারণ এলিমেন্ট */
[data-bs-theme="dark"] .card, [data-bs-theme="dark"] .service-item, [data-bs-theme="dark"] .icon-box,
[data-bs-theme="dark"] .team-member, [data-bs-theme="dark"] .testimonial-item, [data-bs-theme="dark"] .pricing-item {
    background-color: var(--me-surface);
    border-color: var(--me-border) !important;
    color: var(--me-text);
}

[data-bs-theme="dark"] .form-control { background-color: var(--me-surface-2); border-color: var(--me-border); color: var(--me-text); }
[data-bs-theme="dark"] .form-control:focus { background-color: var(--me-surface-2); color: #fff; border-color: var(--me-primary); }
[data-bs-theme="dark"] select option { background-color: var(--me-surface-2); color: var(--me-text); }
[data-bs-theme="dark"] .bg-white, [data-bs-theme="dark"] .bg-light { background-color: var(--me-surface) !important; color: var(--me-text); }
[data-bs-theme="dark"] .text-dark:not(.bg-warning):not(.bg-info):not(.bg-light):not(.bg-white):not(.bg-success):not(.bg-danger):not(.bg-primary):not(.bg-secondary),
[data-bs-theme="dark"] .text-body { color: var(--me-text) !important; }
[data-bs-theme="dark"] .border { border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .table { color: var(--me-text); border-color: var(--me-border); }

/* --------------------------------------------------------------------------
   ৪) Third-party (SweetAlert2 / Quill / Summernote editor ইত্যাদি)
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .swal2-popup { background: var(--me-surface); color: var(--me-text); }
[data-bs-theme="dark"] .swal2-title, [data-bs-theme="dark"] .swal2-html-container { color: var(--me-heading); }
[data-bs-theme="dark"] .swal2-actions .swal2-cancel { background-color: var(--me-surface-2) !important; }

[data-bs-theme="dark"] .ql-toolbar.ql-snow, [data-bs-theme="dark"] .ql-container.ql-snow { border-color: var(--me-border); }
[data-bs-theme="dark"] .ql-snow .ql-stroke { stroke: var(--me-text); }
[data-bs-theme="dark"] .ql-snow .ql-fill { fill: var(--me-text); }
[data-bs-theme="dark"] .ql-snow .ql-picker { color: var(--me-text); }
[data-bs-theme="dark"] .ql-editor { color: var(--me-text); }

/* ---- ৪.১) Summernote WYSIWYG (Marquee Notice / Notice এডিটর) ----
   কেন দরকার
   ---------
   • Admin-এর `facebook_Sell_management`, `gmail_sell_management`,
     `instagram_Sell_management` পেজে "System Management → Enable" করলেই
     Marquee Notice ও Notice এডিটর (Summernote) দেখা যায় — কিন্তু এই
     ফাইলে `.note-*` ক্লাসের কোনো নিয়ম ছিল না ⇒ টুলবার, বাটন, ড্রপডাউন,
     কালার-প্যালেট ও মডাল সাদা/নেটিভ গ্রে-ই থেকে যেত।
   • আরও বড় সমস্যা: এডিটরের ভেতরের সংরক্ষিত কনটেন্টে hard-coded কালো
     কালার থাকে (`rgb(0, 0, 0)`, `rgb(33, 37, 41)`, `#000000`, legacy
     `<font color="#000000">`) ⇒ ডার্ক এডিটরে কালোয়-কালো হয়ে টেক্সট
     পড়া যেত না (একই কনটেন্ট ইউজার-সাইড `.marquee-container` /
     `.notice-bar`-এ দেখানোর সময়ও একই সমস্যা)।
   • Summernote-এর CSS পেজের শেষে (body-র মাঝে) লোড হয় — সমান
     specificity-তে সে জিতে যায়, তাই এখানে `!important` লাগে।
   -------------------------------------------------------------------------- */

/* ফ্রেম + টুলবার */
[data-bs-theme="dark"] .note-editor.note-frame,
[data-bs-theme="dark"] .note-editor.note-airframe {
    background-color: var(--me-surface) !important;
    border-color: var(--me-border) !important;
}

[data-bs-theme="dark"] .note-editor .note-toolbar {
    background-color: var(--me-surface-2) !important;
    background-image: none !important;
    border-color: var(--me-border) !important;
}

/* টুলবারের বাটন — নেটিভ গ্রে বাটন বন্ধ */
[data-bs-theme="dark"] .note-editor .note-btn,
[data-bs-theme="dark"] .note-popover .note-btn {
    background-color: var(--me-surface) !important;
    background-image: none !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
    box-shadow: none !important;
}

[data-bs-theme="dark"] .note-editor .note-btn:hover,
[data-bs-theme="dark"] .note-editor .note-btn:focus,
[data-bs-theme="dark"] .note-editor .note-btn.active,
[data-bs-theme="dark"] .note-editor .note-btn.show {
    background-color: #2a313d !important;
    border-color: #3a4352 !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .note-editor .note-btn:disabled,
[data-bs-theme="dark"] .note-editor .note-btn.disabled { opacity: .45 !important; }

[data-bs-theme="dark"] .note-editor .note-toolbar .note-current-fontname,
[data-bs-theme="dark"] .note-editor .note-toolbar .note-current-fontsize { color: var(--me-text) !important; }
[data-bs-theme="dark"] .note-editor .note-btn i { color: inherit !important; }

/* টাইপ করার এরিয়া */
[data-bs-theme="dark"] .note-editor .note-editing-area .note-editable {
    background-color: var(--me-surface-2) !important;
    color: var(--me-text) !important;
    caret-color: var(--me-primary);
}

[data-bs-theme="dark"] .note-editor .note-editing-area .note-codable {
    background-color: var(--me-surface) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .note-editor .note-placeholder { color: var(--me-muted) !important; }
[data-bs-theme="dark"] .note-editor .note-dropzone { background-color: var(--me-surface-2) !important; color: var(--me-muted) !important; }

/* স্ট্যাটাসবার (নিচের রিসাইজ হ্যান্ডেল) */
[data-bs-theme="dark"] .note-editor .note-statusbar { background-color: var(--me-surface-2) !important; border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .note-editor .note-statusbar .note-resizebar .note-icon-bar { border-top-color: var(--me-muted) !important; }

/* ড্রপডাউন / কালার-প্যালেট / পপওভার / হিন্ট (কালার-সোয়াচ অপরিবর্তিত) */
[data-bs-theme="dark"] .note-editor .note-dropdown-menu,
[data-bs-theme="dark"] .note-popover,
[data-bs-theme="dark"] .note-hint-popover {
    background-color: var(--me-surface) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
    box-shadow: var(--me-shadow-lg) !important;
}

[data-bs-theme="dark"] .note-editor .note-dropdown-menu a,
[data-bs-theme="dark"] .note-editor .note-dropdown-menu .dropdown-item,
[data-bs-theme="dark"] .note-popover .popover-content a,
[data-bs-theme="dark"] .note-popover .popover-content .dropdown-item { color: var(--me-text) !important; }

[data-bs-theme="dark"] .note-editor .note-dropdown-menu a:hover,
[data-bs-theme="dark"] .note-editor .note-dropdown-menu .dropdown-item:hover,
[data-bs-theme="dark"] .note-popover .popover-content a:hover,
[data-bs-theme="dark"] .note-hint-popover .popover-content .note-hint-item:hover {
    background-color: #232a35 !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .note-editor .note-color .note-dropdown-menu .note-palette-title {
    border-bottom-color: var(--me-border) !important;
    color: var(--me-heading) !important;
}

[data-bs-theme="dark"] .note-editor .note-color .note-dropdown-menu .note-palette .note-color-reset,
[data-bs-theme="dark"] .note-editor .note-color .note-dropdown-menu .note-palette .note-color-select {
    background-color: var(--me-surface-2) !important;
    color: var(--me-text) !important;
}

/* মডাল (লিংক / ছবি / ভিডিও / টেবিল) */
[data-bs-theme="dark"] .note-modal .modal-content {
    background-color: var(--me-surface) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .note-modal .modal-header,
[data-bs-theme="dark"] .note-modal .modal-footer { border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .note-modal .modal-title,
[data-bs-theme="dark"] .note-modal .note-form-label { color: var(--me-heading) !important; }

[data-bs-theme="dark"] .note-modal .note-input,
[data-bs-theme="dark"] .note-modal .form-control {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .note-modal .close { color: var(--me-text) !important; text-shadow: none !important; }

/* ---- ৪.১.১) ভেতরের সংরক্ষিত কালো/গাঢ় কালার — ডার্কে পড়ার উপযোগী ----
   DB-তে সেভ করা Marquee Notice / Notice কনটেন্টে `rgb(0, 0, 0)`,
   `rgb(33, 37, 41)`, `#000000` বা legacy `<font color="#000000">`
   থাকলে ডার্ক ব্যাকগ্রাউন্ডে টেক্সট invisible হয়ে যেত — পড়া যেত না।
   `inherit` দিয়ে প্যারেন্টের (ডার্ক-উপযোগী) রঙই নেওয়া হয় — ফলে
   এডিটরের টেক্সট সবসময় `--me-text`/হেডিং টোনে পড়া যায়। */
[data-bs-theme="dark"] .note-editable [style*="color: rgb(0, 0, 0)" i],
[data-bs-theme="dark"] .note-editable [style*="color:rgb(0,0,0)" i],
[data-bs-theme="dark"] .note-editable [style*="color: rgb(33, 37, 41)" i],
[data-bs-theme="dark"] .note-editable [style*="color:#000" i],
[data-bs-theme="dark"] .note-editable [style*="color: #000" i],
[data-bs-theme="dark"] .note-editable font[color="#000000" i],
[data-bs-theme="dark"] .note-editable font[color="#000" i],
[data-bs-theme="dark"] .note-editable font[color="black" i] { color: inherit !important; }

/* এডিটরে দেওয়া হালকা হাইলাইট (হলুদ) — উপরের টেক্সট গাঢ় হবে */
[data-bs-theme="dark"] .note-editable [style*="background-color: rgb(255, 255, 0)" i] { color: #0b1220 !important; }

/* --------------------------------------------------------------------------
   ৫) Print / Receipt — কাগজে কালো ব্যাকগ্রাউন্ড নয়: জোর করে Light
   -------------------------------------------------------------------------- */
@media print {
    html[data-bs-theme="dark"] body,
    html[data-bs-theme="dark"] .card,
    html[data-bs-theme="dark"] .modal-content,
    html[data-bs-theme="dark"] .table,
    html[data-bs-theme="dark"] .table td,
    html[data-bs-theme="dark"] .table th {
        background: #ffffff !important;
        color: #000000 !important;
        box-shadow: none !important;
    }

    html[data-bs-theme="dark"] .theme-switcher { display: none !important; }
}

/* --------------------------------------------------------------------------
   ৬) Elegance — ডার্ক মোডে স্মুথ ট্রানজিশন (motion কমাতে চাইলে বন্ধ)
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
    html[data-bs-theme] body,
    html[data-bs-theme] .card,
    html[data-bs-theme] .header,
    html[data-bs-theme] .sidebar {
        transition: background-color .25s ease, color .25s ease, border-color .25s ease;
    }
}

/* --------------------------------------------------------------------------
   ৭) হোম পেজের কার্ড ও টেক্সট (Night mode ফিক্স)
   মূল ফাইল: resources/views/frontend/pages/partials/home_styles.blade.php
   ওই ফাইল পেজ-স্টাইল হিসেবে পরে লোড হয়, তাই ভ্যারিয়েবল ওভাররাইডে
   `html[data-bs-theme="dark"]` ব্যবহার করা হয়েছে (specificity বেশি → সবসময় জিতে যাবে)।
   -------------------------------------------------------------------------- */
html[data-bs-theme="dark"] {
    --meb-brand: #45d6c3;   /* ডার্ক ব্যাকগ্রাউন্ডে পড়ার উপযোগী উজ্জ্বল টিল */
    --meb-ink: #e9eef8;     /* হেডিং / শক্ত টেক্সট */
    --meb-muted: #a2b1c6;   /* বডি টেক্সট */
    --meb-mint: #12151b;    /* সেকশন ও চিপের ব্যাকগ্রাউন্ড */
    --meb-line: #2b3442;    /* বর্ডার */
    --meb-shadow: 0 30px 60px -45px rgba(0, 0, 0, .85);
}

/* সাদা কার্ডগুলো → ডার্ক সারফেস (নাহলে ডার্ক পেজে জ্বলজ্বলে সাদা ব্লক) */
[data-bs-theme="dark"] .meb-strip,
[data-bs-theme="dark"] .meb-stat,
[data-bs-theme="dark"] .meb-highlight,
[data-bs-theme="dark"] .meb-step,
[data-bs-theme="dark"] .meb-why-card,
[data-bs-theme="dark"] .meb-proof-card,
[data-bs-theme="dark"] .meb-contact-card,
[data-bs-theme="dark"] .meb-pay-chip,
[data-bs-theme="dark"] .meb-faq .faq-item {
    background-color: var(--me-surface) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text);
}

/* আইকন-চিপ (mint ব্যাকগ্রাউন্ড) — ডার্কে mint রঙ অদৃশ্য হয়ে যেত */
[data-bs-theme="dark"] .meb-strip-item i,
[data-bs-theme="dark"] .meb-stat i,
[data-bs-theme="dark"] .meb-highlight i,
[data-bs-theme="dark"] .meb-why-ico,
[data-bs-theme="dark"] .meb-contact-card i,
[data-bs-theme="dark"] .meb-faq .faq-item h3 .num {
    background: rgba(69, 214, 195, .14) !important;
    border-color: rgba(69, 214, 195, .22) !important;
    color: var(--meb-brand) !important;
}

/* খোলা (active) FAQ নাম্বারটি আগের মতোই সলিড ব্র্যান্ড-রঙে থাকবে */
[data-bs-theme="dark"] .meb-faq .faq-item.faq-active h3 .num {
    background: var(--meb-brand) !important;
    color: #08231f !important;
}

/* হিরো-র ভাসমান কার্ড + outline বাটন */
[data-bs-theme="dark"] .meb-float-card {
    background: rgba(23, 26, 33, .96);
    border: 1px solid var(--me-border);
}

[data-bs-theme="dark"] .meb-btn--outline {
    background-color: var(--me-surface);
    border-color: var(--me-border);
    color: var(--meb-brand);
}

[data-bs-theme="dark"] .meb-btn--outline:hover { color: var(--meb-brand); border-color: var(--meb-brand); }

/* Eyebrow (ছোট লেবেল) — হালকা সেকশনে টিল, ডার্ক সেকশনে গোল্ড অপরিবর্তিত */
[data-bs-theme="dark"] .meb-head .meb-eyebrow,
[data-bs-theme="dark"] .meb-section--mint .meb-eyebrow,
[data-bs-theme="dark"] .meb-stats .meb-eyebrow,
[data-bs-theme="dark"] .meb-cta .meb-eyebrow {
    color: var(--meb-brand);
    background: rgba(69, 214, 195, .1);
    border-color: rgba(69, 214, 195, .22);
}

[data-bs-theme="dark"] .meb-section--dark .meb-eyebrow,
[data-bs-theme="dark"] .meb-faq-side .meb-eyebrow,
[data-bs-theme="dark"] .meb-hero .meb-eyebrow {
    color: var(--meb-gold-soft, #ffd977);
    background: rgba(255, 255, 255, .1);
    border-color: rgba(255, 255, 255, .2);
}

/* প্রুফ থাম্বনেইল + অ্যাভাটার বর্ডার */
[data-bs-theme="dark"] .meb-proof-thumb { background: #12151b; }
[data-bs-theme="dark"] .meb-proof-avatar { border-color: #2b3442; }

/* হোভার শ্যাডো ডার্কে আরও নরম */
[data-bs-theme="dark"] .meb-stat:hover,
[data-bs-theme="dark"] .meb-highlight:hover,
[data-bs-theme="dark"] .meb-why-card:hover,
[data-bs-theme="dark"] .meb-proof-card:hover,
[data-bs-theme="dark"] .meb-contact-card:hover {
    box-shadow: 0 26px 50px -34px rgba(0, 0, 0, .9);
}

/* ডার্কে সেকশনগুলো একসাথে মিশে যেত → হালকা সীমানা দেওয়া হলো */
[data-bs-theme="dark"] .meb-section--dark { border-top: 1px solid rgba(255, 255, 255, .06); }
[data-bs-theme="dark"] .meb-stats,
[data-bs-theme="dark"] .meb-section--mint,
[data-bs-theme="dark"] .meb-cta { border-top: 1px solid rgba(255, 255, 255, .04); }

/* --------------------------------------------------------------------------
   ৮) Login / Signup পেজ (`.auth-*`) — সাদা কার্ড/ইনপুট ডার্ক ফিক্স
   মূল ফাইল: resources/views/frontend/pages/partials/auth_styles.blade.php
   (ব্র্যান্ড প্যানেল `.auth-aside` আগেই ডার্ক-টিল ছিল — অপরিবর্তিত)
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .auth-section {
    background:
        radial-gradient(1100px 520px at 8% -8%, rgba(0, 131, 116, .16), transparent 62%),
        radial-gradient(900px 480px at 102% 4%, rgba(252, 178, 22, .1), transparent 58%),
        linear-gradient(180deg, #0f1116 0%, #12151b 58%);
}

[data-bs-theme="dark"] .auth-card {
    background: var(--me-surface);
    box-shadow: 0 45px 90px -48px rgba(0, 0, 0, .9), 0 0 0 1px rgba(69, 214, 195, .1);
}

[data-bs-theme="dark"] .auth-body { background: var(--me-surface); }
[data-bs-theme="dark"] .auth-title { color: var(--me-heading); }

[data-bs-theme="dark"] .auth-subtitle,
[data-bs-theme="dark"] .auth-back-link,
[data-bs-theme="dark"] .auth-strength-text,
[data-bs-theme="dark"] .auth-foot-note,
[data-bs-theme="dark"] .auth-support { color: var(--me-muted); }

[data-bs-theme="dark"] .auth-switch-link,
[data-bs-theme="dark"] .auth-back-link:hover,
[data-bs-theme="dark"] .auth-support a { color: #45d6c3; }

[data-bs-theme="dark"] .auth-field label { color: #cfe6e2; }

[data-bs-theme="dark"] .auth-input { background: var(--me-surface-2); border-color: var(--me-border); }

[data-bs-theme="dark"] .auth-input:focus-within {
    background: #1b1f27;
    border-color: #45d6c3;
    box-shadow: 0 0 0 4px rgba(69, 214, 195, .14);
}

[data-bs-theme="dark"] .auth-input input { color: var(--me-text); }
[data-bs-theme="dark"] .auth-input input::placeholder { color: #7c8698; }
[data-bs-theme="dark"] .auth-input > i,
[data-bs-theme="dark"] .auth-toggle { color: #8fa3b8; }
[data-bs-theme="dark"] .auth-toggle:hover { color: #45d6c3; }
[data-bs-theme="dark"] .auth-input.is-invalid { background: rgba(227, 93, 106, .1); border-color: #e35d6a; }

[data-bs-theme="dark"] .auth-badge-ref {
    color: #9ff0e4;
    background: rgba(69, 214, 195, .12);
    border-color: rgba(69, 214, 195, .28);
}

[data-bs-theme="dark"] .auth-alert-danger { background: rgba(227, 93, 106, .12); border-color: rgba(227, 93, 106, .35); color: #ffb3bd; }
[data-bs-theme="dark"] .auth-alert-info { background: rgba(69, 214, 195, .12); border-color: rgba(69, 214, 195, .3); color: #9ff0e4; }
[data-bs-theme="dark"] .auth-alert-success { background: rgba(67, 181, 129, .12); border-color: rgba(67, 181, 129, .3); color: #9be8bf; }

[data-bs-theme="dark"] .auth-error,
[data-bs-theme="dark"] .auth-check.is-invalid { color: #ff9aa8; }

[data-bs-theme="dark"] .auth-strength span { background: #2b3442; }
[data-bs-theme="dark"] .auth-check { color: var(--me-text); }
[data-bs-theme="dark"] .auth-check a { color: #45d6c3; }
[data-bs-theme="dark"] .auth-divider { color: #7c8698; }

[data-bs-theme="dark"] .auth-divider::before,
[data-bs-theme="dark"] .auth-divider::after { background: var(--me-border); }

[data-bs-theme="dark"] .auth-alt-btn {
    background: var(--me-surface);
    border-color: var(--me-border);
    color: var(--me-text);
}

[data-bs-theme="dark"] .auth-alt-btn:hover {
    border-color: #45d6c3;
    color: #45d6c3;
    background: var(--me-surface-2);
}

/* ---- Device-blocked signup: সাপোর্ট কার্ড (পেজেই তৈরি ডিটেইল) ---- */
[data-bs-theme="dark"] .auth-help {
    background: rgba(227, 93, 106, .08);
    border-color: rgba(227, 93, 106, .35);
}

[data-bs-theme="dark"] .auth-help-head { color: #ffb3bd; }
[data-bs-theme="dark"] .auth-help-list li > span { color: var(--me-muted); }

[data-bs-theme="dark"] .auth-help-list code {
    background: var(--me-surface-2);
    border-color: var(--me-border);
    color: #cfe6e2;
}

[data-bs-theme="dark"] .auth-help-label { color: #cfe6e2; }

[data-bs-theme="dark"] .auth-help-payload {
    background: var(--me-surface-2);
    border-color: var(--me-border);
    color: var(--me-text);
}

[data-bs-theme="dark"] .auth-help-payload:focus {
    border-color: #45d6c3;
    box-shadow: 0 0 0 4px rgba(69, 214, 195, .14);
}

[data-bs-theme="dark"] .auth-help-actions .auth-link-btn { color: #45d6c3; }
[data-bs-theme="dark"] .auth-help-links { border-top-color: rgba(227, 93, 106, .35); }
[data-bs-theme="dark"] .auth-help-note { color: var(--me-muted); }

/* ---- OTP ধাপ (signup verification + password reset) ---- */
[data-bs-theme="dark"] .auth-step {
    background: var(--me-surface-2);
    border-color: var(--me-border);
    color: var(--me-muted);
}

[data-bs-theme="dark"] .auth-step.is-active {
    background: rgba(69, 214, 195, .12);
    border-color: #45d6c3;
    color: #9ff0e4;
}

[data-bs-theme="dark"] .auth-step.is-done {
    background: rgba(67, 181, 129, .12);
    border-color: rgba(67, 181, 129, .35);
    color: #9be8bf;
}

[data-bs-theme="dark"] .auth-prefix { color: #8fa3b8; }
[data-bs-theme="dark"] .auth-hint { color: var(--me-muted); }
[data-bs-theme="dark"] .auth-input input[readonly] { color: #8fa3b8; background: transparent; }

[data-bs-theme="dark"] .auth-otp-panel {
    background: linear-gradient(180deg, rgba(69, 214, 195, .08), var(--me-surface));
    border-color: rgba(69, 214, 195, .28);
}

[data-bs-theme="dark"] .auth-otp-head i { color: #45d6c3; }
[data-bs-theme="dark"] .auth-otp-head strong { color: var(--me-heading); }

[data-bs-theme="dark"] .auth-otp-head span,
[data-bs-theme="dark"] .auth-otp-meta { color: var(--me-muted); }

[data-bs-theme="dark"] .auth-otp input {
    background: var(--me-surface-2);
    border-color: var(--me-border);
    color: var(--me-heading);
}

[data-bs-theme="dark"] .auth-otp input:focus {
    border-color: #45d6c3;
    box-shadow: 0 0 0 4px rgba(69, 214, 195, .14);
}

[data-bs-theme="dark"] .auth-link-btn { color: #45d6c3; }
[data-bs-theme="dark"] .auth-link-btn:disabled { color: #7c8698; }

/* ---- OTP modal (সাইনআপ ধাপ ২ — AJAX মডাল) ---- */
[data-bs-theme="dark"] .auth-otp-modal .modal-content {
    background: var(--me-surface);
    box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .85), 0 0 0 1px var(--me-border);
}

[data-bs-theme="dark"] .auth-otp-modal .modal-header,
[data-bs-theme="dark"] .auth-otp-modal-foot { border-color: var(--me-border); }

[data-bs-theme="dark"] .auth-otp-modal-title { color: var(--me-heading); }
[data-bs-theme="dark"] .auth-otp-modal-title i { color: #45d6c3; }
[data-bs-theme="dark"] .auth-otp-modal-foot .auth-otp-change { color: #45d6c3; }

/* ---- ট্যাব: Email link / Mobile OTP ---- */
[data-bs-theme="dark"] .auth-tabs { background: var(--me-surface-2); }
[data-bs-theme="dark"] .auth-tab { color: var(--me-muted); }

[data-bs-theme="dark"] .auth-tab.is-active {
    background: var(--me-surface);
    color: #45d6c3;
    box-shadow: 0 6px 14px -10px rgba(0, 0, 0, .85);
}

/* --------------------------------------------------------------------------
   ৯) ইউজার ড্যাশবোর্ড পেজগুলো (NiceAdmin + পেজ-ভিত্তিক inline স্টাইল)
   লক্ষ্য: টেক্সট, বাটন, ব্যাজ ও হোভার — সবই ডার্কে ঠিকঠাক পড়া যায়।
   -------------------------------------------------------------------------- */

/* ---- ৯.১) inline স্টাইলের প্যাটার্ন ওভাররাইড (inline beat করতে !important) ---- */

/* হালকা ব্যাকগ্রাউন্ড → ডার্ক সারফেস */
[data-bs-theme="dark"] [style*="background:#f8f9fa" i],
[data-bs-theme="dark"] [style*="background: #f8f9fa" i],
[data-bs-theme="dark"] [style*="background-color:#f8f9fa" i],
[data-bs-theme="dark"] [style*="background-color: #f8f9fa" i],
[data-bs-theme="dark"] [style*="background:#f9f9f9" i],
[data-bs-theme="dark"] [style*="background-color:#f9f9f9" i],
[data-bs-theme="dark"] [style*="background-color: #f9f9f9" i],
[data-bs-theme="dark"] [style*="background-color:#f8f8f8" i],
[data-bs-theme="dark"] [style*="background-color: #f8f8f8" i],
[data-bs-theme="dark"] [style*="background-color:#f3f3f3" i],
[data-bs-theme="dark"] [style*="background-color:#f5f8fa" i],
[data-bs-theme="dark"] [style*="background-color:#f4f7fb" i],
[data-bs-theme="dark"] [style*="background:#f6f9ff" i] {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
}

/* হালকা গ্রেডিয়েন্ট সেকশন (ছবির কার্ড/ফর্ম) → ডার্ক গ্রেডিয়েন্ট
   (সিলেক্টরে বন্ধনী না রেখে দুটি attribute শর্ত একসাথে দেওয়া হলো — স্পেসিং-নিরপেক্ষ) */
[data-bs-theme="dark"] [style*="gradient" i][style*="f8f9fa" i] {
    background: linear-gradient(135deg, #1a1e26, #12151b) !important;
    color: var(--me-text) !important;
}

/* হালকা বর্ডার */
[data-bs-theme="dark"] [style*="border-top: 2px dashed #ccc" i],
[data-bs-theme="dark"] [style*="border: 1px solid #ddd" i],
[data-bs-theme="dark"] [style*="border: 1px solid #eee" i],
[data-bs-theme="dark"] [style*="border:1px solid #ddd" i] {
    border-color: var(--me-border) !important;
}

/* গাঢ় টেক্সট → হালকা টেক্সট */
[data-bs-theme="dark"] [style*="color:#333" i],
[data-bs-theme="dark"] [style*="color: #333" i],
[data-bs-theme="dark"] [style*="color:#444" i],
[data-bs-theme="dark"] [style*="color: #444" i],
[data-bs-theme="dark"] [style*="color:#555" i],
[data-bs-theme="dark"] [style*="color: #555" i],
[data-bs-theme="dark"] [style*="color:#212529" i],
[data-bs-theme="dark"] [style*="color:black" i],
[data-bs-theme="dark"] [style*="color: black" i] {
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] [style*="color:gray" i],
[data-bs-theme="dark"] [style*="color: gray" i],
[data-bs-theme="dark"] [style*="color:grey" i] { color: var(--me-muted) !important; }

/* অর্থপূর্ণ রঙগুলো ডার্কে উজ্জ্বল করা */
[data-bs-theme="dark"] [style*="color:green" i],
[data-bs-theme="dark"] [style*="color: green" i] { color: #4ade80 !important; }
[data-bs-theme="dark"] [style*="color:red" i],
[data-bs-theme="dark"] [style*="color: red" i] { color: #ff7b7b !important; }

/* Bootstrap-ঘরানার হালকা অ্যালার্ট (inline) → ডার্ক সংস্করণ */
[data-bs-theme="dark"] [style*="background-color:#fff3cd" i],
[data-bs-theme="dark"] [style*="background:#fff3cd" i],
[data-bs-theme="dark"] [style*="background: #fff3cd" i] {
    background-color: rgba(255, 193, 7, .14) !important;
    color: #ffd77a !important;
    border-left-color: #ffc107 !important;
}

[data-bs-theme="dark"] [style*="background-color:#f8d7da" i],
[data-bs-theme="dark"] [style*="background:#f8d7da" i] {
    background-color: rgba(220, 53, 69, .16) !important;
    color: #ffb3bd !important;
    border-left-color: #dc3545 !important;
}

[data-bs-theme="dark"] [style*="background-color:#e3f2fd" i],
[data-bs-theme="dark"] [style*="background:#e3f2fd" i] {
    background-color: rgba(13, 110, 253, .16) !important;
    color: #9dc4ff !important;
    border-left-color: #0d6efd !important;
}

[data-bs-theme="dark"] [style*="color:#856404" i] { color: #ffd77a !important; }
[data-bs-theme="dark"] [style*="color:#721c24" i] { color: #ffb3bd !important; }

/* ---- ৯.২) ড্যাশবোর্ডের কার্ড ও কাস্টম কম্পোনেন্ট ---- */
[data-bs-theme="dark"] .income-card,
[data-bs-theme="dark"] .info-card,
[data-bs-theme="dark"] .revenue-card,
[data-bs-theme="dark"] .icon-box,
[data-bs-theme="dark"] .wallet-card {
    background-color: var(--me-surface) !important;
    border: 1px solid var(--me-border) !important;
    color: var(--me-text);
}

[data-bs-theme="dark"] .income-card:hover,
[data-bs-theme="dark"] .info-card:hover,
[data-bs-theme="dark"] .wallet-card:hover {
    background-color: #1d222b !important;
    border-color: rgba(124, 140, 255, .45) !important;
    box-shadow: 0 18px 38px -26px rgba(0, 0, 0, .95) !important;
}

/* নোটিশ বোর্ড (auto-scroll list) */
[data-bs-theme="dark"] .notice-board {
    background: var(--me-surface) !important;
    border-color: var(--me-border) !important;
    scrollbar-color: #3a4150 #12151b;
}
[data-bs-theme="dark"] .notice-list li {
    background: var(--me-surface-2) !important;
    border-bottom-color: var(--me-border) !important;
    color: var(--me-text) !important;
}
[data-bs-theme="dark"] .notice-list li:hover,
[data-bs-theme="dark"] .notice-list li a:hover { background-color: #232a35 !important; color: #fff !important; }
[data-bs-theme="dark"] .notice-board::-webkit-scrollbar-thumb { background: #3a4150; }

/* ড্যাশবোর্ডের ছোট কম্পোনেন্ট */
[data-bs-theme="dark"] .social_media h1,
[data-bs-theme="dark"] .rating-title { color: var(--me-heading) !important; }
[data-bs-theme="dark"] .social-icon { color: var(--me-muted) !important; }
[data-bs-theme="dark"] .social-icon:hover { color: #7c8cff !important; }
[data-bs-theme="dark"] .rating-number { color: var(--me-muted) !important; }
[data-bs-theme="dark"] .notice-box { background-color: var(--me-surface-2) !important; border-color: var(--me-border) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .notice-icon { color: var(--me-primary) !important; }

/* ---- ৯.৩) Reselling পেজের কাস্টম কম্পোনেন্ট ---- */
[data-bs-theme="dark"] .reseller-nav {
    background: var(--me-surface) !important;
    border: 1px solid var(--me-border) !important;
    box-shadow: var(--me-shadow) !important;
}

[data-bs-theme="dark"] .reseller-nav .nav-item a { color: var(--me-text) !important; background: transparent !important; }

[data-bs-theme="dark"] .reseller-nav .nav-item a:hover {
    background: rgba(124, 140, 255, .14) !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .reseller-nav .nav-item a.active {
    background: linear-gradient(135deg, #4c5fe0, #7c8cff) !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .search-bar input,
[data-bs-theme="dark"] .search-bar .form-control {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}
[data-bs-theme="dark"] .search-bar input::placeholder { color: #7c8698 !important; }
[data-bs-theme="dark"] .search-bar button { color: #fff !important; }

[data-bs-theme="dark"] .category-header {
    background: linear-gradient(135deg, #1a1e26, #12151b) !important;
    border: 1px solid var(--me-border) !important;
    color: var(--me-text) !important;
}
[data-bs-theme="dark"] .category-header h3 { color: var(--me-heading) !important; }

[data-bs-theme="dark"] .subcategory-item {
    background: var(--me-surface) !important;
    border: 1px solid var(--me-border) !important;
    color: var(--me-text) !important;
}
[data-bs-theme="dark"] .subcategory-item:hover {
    background: #1d222b !important;
    border-color: rgba(124, 140, 255, .45) !important;
}
[data-bs-theme="dark"] .subcategory-item h6 { color: var(--me-heading) !important; }
[data-bs-theme="dark"] .subcategory-item small { color: var(--me-muted) !important; }
[data-bs-theme="dark"] .divider { border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .earning { color: #4ade80 !important; }

/* ---- ৯.৪) ID-Sell পেজের কম্পোনেন্ট ---- */
[data-bs-theme="dark"] .community-section,
[data-bs-theme="dark"] .form-container {
    background: var(--me-surface) !important;
    border: 1px solid var(--me-border) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .community-section h1,
[data-bs-theme="dark"] .form-container h2 { color: var(--me-heading) !important; }
[data-bs-theme="dark"] .community-section p { color: var(--me-muted) !important; }

[data-bs-theme="dark"] .form-group input {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .notice-bar {
    background: rgba(255, 249, 196, .1) !important;
    border-color: rgba(255, 193, 7, .4) !important;
    color: #ffd77a !important;
}

[data-bs-theme="dark"] .marquee-container { background: var(--me-surface-2) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .copy-alert { background: var(--me-surface) !important; color: var(--me-text) !important; border-color: var(--me-border) !important; }

/* Marquee Notice / Notice ডিসপ্লেতে (ইউজার পেজ + ড্যাশবোর্ড নোটিশ বোর্ড)
   সংরক্ষিত কালো/গাঢ় inline কালার থাকলে ডার্ক পেজে অদৃশ্য হয়ে যেত —
   কনটেইনারের নিজের (ডার্ক-উপযোগী) রঙেই ফিরিয়ে আনা হয়। */
[data-bs-theme="dark"] .marquee-container [style*="color: rgb(0, 0, 0)" i],
[data-bs-theme="dark"] .marquee-container [style*="color:rgb(0,0,0)" i],
[data-bs-theme="dark"] .marquee-container [style*="color: rgb(33, 37, 41)" i],
[data-bs-theme="dark"] .marquee-container [style*="color:#000" i],
[data-bs-theme="dark"] .marquee-container [style*="color: #000" i],
[data-bs-theme="dark"] .marquee-container font[color="#000000" i],
[data-bs-theme="dark"] .marquee-container font[color="#000" i],
[data-bs-theme="dark"] .marquee-container font[color="black" i],
[data-bs-theme="dark"] .notice-bar [style*="color: rgb(0, 0, 0)" i],
[data-bs-theme="dark"] .notice-bar [style*="color:rgb(0,0,0)" i],
[data-bs-theme="dark"] .notice-bar [style*="color: rgb(33, 37, 41)" i],
[data-bs-theme="dark"] .notice-bar [style*="color:#000" i],
[data-bs-theme="dark"] .notice-bar [style*="color: #000" i],
[data-bs-theme="dark"] .notice-bar font[color="#000000" i],
[data-bs-theme="dark"] .notice-bar font[color="#000" i],
[data-bs-theme="dark"] .notice-bar font[color="black" i],
[data-bs-theme="dark"] .notice-board [style*="color: rgb(0, 0, 0)" i],
[data-bs-theme="dark"] .notice-board [style*="color:rgb(0,0,0)" i],
[data-bs-theme="dark"] .notice-board [style*="color: rgb(33, 37, 41)" i],
[data-bs-theme="dark"] .notice-board [style*="color:#000" i],
[data-bs-theme="dark"] .notice-board [style*="color: #000" i],
[data-bs-theme="dark"] .notice-board font[color="#000000" i],
[data-bs-theme="dark"] .notice-board font[color="#000" i],
[data-bs-theme="dark"] .notice-board font[color="black" i],
[data-bs-theme="dark"] .notice-list [style*="color: rgb(0, 0, 0)" i],
[data-bs-theme="dark"] .notice-list [style*="color:rgb(0,0,0)" i],
[data-bs-theme="dark"] .notice-list [style*="color: rgb(33, 37, 41)" i],
[data-bs-theme="dark"] .notice-list [style*="color:#000" i],
[data-bs-theme="dark"] .notice-list [style*="color: #000" i],
[data-bs-theme="dark"] .notice-list font[color="#000000" i],
[data-bs-theme="dark"] .notice-list font[color="#000" i],
[data-bs-theme="dark"] .notice-list font[color="black" i] { color: inherit !important; }

/* মার্কি/নোটিশে দেওয়া হালকা হাইলাইট (হলুদ) — উপরের টেক্সট গাঢ় হবে */
[data-bs-theme="dark"] .marquee-container [style*="background-color: rgb(255, 255, 0)" i],
[data-bs-theme="dark"] .notice-bar [style*="background-color: rgb(255, 255, 0)" i] { color: #0b1220 !important; }

[data-bs-theme="dark"] .suggestions span {
    background: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

/* ---- ৯.৫) কাউন্টডাউন / টাস্ক পেজের কাস্টম বক্স ---- */
[data-bs-theme="dark"] .custom-time-box,
[data-bs-theme="dark"] .custom-leaderboard-countdown-box {
    background: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .custom-digit { color: var(--me-heading) !important; }
[data-bs-theme="dark"] .custom-time-box .label { color: var(--me-muted) !important; }
[data-bs-theme="dark"] .auto-reload-loader,
[data-bs-theme="dark"] .reload-text { color: var(--me-muted) !important; }
[data-bs-theme="dark"] .tooltip-question { color: var(--me-primary) !important; }

/* ---- ৯.৬) সাধারণ Bootstrap/ডিজাইন কম্পোনেন্টের নিরাপত্তা-নেট ---- */

/* টেবিল */
[data-bs-theme="dark"] .table thead th { background-color: var(--me-surface-2) !important; color: var(--me-heading) !important; }
[data-bs-theme="dark"] .table tbody td, [data-bs-theme="dark"] .table tbody th { color: var(--me-text) !important; }
[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * { background-color: #1d222b !important; color: #fff !important; }
[data-bs-theme="dark"] .table-light, [data-bs-theme="dark"] .table > thead.table-light th { background-color: var(--me-surface-2) !important; color: var(--me-heading) !important; }
[data-bs-theme="dark"] .table-bordered > :not(caption) > * { border-color: var(--me-border) !important; }

/* বাটন — light / outline / secondary ও তাদের hover */
[data-bs-theme="dark"] .btn-light,
[data-bs-theme="dark"] .btn-white,
[data-bs-theme="dark"] .btn-secondary {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

[data-bs-theme="dark"] .btn-light:hover,
[data-bs-theme="dark"] .btn-light:focus,
[data-bs-theme="dark"] .btn-white:hover,
[data-bs-theme="dark"] .btn-secondary:hover,
[data-bs-theme="dark"] .btn-secondary:focus {
    background-color: #2a313d !important;
    border-color: #3a4352 !important;
    color: #fff !important;
}

[data-bs-theme="dark"] .btn-outline-primary { color: #9aa8ff !important; border-color: #4a58c9 !important; }
[data-bs-theme="dark"] .btn-outline-primary:hover,
[data-bs-theme="dark"] .btn-outline-primary:focus { background-color: #4c5fe0 !important; color: #fff !important; }

[data-bs-theme="dark"] .btn-outline-secondary { color: var(--me-muted) !important; border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .btn-outline-secondary:hover,
[data-bs-theme="dark"] .btn-outline-secondary:focus { background-color: #2a313d !important; color: #fff !important; }

[data-bs-theme="dark"] .btn-outline-dark { color: var(--me-text) !important; border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .btn-outline-dark:hover { background-color: #2a313d !important; color: #fff !important; }

[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(210%); opacity: .8; }
[data-bs-theme="dark"] .btn-link { color: var(--me-link); }

/* ব্যাজ ও অ্যালার্ট */
[data-bs-theme="dark"] .badge.bg-light,
[data-bs-theme="dark"] .badge.text-bg-light { background-color: var(--me-surface-2) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .badge.bg-white { background-color: var(--me-surface) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .alert-light { background-color: var(--me-surface-2); border-color: var(--me-border); color: var(--me-text); }
[data-bs-theme="dark"] .alert-secondary { background-color: #232a35; border-color: #333c4a; color: var(--me-text); }

/* --------------------------------------------------------------------------
   রঙিন অ্যালার্ট (success / danger / warning / info)
   --------------------------------------------------------------------------
   কেন দরকার: ID-Sell ম্যানেজমেন্ট পেজগুলো (facebook_Sell_management,
   gmail_sell_management, instagram_Sell_management) বডির শেষে পুরনো
   **Bootstrap 4.4.1 CSS** লোড করে (Summernote-এর জন্য)। Bootstrap 5.3-এর
   অ্যালার্ট রঙ `--bs-*-bg-subtle` ভ্যারিয়েবল দিয়ে আসে, কিন্তু BS4 সরাসরি
   `background-color:#d4edda` (#ffe5e5, #fff3cd …) বসায় — আর সেই ফাইল
   পরে লোড হয় ⇒ same specificity-তে BS4 জিতে যায় ⇒ ডার্ক মোডেও অ্যালার্ট
   হালকা সবুজ/লাল থেকে যেত, লেখা পড়া যেত না।
   নিচের রুলগুলো BS4-এর চেয়ে বেশি specificity-র (`[data-bs-theme="dark"]`
   প্রিফিক্স), তাই ডার্ক থিমে অ্যালার্ট ঠিকভাবে ডার্ক হয়।
   রঙগুলো এই ফাইলের `.auth-alert-*`-এর সাথে হুবহু মিলিয়ে রাখা হয়েছে।
   -------------------------------------------------------------------------- */
[data-bs-theme="dark"] .alert-success {
    background-color: rgba(67, 181, 129, .12);
    border-color: rgba(67, 181, 129, .35);
    color: #9be8bf;
}

[data-bs-theme="dark"] .alert-danger {
    background-color: rgba(227, 93, 106, .12);
    border-color: rgba(227, 93, 106, .35);
    color: #ffb3bd;
}

[data-bs-theme="dark"] .alert-warning {
    background-color: rgba(255, 193, 7, .12);
    border-color: rgba(255, 193, 7, .35);
    color: #ffd77a;
}

[data-bs-theme="dark"] .alert-info {
    background-color: rgba(69, 214, 195, .12);
    border-color: rgba(69, 214, 195, .3);
    color: #9ff0e4;
}

/* অ্যালার্টের ভেতরের লিংকও হালকা থাকবে (BS4 গাঢ় নীল লিংক বসাত) */
[data-bs-theme="dark"] .alert-success a,
[data-bs-theme="dark"] .alert-danger a,
[data-bs-theme="dark"] .alert-warning a,
[data-bs-theme="dark"] .alert-info a {
    color: inherit;
    text-decoration: underline;
}

/* ফর্ম */
[data-bs-theme="dark"] .form-select option { background-color: var(--me-surface-2); color: var(--me-text); }
[data-bs-theme="dark"] input[type="file"].form-control { background-color: var(--me-surface-2); color: var(--me-muted); }
[data-bs-theme="dark"] input[type="file"]::file-selector-button {
    background-color: var(--me-surface);
    color: var(--me-text);
    border-color: var(--me-border);
}
[data-bs-theme="dark"] .form-check-input:checked { background-color: var(--me-primary); border-color: var(--me-primary); }
[data-bs-theme="dark"] .form-switch .form-check-input { background-image: none; background-color: #2a313d; }
[data-bs-theme="dark"] .form-range::-webkit-slider-runnable-track { background-color: #2a313d; }
[data-bs-theme="dark"] .input-group .form-control,
[data-bs-theme="dark"] .input-group .form-select { border-color: var(--me-border); }
[data-bs-theme="dark"] select, [data-bs-theme="dark"] option { color-scheme: dark; }

/* নেভিগেশন / লিস্ট / প্রগ্রেস / পেজিনেশন */
[data-bs-theme="dark"] .nav-tabs { border-color: var(--me-border); }
[data-bs-theme="dark"] .nav-tabs .nav-link { color: var(--me-muted); }
[data-bs-theme="dark"] .nav-tabs .nav-link:hover { color: var(--me-heading); border-color: transparent; }
[data-bs-theme="dark"] .nav-tabs .nav-link.active { background-color: var(--me-surface); border-color: var(--me-border) var(--me-border) var(--me-surface); color: var(--me-heading); }
[data-bs-theme="dark"] .nav-pills .nav-link { color: var(--me-muted); }
[data-bs-theme="dark"] .nav-pills .nav-link:hover { color: var(--me-heading); }
[data-bs-theme="dark"] .nav-pills .nav-link.active { background-color: var(--me-primary); color: #fff; }
[data-bs-theme="dark"] .list-group-item { background-color: var(--me-surface) !important; border-color: var(--me-border) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .list-group-item:hover { background-color: var(--me-surface-2) !important; }
[data-bs-theme="dark"] .list-group-item.active { background-color: var(--me-primary) !important; border-color: var(--me-primary) !important; color: #fff !important; }
[data-bs-theme="dark"] .progress { background-color: #232a35; }
[data-bs-theme="dark"] .pagination .page-link { background-color: var(--me-surface); border-color: var(--me-border); color: var(--me-text); }
[data-bs-theme="dark"] .pagination .page-link:hover { background-color: #2a313d; color: #fff; }
[data-bs-theme="dark"] .pagination .page-item.active .page-link { background-color: var(--me-primary); border-color: var(--me-primary); color: #fff; }
[data-bs-theme="dark"] .page-item.disabled .page-link { background-color: var(--me-surface-2); border-color: var(--me-border); color: #6b7686; }

/* মডাল / ড্রপডাউন / অ্যাকর্ডিয়ন / টোস্ট */
[data-bs-theme="dark"] .modal-header, [data-bs-theme="dark"] .modal-footer { background-color: var(--me-surface-2); }
[data-bs-theme="dark"] .modal-body { color: var(--me-text); }
[data-bs-theme="dark"] .dropdown-menu .dropdown-item:active { background-color: var(--me-primary); color: #fff; }
[data-bs-theme="dark"] .accordion-item { background-color: var(--me-surface); border-color: var(--me-border); color: var(--me-text); }
[data-bs-theme="dark"] .accordion-button { background-color: var(--me-surface-2); color: var(--me-heading); }
[data-bs-theme="dark"] .accordion-button:not(.collapsed) { background-color: rgba(124, 140, 255, .12); color: var(--me-heading); box-shadow: none; }
[data-bs-theme="dark"] .accordion-button::after { filter: invert(1) brightness(200%); }
[data-bs-theme="dark"] .accordion-body { color: var(--me-text); }
[data-bs-theme="dark"] .toast { background-color: var(--me-surface); color: var(--me-text); border-color: var(--me-border); }

/* ছোট ইউটিলিটি যা অনেক পেজে ব্যবহৃত */
[data-bs-theme="dark"] .bg-body, [data-bs-theme="dark"] .bg-body-tertiary { background-color: var(--me-bg) !important; }
[data-bs-theme="dark"] .text-body, [data-bs-theme="dark"] .text-body-secondary, [data-bs-theme="dark"] .text-secondary { color: var(--me-text) !important; }
[data-bs-theme="dark"] hr { border-top-color: var(--me-border); }
[data-bs-theme="dark"] .border-light { border-color: var(--me-border) !important; }
[data-bs-theme="dark"] .bg-warning-subtle { background-color: rgba(255, 193, 7, .14) !important; color: #ffd77a !important; }
[data-bs-theme="dark"] .bg-danger-subtle { background-color: rgba(220, 53, 69, .16) !important; color: #ffb3bd !important; }
[data-bs-theme="dark"] .bg-success-subtle { background-color: rgba(25, 135, 84, .18) !important; color: #9be8bf !important; }
[data-bs-theme="dark"] .bg-info-subtle { background-color: rgba(13, 202, 240, .16) !important; color: #a5e9fb !important; }
[data-bs-theme="dark"] .bg-primary-subtle { background-color: rgba(124, 140, 255, .16) !important; color: #b9c2ff !important; }
[data-bs-theme="dark"] .table-primary, [data-bs-theme="dark"] tr.table-primary > * { background-color: rgba(124, 140, 255, .14) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .table-warning, [data-bs-theme="dark"] tr.table-warning > * { background-color: rgba(255, 193, 7, .12) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .table-danger, [data-bs-theme="dark"] tr.table-danger > * { background-color: rgba(220, 53, 69, .12) !important; color: var(--me-text) !important; }
[data-bs-theme="dark"] .table-success, [data-bs-theme="dark"] tr.table-success > * { background-color: rgba(25, 135, 84, .14) !important; color: var(--me-text) !important; }

/* --------------------------------------------------------------------------
   ৯.৭) হালকা/হলুদ ব্যাকগ্রাউন্ডে সঠিক টেক্সট — ডার্ক মোডে "হলুদ বাটনের টেক্সট" ফিক্স
   কারণ: Bootstrap-এর সলিড রঙ (.bg-warning/.bg-info/.bg-success/...) ডার্ক থিমেও
   বদলায় না; কিন্তু আমাদের .text-dark ওভাররাইড টেক্সটকে হালকা করে দিত →
   হলুদ ব্যাকগ্রাউন্ডে ধূসর টেক্সট হয়ে যায়।
   এই সেকশনটি ফাইলের সবচেয়ে শেষে, তাই specificity tie হলেও এটিই জেতে।
   -------------------------------------------------------------------------- */

/* ক্লাস-ভিত্তিক সলিড ব্যাকগ্রাউন্ড (নেস্টেড এলিমেন্টসহ) */
[data-bs-theme="dark"] .bg-warning,   [data-bs-theme="dark"] .bg-warning *   { color: #1b1d21 !important; }
[data-bs-theme="dark"] .bg-info,      [data-bs-theme="dark"] .bg-info *      { color: #0a1b1f !important; }
[data-bs-theme="dark"] .bg-success,   [data-bs-theme="dark"] .bg-success *   { color: #f2fff8 !important; }
[data-bs-theme="dark"] .bg-danger,    [data-bs-theme="dark"] .bg-danger *    { color: #fff5f5 !important; }
[data-bs-theme="dark"] .bg-primary,   [data-bs-theme="dark"] .bg-primary *   { color: #f4f7ff !important; }
[data-bs-theme="dark"] .bg-secondary, [data-bs-theme="dark"] .bg-secondary * { color: #f7f9fb !important; }

/* inline সলিড গোল্ড/হলুদ ব্যাকগ্রাউন্ড → গাঢ় টেক্সট (উপরে থাকা inline-রুলের চেয়ে পরে) */
[data-bs-theme="dark"] [style*="background:#ffc107" i],
[data-bs-theme="dark"] [style*="background: #ffc107" i],
[data-bs-theme="dark"] [style*="background-color:#ffc107" i],
[data-bs-theme="dark"] [style*="background-color: #ffc107" i],
[data-bs-theme="dark"] [style*="background:#ffca2c" i],
[data-bs-theme="dark"] [style*="background:#ffd977" i],
[data-bs-theme="dark"] [style*="background: #ffd977" i],
[data-bs-theme="dark"] [style*="background:#ffd700" i],
[data-bs-theme="dark"] [style*="background:#ffcc00" i],
[data-bs-theme="dark"] [style*="background:#ffff00" i],
[data-bs-theme="dark"] [style*="background:#f1c40f" i],
[data-bs-theme="dark"] [style*="background:gold" i],
[data-bs-theme="dark"] [style*="background: gold" i],
[data-bs-theme="dark"] [style*="background-color:gold" i] {
    color: #1b1d21 !important;
}

/* হলুদ/সায়ান বাটন — hover, focus, active ও disabled অবস্থায়ও */
[data-bs-theme="dark"] .btn-warning,
[data-bs-theme="dark"] .btn-warning:hover,
[data-bs-theme="dark"] .btn-warning:focus,
[data-bs-theme="dark"] .btn-warning:active,
[data-bs-theme="dark"] .btn-warning:disabled,
[data-bs-theme="dark"] .btn-warning.disabled { color: #1b1d21 !important; }

[data-bs-theme="dark"] .btn-info,
[data-bs-theme="dark"] .btn-info:hover,
[data-bs-theme="dark"] .btn-info:focus,
[data-bs-theme="dark"] .btn-info:disabled,
[data-bs-theme="dark"] .btn-info.disabled { color: #0a1b1f !important; }

/* হলুদ/সায়ান ব্যাজ (text-dark সহ বা ছাড়া) */
[data-bs-theme="dark"] .badge.bg-warning,
[data-bs-theme="dark"] .badge.bg-warning *,
[data-bs-theme="dark"] .badge.text-bg-warning,
[data-bs-theme="dark"] .badge.text-bg-warning * { color: #1b1d21 !important; }

[data-bs-theme="dark"] .badge.bg-info,
[data-bs-theme="dark"] .badge.bg-info *,
[data-bs-theme="dark"] .badge.text-bg-info,
[data-bs-theme="dark"] .badge.text-bg-info * { color: #0a1b1f !important; }

/* SweetAlert2-এর গোল্ড কনফার্ম বাটন (JS auto-contrast না চললে এটি ব্যাকআপ) */
[data-bs-theme="dark"] .swal2-confirm[style*="#ffc107" i],
[data-bs-theme="dark"] .swal2-confirm[style*="255, 193, 7"],
[data-bs-theme="dark"] .swal2-confirm[style*="#ffd977" i],
[data-bs-theme="dark"] .swal2-confirm[style*="255, 217, 119"],
[data-bs-theme="dark"] .swal2-confirm[style*="#ffca2c" i],
[data-bs-theme="dark"] .swal2-styled[style*="#ffc107" i],
[data-bs-theme="dark"] .swal2-styled[style*="255, 193, 7"] { color: #08231f !important; }

/* --------------------------------------------------------------------------
   ৯.৮) হোভার-অবস্থার গার্ড — ডার্ক মোডে কার্ড/লেবেল সাদা হয়ে যাওয়া ঠেকানো
   কিছু পেজের নিজস্ব <style>-এ আছে:  .card:hover { background-color:#f8f9fa }
   ওই রুল বডিতে থাকায় পরে লোড হয় → specificity tie-তে জিতে যেত, ফলে
   ডার্ক মোডে কার্ড সাদা কিন্তু টেক্সট হালকা → পড়া যেত না।
   এখানে `html[data-bs-theme="dark"]` প্রিফিক্স (specificity বেশি) +
   `!important` — তাই লোড-অর্ডার নির্বিশেষে এই নিয়মগুলোই জেতে।
   (রিপোর্টকৃত পেজ: user/job/view → JobCreate/view_job.blade.php:433)
   -------------------------------------------------------------------------- */

/* ১) যেকোনো Bootstrap কার্ডের হোভার — সাদা নয়, ডার্ক সারফেসই থাকবে */
html[data-bs-theme="dark"] .card:hover,
html[data-bs-theme="dark"] a.card:hover {
    background-color: #1d222b !important;
    border-color: rgba(124, 140, 255, .35) !important;
    box-shadow: 0 18px 38px -28px rgba(0, 0, 0, .95) !important;
}

/* ২) কার্ডের ভেতরের টেক্সট/হেডিং/আইকন হোভারেও পড়া যাবে */
html[data-bs-theme="dark"] .card:hover h1,
html[data-bs-theme="dark"] .card:hover h2,
html[data-bs-theme="dark"] .card:hover h3,
html[data-bs-theme="dark"] .card:hover h4,
html[data-bs-theme="dark"] .card:hover h5,
html[data-bs-theme="dark"] .card:hover h6,
html[data-bs-theme="dark"] .card:hover strong,
html[data-bs-theme="dark"] .card:hover .card-title,
html[data-bs-theme="dark"] .card:hover .card-header { color: var(--me-heading) !important; }

html[data-bs-theme="dark"] .card:hover p,
html[data-bs-theme="dark"] .card:hover li { color: var(--me-text) !important; }

html[data-bs-theme="dark"] .card:hover .text-muted,
html[data-bs-theme="dark"] .card:hover small { color: var(--me-muted) !important; }

/* ২ক) কার্ড হোভার করলেও ভেতরের ব্যাজগুলোর সঠিক রঙ অটুট থাকবে
   (নাহলে হোভার-রুল ব্যাজের টেক্সট হালকা করে দিত → হলুদে পড়া যেত না) */
html[data-bs-theme="dark"] .card:hover .badge.bg-warning,
html[data-bs-theme="dark"] .card:hover .badge.bg-warning *,
html[data-bs-theme="dark"] .card:hover .badge.text-bg-warning,
html[data-bs-theme="dark"] .card:hover .badge.text-bg-warning * { color: #1b1d21 !important; }

html[data-bs-theme="dark"] .card:hover .badge.bg-info,
html[data-bs-theme="dark"] .card:hover .badge.bg-info *,
html[data-bs-theme="dark"] .card:hover .badge.text-bg-info,
html[data-bs-theme="dark"] .card:hover .badge.text-bg-info * { color: #0a1b1f !important; }

html[data-bs-theme="dark"] .card:hover .badge.bg-success,
html[data-bs-theme="dark"] .card:hover .badge.bg-success * { color: #f2fff8 !important; }
html[data-bs-theme="dark"] .card:hover .badge.bg-primary,
html[data-bs-theme="dark"] .card:hover .badge.bg-primary * { color: #f4f7ff !important; }
html[data-bs-theme="dark"] .card:hover .badge.bg-danger,
html[data-bs-theme="dark"] .card:hover .badge.bg-danger * { color: #fff5f5 !important; }

/* ৩) Job Create পেজের radio/checkbox লেবেল হোভার (#f0f0f0 → ডার্ক) */
html[data-bs-theme="dark"] input[type="radio"] + label:hover,
html[data-bs-theme="dark"] input[type="checkbox"] + label:hover {
    background-color: #232a35 !important;
    border-color: var(--me-border) !important;
    color: var(--me-text) !important;
}

/* ৪) .btn-light এর হোভার (product card/সার্চ পেজ) — নিশ্চিত করা */
html[data-bs-theme="dark"] .btn-light:hover,
html[data-bs-theme="dark"] .btn-light:focus {
    background-color: #2a313d !important;
    border-color: #3a4352 !important;
    color: #ffffff !important;
}

/* ৫) সাধারণ টেবিল/লিস্ট/ড্রপডাউন হোভার সুরক্ষা */
html[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * { background-color: #1d222b !important; color: #ffffff !important; }
html[data-bs-theme="dark"] .list-group-item:hover { background-color: #1d222b !important; color: #ffffff !important; }
html[data-bs-theme="dark"] .dropdown-item:hover, html[data-bs-theme="dark"] .dropdown-item:focus { background-color: #232a35 !important; color: #ffffff !important; }

/* --------------------------------------------------------------------------
   ৯.৯) ল্যান্ডিং / ফুটার / প্রুফ-পেজের গোল্ড ব্র্যান্ড বাটন — ডার্ক মোডেও গাঢ় টেক্সট
   কারণ: `[data-bs-theme="dark"] a { color: var(--me-link) }` (specificity ০-১-১)
   পেজ-লেভেলের `.meb-btn--primary` / `.mef-strip-btn` / `.proof-cta-btn` /
   `.nav-pill--cta` (০-১-০) এর `color` কে হারিয়ে দিত → গোল্ড ব্যাকগ্রাউন্ডে
   ফ্যাকাশে নীল টেক্সট হয়ে যেত (`:hover` অবস্থাতেও একই)। তাই higher
   specificity + `!important` — সেকশন ৯.৭/৯.৮ এর মতোই।
   -------------------------------------------------------------------------- */

/* hero ("Create free account") + earning ("Create free account & start") +
   CTA ("Create free account") + footer strip ("Create free account") */
html[data-bs-theme="dark"] .meb-btn--primary,
html[data-bs-theme="dark"] .mef-strip-btn {
    color: #08231f !important;
}

/* প্রুফ পেজের গোল্ড CTA বাটন + হেডারের মোবাইল "Join" পিল (গোল্ড ব্যাকগ্রাউন্ড) */
html[data-bs-theme="dark"] .proof-cta-btn,
html[data-bs-theme="dark"] .nav-pill--cta {
    color: #08443d !important;
}

html[data-bs-theme="dark"] .proof-cta-btn:hover {
    color: #04332d !important;
}


/* ==========================================================================
   ১০) রঙিন কার্ড / হোভার / সেমান্টিক টেক্সট — ডার্ক মোডের কালার-প্রবলেমের ফিক্স
   ==========================================================================
   আগে ঠিক কী ভাঙছিল:
     ক) সেকশন ৯.৮-এর `html[data-bs-theme="dark"] .card:hover` রুল **সব** কার্ডে
        প্রযোজ্য ছিল — তাই `bg-warning` / `bg-info` / `bg-primary` কার্ডে হোভার
        করলেই কার্ডটি ধূসর (#1d222b) হয়ে যেত, কিন্তু ভেতরের লেখা `.text-dark`
        (গাঢ়) / `.text-white` (সাদা) থেকে যেত ⇒ হোভারে লেখা পড়া যেত না।
     খ) `.card:hover .card-title / h1..h6 { color: var(--me-heading) }` — হলুদ
        (`bg-warning`) বা সায়ান (`bg-info`) কার্ডে সাদা লেখা ⇒ অদৃশ্য।
     গ) `.text-primary` / `.text-danger` / `.text-warning` Bootstrap-এর গাঢ় রঙেই
        থাকত — কারণ ডার্ক থিমে `--bs-primary-rgb` বদলায় না। গাঢ় নীল ডার্ক
        ব্যাকগ্রাউন্ডে প্রায় অদৃশ্য ("Get More Info" লিংকগুলো তাই পড়া যেত না)।
     ঘ) রঙিন কার্ডের `.card-footer` সাধারণ ধূসর সারফেস হয়ে যেত ⇒ রঙিন কার্ডের
        সাথে বেমানান দেখাত এবং ফুটারের `text-primary` লিংকও হারিয়ে যেত।
     ঙ) `.card > .card-footer.bg-light` কার্ডের গায়ের রঙেই মিশে যেত।

   নিচের সব রুল `html[data-bs-theme="dark"]` প্রিফিক্স দিয়ে লেখা — specificity
   বেশি, তাই পেজ-স্টাইল বা লোড-অর্ডার নির্বিশেষে এগুলোই জেতে।
   -------------------------------------------------------------------------- */

html[data-bs-theme="dark"] {
    /* হালকা (হলুদ/সায়ান) সারফেসের উপরে পড়ার উপযোগী কালি */
    --me-ink-on-light: #0b1220;
    --me-ink-on-light-soft: rgba(11, 18, 32, .72);
    --me-accent-glow: 0 22px 45px -30px rgba(0, 0, 0, .95);
}

/* ---- ১০.১) রঙিন কার্ড হোভারে নিজের রঙই ধরে রাখবে (ধূসর হবে না) ---- */
html[data-bs-theme="dark"] .card.bg-primary:hover   { background-color: var(--bs-primary) !important; }
html[data-bs-theme="dark"] .card.bg-secondary:hover { background-color: var(--bs-secondary) !important; }
html[data-bs-theme="dark"] .card.bg-success:hover   { background-color: var(--bs-success) !important; }
html[data-bs-theme="dark"] .card.bg-info:hover      { background-color: var(--bs-info) !important; }
html[data-bs-theme="dark"] .card.bg-warning:hover   { background-color: var(--bs-warning) !important; }
html[data-bs-theme="dark"] .card.bg-danger:hover    { background-color: var(--bs-danger) !important; }
html[data-bs-theme="dark"] .card.bg-dark:hover      { background-color: var(--me-surface-2) !important; }
html[data-bs-theme="dark"] .card.bg-light:hover,
html[data-bs-theme="dark"] .card.bg-white:hover     { background-color: var(--me-surface) !important; }

html[data-bs-theme="dark"] :is(.card.bg-primary, .card.bg-secondary, .card.bg-success, .card.bg-danger, .card.bg-dark):hover {
    border-color: transparent !important;
    box-shadow: var(--me-accent-glow) !important;
}

/* ---- ১০.২) হালকা (হলুদ/সায়ান) কার্ডে গাঢ় টেক্সট — `.text-white` সহ ----
   পুরোনো পেজগুলোতে `class="card text-white bg-warning"` লেখা আছে —
   সাদা লেখা হলুদে অদৃশ্য। শুধু **কার্ড/অ্যালার্ট** স্কোপ করা হয়েছে,
   নাহলে ভেতরের নীল `btn-primary` বা ব্যাজগুলোর টেক্সটও গাঢ় হয়ে যেত।
   (ইনলাইন-স্টাইলে বানানো হালকা কার্ডের জন্য JS auto-contrast ব্যাকআপ:
    public/js/theme.js → fixLightBackgroundText) */
html[data-bs-theme="dark"] .card.bg-warning,
html[data-bs-theme="dark"] .card.bg-info,
html[data-bs-theme="dark"] .alert.bg-warning,
html[data-bs-theme="dark"] .alert.bg-info {
    color: var(--me-ink-on-light) !important;
}

/* `:where()` ব্যবহার করা হয়েছে যাতে :not() চেইন specificity না বাড়ায়
   (নাহলে নিচের "soft" রুলটি হারিয়ে যেত)। `[class*="bg-"]` বাদ দেওয়ায়
   ব্যাজ/বাটন (যাদের নিজস্ব ব্যাকগ্রাউন্ড আছে) অক্ষত থাকে। */
html[data-bs-theme="dark"] :is(.card.bg-warning, .card.bg-info, .alert.bg-warning, .alert.bg-info)
    *:where(:not(.btn):not([class*="bg-"]):not([class*="text-bg-"])) {
    color: var(--me-ink-on-light) !important;
}

/* হোভার-অবস্থাতেও হালকা সারফেসের লেখা গাঢ়ই থাকবে (৯.৮-এর সাদা-করা রুল
   specificity-তে জিতে যেত, তাই এখানে higher specificity + পরে লোড) */
html[data-bs-theme="dark"] .card.bg-warning:hover *:where(:not(.btn):not([class*="bg-"])),
html[data-bs-theme="dark"] .card.bg-info:hover *:where(:not(.btn):not([class*="bg-"])) {
    color: var(--me-ink-on-light) !important;
}

/* রঙিন (গাঢ়) কার্ডে হোভার করলেও ভেতরের লেখা সাদাই থাকবে */
html[data-bs-theme="dark"] :is(.card.bg-primary, .card.bg-secondary, .card.bg-success, .card.bg-danger, .card.bg-dark):hover :is(h1, h2, h3, h4, h5, h6, .card-title, .card-text, strong, small, p, span, i, a) {
    color: #ffffff !important;
}

/* হালকা সারফেশের ভেতরের মিউটেড লেখা (small / description) */
html[data-bs-theme="dark"] :is(.card.bg-warning, .card.bg-info, .alert.bg-warning, .alert.bg-info)
    :is(small, .text-muted, .card-text) {
    color: var(--me-ink-on-light-soft) !important;
}


/* ---- ১০.৩) রঙিন কার্ডের হেডার/ফুটার — কার্ডেরই অংশ মনে হবে ---- */
html[data-bs-theme="dark"] .card > .card-header,
html[data-bs-theme="dark"] .card > .card-footer {
    background-color: var(--me-surface-2) !important;
    border-color: var(--me-border) !important;
}

html[data-bs-theme="dark"] :is(.card.bg-primary, .card.bg-secondary, .card.bg-success, .card.bg-danger, .card.bg-dark) > .card-footer,
html[data-bs-theme="dark"] :is(.card.bg-primary, .card.bg-secondary, .card.bg-success, .card.bg-danger, .card.bg-dark) > .card-header {
    background-color: rgba(0, 0, 0, .2) !important;
    border-color: rgba(255, 255, 255, .18) !important;
}

html[data-bs-theme="dark"] .card.bg-warning > .card-footer,
html[data-bs-theme="dark"] .card.bg-warning > .card-header,
html[data-bs-theme="dark"] .card.bg-info > .card-footer,
html[data-bs-theme="dark"] .card.bg-info > .card-header {
    background-color: rgba(255, 255, 255, .32) !important;
    border-color: rgba(11, 18, 32, .16) !important;
}

/* রঙিন কার্ডের ফুটারের লিংক ("Get More Info") — নিজের কার্ডের সাথে মানানসই */
html[data-bs-theme="dark"] :is(.card.bg-primary, .card.bg-secondary, .card.bg-success, .card.bg-danger, .card.bg-dark) .card-footer a {
    color: rgba(255, 255, 255, .94) !important;
}

html[data-bs-theme="dark"] .card.bg-warning .card-footer a,
html[data-bs-theme="dark"] .card.bg-info .card-footer a {
    color: var(--me-ink-on-light) !important;
}

html[data-bs-theme="dark"] :is(.card.bg-primary, .card.bg-secondary, .card.bg-success, .card.bg-danger, .card.bg-dark, .card.bg-warning, .card.bg-info) .card-footer a:hover {
    opacity: .78;
}

/* ---- ১০.৪) সেমান্টিক টেক্সট/লিংক রঙ — ডার্ক ব্যাকগ্রাউন্ডে উজ্জ্বল ----
   Bootstrap ডার্ক থিমে `--bs-primary-rgb` অপরিবর্তিত থাকে ⇒ `.text-primary`
   গাঢ় নীল হয়ে যায়। তাই ডার্ক মোডের জন্য পড়ার উপযোগী টোন। */
html[data-bs-theme="dark"] .text-primary   { color: #9aa8ff !important; }
html[data-bs-theme="dark"] .text-success   { color: #4ade80 !important; }
html[data-bs-theme="dark"] .text-danger    { color: #ff7b7b !important; }
html[data-bs-theme="dark"] .text-warning   { color: #ffd166 !important; }
html[data-bs-theme="dark"] .text-info      { color: #6fd8e8 !important; }
html[data-bs-theme="dark"] .text-secondary { color: #aab6c8 !important; }

html[data-bs-theme="dark"] a.text-primary:hover,
html[data-bs-theme="dark"] a.text-success:hover,
html[data-bs-theme="dark"] a.text-danger:hover,
html[data-bs-theme="dark"] a.text-warning:hover,
html[data-bs-theme="dark"] a.text-info:hover { filter: brightness(1.15); }

/* ---- ১০.৫) `.bg-dark` কার্ড পেজ-ব্যাকগ্রাউন্ডের সাথে মিশে যায় ----
   #212529 কার্ড #0f1116 পেজে প্রায় অদৃশ্য ⇒ elevated surface + বর্ডার। */
html[data-bs-theme="dark"] .bg-dark:not(.badge):not(.btn) {
    background-color: var(--me-surface-2) !important;
    border: 1px solid var(--me-border) !important;
    color: var(--me-text) !important;
}

html[data-bs-theme="dark"] .card.bg-dark .card-title,
html[data-bs-theme="dark"] .card.bg-dark :is(h1, h2, h3, h4, h5, h6) {
    color: var(--me-heading) !important;
}

/* ---- ১০.৬) কার্ডের ভেতরের ডিভাইডার ও ছোট ইউটিলিটি ---- */
html[data-bs-theme="dark"] .card .border-end,
html[data-bs-theme="dark"] .card .border-start,
html[data-bs-theme="dark"] .card .border-top,
html[data-bs-theme="dark"] .card .border-bottom,
html[data-bs-theme="dark"] .card .border { border-color: var(--me-border) !important; }

/* আউটলাইন বাটন হালকা সারফেসের ভেতরে থাকলে নিজের কার্ডের টেক্সট রঙই নেবে */
html[data-bs-theme="dark"] :is(.bg-warning, .bg-info) .btn-outline-dark,
html[data-bs-theme="dark"] :is(.bg-warning, .bg-info) .btn-outline-secondary {
    color: var(--me-ink-on-light) !important;
    border-color: rgba(11, 18, 32, .35) !important;
}

/* ==========================================================================
   SECTION 10 END
   ========================================================================== */