/* ═══════════════════════════════════════════════════════════════
   WaTick — Neon Dark Green  |  WhatsJet Theme Manager
   --bg-dark:#0b0f0c  --neon-green:#00ff88  --soft-green:#1db954
═══════════════════════════════════════════════════════════════ */

/* ── CSS Variables ───────────────────────────────────────────── */
html body {
    --bg-dark: #0b0f0c;
    --card-bg: #0f1a13;
    --neon-green: #00ff88;
    --soft-green: #1db954;
    --text-light: #e6f7ee;
    --text-muted: #9bbfa7;
    --border-glow: rgba(0,255,136,.4);
}

/* ── Body / Background ───────────────────────────────────────── */
html body,
html body.lw-authenticated-page,
html body.lw-minimized-menu {
    background: radial-gradient(circle at top, #0f1f16, #050807) !important;
    color: var(--text-light) !important;
    font-family: 'Segoe UI', sans-serif !important;
}
div.main-content {
    background: transparent !important;
}

/* ── Top Navbar ──────────────────────────────────────────────── */
html body #navbar-main,
html body .main-content #navbar-main,
html body .main-content .navbar-top,
#navbar-main, .main-content .navbar-top {
    background: linear-gradient(90deg,#0d2f1f,#0a1f15) !important;
    border-bottom: 1px solid var(--border-glow) !important;
    box-shadow: 0 0 10px rgba(0,255,136,.2) !important;
    color: #fff !important;
}
html body #navbar-main .nav-link,
html body #navbar-main .text-white,
html body #navbar-main a,
html body #navbar-main span,
html body #navbar-main i,
html body #navbar-main p,
html body #navbar-main .mb-0 { color: #fff !important; }
html body #navbar-main .nav-link:hover { color: var(--neon-green) !important; }

/* ── Sidebar ─────────────────────────────────────────────────── */
html body nav#sidenav-main,
html body .navbar.lw-sidebar-container,
html body nav#sidenav-main.navbar-vertical,
html body .navbar.lw-sidebar-container.navbar-light {
    background: #050807 !important;
    background-color: #050807 !important;
    border-right: 1px solid var(--border-glow) !important;
    box-shadow: 2px 0 15px rgba(0,0,0,.5) !important;
}
nav#sidenav-main hr, .lw-sidebar-container hr {
    border-color: rgba(0,255,136,.1) !important;
}
/* Sidebar links */
html body nav#sidenav-main .navbar-nav .nav-link,
html body .navbar.lw-sidebar-container.navbar-light .navbar-nav .nav-link {
    color: var(--text-muted) !important;
    border-radius: 8px !important;
    margin: 2px 6px !important;
    padding: 10px 12px !important;
    transition: all .25s !important;
}
html body nav#sidenav-main .navbar-nav .nav-link i,
html body nav#sidenav-main .navbar-nav .nav-link .fa,
html body nav#sidenav-main .navbar-nav .nav-link .fas,
html body .navbar.lw-sidebar-container .navbar-nav .nav-link i {
    color: var(--text-muted) !important;
    transition: .3s !important;
}
html body .navbar-light .navbar-nav .nav-link:hover i,
html body nav#sidenav-main .navbar-nav .nav-link:hover i {
    color: var(--neon-green) !important;
    text-shadow: 0 0 10px var(--neon-green) !important;
}
html body nav#sidenav-main .navbar-nav .nav-link:hover,
html body nav#sidenav-main .navbar-nav .nav-link.active,
html body .navbar-light .navbar-nav .nav-link.active,
html body .navbar-light .navbar-nav .nav-link:hover {
    background: rgba(0,255,136,.08) !important;
    color: var(--neon-green) !important;
}
html body nav#sidenav-main .navbar-nav .nav-link.active i,
html body .navbar-light .navbar-nav .nav-link.active i {
    color: var(--neon-green) !important;
    text-shadow: 0 0 8px var(--neon-green) !important;
}
html body .lw-minimized-menu .navbar-vertical.navbar-expand-md .navbar-nav .nav-link.active:before {
    border-left: 3px solid var(--neon-green) !important;
}
html body nav#sidenav-main .navbar-nav .nav-link[data-toggle=collapse]:after,
html body .navbar.lw-sidebar-container .navbar-nav .nav-link[data-toggle=collapse]:after {
    color: var(--text-muted) !important;
}

/* ── Cards ───────────────────────────────────────────────────── */
html body .card,
html body.lw-authenticated-page .card,
html body .navbar-collapse,
html body fieldset:not(.filepond--file-wrapper) {
    background: var(--card-bg) !important;
    background-color: #0f1a13 !important;
    border: 1px solid var(--border-glow) !important;
    border-radius: 14px !important;
    color: var(--text-light) !important;
    transition: .3s ease !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: none !important;
}
html body .card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 0 20px rgba(0,255,136,.15) !important;
}
/* Neon glow inner border */
html body .card::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: 14px !important;
    border: 1px solid rgba(0,255,136,.1) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}
html body .card-header {
    background: rgba(0,255,136,.04) !important;
    border-bottom: 1px solid rgba(0,255,136,.15) !important;
    border-radius: 13px 13px 0 0 !important;
    color: var(--text-light) !important;
}
html body .card-header h5, html body .card-header h6 { color: var(--neon-green) !important; }
/* Stat numbers */
html body .card-body h1,
html body .card-body h2,
html body .card-body .h1,
html body .card-body .h2,
html body .card .value { color: var(--neon-green) !important; font-weight: 700 !important; font-size: 28px !important; }
/* Label text */
html body .card-body p.text-uppercase,
html body .card-body .text-uppercase,
html body .card-body h3,
html body .card-body h4 { color: var(--text-muted) !important; font-size: 13px !important; }
html body .card-body p, html body .card-body li,
html body .card-body small, html body .card-body span:not(.badge) { color: var(--text-muted) !important; }
html body .card-body a { color: var(--soft-green) !important; }
html body .card-body a:hover { color: var(--neon-green) !important; }

