.tftable {
    font-family: 'Times New Roman', Times, serif;
    font-size: 14px;
    color: #000000;
    width: 100%;
    border-width: 1px;
    border-color: #9dcc7a;
    border-collapse: collapse;
}

.tftable th {
    font-size: 14px;
    background-color: #abd28e;
    border-width: 1px;
    padding: 4px;
    border-color: #9dcc7a;
    text-align: left;
}

.tftable tr {
    background-color: #ffffff;
}

.tftable td {
    font-size: 14px;
    border-width: 1px;
    padding: 2px;
    border-color: #9dcc7a;
}

.tftable tr:hover {
    background-color: #ffff99;
}


/* আপনার পছন্দের স্টাইল (শুধুমাত্র ইনফো টেবিল - border='0' এর জন্য) */
.tftable[border='0'] {
    border-top: 2px solid #9dcc7a;
    /* টেবিলের একদম উপরের মোটা দাগ */
    border-bottom: 2px solid #9dcc7a;
    /* টেবিলের একদম নিচের মোটা দাগ */
}

.tftable[border='0'] td {
    border-bottom: 1px solid #9dcc7a;
    /* প্রতি রো এর নিচে হালকা চিকন দাগ */
}

.tftable[border='0'] tr:last-child td {
    border-bottom: none;
    /* শেষ লাইনের নিচের চিকন দাগ দরকার নেই কারণ নিচে মোটা দাগ আছে */
}




table td,
table th {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
}





/* ///Select2///////////////// */
/* Select2 কন্টেইনারকে ইনপুট গ্রুপের সাথে লাইনে রাখার জন্য */
.input-group>.select2-container--default {
    flex: 1 1 auto;
    width: 1% !important;
}

/* ড্রপডাউন বক্সের হাইট এবং বর্ডার ঠিক করার জন্য */
.input-group>.select2-container--default .select2-selection--single {
    height: 100% !important;
    border: 1px solid #ced4da;
    border-radius: 0;
    /* ইনপুট গ্রুপের মাঝখানে রেডিয়াস রিমুভ করার জন্য */
    display: flex;
    align-items: center;
}

