/* ═══════════════════════════════════════════════════════════════
   Mr. Jhole — modals, dialogs, sheets & drawers (dark mode)
   One place for every popup so none of them keeps a light panel
   with light text on the navy theme. Light mode is unchanged.
═══════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  --mdl-surface: #0D2044;
  --mdl-sub: #12264A;
  --mdl-field: #0A1A38;
  --mdl-line: rgba(135,152,187,.22);
  --mdl-text: #F4F7FF;
  --mdl-text2: #B6C3DE;
  --mdl-muted: #8798BB;
  --mdl-accent: #F23A5C;
}

/* ── Backdrops ── */
[data-theme="dark"] .modal,
[data-theme="dark"] .rp-overlay, [data-theme="dark"] .report-overlay, [data-theme="dark"] .snippet-overlay,
[data-theme="dark"] .create-group-overlay, [data-theme="dark"] .browse-overlay, [data-theme="dark"] .drop-overlay,
[data-theme="dark"] .bottom-modal-overlay, [data-theme="dark"] .jh-lg-overlay, [data-theme="dark"] .recording-overlay,
[data-theme="dark"] .chat-overlay, [data-theme="dark"] #jh-overlay { background: rgba(3,9,22,.72) !important; }

/* ── Panels ── */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .rp-modal, [data-theme="dark"] .report-modal, [data-theme="dark"] .snippet-modal,
[data-theme="dark"] .create-group-modal, [data-theme="dark"] .browse-modal, [data-theme="dark"] .gift-modal,
[data-theme="dark"] .drop-sheet, [data-theme="dark"] .bottom-modal, [data-theme="dark"] .jh-lg-modal,
[data-theme="dark"] #jh-box, [data-theme="dark"] .chat-drawer,
[data-theme="dark"] #settings-modal > div, [data-theme="dark"] #rate-modal, [data-theme="dark"] #room-settings-modal,
[data-theme="dark"] #discovery-modal > div, [data-theme="dark"] #gift-modal > div {
  background: var(--mdl-surface) !important;
  color: var(--mdl-text) !important;
  border: 1px solid var(--mdl-line) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.6) !important;
}

/* ── Header / body / footer ── */
[data-theme="dark"] .modal-header, [data-theme="dark"] .flash-modal-header, [data-theme="dark"] .browse-modal-header, [data-theme="dark"] .drop-sheet-header,
[data-theme="dark"] .modal-footer, [data-theme="dark"] .flash-modal-footer, [data-theme="dark"] .chat-header, [data-theme="dark"] .chat-footer {
  background: transparent !important; border-color: var(--mdl-line) !important; color: var(--mdl-text) !important;
}
[data-theme="dark"] .modal-body, [data-theme="dark"] .flash-modal-body, [data-theme="dark"] .pasal-post-right { background: transparent !important; color: var(--mdl-text) !important; }
[data-theme="dark"] .modal-title, [data-theme="dark"] .modal-header h2, [data-theme="dark"] .modal-header h3,
[data-theme="dark"] .flash-modal-title, [data-theme="dark"] .browse-modal-header h2, [data-theme="dark"] .browse-modal-header h3,
[data-theme="dark"] #jh-title, [data-theme="dark"] .rp-modal h3, [data-theme="dark"] .report-modal h3, [data-theme="dark"] .snippet-modal h3,
[data-theme="dark"] .create-group-modal h2, [data-theme="dark"] .create-group-modal h3, [data-theme="dark"] #modal-title, [data-theme="dark"] #browse-modal-title { color: var(--mdl-text) !important; }
[data-theme="dark"] .flash-modal-sub, [data-theme="dark"] #jh-msg, [data-theme="dark"] .rp-modal p, [data-theme="dark"] .report-modal p,
[data-theme="dark"] .browse-modal-header p, [data-theme="dark"] #browse-modal-subtitle, [data-theme="dark"] .modal-sub, [data-theme="dark"] .modal-body p { color: var(--mdl-text2) !important; }
[data-theme="dark"] .modal-section { background: transparent !important; border-color: var(--mdl-line) !important; }
[data-theme="dark"] .modal-section-title, [data-theme="dark"] .modal-body label, [data-theme="dark"] .form-label, [data-theme="dark"] .flash-modal-body label { color: var(--mdl-text) !important; }
[data-theme="dark"] .modal-body small, [data-theme="dark"] .form-hint, [data-theme="dark"] .modal-body .hint { color: var(--mdl-muted) !important; }