/* lw-form-card-box */
html body .lw-form-card-box {
    background: var(--card-bg) !important;
    border-color: var(--border-glow) !important;
}

/* Gradient stat icon circles */
.bg-gradient-primary { background: linear-gradient(135deg,#0d4a28,var(--soft-green)) !important; box-shadow: 0 0 12px rgba(0,255,136,.2) !important; }
.bg-gradient-success { background: linear-gradient(135deg,#0b3320,#00b894) !important; }
.bg-gradient-danger  { background: linear-gradient(135deg,#3b0d0d,#e74c3c) !important; }
.bg-gradient-warning { background: linear-gradient(135deg,#3b2b0d,#f39c12) !important; }
.bg-gradient-info    { background: linear-gradient(135deg,#0d2535,#3498db) !important; }

/* ── Quick Start Section ─────────────────────────────────────── */
html body .card-body h4,
html body .card .quick-start h4,
.lw-page-title,
html body .lw-page-title {
    color: var(--neon-green) !important;
    font-weight: 700 !important;
}
html body .card-body ul li,
html body .card-body ol li { color: var(--text-muted) !important; margin-bottom: 8px !important; }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn.btn-primary,
html body .btn.btn-primary,
html body .page-item.active .page-link {
    background: var(--neon-green) !important;
    color: #000 !important;
    border: none !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    transition: .3s !important;
    box-shadow: none !important;
}
.btn.btn-primary:hover,
html body .btn.btn-primary:hover {
    box-shadow: 0 0 15px var(--neon-green) !important;
    background: var(--neon-green) !important;
}
html body .conversation-compose .send .circle {
    background: var(--neon-green) !important;
    border-color: var(--soft-green) !important;
}

/* ── Typography ──────────────────────────────────────────────── */
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6 { color: var(--text-light) !important; }
.text-primary, a { color: var(--soft-green) !important; }
a:hover { color: var(--neon-green) !important; }
.text-muted { color: var(--text-muted) !important; }

/* ── Forms ───────────────────────────────────────────────────── */
.form-control, .selectize-input {
    background-color: #050807 !important;
    border-color: rgba(0,255,136,.2) !important;
    color: var(--text-light) !important;
    border-radius: 8px !important;
}
.form-control:focus {
    border-color: var(--neon-green) !important;
    box-shadow: 0 0 0 3px rgba(0,255,136,.15) !important;
}
.selectize-dropdown { background:#0f1a13 !important; border-color:rgba(0,255,136,.15) !important; }
label, .col-form-label { color: var(--text-muted) !important; }

/* ── Tables ──────────────────────────────────────────────────── */
.dataTables_wrapper .table thead {
    background: #050807 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.3) !important;
}
.dataTables_wrapper .table thead th {
    color: var(--neon-green) !important;
    font-size: .72rem !important; letter-spacing: .8px !important;
    text-transform: uppercase !important; font-weight: 700 !important;
}
.dataTables_wrapper .table td, .dataTables_wrapper .table th {
    color: var(--text-muted) !important;
    border-color: rgba(0,255,136,.06) !important;
}
div.dataTables_wrapper table.dataTable > tbody > tr:hover {
    background-color: rgba(0,255,136,.04) !important;
}

/* ── Badges ──────────────────────────────────────────────────── */
.badge-primary { background:rgba(0,255,136,.12) !important; color:var(--neon-green) !important; }
.badge-success { background:rgba(29,185,84,.12) !important; color:var(--soft-green) !important; }
.badge-danger  { background:rgba(231,76,60,.12)  !important; color:#e74c3c !important; }
.badge-warning { background:rgba(243,156,18,.12) !important; color:#f39c12 !important; }

/* ── Dropdowns ───────────────────────────────────────────────── */
.dropdown-menu {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-glow) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 30px rgba(0,0,0,.4), 0 0 10px rgba(0,255,136,.1) !important;
}
.dropdown-item { color: var(--text-muted) !important; }
.dropdown-item:hover, .dropdown-item.active, .dropdown-item:active {
    background-color: rgba(0,255,136,.08) !important; color: var(--neon-green) !important;
}
.dropdown-divider { border-color: rgba(0,255,136,.1) !important; }
.dropdown-header { color: var(--neon-green) !important; }

/* ── Modals ──────────────────────────────────────────────────── */
.modal-content { background:var(--card-bg) !important; border:1px solid var(--border-glow) !important; }
.modal .modal-body { background:var(--card-bg) !important; color:var(--text-light) !important; }
.modal-open .modal .modal-body .modal-header { background:#050807 !important; border-bottom:1px solid rgba(0,255,136,.15) !important; }
.modal-open .modal .modal-footer { background:var(--card-bg) !important; border-top:1px solid rgba(0,255,136,.1) !important; }
.modal-title,
.modal-open .modal .modal-body .modal-header .modal-title { color:var(--neon-green) !important; }
.modal .form-control { background:#050807 !important; border-color:rgba(0,255,136,.2) !important; color:var(--text-light) !important; }
.modal label { color:var(--text-muted) !important; }

/* ── Nav Tabs ────────────────────────────────────────────────── */
.nav-tabs .nav-link { background:#050807 !important; color:var(--text-muted) !important; border-color:rgba(0,255,136,.1) !important; }
.nav-tabs .nav-link.active { background:var(--neon-green) !important; color:#000 !important; border-color:var(--neon-green) !important; font-weight:700 !important; }

/* ── SweetAlert ──────────────────────────────────────────────── */
div:where(.swal2-container) div:where(.swal2-popup) { background:var(--card-bg) !important; color:var(--text-light) !important; border:1px solid var(--border-glow) !important; }
div:where(.swal2-container) div:where(.swal2-popup) .swal2-title { color:var(--text-light) !important; }
div:where(.swal2-container) button:where(.swal2-styled).swal2-confirm { background:var(--neon-green) !important; color:#000 !important; }

/* ── Scrollbar ───────────────────────────────────────────────── */
html > body ::-webkit-scrollbar-track { background:#050807 !important; }
html > body ::-webkit-scrollbar-thumb { background:rgba(0,255,136,.2) !important; border-radius:4px !important; }
html > body ::-webkit-scrollbar-thumb:hover { background:var(--neon-green) !important; box-shadow:0 0 8px var(--neon-green) !important; }

/* ── Footer ──────────────────────────────────────────────────── */
.footer { background:transparent !important; border-top:1px solid rgba(0,255,136,.08) !important; color:var(--text-muted) !important; }

/* ══ CALENDAR WIDGET ══════════════════════════════════════════ */
html body .fc,
html body .fc *,
html body .fc-view,
html body .fc-daygrid,
html body .fc-daygrid-body,
html body .fc-scrollgrid,
html body .fc-scrollgrid-section table,
html body .fc-scrollgrid-section-body table { background-color: var(--card-bg) !important; border-color:rgba(0,255,136,.08) !important; }
html body .fc td, html body .fc th,
html body .fc .fc-daygrid-day,
html body .fc .fc-daygrid-day-frame,
html body .fc-daygrid-day-top { background-color:var(--card-bg) !important; border-color:rgba(0,255,136,.08) !important; }
/* Header toolbar */
html body .fc .fc-toolbar.fc-header-toolbar {
    background: linear-gradient(90deg,#0d2f1f,#0a1f15) !important;
    border-bottom: 1px solid var(--border-glow) !important;
    padding:10px 14px !important; margin-bottom:0 !important;
    border-radius:13px 13px 0 0 !important;
    box-shadow:0 0 10px rgba(0,255,136,.15) !important;
}
html body .fc .fc-toolbar-title { color:#fff !important; font-size:.95rem !important; font-weight:700 !important; }
html body .fc .fc-button, html body .fc .fc-button-primary {
    background:transparent !important; border:1px solid rgba(255,255,255,.3) !important;
    color:#fff !important; box-shadow:none !important; padding:2px 8px !important;
}
html body .fc .fc-button-primary:hover { background:rgba(0,255,136,.15) !important; border-color:var(--neon-green) !important; box-shadow:0 0 8px rgba(0,255,136,.3) !important; }
/* Col headers */
html body .fc .fc-col-header-cell,
html body .fc .fc-scrollgrid-section-header td { background:#050807 !important; border-color:rgba(0,255,136,.1) !important; }
html body .fc .fc-col-header-cell-cushion { color:rgba(0,255,136,.6) !important; font-size:.68rem !important; font-weight:700 !important; text-transform:uppercase !important; letter-spacing:.5px !important; }
/* Day numbers */
html body .fc .fc-daygrid-day-number, html body .fc a.fc-daygrid-day-number { color:var(--text-muted) !important; font-size:.78rem !important; }
/* Today */
html body .fc .fc-day-today, html body .fc .fc-day-today .fc-daygrid-day-frame { background:rgba(0,255,136,.06) !important; }
html body .fc .fc-day-today .fc-daygrid-day-number {
    background:var(--neon-green) !important; color:#000 !important;
    border-radius:50% !important; width:22px !important; height:22px !important;
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    font-weight:700 !important; box-shadow:0 0 8px var(--neon-green) !important;
}
/* Other month */
html body .fc .fc-day-other { background:#050807 !important; }
html body .fc .fc-day-other .fc-daygrid-day-number { color:rgba(255,255,255,.2) !important; }
/* Events */
html body .fc .fc-event, html body .fc .fc-daygrid-event {
    background:var(--soft-green) !important; border-color:#128b3d !important;
    color:#fff !important; border-radius:4px !important;
    box-shadow:0 0 6px rgba(0,255,136,.2) !important;
}
html body .fc .fc-event-title { color:#fff !important; }
/* Scrollgrid borders */
html body .fc-scrollgrid, html body .fc-theme-standard .fc-scrollgrid { border-color:rgba(0,255,136,.08) !important; }
html body .fc-theme-standard td, html body .fc-theme-standard th { border-color:rgba(0,255,136,.07) !important; }

/* ══ GUEST / LOGIN PAGE ════════════════════════════════════════ */
html body.lw-guest-page { background:radial-gradient(circle at top,#0f1f16,#050807) !important; }
html body.lw-guest-page .card, html body.lw-guest-page .card-body,
html body.lw-guest-page .lw-form-card-box { background:var(--card-bg) !important; border-color:var(--border-glow) !important; }
html body.lw-guest-page h1,html body.lw-guest-page h2,
html body.lw-guest-page h3,html body.lw-guest-page h4,
html body.lw-guest-page h5,html body.lw-guest-page h6 { color:var(--text-light) !important; }
html body.lw-guest-page p, html body.lw-guest-page small, html body.lw-guest-page .text-muted { color:var(--text-muted) !important; }
html body.lw-guest-page a { color:var(--soft-green) !important; }
html body.lw-guest-page .form-control, html body.lw-guest-page .input-group-text { background:#050807 !important; border-color:rgba(0,255,136,.2) !important; color:var(--text-light) !important; }
html body.lw-guest-page label { color:var(--text-muted) !important; }

/* ══ WHATSAPP CHAT PAGE ════════════════════════════════════════ */
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .status-bar,
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .user-bar,
.card.lw-whatsapp-chat-block-container .lw-contacts-header { background:#050807 !important; color:var(--text-light) !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation { background:#03050a !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message.received { background:var(--card-bg) !important; color:var(--text-light) !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message.sent { background:rgba(0,255,136,.1) !important; color:var(--text-light) !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose .send .circle { background:var(--neon-green) !important; }
.card.lw-whatsapp-chat-block-container .nav-tabs .nav-link.active { background:var(--neon-green) !important; color:#000 !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .lw-contact-list,
.card.lw-whatsapp-chat-block-container .lw-contact-list-block { background:#050807 !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .lw-contact-list .lw-contact { background:var(--card-bg) !important; border-bottom:1px solid rgba(0,255,136,.06) !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .lw-contact-list .lw-contact h2 { color:var(--text-light) !important; }
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .lw-contact-list .lw-contact .lw-contact-avatar { background:var(--neon-green) !important; color:#000 !important; }

/* ══ BREADCRUMB ════════════════════════════════════════════════ */
nav.lw-breadcrumb-container { background:transparent !important; }

/* ══ HOME/LANDING PAGE ═════════════════════════════════════════ */
html body.lw-outer-home-page { background:radial-gradient(circle at top,#0f1f16,#050807) !important; }
html body.lw-outer-home-page .card { background:var(--card-bg) !important; border-color:var(--border-glow) !important; }
html body.lw-outer-home-page nav.navbar { background:linear-gradient(90deg,#0d2f1f,#0a1f15) !important; border-bottom:1px solid var(--border-glow) !important; }

/* ══ WHATSAPP CHAT — FULL DARK FIX ════════════════════════════ */

/* Compose/input bar at bottom */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose > div,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose input,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose .input-msg,
html body .lw-chat-main-container .conversation-compose,
html body .emojionearea,
html body .emojionearea .emojionearea-editor,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .emojionearea,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .emojionearea .emojionearea-editor {
    background: #050807 !important;
    background-color: #050807 !important;
    color: var(--text-light) !important;
    border-color: rgba(0,255,136,.12) !important;
}

/* Emoji/attachment buttons in compose */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose .emoji,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose .photo,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose .attach {
    background: #050807 !important;
}

/* Compose bar wrap */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .conversation-compose {
    border-top: 1px solid rgba(0,255,136,.1) !important;
}

/* Right panel — Contact Info, Assign Team Member, Labels */
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block .card,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block .card-body,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block .card-header,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block fieldset,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block .form-control,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block .selectize-input {
    background: var(--card-bg) !important;
    background-color: #0f1a13 !important;
    border-color: rgba(0,255,136,.1) !important;
    color: var(--text-light) !important;
}
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block h5,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block h6,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block label,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block .col-form-label,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block p,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block span:not(.badge),
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block small {
    color: var(--text-muted) !important;
}
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block strong,
html body .card.lw-whatsapp-chat-block-container .lw-contact-crm-block b {
    color: var(--text-light) !important;
}

/* Sent message bubbles (white background issue) */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message {
    background: #0f1a13 !important;
    color: var(--text-light) !important;
}
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message.sent {
    background: rgba(0,255,136,.1) !important;
}
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .message-text,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message p,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message span:not(.badge) {
    color: var(--text-light) !important;
}

/* Message media/image container */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .message-media,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-media-wrapper {
    background: #050807 !important;
}

/* Chat header (user bar top) */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .user-bar {
    background: linear-gradient(90deg,#0d2f1f,#0a1f15) !important;
    border-bottom: 1px solid rgba(0,255,136,.1) !important;
}
html body .lw-whatsapp-bar-icon-btn i { color: var(--neon-green) !important; }

/* Search / filter labels area */
html body .card.lw-whatsapp-chat-block-container .lw-labels-selector-box,
html body .card.lw-whatsapp-chat-block-container fieldset:not(.filepond--file-wrapper) {
    background: var(--card-bg) !important;
    border-color: rgba(0,255,136,.08) !important;
}
html body .lw-chat-main-container input.form-control,
html body .lw-chat-main-container input[type=text] {
    background: #050807 !important;
    border-color: rgba(0,255,136,.1) !important;
    color: var(--text-light) !important;
}
html body .lw-chat-main-container input::placeholder { color: var(--text-muted) !important; }

/* Tab content wrapper */
html body .card.lw-whatsapp-chat-block-container .tab-content,
html body .card.lw-whatsapp-chat-block-container .lw-contact-list-header {
    background: #050807 !important;
}

/* Metadata time */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .metadata .time {
    color: var(--text-muted) !important;
}

/* ══ MESSAGE TEMPLATE / MEDIA BUBBLE FIX ══════════════════════ */

/* Template message header bar (Birthday Greeting strip) */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-template-header,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-message-header,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message [class*="header"],
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-msg-header {
    background: rgba(0,255,136,.15) !important;
    color: var(--neon-green) !important;
    border-bottom: 1px solid rgba(0,255,136,.2) !important;
}

/* All text inside message bubbles */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message *,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message p,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message span,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message div,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message strong,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message b {
    color: var(--text-light) !important;
}

/* Media/image container inside message (white strip) */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-message-media,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-media-wrapper,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-template-body,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-msg-body,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message [class*="body"],
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message [class*="media"] {
    background: #050807 !important;
    background-color: #050807 !important;
}

/* The image wrapper itself (grey bg around WhatsApp image) */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-msg-img-wrapper,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message figure,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .lw-img-container {
    background: #050807 !important;
}

/* Full sent/received bubble containers */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message.sent {
    background: rgba(0,255,136,.08) !important;
    border: none !important;
}
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message.received {
    background: #0f1a13 !important;
    border: none !important;
}

/* Message time/date metadata */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .metadata,
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .message .metadata .time {
    color: var(--text-muted) !important;
}

/* ══ NUCLEAR MESSAGE BUBBLE FIX v3 ════════════════════════════ */
/* Force ALL elements inside chat window to dark */
html body .lw-whatsapp-chat-window *:not(img):not(svg):not(path):not(.fas):not(.fa):not(i):not(.badge) {
    background-color: transparent !important;
    color: var(--text-light) !important;
}

/* Restore specific backgrounds */
html body .lw-whatsapp-chat-window .conversation { background: #03050a !important; }
html body .lw-whatsapp-chat-window .message.received { background: #0f1a13 !important; }
html body .lw-whatsapp-chat-window .message.sent { background: rgba(0,255,136,.08) !important; }
html body .lw-whatsapp-chat-window .user-bar { background: linear-gradient(90deg,#0d2f1f,#0a1f15) !important; }
html body .lw-whatsapp-chat-window .status-bar { background: #050807 !important; }
html body .lw-whatsapp-chat-window .conversation-compose { background: #050807 !important; }
html body .lw-whatsapp-chat-window .conversation-compose > div,
html body .lw-whatsapp-chat-window .conversation-compose input { background: #050807 !important; }
html body .lw-whatsapp-chat-window .lw-contact-list { background: #050807 !important; }
html body .lw-whatsapp-chat-window .lw-contact { background: #0f1a13 !important; }
html body .lw-whatsapp-chat-window .tab-content { background: #050807 !important; }
html body .lw-whatsapp-chat-window .nav-tabs { background: #050807 !important; }
html body .lw-whatsapp-chat-window .nav-tabs .nav-link { background: #050807 !important; color: var(--text-muted) !important; }
html body .lw-whatsapp-chat-window .nav-tabs .nav-link.active { background: var(--neon-green) !important; color: #000 !important; }

/* Send button */
html body .lw-whatsapp-chat-window .conversation-compose .send .circle { background: var(--neon-green) !important; }

/* Template header text — force visible */
html body .lw-whatsapp-chat-window .message [class*="header"] *,
html body .lw-whatsapp-chat-window .message [class*="template"] *,
html body .lw-whatsapp-chat-window .message > div > div:first-child,
html body .lw-whatsapp-chat-window .message > div > div:first-child * {
    color: var(--neon-green) !important;
    background: rgba(0,255,136,.1) !important;
}

/* WhatsApp image green tint background → dark */
html body .lw-whatsapp-chat-window .message img + *,
html body .lw-whatsapp-chat-window .message figure ~ *,
html body .lw-whatsapp-chat-window .message .lw-msg-img-wrap,
html body .lw-whatsapp-chat-window .message .lw-template-img,
html body .lw-whatsapp-chat-window .message .lw-media-block,
html body .lw-whatsapp-chat-window .message [style*="background"] {
    background: #050807 !important;
    background-color: #050807 !important;
}

/* Override any inline style background on message children */
html body .lw-whatsapp-chat-window .message > * { background: transparent !important; }
html body .lw-whatsapp-chat-window .message { overflow: hidden !important; }
/* ══ BIRTHDAY BADGE FIX ════════════════════════════ */
html body .bra-badge-birthday,
html body .lw-whatsapp-chat-window .bra-badge-birthday,
.bra-badge-birthday {
    background: rgba(0,255,136,.12) !important;
    background-color: rgba(0,255,136,.12) !important;
    color: var(--neon-green) !important;
    border: 1px solid rgba(0,255,136,.3) !important;
}
html body .bra-badge-birthday *,
.bra-badge-birthday * {
    color: var(--neon-green) !important;
    background: transparent !important;
}
/* ══ MESSAGE IMAGE WRAPPER — dark bg ══════════════ */
html body .lw-whatsapp-chat-window .message .bra-badge-birthday ~ *,
html body .lw-whatsapp-chat-window .message > div > *:not(.bra-badge-birthday):not(.metadata) {
    background: transparent !important;
}
/* Image container green bg → transparent/dark */
html body .lw-whatsapp-chat-window .message img {
    display: block !important;
    border-radius: 8px !important;
}
html body .lw-whatsapp-chat-window .message > div {
    background: #0f1a13 !important;
}
html body .lw-whatsapp-chat-window .message.sent > div {
    background: rgba(0,255,136,.08) !important;
}
html body .lw-whatsapp-chat-window .message.received > div {
    background: #0f1a13 !important;
}
/* ══ CONTACT AVATAR FIX ═══════════════════════════ */
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .lw-contact-list .lw-contact .lw-contact-avatar,
.card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window .lw-contact-list .lw-contact .lw-contact-avatar {
    background: #0f1a13 !important;
    color: var(--neon-green) !important;
    border: 1px solid rgba(0,255,136,.25) !important;
}
/* ══ INLINE STYLE COLOR OVERRIDE ══════════════════ */
/* Contact avatars — override any inline red/colored text */
html body .lw-whatsapp-chat-window .lw-contact-avatar,
html body .lw-whatsapp-chat-window .lw-contact-avatar span,
html body .lw-whatsapp-chat-window [class*="avatar"],
html body .lw-whatsapp-chat-window [class*="avatar"] span {
    color: var(--neon-green) !important;
}
/* ══ MESSAGE BUBBLE REFINEMENT ════════════════════ */
/* Sent message — less green, more dark */
html body .lw-whatsapp-chat-window .message.sent,
html body .lw-whatsapp-chat-window .message.sent > div {
    background: #0d1f13 !important;
    border: none !important;
}
/* Received message */
html body .lw-whatsapp-chat-window .message.received,
html body .lw-whatsapp-chat-window .message.received > div {
    background: #0a1510 !important;
    border: none !important;
}

/* "See all options" CTA button inside message */
html body .lw-whatsapp-chat-window .message .lw-template-cta,
html body .lw-whatsapp-chat-window .message [class*="cta"],
html body .lw-whatsapp-chat-window .message [class*="button"],
html body .lw-whatsapp-chat-window .message a.btn,
html body .lw-whatsapp-chat-window .message .btn {
    background: transparent !important;
    border: 1px solid rgba(0,255,136,.3) !important;
    color: var(--neon-green) !important;
    border-radius: 6px !important;
}
html body .lw-whatsapp-chat-window .message .btn:hover,
html body .lw-whatsapp-chat-window .message [class*="cta"]:hover {
    background: rgba(0,255,136,.1) !important;
}

/* Contact avatar — all avatars in chat */
html body .lw-whatsapp-chat-window [class*="avatar"],
html body .lw-whatsapp-chat-window .lw-contact-avatar,
html body .lw-whatsapp-chat-window .lw-chat-avatar,
html body .lw-whatsapp-chat-window .lw-user-avatar {
    background: #0f1a13 !important;
    background-color: #0f1a13 !important;
    color: var(--neon-green) !important;
    border: 1.5px solid rgba(0,255,136,.3) !important;
}
/* Override any inline color on avatar spans */
html body .lw-whatsapp-chat-window [class*="avatar"] *,
html body .lw-whatsapp-chat-window .lw-contact-avatar * {
    color: var(--neon-green) !important;
}

/* Message image area — no extra green bg */
html body .lw-whatsapp-chat-window .message img {
    border-radius: 8px !important;
    max-width: 100% !important;
}
html body .lw-whatsapp-chat-window .message .lw-msg-img,
html body .lw-whatsapp-chat-window .message [class*="img"],
html body .lw-whatsapp-chat-window .message [class*="media"] {
    background: #050807 !important;
    background-color: #050807 !important;
}
/* ══ FIELDSET LEGEND FIX ═══════════════════════════ */
html body fieldset legend,
html body fieldset:not(.filepond--file-wrapper) legend,
html body .card-body fieldset legend,
html body .lw-form-card-box fieldset legend {
    background-color: #0f1a13 !important;
    color: var(--text-light) !important;
    border-color: rgba(0,255,136,.12) !important;
    font-size: .85rem !important;
}

/* Quick Start card text */
html body .card-body h4,
html body .card-body h5,
html body .card .lw-quick-start h4,
html body .lw-quick-start-card h4 {
    color: var(--neon-green) !important;
    font-weight: 700 !important;
}
html body .card-body ol li,
html body .card-body ul li,
html body .card-body p {
    color: var(--text-muted) !important;
}
html body .card-body ol li a,
html body .card-body ul li a {
    color: var(--soft-green) !important;
}

/* ══ CALENDAR CELLS — force white/light → dark ══════ */
/* Nuke inline styles on fc cells */
html body .fc-daygrid-day,
html body .fc-daygrid-day .fc-daygrid-day-frame,
html body .fc-scrollgrid-sync-table td,
html body .fc-scrollgrid-sync-table tr,
html body .fc table,
html body .fc tbody,
html body .fc tr,
html body .fc td:not(.fc-col-header-cell) {
    background: var(--card-bg) !important;
    background-color: #0f1a13 !important;
}
html body .fc .fc-day-today,
html body .fc .fc-day-today .fc-daygrid-day-frame {
    background: rgba(0,255,136,.07) !important;
    background-color: rgba(0,255,136,.07) !important;
}
/* Calendar "Open Todo App" footer */
html body .fc-footer-toolbar,
html body .fc .fc-footer-toolbar {
    background: #0a1510 !important;
    border-top: 1px solid rgba(0,255,136,.1) !important;
    padding: 8px 12px !important;
}
html body .fc .fc-footer-toolbar a,
html body .fc .fc-footer-toolbar button {
    color: var(--soft-green) !important;
}
/* ══ BRA MODAL (Set Chat Reminder) — FULL DARK FIX ════════════ */
html body #bra-modal,
html body #bra-modal > div {
    background: #0f1a13 !important;
    border-radius: 12px !important;
    border: 1px solid rgba(0,255,136,.2) !important;
    color: var(--text-light) !important;
}

/* Modal header — keep orange gradient */
html body #bra-modal > div > div:first-child {
    background: linear-gradient(135deg,#f97316,#ea580c) !important;
    color: #fff !important;
}
html body #bra-modal > div > div:first-child * { color: #fff !important; background: transparent !important; }

/* Modal body */
html body #bra-modal > div > div:nth-child(2) {
    background: #0f1a13 !important;
    padding: 16px !important;
}

/* All inputs, selects, textareas inside modal */
html body #bra-modal input,
html body #bra-modal select,
html body #bra-modal textarea {
    background: #050807 !important;
    background-color: #050807 !important;
    border: 1px solid rgba(0,255,136,.2) !important;
    color: var(--text-light) !important;
    border-radius: 7px !important;
}
html body #bra-modal input::placeholder,
html body #bra-modal textarea::placeholder { color: var(--text-muted) !important; }
html body #bra-modal input:focus,
html body #bra-modal select:focus,
html body #bra-modal textarea:focus {
    border-color: var(--neon-green) !important;
    box-shadow: 0 0 0 2px rgba(0,255,136,.15) !important;
    outline: none !important;
}

/* Labels inside modal */
html body #bra-modal label { color: var(--text-muted) !important; }

/* Tab buttons (Text / Media / Template) */
html body #bra-tab-text,
html body #bra-tab-media,
html body #bra-tab-template {
    background: #050807 !important;
    border: 2px solid rgba(0,255,136,.2) !important;
    color: var(--text-muted) !important;
    border-radius: 7px !important;
}
html body #bra-tab-text[style*="border:2px solid #f97316"],
html body #bra-tab-text.active,
html body #bra-modal button.active {
    border-color: var(--neon-green) !important;
    background: rgba(0,255,136,.1) !important;
    color: var(--neon-green) !important;
}

/* Smart 24hr info box */
html body #bra-modal div[style*="#eff6ff"],
html body #bra-modal div[style*="eff6ff"] {
    background: rgba(0,255,136,.06) !important;
    border: 1px solid rgba(0,255,136,.2) !important;
    color: var(--text-muted) !important;
}
html body #bra-modal div[style*="#eff6ff"] strong,
html body #bra-modal div[style*="eff6ff"] strong { color: var(--neon-green) !important; }

/* Template info box */
html body #bra-tpl-info {
    background: rgba(0,255,136,.06) !important;
    border: 1px solid rgba(0,255,136,.15) !important;
    color: var(--text-muted) !important;
}

/* HR divider */
html body #bra-modal hr { border-color: rgba(0,255,136,.1) !important; }

/* Set Reminder button — keep orange */
html body #bra-modal button[onclick="braSubmit()"] {
    background: linear-gradient(135deg,#f97316,#ea580c) !important;
    color: #fff !important;
    border: none !important;
}

/* Reminders list on right side */
html body .bra-reminder-item,
html body [class*="bra-reminder"] {
    background: #0a1510 !important;
    border: 1px solid rgba(0,255,136,.1) !important;
    color: var(--text-light) !important;
    border-radius: 6px !important;
}

/* Override nuclear transparent on modal */
html body #bra-modal *:not(img):not(svg):not(i):not(.fas) {
    background-color: transparent !important;
}
html body #bra-modal > div { background-color: #0f1a13 !important; }
html body #bra-modal input,
html body #bra-modal select,
html body #bra-modal textarea { background-color: #050807 !important; }
html body #bra-modal > div > div:first-child { background: linear-gradient(135deg,#f97316,#ea580c) !important; }
html body #bra-modal button[onclick="braSubmit()"] { background: linear-gradient(135deg,#f97316,#ea580c) !important; }
/* ══ BRA MODAL SELECT DROPDOWN ════════════════════ */
html body #bra-modal select option,
html body #bra-modal select,
html body #bra-tname,
html body #bra-tname option,
html body #bra-mtype,
html body #bra-mtype option {
    background: #050807 !important;
    background-color: #050807 !important;
    color: var(--text-light) !important;
}
/* Native browser dropdown list */
html body #bra-modal option:hover,
html body #bra-modal option:checked,
html body #bra-modal option:focus {
    background: rgba(0,255,136,.2) !important;
    color: var(--neon-green) !important;
}
/* Selectize custom dropdown if used */
html body #bra-modal .selectize-dropdown,
html body #bra-modal .selectize-dropdown-content,
html body #bra-modal .selectize-dropdown .option {
    background: #050807 !important;
    color: var(--text-light) !important;
    border: 1px solid rgba(0,255,136,.2) !important;
}
html body #bra-modal .selectize-dropdown .option:hover,
html body #bra-modal .selectize-dropdown .option.active {
    background: rgba(0,255,136,.12) !important;
    color: var(--neon-green) !important;
}

/* ══════════════════════════════════════════════════════
   WATICK — MOBILE RESPONSIVE
   Breakpoints: 768px (tablet), 480px (phone)
══════════════════════════════════════════════════════ */

@media (max-width: 768px) {

    /* ── Body ── */
    html body, html body.lw-authenticated-page {
        font-size: 14px !important;
    }

    /* ── Top Navbar ── */
    html body #navbar-main,
    html body .main-content #navbar-main {
        padding: 6px 10px !important;
        min-height: 52px !important;
    }
    html body #navbar-main .navbar-brand img {
        height: 28px !important;
    }
    html body #navbar-main .nav-link {
        padding: 4px 8px !important;
        font-size: 13px !important;
    }

    /* ── Sidebar collapsed ── */
    html body nav#sidenav-main,
    html body .navbar.lw-sidebar-container {
        width: 60px !important;
        min-width: 60px !important;
    }
    html body nav#sidenav-main .navbar-nav .nav-link span,
    html body .navbar.lw-sidebar-container .navbar-nav .nav-link span {
        display: none !important;
    }
    html body nav#sidenav-main .navbar-nav .nav-link i {
        font-size: 1.1rem !important;
        margin: 0 !important;
    }

    /* ── Main content ── */
    html body .main-content {
        margin-left: 0 !important;
        padding: 10px !important;
    }
    html body .container-fluid {
        padding: 8px 10px !important;
    }

    /* ── Cards ── */
    html body .card {
        border-radius: 10px !important;
        margin-bottom: 12px !important;
    }
    html body .card-body {
        padding: 12px !important;
    }
    html body .card-header {
        padding: 10px 14px !important;
    }

    /* ── Dashboard stat cards grid ── */
    html body .row {
        margin: 0 !important;
    }
    html body .col-xl-3, html body .col-lg-3,
    html body .col-md-6, html body .col-sm-6 {
        padding: 4px !important;
    }

    /* ── Page title ── */
    html body .lw-page-title {
        font-size: 1.3rem !important;
        margin-bottom: 12px !important;
    }

    /* ── Breadcrumb ── */
    nav.lw-breadcrumb-container {
        padding: 6px 10px !important;
        font-size: 12px !important;
    }

    /* ── Tables ── */
    .dataTables_wrapper {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }
    .dataTables_wrapper .table {
        min-width: 500px !important;
    }
    .dataTables_wrapper .table td,
    .dataTables_wrapper .table th {
        font-size: 12px !important;
        padding: 8px 10px !important;
    }
    .dataTables_length, .dataTables_filter {
        font-size: 12px !important;
    }

    /* ── Forms ── */
    .form-control, .selectize-input {
        font-size: 14px !important;
        padding: 8px 10px !important;
    }
    .btn {
        font-size: 13px !important;
        padding: 8px 14px !important;
    }

    /* ── BRA Modal (Set Reminder) ── */
    html body #bra-modal > div {
        width: 95vw !important;
        max-width: 95vw !important;
        max-height: 92vh !important;
        margin: 4vh auto !important;
        border-radius: 10px !important;
    }
    html body #bra-modal > div > div:first-child {
        padding: 12px 14px !important;
        border-radius: 10px 10px 0 0 !important;
    }
    html body #bra-modal > div > div:first-child h5 {
        font-size: 14px !important;
    }
    html body #bra-modal > div > div:nth-child(2) {
        padding: 12px !important;
    }
    html body #bra-modal input,
    html body #bra-modal select,
    html body #bra-modal textarea {
        font-size: 14px !important;
        padding: 9px 10px !important;
    }
    html body #bra-tab-text,
    html body #bra-tab-media,
    html body #bra-tab-template {
        padding: 8px 4px !important;
        font-size: 11px !important;
    }
    html body #bra-modal button[onclick="braSubmit()"] {
        padding: 12px !important;
        font-size: 14px !important;
    }

    /* ── Calendar ── */
    html body .fc .fc-toolbar-title {
        font-size: .8rem !important;
    }
    html body .fc .fc-col-header-cell-cushion {
        font-size: .6rem !important;
        padding: 4px 2px !important;
    }
    html body .fc .fc-daygrid-day-number {
        font-size: .7rem !important;
        padding: 2px !important;
    }
    html body .fc .fc-toolbar.fc-header-toolbar {
        padding: 8px 10px !important;
    }
    html body .fc .fc-button {
        padding: 2px 6px !important;
        font-size: .75rem !important;
    }

    /* ── WhatsApp Chat ── */
    html body .card.lw-whatsapp-chat-block-container {
        border-radius: 8px !important;
    }
    html body .lw-whatsapp-chat-window .user-bar {
        padding: 8px 10px !important;
    }
    html body .lw-whatsapp-chat-window .conversation-compose {
        padding: 6px 8px !important;
    }
    html body .lw-whatsapp-chat-window .message {
        max-width: 85% !important;
        font-size: 13px !important;
    }

    /* ── Dropdowns ── */
    .dropdown-menu {
        font-size: 13px !important;
        padding: 4px 0 !important;
    }
    .dropdown-item {
        padding: 8px 14px !important;
    }

    /* ── Modals ── */
    .modal-dialog {
        margin: 8px !important;
        max-width: calc(100vw - 16px) !important;
    }
    .modal .modal-body {
        padding: 14px !important;
    }

    /* ── Badges ── */
    .badge {
        font-size: 10px !important;
        padding: 3px 6px !important;
    }
}

@media (max-width: 480px) {

    /* ── Tighter spacing ── */
    html body .container-fluid {
        padding: 6px 8px !important;
    }
    html body .card-body {
        padding: 10px !important;
    }

    /* ── Stat card numbers ── */
    html body .card-body h1,
    html body .card-body h2,
    html body .card .value {
        font-size: 22px !important;
    }
    html body .card-body p.text-uppercase,
    html body .card-body .text-uppercase {
        font-size: .65rem !important;
    }

    /* ── Navbar ── */
    html body #navbar-main .navbar-brand span,
    html body #navbar-main .d-none-mobile {
        display: none !important;
    }

    /* ── Page title ── */
    html body .lw-page-title {
        font-size: 1.1rem !important;
    }

    /* ── Buttons ── */
    .btn.btn-primary {
        padding: 8px 16px !important;
        font-size: 13px !important;
    }

    /* ── Tables ── */
    .dataTables_wrapper .table td,
    .dataTables_wrapper .table th {
        font-size: 11px !important;
        padding: 6px 8px !important;
        white-space: nowrap !important;
    }

    /* ── Chat ── */
    html body .lw-whatsapp-chat-window .message {
        max-width: 90% !important;
        font-size: 12px !important;
    }
    html body .lw-whatsapp-chat-window .metadata .time {
        font-size: 10px !important;
    }

    /* ── Calendar ── */
    html body .fc .fc-toolbar-title { font-size: .75rem !important; }
    html body .fc .fc-daygrid-day-number { font-size: .65rem !important; }

    /* ── BRA Modal ── */
    html body #bra-modal > div {
        width: 98vw !important;
        max-height: 96vh !important;
        margin: 2vh auto !important;
    }
    html body #bra-tab-text,
    html body #bra-tab-media,
    html body #bra-tab-template {
        font-size: 10px !important;
        padding: 7px 2px !important;
    }
}
/* ══ MOBILE FIXES ══════════════════════════════════ */

/* Navbar text — white on green bg */
html body #navbar-main span,
html body #navbar-main .navbar-text,
html body #navbar-main .nav-link,
html body #navbar-main a,
html body #navbar-main p,
html body #navbar-main small,
html body #navbar-main .dropdown-toggle {
    color: #fff !important;
}
html body #navbar-main .dropdown-menu span,
html body #navbar-main .dropdown-menu a,
html body #navbar-main .dropdown-menu .nav-link {
    color: var(--text-light) !important;
}

/* Language selector text */
html body #navbar-main .lw-language-selector,
html body #navbar-main [class*="language"] {
    color: #fff !important;
}

/* Contact avatar — always show with green border */
html body .lw-contact-avatar,
html body .lw-whatsapp-chat-window .lw-contact-avatar,
html body [class*="lw-contact-avatar"] {
    background: #0f1a13 !important;
    color: var(--neon-green) !important;
    border: 1.5px solid rgba(0,255,136,.3) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: 50% !important;
    font-size: .85rem !important;
}

@media (max-width: 768px) {
    /* Ensure navbar items visible on mobile */
    html body #navbar-main .navbar-collapse {
        background: linear-gradient(90deg,#0d2f1f,#0a1f15) !important;
        padding: 8px !important;
        border-top: 1px solid rgba(0,255,136,.1) !important;
    }
    html body #navbar-main .navbar-collapse .nav-link,
    html body #navbar-main .navbar-collapse span,
    html body #navbar-main .navbar-collapse a {
        color: #fff !important;
    }

    /* Contact list items on mobile */
    html body .lw-contact h2,
    html body .lw-contact h3,
    html body .lw-contact .lw-contact-name {
        font-size: 13px !important;
        color: var(--text-light) !important;
    }
    html body .lw-contact small,
    html body .lw-contact .text-muted {
        font-size: 11px !important;
        color: var(--text-muted) !important;
    }

    /* Avatar size on mobile */
    html body .lw-contact-avatar {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        font-size: .8rem !important;
    }
}
/* ══ REMOVE MESSAGE BUBBLE BORDERS ════════════════ */
html body .lw-whatsapp-chat-window .message,
html body .lw-whatsapp-chat-window .message.sent,
html body .lw-whatsapp-chat-window .message.received {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}
/* ══ CONTACT LIST / CHAT DIVIDER LINE ═════════════ */
html body .card.lw-whatsapp-chat-block-container .lw-contact-list-block {
    border-right: 1px solid rgba(0,255,136,.2) !important;
}
html body .card.lw-whatsapp-chat-block-container .lw-whatsapp-chat-window {
    border-left: 1px solid rgba(0,255,136,.2) !important;
}