/* যদি বাম পাশের টেক্সট বক্স (Prepend) থাকে তবে তার পাশের কোণা সোজা করার জন্য */
.input-group-prepend~.select2-container--default .select2-selection--single {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/* ///Select2///////////////// */

/* Dark theme overrides for Login page input fields */
body.theme-dark .dt-login--container .form-control {
    background-color: #1a2234 !important;
    border-color: #2c374e !important;
    color: #f8fafc !important;
}

body.theme-dark .dt-login--container .form-control::placeholder {
    color: #94a3b8 !important;
    opacity: 0.8;
}

body.theme-dark .dt-login--container label {
    color: #cbd5e1 !important;
}

/* Dark theme adaptation for dashboard and reports */
body.theme-dark .welcome-banner {
    background: linear-gradient(135deg, #0f172a, #1e293b) !important;
    border: 1px solid #2c374e !important;
}

body.theme-dark .dashboard-stat-card {
    background-color: #1a2234 !important;
    border: 1px solid #2c374e !important;
}

body.theme-dark .dashboard-stat-card h2,
body.theme-dark .dashboard-stat-card h4,
body.theme-dark .dashboard-stat-card div {
    color: #f8fafc !important;
}

body.theme-dark .stat-icon-bg {
    color: #ffffff !important;
    opacity: 0.03 !important;
}

body.theme-dark .card-header-dark-friendly {
    background-color: #1a2234 !important;
    border-bottom: 1px solid #2c374e !important;
    color: #f8fafc !important;
}

body.theme-dark .card-body-dark-friendly {
    background-color: #111a2e !important;
    color: #cbd5e1 !important;
}

body.theme-dark .filter-card-dark-friendly {
    background-color: #1a2234 !important;
    border: 1px solid #2c374e !important;
}

body.theme-dark .filter-card-dark-friendly label {
    color: #94a3b8 !important;
}

body.theme-dark .filter-card-dark-friendly .form-control {
    background-color: #111a2e !important;
    border-color: #2c374e !important;
    color: #f8fafc !important;
}

body.theme-dark .table-dark-friendly {
    color: #cbd5e1 !important;
}

body.theme-dark .table-dark-friendly th,
body.theme-dark .table-dark-friendly thead th {
    background-color: #1a2234 !important;
    border-color: #2c374e !important;
    color: #f8fafc !important;
}

body.theme-dark .table-dark-friendly td {
    border-color: #2c374e !important;
}

body.theme-dark .card-header-dark-friendly h6.text-dark,
body.theme-dark .card-header-dark-friendly .text-dark {
    color: #f8fafc !important;
}

/* ///Ticket System///////////////// */





/* ///Accounts Expenses///////////////// */

.acc-card {
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
    border: 1px solid #eef0f3 !important;
    background: #ffffff;
}

.acc-header {
    background: transparent !important;
    border-bottom: 1px solid #eef0f3 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #2D3748 !important;
    padding: 12px 15px !important;
}

.btn-toggle-group {
    display: flex;
    background: #edf2f7;
    padding: 4px;
    border-radius: 10px;
    margin-bottom: 20px;
    border: 1px solid #cbd5e1;
}

.btn-toggle-group button {
    flex: 1;
    border: none !important;
    background: transparent;
    padding: 10px 15px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
    border-radius: 8px;
    transition: all 0.3s ease;
    outline: none !important;
}

/* Active received button */
.btn-toggle-group button.btn-received {
    background: #006B44 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 6px rgba(0, 107, 68, 0.15) !important;
}

/* Inactive received button */
.btn-toggle-group button.btn-outline-received {
    color: #006B44 !important;
}

/* Active bill button */
.btn-toggle-group button.btn-info {
    background: #0284c7 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 6px rgba(2, 132, 199, 0.15) !important;
}

/* Inactive bill button */
.btn-toggle-group button.btn-outline-info {
    color: #0284c7 !important;
}

/* Active payment button */
.btn-toggle-group button.btn-payment {
    background: #007bff !important;
    color: #ffffff !important;
    box-shadow: 0 4px 6px rgba(0, 123, 255, 0.15) !important;
}

/* Inactive payment button */
.btn-toggle-group button.btn-outline-payment {
    color: #007bff !important;
}

/* Amount box styling */
.amount-box {
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

.amount-box label {
    font-weight: 700 !important;
    font-size: 13px !important;
    margin-bottom: 8px !important;
}

.bg-cr {
    background-color: #f0f4ff !important;
    border: 1px solid #cbd5e1 !important;
}

.bg-bill {
    background-color: #ecfdf5 !important;
    border: 1px solid #a7f3d0 !important;
}

.bg-dr {
    background-color: #fff1f2 !important;
    border: 1px solid #fecdd3 !important;
}

.amount-box input.form-control {
    font-size: 20px !important;
    font-weight: 700 !important;
    height: 48px !important;
    border-radius: 8px !important;
    text-align: right !important;
    padding-right: 15px !important;
}

#cr_part input.form-control {
    background-color: #e8f0fe !important;
    border: 1.5px solid #a5b4fc !important;
    color: #4338ca !important;
}

#bill_part input.form-control {
    background-color: #ecfdf5 !important;
    border: 1.5px solid #6ee7b7 !important;
    color: #047857 !important;
}

#dr_part input.form-control {
    background-color: #fff1f2 !important;
    border: 1.5px solid #fda4af !important;
    color: #be123c !important;
}

.word-display {
    font-size: 11px !important;
    font-style: italic !important;
    color: #64748b !important;
    display: block !important;
    margin-top: 4px !important;
    text-align: left !important;
}

/* Card input and labels styling */
.acc-card .form-control {
    border-radius: 8px !important;
    border: 1.5px solid #cbd5e1 !important;
    font-size: 13px !important;
    height: 42px !important;
    transition: all 0.2s ease !important;
}

.acc-card .form-control:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

.acc-card label {
    font-weight: 700 !important;
    color: #334155 !important;
    font-size: 13px !important;
    margin-bottom: 6px !important;
}

/* Select2 Global overriding to match standard inputs */
.select2-container--default .select2-selection--single {
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 8px !important;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 10px !important;
    transition: all 0.2s ease !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #334155 !important;
    font-size: 13px !important;
    padding-left: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px !important;
    right: 8px !important;
}

.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1) !important;
}

/* Save transaction button custom styling */
#btn_preview_trigger {
    background: #006B44 !important;
    border-color: #006B44 !important;
    color: #ffffff !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    transition: all 0.2s ease !important;
}

#btn_preview_trigger:hover {
    background: #005234 !important;
    border-color: #005234 !important;
}

/* ============================================================
   DARK MODE OVERRIDES (added 2026-07-22)
   পেজগুলোর ভেতরে হার্ডকোড করা সাদা ব্যাকগ্রাউন্ড ডার্ক মোডে
   ঠিক করার জন্য। লাইট মোডে কোনো প্রভাব নেই।
   Palette: surface #1a2234 | deep #111a2e | border #2c374e
            text #f8fafc / #cbd5e1 / muted #94a3b8
   ============================================================ */