/* ── Close buttons ── */
[data-theme="dark"] .close-modal, [data-theme="dark"] .modal-close, [data-theme="dark"] .drop-sheet-close, [data-theme="dark"] .chat-close-btn {
  background: rgba(255,255,255,.08) !important; color: var(--mdl-text2) !important; border: none !important;
}
[data-theme="dark"] .close-modal:hover, [data-theme="dark"] .modal-close:hover { background: rgba(255,255,255,.16) !important; color: #fff !important; }

/* ── Form controls ── */
[data-theme="dark"] .modal input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),
[data-theme="dark"] .modal select, [data-theme="dark"] .modal textarea,
[data-theme="dark"] .rp-modal input, [data-theme="dark"] .rp-modal textarea, [data-theme="dark"] .rp-note,
[data-theme="dark"] .report-modal input, [data-theme="dark"] .report-modal textarea, [data-theme="dark"] .report-modal select,
[data-theme="dark"] .snippet-modal input, [data-theme="dark"] .snippet-modal textarea,
[data-theme="dark"] .create-group-modal input, [data-theme="dark"] .create-group-modal textarea, [data-theme="dark"] .create-group-modal select,
[data-theme="dark"] .browse-modal input, [data-theme="dark"] .gift-modal input, [data-theme="dark"] #jh-box input,
[data-theme="dark"] .chat-drawer input, [data-theme="dark"] .chat-input,
[data-theme="dark"] .form-input, [data-theme="dark"] .form-select, [data-theme="dark"] .form-textarea {
  background: var(--mdl-field) !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; caret-color: var(--mdl-accent);
}
[data-theme="dark"] .modal input::placeholder, [data-theme="dark"] .modal textarea::placeholder, [data-theme="dark"] .rp-note::placeholder,
[data-theme="dark"] .create-group-modal input::placeholder, [data-theme="dark"] .create-group-modal textarea::placeholder, [data-theme="dark"] .chat-input::placeholder,
[data-theme="dark"] .form-input::placeholder, [data-theme="dark"] .form-textarea::placeholder { color: #7488B0 !important; }
[data-theme="dark"] .modal input:focus, [data-theme="dark"] .modal select:focus, [data-theme="dark"] .modal textarea:focus,
[data-theme="dark"] .form-input:focus, [data-theme="dark"] .form-select:focus, [data-theme="dark"] .form-textarea:focus, [data-theme="dark"] .chat-input:focus {
  border-color: var(--mdl-accent) !important; box-shadow: 0 0 0 3px rgba(242,58,92,.18) !important; background: var(--mdl-field) !important;
}
[data-theme="dark"] .modal select option, [data-theme="dark"] .create-group-modal select option, [data-theme="dark"] .form-select option { background: #0D2044; color: #F4F7FF; }
[data-theme="dark"] .modal .has-err, [data-theme="dark"] .form-input.has-err { background: rgba(242,58,92,.10) !important; border-color: #F23A5C !important; }

/* ── Choice rows (radio cards, toggles, condition pills, upload slots) ── */
[data-theme="dark"] .rp-opt, [data-theme="dark"] .modal .option-card, [data-theme="dark"] .modal .toggle-card, [data-theme="dark"] .modal .opt-card {
  background: var(--mdl-sub) !important; border-color: var(--mdl-line) !important; color: var(--mdl-text) !important;
}
[data-theme="dark"] .rp-opt:has(input:checked) { background: rgba(242,58,92,.14) !important; border-color: var(--mdl-accent) !important; }
[data-theme="dark"] .modal .photo-slot, [data-theme="dark"] .modal .upload-slot, [data-theme="dark"] .modal .slot, [data-theme="dark"] .modal [class*="-slot"] { background: var(--mdl-field) !important; border-color: var(--mdl-line) !important; color: var(--mdl-text2) !important; }
[data-theme="dark"] .modal-content [class*="cond"] button, [data-theme="dark"] .modal-content .cond-btn { color: var(--mdl-text) !important; }

/* ── Buttons ── */
[data-theme="dark"] .btn-cancel-modal, [data-theme="dark"] .rp-cancel, [data-theme="dark"] #jh-cancel, [data-theme="dark"] .modal .btn-secondary,
[data-theme="dark"] .modal-footer .btn-outline, [data-theme="dark"] .modal-footer .cancel {
  background: transparent !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; box-shadow: none !important;
}
[data-theme="dark"] .btn-cancel-modal:hover, [data-theme="dark"] .rp-cancel:hover, [data-theme="dark"] #jh-cancel:hover { background: rgba(255,255,255,.07) !important; }
[data-theme="dark"] .modal-footer .btn-cancel, [data-theme="dark"] .modal-footer button[onclick*="close"]:not(.btn-primary) { color: var(--mdl-text) !important; }

/* ── Left promo panel of the post-listing modals ── */
[data-theme="dark"] .pasal-post-left, [data-theme="dark"] .radar-post-left {
  background: linear-gradient(160deg, #0F2750 0%, #0A1A38 100%) !important; border-right: 1px solid var(--mdl-line);
  color: var(--mdl-text) !important;
}
[data-theme="dark"] .pasal-post-left h2, [data-theme="dark"] .radar-post-left h2 { color: var(--mdl-text) !important; }
[data-theme="dark"] .pasal-post-left p, [data-theme="dark"] .radar-post-left p { color: var(--mdl-text2) !important; }
[data-theme="dark"] .pasal-left-pill, [data-theme="dark"] .radar-left-pill { background: rgba(255,255,255,.07) !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; box-shadow: none !important; }
[data-theme="dark"] .pasal-post-jpoints, [data-theme="dark"] .radar-post-jpoints { background: rgba(255,178,62,.12) !important; color: #FFC24A !important; border: 1px solid rgba(255,178,62,.35) !important; }
[data-theme="dark"] .pasal-post-jpoints i { color: #FFC24A !important; }

/* ── Confirm / alert dialog (MrJhole.confirm) ── */
[data-theme="dark"] #jh-box { border-radius: 22px !important; }
[data-theme="dark"] #jh-btns button:not(#jh-ok) { background: transparent !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; }

/* ── Chat drawer + bubbles inside Pasal / Radar detail ── */
[data-theme="dark"] .chat-handle { background: rgba(255,255,255,.25) !important; }
[data-theme="dark"] .chat-bubble.other { background: #12264A !important; color: var(--mdl-text) !important; }
[data-theme="dark"] .chat-h-name, [data-theme="dark"] .cc-title { color: var(--mdl-text) !important; }
[data-theme="dark"] .chat-h-sub, [data-theme="dark"] .chat-bubble-time, [data-theme="dark"] .chat-info-msg { color: var(--mdl-muted) !important; }
[data-theme="dark"] .chat-context, [data-theme="dark"] .chat-messages { background: transparent !important; border-color: var(--mdl-line) !important; }
[data-theme="dark"] .chat-safe-note { background: rgba(255,178,62,.10) !important; color: #FFC24A !important; }
[data-theme="dark"] .chat-quick button { background: var(--mdl-sub) !important; color: var(--mdl-text) !important; border-color: var(--mdl-line) !important; }

/* ── Toasts ── */
[data-theme="dark"] .toast { background: #12264A; color: #F4F7FF; border: 1px solid var(--mdl-line); }
[data-theme="dark"] .toast.ok { background: #0F5A3A; border-color: rgba(34,197,94,.4); }
[data-theme="dark"] .toast.err { background: #6B1426; border-color: rgba(242,58,92,.45); }

/* ── Radar "Post Local Offer" modal (hard-coded #fff right panel) ── */
[data-theme="dark"] #postOfferModal .radar-post-right,
[data-theme="dark"] #postOfferModal .modal-header,
[data-theme="dark"] #postOfferModal .modal-body,
[data-theme="dark"] #postOfferModal .modal-footer { background: transparent !important; color: var(--mdl-text) !important; }
[data-theme="dark"] #postOfferModal .modal-content { background: var(--mdl-surface) !important; }
[data-theme="dark"] #postOfferModal .btn-cancel, [data-theme="dark"] .modal-footer .btn-cancel {
  background: transparent !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; box-shadow: none !important;
}
[data-theme="dark"] #postOfferModal .btn-cancel:hover { background: rgba(255,255,255,.07) !important; }
[data-theme="dark"] #postOfferModal label, [data-theme="dark"] #postOfferModal .addr-pick-label, [data-theme="dark"] #postOfferModal .modal-title { color: var(--mdl-text) !important; }
[data-theme="dark"] #postOfferModal small, [data-theme="dark"] #postOfferModal .addr-pick-text, [data-theme="dark"] #postOfferModal span.hint { color: var(--mdl-text2) !important; }
[data-theme="dark"] #postOfferModal .addr-pick-card, [data-theme="dark"] #postOfferModal [class*="addr-"] { background: var(--mdl-sub) !important; border-color: var(--mdl-line) !important; color: var(--mdl-text) !important; }
[data-theme="dark"] #postOfferModal button:not(.btn-primary):not(.btn-submit):not(.btn-cancel):not(.slot-remove):not(.close-modal):not(.modal-close) { color: var(--mdl-text2); }

/* ── Chiya Guff: create-group + browse-rooms + room-settings ── */
[data-theme="dark"] .create-group-modal, [data-theme="dark"] .browse-modal, [data-theme="dark"] #room-settings-modal { background: var(--mdl-surface) !important; }
[data-theme="dark"] .cg-right-panel, [data-theme="dark"] .cg-right-header, [data-theme="dark"] .cg-right-body, [data-theme="dark"] .cg-footer { background: transparent !important; border-color: var(--mdl-line) !important; }
[data-theme="dark"] .cg-right-header h3, [data-theme="dark"] .cg-left-title { color: var(--mdl-text) !important; }
[data-theme="dark"] .cg-right-header p, [data-theme="dark"] .cg-left-sub, [data-theme="dark"] .cg-char-count { color: var(--mdl-text2) !important; }
[data-theme="dark"] .cg-field label { color: var(--mdl-muted) !important; }
[data-theme="dark"] .cg-vis-card, [data-theme="dark"] .cg-toggle-row { background: var(--mdl-sub) !important; border: 1px solid var(--mdl-line) !important; }
[data-theme="dark"] .cg-vis-card.active { border-color: var(--mdl-accent) !important; background: rgba(242,58,92,.12) !important; }
[data-theme="dark"] .cg-vc-label, [data-theme="dark"] .cg-toggle-row > div > span { color: var(--mdl-text) !important; }
[data-theme="dark"] .cg-vc-desc, [data-theme="dark"] .cg-toggle-row > div > small { color: var(--mdl-text2) !important; }
[data-theme="dark"] .cg-vc-icon { background: rgba(255,255,255,.10) !important; color: var(--mdl-text) !important; }
[data-theme="dark"] .cg-footer button:not(.cg-btn-primary):not([type="submit"]) { background: transparent !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; }
[data-theme="dark"] .browse-modal-header h3, [data-theme="dark"] .browse-modal h3, [data-theme="dark"] .browse-modal .section-title, [data-theme="dark"] .browse-modal strong { color: var(--mdl-text) !important; }
[data-theme="dark"] .browse-modal p, [data-theme="dark"] .browse-empty, [data-theme="dark"] .browse-modal .hub-empty-desc { color: var(--mdl-text2) !important; }
[data-theme="dark"] .browse-close-btn { background: rgba(255,255,255,.08) !important; color: var(--mdl-text2) !important; }
[data-theme="dark"] .browse-modal [class*="tab"] { color: var(--mdl-text2); }
[data-theme="dark"] .browse-modal [class*="tab"].active { color: #fff; }

/* ── Final touch-ups from the contrast scan ── */
[data-theme="dark"] #postOfferModal .btn-post-offer, [data-theme="dark"] #postOfferModal .btn-submit, [data-theme="dark"] #postOfferModal .modal-footer .btn-primary { color: #fff !important; }
[data-theme="dark"] #browse-overlay .browse-search-wrap, [data-theme="dark"] .browse-search-wrap { background: transparent !important; }
[data-theme="dark"] .browse-search { background: var(--mdl-field) !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; }
[data-theme="dark"] #browse-overlay .browse-modal, [data-theme="dark"] #browse-overlay .browse-modal * { border-color: var(--mdl-line); }
[data-theme="dark"] #browse-overlay .browse-modal span, [data-theme="dark"] #browse-overlay .browse-modal .hub-empty-title { color: var(--mdl-text); }
[data-theme="dark"] #browse-overlay .browse-modal p, [data-theme="dark"] #browse-overlay .browse-modal .browse-empty { color: var(--mdl-text2) !important; }
[data-theme="dark"] .cg-step-label, [data-theme="dark"] .cg-right-header .cg-step-label { color: #FF8FA9 !important; }
[data-theme="dark"] .cg-left-title em { color: #FF6B8B !important; }

/* ── Guff "Browse Rooms" (ID-level rules in the page need ID-level overrides) ── */
[data-theme="dark"] #browse-overlay .browse-modal { color: var(--mdl-text) !important; background: var(--mdl-surface) !important; }
[data-theme="dark"] #browse-overlay .browse-left-panel { background: linear-gradient(160deg, #0F2750 0%, #0A1A38 100%) !important; border-right: 1px solid var(--mdl-line) !important; }
[data-theme="dark"] #browse-overlay .browse-lp-title { color: var(--mdl-text) !important; }
[data-theme="dark"] #browse-overlay .browse-lp-title em { color: #FF6B8B !important; }
[data-theme="dark"] #browse-overlay .browse-lp-sub { color: var(--mdl-text2) !important; }
[data-theme="dark"] #browse-overlay .browse-lp-feat { background: rgba(255,255,255,.07) !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; box-shadow: none !important; }
[data-theme="dark"] #browse-overlay .browse-lp-feat i { color: #FF6B8B !important; }
[data-theme="dark"] #browse-overlay .browse-lp-icon-outer { background: rgba(242,58,92,.14) !important; }
[data-theme="dark"] #browse-overlay .browse-right-panel, [data-theme="dark"] #browse-overlay .browse-modal-header, [data-theme="dark"] #browse-overlay .browse-search-wrap { background: transparent !important; border-color: var(--mdl-line) !important; }
[data-theme="dark"] #browse-overlay .browse-modal-header h3, [data-theme="dark"] #browse-overlay .browse-room-name { color: var(--mdl-text) !important; }
[data-theme="dark"] #browse-overlay .browse-modal-header p, [data-theme="dark"] #browse-overlay .browse-room-desc, [data-theme="dark"] #browse-overlay .browse-right-panel p { color: var(--mdl-text2) !important; }
[data-theme="dark"] #browse-overlay .browse-modal-header h3 span, [data-theme="dark"] #browse-overlay .browse-modal-header .browse-title-text { color: var(--mdl-text) !important; }
[data-theme="dark"] #browse-overlay .browse-search { background: var(--mdl-field) !important; color: var(--mdl-text) !important; border: 1px solid var(--mdl-line) !important; }
[data-theme="dark"] #browse-overlay .browse-room-item { background: var(--mdl-sub) !important; border-color: var(--mdl-line) !important; }
[data-theme="dark"] #browse-overlay .browse-join-btn { color: #FF8FA9 !important; border-color: #FF8FA9 !important; }
[data-theme="dark"] #browse-overlay .browse-join-btn.joined { background: var(--mdl-accent) !important; border-color: var(--mdl-accent) !important; color: #fff !important; }
[data-theme="dark"] .snippet-char-count { color: var(--mdl-muted) !important; }

/* ═══════════════════════════════════════════════════════════════
   Dark-mode page chrome (toolbar, search, buttons, pills)
   style.css forces a purple-black toolbar with !important; this
   brings every page onto the same navy surface as the login page.
═══════════════════════════════════════════════════════════════ */
html[data-theme="dark"] body .topbar {
  background: rgba(6,19,41,.78) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%);
  border-bottom: 1px solid rgba(135,152,187,.12) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body .topbar .search-input,
html[data-theme="dark"] body .search-input {
  background: #0D2044 !important; border: 1px solid rgba(135,152,187,.22) !important; color: #F4F7FF !important; box-shadow: none !important;
}
html[data-theme="dark"] body .search-input::placeholder { color: #7488B0 !important; }
html[data-theme="dark"] body .search-input:focus { border-color: #F23A5C !important; box-shadow: 0 0 0 3px rgba(242,58,92,.18) !important; background: #0A1A38 !important; }
html[data-theme="dark"] body .search-wrap i { color: #8798BB !important; }
html[data-theme="dark"] body .search-kbd { background: rgba(255,255,255,.07); color: #8798BB; border: 1px solid rgba(135,152,187,.2); }

/* location pills + primary action buttons: flat, no hard bottom edge */
html[data-theme="dark"] body .loc-pill, html[data-theme="dark"] body .pz-loc, html[data-theme="dark"] body .rz-loc {
  background: #0D2044 !important; border: 1px solid rgba(135,152,187,.22) !important; color: #F4F7FF !important; box-shadow: none !important;
}
body .topbar-post-btn, body .pasal-sell-btn, body .btn-post-offer:not(.btn-flash-push) { border-bottom: none !important; }
html[data-theme="dark"] body .topbar-post-btn, html[data-theme="dark"] body .pasal-sell-btn, html[data-theme="dark"] body .btn-post-offer:not(.btn-flash-push) {
  background: #F23A5C !important; color: #fff !important; box-shadow: 0 4px 14px rgba(242,58,92,.28) !important;
}
html[data-theme="dark"] body .topbar-post-btn:hover, html[data-theme="dark"] body .pasal-sell-btn:hover { background: #D92D4D !important; transform: none !important; }

/* category tabs under the toolbar (home) */
html[data-theme="dark"] body .cat-tab { color: #B6C3DE; }
html[data-theme="dark"] body .cat-tab:hover { color: #fff; }
html[data-theme="dark"] body .cat-tab.active { background: #F23A5C; color: #fff; }

/* topbar dropdown menu (+ Post) */
html[data-theme="dark"] body .topbar-post-menu { background: #0D2044 !important; border: 1px solid rgba(135,152,187,.22) !important; box-shadow: 0 16px 40px rgba(0,0,0,.5) !important; }
html[data-theme="dark"] body .tpm-item strong { color: #F4F7FF !important; }
html[data-theme="dark"] body .tpm-item span { color: #B6C3DE !important; }

/* search results overlay */
html[data-theme="dark"] #search-results-overlay { background: #0D2044 !important; border: 1px solid rgba(135,152,187,.22) !important; color: #F4F7FF; }
html[data-theme="dark"] #search-results-overlay .search-overlay-head h2, html[data-theme="dark"] .result-title { color: #F4F7FF !important; }
html[data-theme="dark"] .result-item:hover { background: rgba(255,255,255,.05) !important; }
html[data-theme="dark"] .result-group-header { color: #B6C3DE !important; }
@media (max-width: 860px) { .search-kbd { display: none !important; } }

/* Boli / Tank pickup picker: "Add another address" as a clear dashed button */
#addr-add-link, #pool-addr-add-link { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 10px; padding: 10px 14px; border: 1.5px dashed currentColor; border-radius: 10px; font-size: .82rem; font-weight: 700; text-decoration: none; box-sizing: border-box; }
#addr-add-link:hover, #pool-addr-add-link:hover { background: rgba(255,32,93,.07); text-decoration: none; }