/* ---------------------------------------------------------------------------
   Dark mode for the components that only had half of it.
 
   The convention here is a PAIR: `[data-theme="dark"] .x` for an explicit dark
   choice, and the same declarations under
   `@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .x }`
   for the OS default. 'system' is the DEFAULT theme and it REMOVES the
   data-theme attribute, so a rule with only the first half never matches for
   anyone who has not explicitly picked dark — they get the light styling on a
   dark OS.
 
   These 41 selectors had only that first half. The declarations are copied
   from it verbatim, so the two halves say the same thing, which is what the
   convention requires: when both match, the guarded one wins on specificity
   (0,3,0 against 0,2,0), and halves that disagree make that a live difference.
   --------------------------------------------------------------------------- */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .activity-tab.active { background: rgba(255, 255, 255, 0.1); }
    :root:not([data-theme="light"]) .apple-calendar-badge { opacity: 0.8; }
    :root:not([data-theme="light"]) .auth-btn-apple { background: #ffffff; color: #000000; border-color: #ffffff; }
    :root:not([data-theme="light"]) .auth-btn-apple:hover { background: #e8e8e8; }
    :root:not([data-theme="light"]) .billing-interval-btn.active { background: var(--bg-secondary); }
    :root:not([data-theme="light"]) .billing-plan-card { background: var(--bg-tertiary); }
    :root:not([data-theme="light"]) .billing-plan-icon { background: var(--bg-secondary); }
    :root:not([data-theme="light"]) .btn-danger { background: var(--color-red-fill); }
    :root:not([data-theme="light"]) .btn-danger-text { color: var(--color-red-text); }
    :root:not([data-theme="light"]) .btn-danger-text:hover { color: var(--color-red-text); background: rgba(239, 68, 68, 0.15); }
    :root:not([data-theme="light"]) .btn-danger:hover { background: var(--color-red-fill-hover); }
    :root:not([data-theme="light"]) .conversation-message.own .conversation-message-content { background: rgba(74, 144, 217, 0.15); }
    :root:not([data-theme="light"]) .conversation-reply-input { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.05); }
    :root:not([data-theme="light"]) .entity-links-btn:hover { background: rgba(255,255,255,0.1); }
    :root:not([data-theme="light"]) .entity-links-confirm:hover { background: rgba(16, 185, 129, 0.2); }
    :root:not([data-theme="light"]) .entity-links-dismiss:hover { background: rgba(239, 68, 68, 0.2); }
    :root:not([data-theme="light"]) .entity-links-drawer { background: var(--bg-card, #1c1c2a); border-left-color: rgba(255,255,255,0.08); box-shadow: -8px 0 28px rgba(0, 0, 0, 0.5); }
    :root:not([data-theme="light"]) .entity-links-drawer-close:hover { background: rgba(255,255,255,0.08); color: var(--text-light, #F5F5F7); }
    :root:not([data-theme="light"]) .entity-links-drawer-header { border-bottom-color: rgba(255,255,255,0.08); }
    :root:not([data-theme="light"]) .entity-links-icon { background: rgba(255,255,255,0.06); color: var(--text-secondary, #b8b8c4); }
    :root:not([data-theme="light"]) .entity-links-item:focus-visible { background: rgba(255,255,255,0.06); }
    :root:not([data-theme="light"]) .entity-links-item:hover { background: rgba(255,255,255,0.06); }
    :root:not([data-theme="light"]) .entity-links-title { color: var(--text-light, #F5F5F7); }
    :root:not([data-theme="light"]) .entity-links-toggle { background: var(--bg-card, #1c1c2a); border-color: rgba(255,255,255,0.08); box-shadow: -2px 0 12px rgba(0, 0, 0, 0.4); color: var(--text-secondary, #b8b8c4); }
    :root:not([data-theme="light"]) .entity-links-toggle-count { background: rgba(255,255,255,0.1); color: var(--text-secondary, #b8b8c4); }
    :root:not([data-theme="light"]) .entity-links-toggle:hover { color: var(--text-light, #F5F5F7); }
    :root:not([data-theme="light"]) .modal-comments-input { border-color: rgba(255, 255, 255, 0.15); background: rgba(255, 255, 255, 0.05); }
    :root:not([data-theme="light"]) .plan-card { background: var(--bg-secondary); }
    :root:not([data-theme="light"]) .plan-card:hover { background: var(--bg-tertiary); }
    :root:not([data-theme="light"]) .quick-add-input:empty:before { color: rgba(255, 255, 255, 0.4); }
    :root:not([data-theme="light"]) .quick-add-modal { background: rgba(40, 40, 42, 0.95); border: 1px solid rgba(255, 255, 255, 0.1); }
    :root:not([data-theme="light"]) .session-expired-icon { background: linear-gradient(135deg, rgba(53, 122, 189, 0.15) 0%, rgba(53, 122, 189, 0.08) 100%); }
    :root:not([data-theme="light"]) .session-expired-overlay { background: linear-gradient(135deg, rgba(17, 24, 39, 0.95) 0%, rgba(31, 41, 55, 0.95) 100%); }
    :root:not([data-theme="light"]) .tag-chip:hover { box-shadow: var(--shadow-2); }
    :root:not([data-theme="light"]) .tag-detail-close:hover { background: rgba(255, 255, 255, 0.08); }
    :root:not([data-theme="light"]) .tag-detail-delete-btn:hover { background: rgba(239, 68, 68, 0.15); }
    :root:not([data-theme="light"]) .tag-detail-modal { box-shadow: var(--shadow-3); }
    :root:not([data-theme="light"]) .ub-container { box-shadow: var(--shadow-3); }
    :root:not([data-theme="light"]) .ub-overlay { background: rgba(0, 0, 0, 0.4); }
    :root:not([data-theme="light"]) .upgrade-prompt-content { background: var(--bg-secondary); }
    :root:not([data-theme="light"]) .workspace-dropdown { background: #1e1e1e; }
}