/* --- tftable (রিপোর্ট টেবিল) --- */
body.theme-dark .tftable {
    color: #cbd5e1;
    border-color: #2c374e;
}

body.theme-dark .tftable th {
    background-color: #1a2234;
    color: #f8fafc;
    border-color: #2c374e;
}

body.theme-dark .tftable tr {
    background-color: #111a2e;
}

body.theme-dark .tftable td {
    border-color: #2c374e;
}

body.theme-dark .tftable tr:hover {
    background-color: #232f4b;
}

body.theme-dark .tftable[border='0'],
body.theme-dark .tftable[border='0'] td {
    border-color: #2c374e;
}

/* --- Ticket System --- */
body.theme-dark .ticket-container,
body.theme-dark .ticket-content,
body.theme-dark .ticket-chat-area,
body.theme-dark .chat-messages {
    background: #111a2e !important;
}

body.theme-dark .ticket-sidebar,
body.theme-dark .sidebar-header,
body.theme-dark .chat-header,
body.theme-dark .chat-input-area,
body.theme-dark .mobile-header {
    background: #1a2234 !important;
    color: #f8fafc !important;
    border-color: #2c374e !important;
}

body.theme-dark .staff-message .message-content,
body.theme-dark .attachment-file {
    background: #1a2234 !important;
    border-color: #2c374e !important;
    color: #e2e8f0 !important;
}

body.theme-dark .message-content {
    background: #1a2234;
    color: #e2e8f0;
}

/* --- Accounts (acc-card) --- */
body.theme-dark .acc-card {
    background: #1a2234 !important;
    border-color: #2c374e !important;
}

body.theme-dark .acc-header {
    color: #f8fafc !important;
    border-bottom-color: #2c374e !important;
}

body.theme-dark .acc-card label {
    color: #cbd5e1 !important;
}

body.theme-dark .acc-card .form-control {
    background-color: #111a2e !important;
    border-color: #2c374e !important;
    color: #f8fafc !important;
}

body.theme-dark .btn-toggle-group {
    background: #111a2e;
    border-color: #2c374e !important;
}

/* --- PM2 Server --- */
body.theme-dark .pm2-card {
    background: #1a2234 !important;
    border-color: #2c374e !important;
}

body.theme-dark .nav-tabs-custom {
    background: #111a2e !important;
    color: #cbd5e1 !important;
}

body.theme-dark .nav-tabs-custom .nav-link.active {
    background: #1a2234 !important;
    border-color: #2c374e !important;
}

body.theme-dark .icon-interval {
    background: #3b2f0b !important;
    color: #fbbf24 !important;
}

/* --- বিভিন্ন পেজের কার্ড --- */
body.theme-dark .tree-node-card,
body.theme-dark .stats-banner-card,
body.theme-dark .wa-card,
body.theme-dark .dashboard-stat-card {
    background: #1a2234 !important;
    border-color: #2c374e !important;
    color: #e2e8f0;
}

body.theme-dark .whatsapp-settings-container {
    color: #cbd5e1;
}

/* ইনলাইন style-এ সাদা ব্যাকগ্রাউন্ড দেওয়া কার্ড (যেমন reseller পেজ) */
body.theme-dark .card[style*="background: #fff"],
body.theme-dark .card[style*="background: #ffffff"],
body.theme-dark .card[style*="background-color: #ffffff"] {
    background: #1a2234 !important;
    border-color: #2c374e !important;
}

/* --- Modal (সব পেজের জন্য) --- */
body.theme-dark .modal-content {
    background-color: #1a2234;
    color: #e2e8f0;
}

body.theme-dark .modal-header,
body.theme-dark .modal-footer {
    background: #1a2234 !important;
    border-color: #2c374e !important;
}

body.theme-dark .modal-header .modal-title {
    color: #f8fafc;
}

body.theme-dark .modal-header .close {
    color: #f8fafc;
    text-shadow: none;
}

/* --- Select2 (ডার্ক থিম CSS-এ select2 নেই) --- */
body.theme-dark .select2-container--default .select2-selection--single,
body.theme-dark .select2-container--default .select2-selection--multiple {
    background-color: #111a2e !important;
    border-color: #2c374e !important;
}

body.theme-dark .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #e2e8f0 !important;
}

body.theme-dark .select2-dropdown {
    background-color: #1a2234;
    border-color: #2c374e;
    color: #e2e8f0;
}

body.theme-dark .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #111a2e;
    border-color: #2c374e;
    color: #e2e8f0;
}

body.theme-dark .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #2563eb !important;
    color: #ffffff !important;
}

/* select2-এর নিজের CSS বাছাই করা সারিতে হালকা ধূসর (#ddd) বসায়, তাই
   ডার্ক থিমে ধূসরের উপর ধূসর লেখা — পড়াই যেত না।  আর খোঁজার ঘরটা
   ব্রাউজারের সাদা ইনপুট হয়ে থাকত।  দুটোই এখানে ঠিক করা। */
body.theme-dark .select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #1b3550 !important;
    color: #93c5fd !important;
}

body.theme-dark .select2-results__options,
body.theme-dark .select2-results__option {
    background-color: #1a2234;
    color: #e2e8f0;
}

body.theme-dark .select2-search--dropdown {
    background-color: #1a2234;
}

body.theme-dark .select2-search--dropdown .select2-search__field,
body.theme-dark .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #111a2e !important;
    border: 1px solid #2c374e !important;
    color: #e2e8f0 !important;
    border-radius: 4px;
}

body.theme-dark .select2-search--dropdown .select2-search__field:focus {
    border-color: #3b82f6 !important;
    outline: none;
}

body.theme-dark .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-top-color: #94a3b8;
}

body.theme-dark .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-bottom-color: #94a3b8;
}

body.theme-dark .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #7c8798;
}

body.theme-dark .select2-dropdown {
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
}

/* --- Bootstrap টেবিল (ডার্ক থিম CSS এগুলো কভার করে না) --- */
body.theme-dark .table {
    color: #cbd5e1;
}

body.theme-dark .table th,
body.theme-dark .table td,
body.theme-dark .table thead th,
body.theme-dark .table-bordered,
body.theme-dark .table-bordered th,
body.theme-dark .table-bordered td {
    border-color: #2c374e !important;
}

body.theme-dark .table-striped tbody tr:nth-of-type(odd) {
    background-color: #1a2234;
}

body.theme-dark .table-striped tbody tr:nth-of-type(even) {
    background-color: #111a2e;
}

body.theme-dark .table thead th {
    background-color: #1a2234;
    color: #f8fafc;
}

/* --- Highcharts গ্রাফ ডার্ক মোড --- */
body.theme-dark .highcharts-background {
    fill: #1a2234;
}

body.theme-dark .highcharts-container text {
    fill: #cbd5e1 !important;
}

body.theme-dark .highcharts-grid-line {
    stroke: #2c374e;
}

body.theme-dark .highcharts-axis-line {
    stroke: #2c374e;
}

/* --- Form control: পেজের নিজস্ব <style> ব্লকের সাদা ইনপুট ঠিক করা --- */
body.theme-dark .form-control {
    background-color: #111a2e !important;
    border-color: #2c374e !important;
    color: #f8fafc !important;
}

body.theme-dark .form-control::placeholder {
    color: #94a3b8 !important;
}

body.theme-dark .form-control:focus {
    background-color: #1a2234 !important;
    color: #f8fafc !important;
}

/* --- টিকিট পেজের বাকি অংশ --- */
body.theme-dark .mobile-description-sidebar,
body.theme-dark .chat-input-group,
body.theme-dark .refresh-popup-modal,
body.theme-dark .custom-alert {
    background: #1a2234 !important;
    color: #e2e8f0 !important;
    border-color: #2c374e !important;
}

body.theme-dark .chat-tool-btn,
body.theme-dark .file-preview-item,
body.theme-dark .refresh-popup-header,
body.theme-dark .refresh-popup-footer,
body.theme-dark .refresh-setting-help,
body.theme-dark .file-info {
    background: #111a2e !important;
    color: #cbd5e1 !important;
    border-color: #2c374e !important;
}

body.theme-dark .file-preview-item:hover,
body.theme-dark .attachment-file:hover,
body.theme-dark .chat-tool-btn:hover {
    background: #232f4b !important;
}

body.theme-dark .notification-permission,
body.theme-dark .mobile-warning {
    background: #3b2f0b !important;
    color: #fbbf24 !important;
    border-color: #6b5416 !important;
}

/* টিকিট পেজে হেডার/টেক্সটের কালো রং হালকা করা */
body.theme-dark .chat-header,
body.theme-dark .sidebar-header,
body.theme-dark .mobile-header {
    color: #f8fafc !important;
}

body.theme-dark .ticket-sidebar h1,
body.theme-dark .ticket-sidebar h2,
body.theme-dark .ticket-sidebar h3,
body.theme-dark .ticket-sidebar h4,
body.theme-dark .ticket-sidebar h5,
body.theme-dark .ticket-sidebar h6,
body.theme-dark .ticket-sidebar label,
body.theme-dark .chat-header h1,
body.theme-dark .chat-header h3,
body.theme-dark .chat-header h4 {
    color: #f8fafc !important;
}

body.theme-dark .message-text {
    color: #e2e8f0;
}

body.theme-dark .message-time {
    color: #94a3b8;
}
/* ===== Dark theme: Bootstrap bg-light / bg-white boxes must stay readable (2026-07-23) ===== */
body.theme-dark .bg-light {
    background-color: #111a2e !important;
    border-color: #2c374e !important;
    color: #e2e8f0;
}
body.theme-dark .bg-white {
    background-color: #1a2234 !important;
    border-color: #2c374e !important;
    color: #e2e8f0;
}
body.theme-dark .bg-light .border,
body.theme-dark .bg-white .border {
    border-color: #2c374e !important;
}
body.theme-dark .bg-light .text-muted,
body.theme-dark .bg-white .text-muted {
    color: #94a3b8 !important;
}
body.theme-dark .navbar-light.bg-light .nav-link {
    color: #cbd5e1;
}

/* ===== Header theme toggle (icon button) ===== */
/* Light theme: white header — dark icon on light pill */
.theme-toggle-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid #cbd5e1;
    background: #f1f5f9;
    color: #334155;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    padding: 0;
    outline: none;
    transition: background .2s, transform .2s, color .2s;
}
.theme-toggle-btn:hover {
    background: #e2e8f0;
    transform: rotate(20deg);
}
.theme-toggle-btn:focus { outline: none; box-shadow: 0 0 0 2px rgba(100, 116, 139, 0.3); }
.theme-toggle-btn .fa-moon { color: #334155; }
/* Dark theme: dark header — light icon on translucent pill */
body.theme-dark .theme-toggle-btn {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
}
body.theme-dark .theme-toggle-btn:hover { background: rgba(255, 255, 255, 0.16); }
.theme-toggle-btn .fa-sun { color: #fbbf24; }

/* ===== Dark theme: Bootstrap thead-light table headers readable ===== */
body.theme-dark .thead-light th {
    background-color: #111a2e !important;
    color: #e2e8f0 !important;
    border-color: #2c374e !important;
}
body.theme-dark .resp-link { color: #94a3b8; }
body.theme-dark .resp-link:hover { color: #60a5fa; }

/* ===== Dark theme: SweetAlert popup content contrast ===== */
body.theme-dark .swal2-popup pre {
    color: #e2e8f0;
    background: rgba(0, 0, 0, 0.25);
    border-radius: 8px;
    padding: 10px 12px;
}
.swal2-popup pre {
    background: #f1f5f9;
    border-radius: 8px;
    padding: 10px 12px;
}

/* (Sidebar menu override removed on request — using the theme's original menu design.) */

/* ===== Dark theme: badge-dark ("dark" যেটা আঁধারে সাদা হয়ে যায়) =====
   থিমের ডার্ক স্টাইলশিটে নামটার মানে উল্টে যায়:

       .badge-dark { color:#212529; background-color:#E0E0E0 }

   অর্থাৎ আঁধারে `badge-dark` মানে **হালকা ধূসর**।  ফলে বিল হিস্ট্রির
   কাজের বোতামগুলোর সারিতে নীল/লাল/হলুদের পাশে ওটা একটা সাদা চাকতি
   হয়ে ফুটে থাকত, আর ভেতরের ট্র্যাশ আইকনটা #212529-এ প্রায় মিশে গিয়ে
   চোখেই পড়ত না।  (একই দশা `.bg-dark`-এর — সেটা রিচার্জ পাতায় আগেই ধরা
   পড়েছিল।)

   এখন আঁধারে ওটা সত্যিকারের নিরপেক্ষ চিপ: গাঢ় স্লেট তল, হালকা লেখা —
   পাশের রঙিন বোতামগুলোর সাথে মানানসই, আর আইকনটা স্পষ্ট। */
body.theme-dark .badge-dark {
    background-color: #39445a !important;
    color: #e2e8f0 !important;
    border-color: #4b5670 !important;
}
body.theme-dark a.badge-dark:hover,
body.theme-dark a.badge-dark:focus,
body.theme-dark button.badge-dark:hover,
body.theme-dark button.badge-dark:focus {
    background-color: #4b5670 !important;
    color: #fff !important;
}
/* মোছার বোতামটা hover-এ লাল — চাপার আগেই বোঝা যায় কাজটা ফেরানো যাবে না */
body.theme-dark button.badge-dark:hover .icon-trash,
button.badge-dark:hover .icon-trash { color: #ff7b72; }