/* Light Mode Theme Overrides */

/* Header */
body.light-mode .app-header {
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .header-logo h1 {
    color: #111827;
}

/* Search */
body.light-mode .search-input {
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .search-input::placeholder {
    color: #9ca3af;
}

body.light-mode .search-input:focus {
    background: #ffffff;
    border-color: #9ca3af;
}

body.light-mode .search-icon {
    stroke: #6b7280;
}

body.light-mode .search-results {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

body.light-mode .search-result-item {
    border-bottom: 1px solid #f3f4f6;
}

body.light-mode .search-result-item:hover {
    background: #f9fafb;
}

body.light-mode .search-result-icon {
    stroke: #6b7280;
}

body.light-mode .search-result-title {
    color: #111827;
}

body.light-mode .search-result-description {
    color: #6b7280;
}

body.light-mode .search-result-meta {
    color: #9ca3af;
}

/* Theme Toggle Button */
body.light-mode .theme-toggle-btn {
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .theme-toggle-btn:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

body.light-mode .theme-toggle-btn svg {
    stroke: #111827;
}

body.light-mode .theme-toggle-btn:focus,
body.light-mode .theme-toggle-btn:active {
    outline: none;
    box-shadow: none;
}

/* Add New Button */
body.light-mode .add-new-btn {
    background: #111827;
    color: #ffffff;
    border: 1px solid #111827;
}

body.light-mode .add-new-btn:hover {
    background: #1f2937;
    border-color: #1f2937;
}

body.light-mode .add-new-btn svg {
    stroke: #ffffff;
}

/* Primary CTA — black button (matches add-new-btn; used across forms, widgets, email, etc.) */
body.light-mode .btn-primary,
body.light-mode .btn.btn-primary,
body.light-mode .modal-actions .btn-primary,
body.light-mode .modal-content .btn-primary,
body.light-mode .import-modal-content .modal-actions .btn-primary,
body.light-mode .contacts-import-modal .btn-primary,
body.light-mode .add-form-btn,
body.light-mode .add-campaign-btn,
body.light-mode .add-list-btn,
body.light-mode .add-new-trigger,
body.light-mode .contacts-new-contact-btn,
body.light-mode .top-bar-actions .submit-button:not(.pl-dash-editor-save-btn),
body.light-mode .create-form-page .submit-button:not(.pl-dash-editor-save-btn),
body.light-mode .create-widget-page .submit-button:not(.pl-dash-editor-save-btn),
body.light-mode .submit-button:not(.pl-dash-editor-save-btn) {
    background: #111827 !important;
    color: #ffffff !important;
    border-color: #111827 !important;
}

body.light-mode .btn-primary:hover,
body.light-mode .btn.btn-primary:hover,
body.light-mode .modal-actions .btn-primary:hover,
body.light-mode .modal-content .btn-primary:hover,
body.light-mode .import-modal-content .modal-actions .btn-primary:hover,
body.light-mode .contacts-import-modal .btn-primary:hover,
body.light-mode .add-form-btn:hover,
body.light-mode .add-campaign-btn:hover,
body.light-mode .add-list-btn:hover,
body.light-mode .add-new-trigger:hover,
body.light-mode .contacts-new-contact-btn:hover,
body.light-mode .top-bar-actions .submit-button:hover:not(:disabled):not(.pl-dash-editor-save-btn),
body.light-mode .create-form-page .submit-button:hover:not(:disabled):not(.pl-dash-editor-save-btn),
body.light-mode .create-widget-page .submit-button:hover:not(:disabled):not(.pl-dash-editor-save-btn),
body.light-mode .submit-button:hover:not(:disabled):not(.pl-dash-editor-save-btn) {
    background: #1f2937 !important;
    color: #ffffff !important;
    border-color: #1f2937 !important;
}

body.light-mode .add-new-dropdown {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

body.light-mode .add-new-dropdown-item {
    color: #111827;
    border-bottom: 1px solid #f3f4f6;
}

body.light-mode .add-new-dropdown-item:hover {
    background: #f9fafb;
}

body.light-mode .add-new-dropdown-item .dropdown-icon svg {
    stroke: #111827;
    fill: #111827;
}

body.light-mode .add-new-dropdown-back {
    color: #6b7280;
}

body.light-mode .add-new-dropdown-back:hover {
    color: #111827;
    background: #f3f4f6;
}

/* Modal overlay (sending emails, send test, etc.) – lighter backdrop in light mode */
body.light-mode .modal {
    background: rgba(0, 0, 0, 0.35);
}

body.light-mode .modal-content {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    color: #111827;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
}

body.light-mode .modal-content h3 {
    color: #111827;
}

body.light-mode .modal-content p {
    color: #6b7280;
}

body.light-mode .modal-input {
    background: #ffffff;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .modal-input::placeholder {
    color: #9ca3af;
}

body.light-mode .modal-actions .btn {
    background: #2563eb;
    color: #ffffff;
}

body.light-mode .modal-actions .btn:hover {
    background: #1d4ed8;
}

body.light-mode .modal-actions .btn-secondary {
    background: #f3f4f6;
    color: #374151;
}

body.light-mode .modal-actions .btn-secondary:hover {
    background: #e5e7eb;
}

/* Notification Icon */
body.light-mode .notification-icon {
    color: #111827;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
}

body.light-mode .notification-icon svg {
    fill: #111827;
}

body.light-mode .notification-icon:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

body.light-mode .notification-badge {
    background: #ef4444;
    color: #ffffff;
}

/* Notification Dropdown */
body.light-mode .notification-dropdown {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}

body.light-mode .notification-header {
    border-bottom: 1px solid #e5e7eb;
    background: #ffffff;
    color: #111827;
}

body.light-mode .notification-header h3 {
    color: #111827;
}

body.light-mode .notification-content {
    background: #ffffff;
}

body.light-mode .mark-read-btn {
    color: #6366f1;
}

body.light-mode .mark-read-btn:hover {
    color: #4f46e5;
    background: #eef2ff;
}

body.light-mode .notification-item {
    border-bottom: 1px solid #f3f4f6;
}

body.light-mode .notification-item:hover {
    background: #f9fafb;
}

body.light-mode .notification-item.unread {
    background: #eff6ff;
}

body.light-mode .notification-item.unread:hover {
    background: #dbeafe;
}

body.light-mode .notification-content h4 {
    color: #111827;
}

body.light-mode .notification-content p {
    color: #6b7280;
}

body.light-mode .notification-time {
    color: #9ca3af;
}

body.light-mode .notification-thumbnail {
    border: 1px solid #e5e7eb;
    background: #f9fafb;
}

body.light-mode .notification-empty {
    color: #6b7280;
}

body.light-mode .notification-loading {
    color: #9ca3af;
}

body.light-mode .notification-text {
    color: #4b5563;
}

body.light-mode .notification-content-wrapper {
    background: transparent;
}

body.light-mode .notification-avatar {
    background: #3b82f6;
    color: #ffffff;
}

body.light-mode .notification-icon-small {
    stroke: currentColor;
}

body.light-mode .notification-unread-dot {
    background: #2563eb;
}

/* Notification scrollbar */
body.light-mode .notification-content::-webkit-scrollbar-track {
    background: #f3f4f6;
}

body.light-mode .notification-content::-webkit-scrollbar-thumb {
    background: #d1d5db;
}

body.light-mode .notification-content::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

/* Header Messages Icon */
body.light-mode .header-messages-link {
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .header-messages-link:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

body.light-mode .header-messages-link .header-messages-icon {
    fill: #111827;
}

/* Header dialer (dialpad) */
body.light-mode .header-dialer-btn {
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(5, 150, 105, 0.4);
    color: #047857;
}
body.light-mode .header-dialer-btn:hover {
    background: rgba(16, 185, 129, 0.2);
    border-color: rgba(5, 150, 105, 0.55);
    color: #065f46;
}

body.light-mode .header-desktop-text-btn {
    background: rgba(79, 70, 229, 0.08);
    border: 1px solid rgba(79, 70, 229, 0.35);
    color: #4338ca;
}
body.light-mode .header-desktop-text-btn:hover {
    background: rgba(79, 70, 229, 0.14);
    border-color: rgba(67, 56, 202, 0.5);
    color: #312e81;
}

/* User Icon */
body.light-mode .user-icon {
    background: #f3f4f6;
    color: #111827;
    border: 1px solid #d1d5db;
}

body.light-mode .user-icon:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

/* User Dropdown */
body.light-mode .user-dropdown {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
}

body.light-mode .user-dropdown-header {
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

body.light-mode .user-name {
    color: #111827;
}

body.light-mode .user-email {
    color: #6b7280;
}

body.light-mode .user-dropdown-item {
    color: #111827;
}

body.light-mode .user-dropdown-item:hover {
    background: #f9fafb;
}

body.light-mode .user-dropdown-item svg {
    stroke: #111827;
}

body.light-mode .user-dropdown-item {
    color: #4b5563;
}

body.light-mode .user-dropdown-item .dropdown-icon-svg {
    fill: #4b5563;
    stroke: #4b5563;
}

body.light-mode .user-dropdown-item.logout {
    color: #ef4444;
    border-top: 1px solid #e5e7eb;
}

body.light-mode .user-dropdown-item.logout:hover {
    background: #fef2f2;
}

body.light-mode .user-dropdown-item.logout svg {
    stroke: #ef4444;
}

/* Settings Modal */
body.light-mode .settings-modal-overlay {
    background: rgba(0, 0, 0, 0.5);
}

body.light-mode .settings-modal {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
}

body.light-mode .settings-modal-header h2 {
    color: #111827;
}

body.light-mode .settings-close-btn {
    color: #6b7280;
}

body.light-mode .settings-close-btn:hover {
    color: #111827;
    background: #f3f4f6;
}

body.light-mode .settings-section h3 {
    color: #111827;
}

body.light-mode .settings-theme-primary {
    color: #111827;
}

body.light-mode .settings-theme-hint {
    color: #6b7280;
}

body.light-mode .settings-field label {
    color: #6b7280;
}

body.light-mode .settings-field-value {
    color: #111827;
}

body.light-mode .settings-field input:not([type="checkbox"]):not([type="radio"]) {
    background: transparent;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .settings-field input:not([type="checkbox"]):not([type="radio"]):focus {
    border-color: #3b82f6;
    background: transparent;
}

body.light-mode .settings-edit-icon-btn {
    background: #f3f4f6;
    color: #6b7280;
}
body.light-mode .settings-edit-icon-btn:hover {
    background: #e5e7eb;
    color: #111827;
}
body.light-mode .settings-edit-btn,
body.light-mode .settings-cancel-btn {
    background: #ffffff;
    color: #111827;
    border: 1px solid #d1d5db;
}

body.light-mode .settings-edit-btn:hover,
body.light-mode .settings-cancel-btn:hover {
    background: #f9fafb;
}

body.light-mode .settings-edit-btn:focus,
body.light-mode .settings-edit-btn:active,
body.light-mode .settings-cancel-btn:focus,
body.light-mode .settings-cancel-btn:active {
    outline: none;
    box-shadow: none;
}

body.light-mode .settings-save-btn {
    background: #111827;
    color: #ffffff;
}

body.light-mode .settings-save-btn:hover {
    background: #1f2937;
}

body.light-mode .settings-save-btn:disabled {
    background: #f9fafb;
    color: #9ca3af;
    border-color: #e5e7eb;
}

body.light-mode .settings-save-btn:focus,
body.light-mode .settings-save-btn:active {
    outline: none;
    box-shadow: none;
}

body.light-mode #notificationEmailSection .settings-save-btn {
    background: #111827;
    color: #ffffff;
}
body.light-mode #notificationEmailSection .settings-save-btn:hover {
    background: #1f2937;
    color: #ffffff;
}

/* Divider only under collapsible header in classic settings modal — not on settings page tab */
body.light-mode .settings-danger-zone-content .settings-danger-zone {
    border-top: 1px solid #e5e7eb;
}

body.light-mode .settings-actions {
    border-top: 1px solid #e5e7eb;
}

body.light-mode .settings-danger-zone h4 {
    color: #ef4444;
}

body.light-mode .settings-delete-btn {
    background: #ef4444;
}

body.light-mode .settings-delete-btn:hover {
    background: #dc2626;
}

body.light-mode .settings-modal-content {
    background: #ffffff;
}

/* Settings modal scrollbar */
body.light-mode .settings-modal-content::-webkit-scrollbar-track {
    background: #f3f4f6;
}

body.light-mode .settings-modal-content::-webkit-scrollbar-thumb {
    background: #d1d5db;
}

body.light-mode .settings-modal-content::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

body.light-mode .settings-section-title {
    color: #6b7280;
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .settings-field {
    background: transparent;
    border: none;
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .settings-field-label {
    color: #6b7280;
}

body.light-mode .settings-field input:disabled {
    background: transparent;
    border: none;
    color: #111827;
}

body.light-mode .settings-loading {
    color: #6b7280;
}

body.light-mode .settings-error {
    color: #ef4444;
}

/* Billing modal (inside settings shell) — override dark typography tokens */
body.light-mode #billingModalContentInner .settings-field-value.is-muted-text {
    color: #6b7280 !important;
}
body.light-mode #billingModalContentInner .billing-total-min {
    color: #111827;
}
body.light-mode #billingModalContentInner .billing-meter-line,
body.light-mode #billingModalContentInner .billing-est-line {
    color: #6b7280;
}
body.light-mode #billingModalContentInner .billing-num-strong,
body.light-mode #billingModalContentInner .billing-money-strong {
    color: #111827;
}
body.light-mode #billingModalContentInner .billing-fetch-hint {
    color: #6b7280;
}
body.light-mode #billingModalContentInner .billing-statement-row .settings-field-label {
    color: #111827;
}
body.light-mode #billingModalContentInner .billing-statement-row .settings-field-value {
    color: #6b7280;
}
body.light-mode #billingModalContentInner .billing-statement-row:hover {
    background: #f9fafb;
}
body.light-mode #billingModalContentInner .billing-statement-row:hover .settings-field-value {
    color: #111827;
}

/* Notification verification box in light mode */
body.light-mode .notification-verification-box {
    background: #f9fafb;
    border-color: #e5e7eb;
}
body.light-mode .notification-verification-box p {
    color: #6b7280;
}
body.light-mode .notification-verification-box .verify-row input {
    background: #fff;
    border-color: #d1d5db;
    color: #111827;
}
body.light-mode .notification-verification-box .verify-row input:focus {
    border-color: #3b82f6;
}
body.light-mode .notification-verification-box .notification-resend-btn,
body.light-mode .notification-verification-box .notification-cancel-btn,
body.light-mode .notification-verification-box .btn-resend {
    color: #374151;
    background: #fff;
    border-color: #d1d5db;
}
body.light-mode .notification-verification-box .notification-resend-btn:hover,
body.light-mode .notification-verification-box .notification-cancel-btn:hover,
body.light-mode .notification-verification-box .btn-resend:hover {
    background: #f3f4f6;
    color: #111827;
}

body.light-mode .settings-edit-btn:disabled {
    background: #f9fafb;
    color: #9ca3af;
    border-color: #e5e7eb;
}

/* Settings toggle switch */
body.light-mode .settings-toggle input[type="checkbox"] {
    background: #e5e7eb;
}

body.light-mode .settings-toggle input[type="checkbox"]:before {
    background: #ffffff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

body.light-mode .settings-toggle input[type="checkbox"]:checked {
    background: #3b82f6;
}

body.light-mode .settings-toggle input[type="checkbox"]:checked:before {
    background: #ffffff;
}

body.light-mode .settings-toggle label {
    color: #111827;
}

body.light-mode .settings-modal-header {
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode #billingModalContent .settings-modal-header {
    border-bottom: none;
}

/* Change password modal - light mode */
body.light-mode .change-password-modal {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1);
}
body.light-mode .change-password-header {
    border-bottom: 1px solid #e5e7eb;
}
body.light-mode .change-password-header h2 {
    color: #111827;
}
body.light-mode .change-password-message {
    color: #6b7280;
}
body.light-mode .change-password-field label {
    color: #374151;
}
body.light-mode .change-password-field input {
    background: #f9fafb;
    border: 1px solid #d1d5db;
    color: #111827;
}
body.light-mode .change-password-field input:focus {
    border-color: #3b82f6;
}
body.light-mode .change-password-resend {
    color: #6b7280;
}
body.light-mode .change-password-resend a {
    color: #2563eb;
}

/* Email verification section */
body.light-mode #emailVerificationSection p {
    color: #6b7280;
}

body.light-mode #emailVerificationSection strong {
    color: #111827;
}

body.light-mode #emailVerificationCode {
    background: #ffffff;
    border: 1px solid #d1d5db !important;
    color: #111827 !important;
}

body.light-mode #emailVerificationCode::placeholder {
    color: #9ca3af;
}

body.light-mode #emailVerificationCode:focus {
    border-color: #3b82f6 !important;
}

body.light-mode #emailVerificationMessage {
    color: #6b7280;
}

/* Delete account confirmation styles */
body.light-mode .settings-danger-zone-header {
    border-bottom-color: rgba(220, 38, 38, 0.25);
    color: #b91c1c;
}
body.light-mode .settings-danger-zone-header:hover {
    color: #991b1b;
}
body.light-mode .settings-danger-zone-header .settings-danger-zone-chevron {
    stroke: #b91c1c;
}
body.light-mode .settings-delete-confirmation {
    background: rgba(239, 68, 68, 0.05);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

body.light-mode .settings-delete-confirmation h5 {
    color: #dc2626;
}

body.light-mode .settings-delete-confirmation p {
    color: #374151;
}

body.light-mode .settings-delete-confirmation p a {
    color: #6b7280;
}

body.light-mode .settings-delete-confirmation p a:hover {
    color: #374151;
}

body.light-mode .settings-delete-confirmation input {
    background: #ffffff;
    border: 1px solid rgba(239, 68, 68, 0.3);
    color: #111827;
}

body.light-mode .settings-delete-confirmation input:focus {
    border-color: #dc2626;
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.2);
}

body.light-mode .settings-delete-confirmation input::placeholder {
    color: #9ca3af;
}

body.light-mode .settings-delete-cancel-btn {
    background: transparent;
    color: #6b7280;
    border: 1px solid #d1d5db;
}

body.light-mode .settings-delete-cancel-btn:hover {
    background: #f3f4f6;
    color: #111827;
    border-color: #9ca3af;
}

body.light-mode .settings-delete-confirm-btn {
    background: #dc2626;
    color: #ffffff;
}

body.light-mode .settings-delete-confirm-btn:hover {
    background: #b91c1c;
}

body.light-mode .settings-delete-confirm-btn:disabled {
    background: #9ca3af;
    color: #ffffff;
}

/* Eye icon in widgets page */
body.light-mode .row-stat a {
    color: #374151 !important;
}

body.light-mode .row-stat a svg {
    fill: #374151 !important;
}

body.light-mode .row-stat a:hover {
    color: #3b82f6 !important;
}

body.light-mode .row-stat a:hover svg {
    fill: #3b82f6 !important;
}

/* Home Page */
body.light-mode {
    background: #ffffff;
    color: #111827;
}

body.light-mode .content-area {
    background: #ffffff;
    padding-top: 24px;
}

body.light-mode .welcome-title {
    color: #111827;
}

body.light-mode .welcome-subtitle {
    color: #6b7280;
}

body.light-mode .action-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
}

body.light-mode .action-card:hover {
    background: #f9fafb;
    border-color: #d1d5db;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

body.light-mode .action-icon {
    color: #111827;
}

body.light-mode .action-title {
    color: #111827;
}

body.light-mode .action-description {
    color: #6b7280;
}

body.light-mode .quick-links {
    border-top: 1px solid #e5e7eb;
}

body.light-mode .quick-links h3 {
    color: #9ca3af;
}

body.light-mode .link-item {
    color: #6b7280;
}

body.light-mode .link-item:hover {
    color: #111827;
}

/* Sidebar */
body.light-mode .sidebar {
    background: #ffffff;
    border-right: 1px solid #e5e7eb;
}

body.light-mode .sidebar-logo {
    border-bottom: 1px solid #f3f4f6;
}

body.light-mode .sidebar-logo h1 {
    background: linear-gradient(to right, #111827, #6b7280);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

body.light-mode .nav-item {
    color: #374151;
}

body.light-mode .nav-item:hover {
    background: #f3f4f6;
    color: #111827;
}

body.light-mode .nav-item.active {
    background: #e5e7eb;
    color: #111827;
}

body.light-mode .nav-icon {
    fill: currentColor;
}

body.light-mode .sidebar-footer {
    border-top: 1px solid #f3f4f6;
}

/* Email sidebar accordion (sublinks) in light mode */
body.light-mode .email-nav-sublink {
    color: #4b5563;
}

body.light-mode .email-nav-sublink:hover {
    background: #f3f4f6;
    color: #111827;
}

body.light-mode .email-nav-sublink.active {
    background: #e5e7eb;
    color: #111827;
}

body.light-mode .sidebar:hover .sidebar-email-wrap.email-nav-accordion.email-nav-open::before {
    background: rgba(0, 0, 0, 0.12);
}

body.light-mode .sidebar:hover .sidebar-email-wrap.email-nav-accordion.email-nav-open .email-nav-sublink.active::after {
    background: rgba(0, 0, 0, 0.22);
}

body.light-mode .logout-button {
    background: transparent;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

body.light-mode .logout-button:hover {
    background: #f3f4f6;
    color: #111827;
    border-color: #d1d5db;
}

/* Sites page — list rows use dark-theme borders in sites.html; restore separators on white */
body.light-mode .sites-page .main-content,
body.light-mode .sites-page .content-area {
    background: #ffffff;
}

body.light-mode .sites-page .sites-list .list-header {
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .sites-page .sites-list .site-row {
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .sites-page .sites-list .site-row:hover {
    background: #f9fafb;
}

body.light-mode .sites-page .sites-list .site-row.selected {
    background: rgba(59, 130, 246, 0.15);
}

/* Forms & Widgets Pages */
/* Disclosures page specific top-bar spacing */
body.light-mode .forms-page .top-bar {
    padding: 24px 40px 0px 40px;
}

/* Manage form page specific top-bar spacing */
body.light-mode .manage-form-page .top-bar {
    padding: 24px 40px;
}

body.light-mode .top-bar h2 {
    color: #0A2540;
}

/* Messages page */
body.light-mode .messages-page .messages-list-header h2 {
    color: #0A2540;
}

body.light-mode .messages-list-header {
    border-right-color: #e5e7eb;
    background: #ffffff;
}

body.light-mode .messages-list-body {
    border-right-color: #e5e7eb;
    background: #ffffff;
}

body.light-mode .messages-detail-column {
    background: #ffffff;
}

/* Thread contact strip: inline messages.html uses `.messages-detail-column …` after this file,
   so we need `body.light-mode` + detail column for higher specificity than those dark-theme rules. */
body.light-mode .messages-detail-column .thread-contact-strip {
    background: #ffffff;
    box-shadow: 0 1px 0 #e5e7eb;
}

body.light-mode .messages-detail-column .contact-card-name {
    color: #111827;
}

body.light-mode .messages-detail-column .contact-card-line {
    color: #374151;
}

body.light-mode .messages-detail-column .contact-card-line .label {
    color: #6b7280;
}

body.light-mode .messages-detail-column .contact-card-line a {
    color: #2563eb;
}

body.light-mode .messages-detail-column .thread-meta {
    color: #6b7280;
}

body.light-mode .messages-detail-column .sender-avatar-default {
    background: #e5e7eb;
    color: #6b7280;
}

body.light-mode .message-detail-placeholder {
    color: #4b5563;
}

body.light-mode .app-list-page .list-header {
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .app-list-page .header-cell {
    color: #6b7280;
}

body.light-mode .app-list-page .message-row {
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .app-list-page .message-row:hover {
    background: #f9fafb;
}

body.light-mode .app-list-page .message-row-avatar {
    background: #e5e7eb;
    color: #111827;
}

body.light-mode .app-list-page .message-row-avatar-default {
    background: #d1d5db;
    color: #6b7280;
}

body.light-mode .app-list-page .message-row-avatar.message-row-avatar-sms {
    background: #2563eb;
    color: #fff;
}

body.light-mode .app-list-page .message-row-avatar.message-row-avatar-sms.message-row-avatar-default {
    background: #2563eb;
    color: #fff;
}

body.light-mode .app-list-page .row-title {
    color: #0A2540;
}

body.light-mode .app-list-page .row-preview {
    color: #6b7280;
}

body.light-mode .app-list-page .row-stat {
    color: #6b7280;
}

body.light-mode .app-list-page .row-stat-secondary {
    color: #9ca3af;
}

body.light-mode .phone-date-stack .phone-row-time {
    color: #374151;
}

body.light-mode .phone-date-stack .phone-row-duration {
    color: #9ca3af;
}

body.light-mode .phone-dir-icon-wrap {
    color: #9ca3af;
}

body.light-mode .phone-row-title-row--missed .phone-row-title-text {
    color: #dc2626;
}

body.light-mode .phone-row-title-row--missed .phone-dir-icon-wrap {
    color: #dc2626;
}

body.light-mode .phone-dtmf-pressed {
    color: #6b7280;
}

body.light-mode .phone-row-title-row--missed .phone-dtmf-pressed {
    color: #f87171;
}

body.light-mode .messages-page .folder-tab {
    color: #6b7280;
}

body.light-mode .messages-page .folder-tab:hover {
    color: #111827;
    background: #f3f4f6;
}

body.light-mode .messages-page .folder-tab.active {
    color: #111827;
    background: #e5e7eb;
}

body.light-mode .messages-page .delete-bar-btn-mark-read {
    color: #374151;
    border-color: #d1d5db;
}

body.light-mode .messages-page .delete-bar-btn-mark-read:hover {
    background: #f3f4f6;
    color: #111827;
}

body.light-mode .messages-page .trash-auto-delete-notice {
    background: #fef3c7;
    color: #92400e;
}

body.light-mode .messages-page .empty-state-text {
    color: #111827;
}

body.light-mode .messages-page .empty-state-subtext {
    color: #6b7280;
}

body.light-mode .app-list-page .message-row-unread-dot {
    background: #2563eb;
}

body.light-mode .app-list-page .status-badge.unread {
    background: #dbeafe;
    color: #1d4ed8;
}

body.light-mode .app-list-page .status-badge.read {
    background: #f3f4f6;
    color: #6b7280;
}

body.light-mode .app-list-page .status-badge.folder-inbox {
    background: #d1fae5;
    color: #065f46;
}

body.light-mode .app-list-page .status-badge.folder-trash {
    background: #ffedd5;
    color: #c2410c;
}

body.light-mode .message-source-badge--form {
    background: #d1fae5;
    color: #065f46;
}

/* Single message view (view-message page) */
body.light-mode .back-btn {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #374151;
}

body.light-mode .back-btn:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
    color: #111827;
}

body.light-mode .top-bar-actions button:not(.add-list-btn):not(.add-campaign-btn):not(.add-new-btn):not(.add-new-trigger):not(.btn-primary):not(.add-form-btn):not(.submit-button):not(.preview-button) {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #374151;
}

body.light-mode .top-bar-actions button:not(.add-list-btn):not(.add-campaign-btn):not(.add-new-btn):not(.add-new-trigger):not(.btn-primary):not(.add-form-btn):not(.submit-button):not(.preview-button):hover {
    background: #e5e7eb;
    color: #111827;
}

body.light-mode .thread-bubble-them {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #111827;
}

body.light-mode .thread-bubble-me {
    background: #2563eb;
    border-color: #1d4ed8;
    color: #fff;
}

body.light-mode .thread-meta {
    color: #6b7280;
}

body.light-mode .sender-avatar {
    background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
    color: #fff;
}

body.light-mode .sender-avatar-default {
    background: #e5e7eb;
    color: #6b7280;
}

body.light-mode .sender-avatar-sms {
    background: #2563eb;
    color: #fff;
}

body.light-mode .sender-avatar-sms.sender-avatar-default {
    background: #2563eb;
    color: #fff;
}

body.light-mode .messages-detail-column .contact-card-meta-row .thread-meta {
    color: #64748b;
}

body.light-mode .messages-detail-column .contact-card-meta-row .message-source-badge--form {
    background: rgba(59, 130, 246, 0.12);
    color: #1d4ed8;
    border: 1px solid rgba(37, 99, 235, 0.25);
}

/* Form submission thread: SMS consent line (inline messages.html `.thread-bubble-note`) */
body.light-mode .messages-detail-column .thread-bubble.thread-bubble-note {
    background: #eff6ff;
    color: #1e3a8a;
    border: 1px dashed #93c5fd;
    border-left: 3px solid #2563eb;
}

body.light-mode .messages-detail-column .thread-bubble.thread-bubble-them.thread-bubble-muted {
    color: #9ca3af;
}

body.light-mode .contact-card-name {
    color: #111827;
}

body.light-mode .contact-card-line {
    color: #374151;
}

body.light-mode .contact-card-line .label {
    color: #6b7280;
}

body.light-mode .contact-card-line a {
    color: #2563eb;
}

body.light-mode .form-details-summary {
    color: #6b7280;
}

body.light-mode .form-details-summary::before {
    color: #6b7280;
}

body.light-mode .form-details {
    background: #f9fafb;
}

body.light-mode .form-detail-label {
    color: #6b7280;
}

body.light-mode .form-detail-value {
    color: #111827;
}

body.light-mode .form-detail-link {
    color: #2563eb;
}

body.light-mode .message-section-title {
    color: #6b7280;
}

body.light-mode .form-submission-label {
    color: #6b7280;
}

body.light-mode .form-submission-value {
    color: #111827;
}

body.light-mode .form-submission-empty {
    color: #6b7280;
}

body.light-mode .message-body {
    color: #374151;
}

body.light-mode .message-body strong {
    color: #111827;
}

body.light-mode .trash-notice {
    background: #fef3c7 !important;
    color: #92400e !important;
}

body.light-mode .reply-bar {
    background: #ffffff;
    border-top-color: #e5e7eb;
    box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.06);
}

body.light-mode .reply-composer-field {
    border-color: #e5e7eb;
    background: #f9fafb;
    color: #9ca3af;
}

body.light-mode .reply-composer-field::placeholder {
    color: #9ca3af;
}

body.light-mode .reply-send-btn {
    background: #f3f4f6;
    color: #9ca3af;
    opacity: 0.85;
}

body.light-mode .reply-icon-btn {
    color: #111827;
    background: #f3f4f6;
    border-color: #e5e7eb;
}

body.light-mode .reply-icon-btn:hover {
    background: #e5e7eb;
    border-color: #d1d5db;
}

body.light-mode .messages-column-resizer:hover,
body.light-mode .messages-column-resizer.is-dragging {
    background: rgba(0, 0, 0, 0.04);
}

/* Messages page: fixed composer matches thread column (flat, same bubble styling) */
body.light-mode #panelReplyBar.messages-page-reply-bar {
    background: #ffffff;
    border-top-color: #e5e7eb;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.light-mode #panelReplyBar .reply-composer-field {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #9ca3af;
}

body.light-mode #panelReplyBar .reply-composer-field::placeholder {
    color: #9ca3af;
}

body.light-mode #panelReplyBar .reply-composer-field.reply-composer-field--visual-test {
    color: #111827;
}

body.light-mode #panelReplyBar .reply-send-btn {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    color: #9ca3af;
    opacity: 0.9;
    border-radius: 50%;
}

body.light-mode #panelReplyBar .reply-send-btn:disabled,
body.light-mode #panelReplyBar .reply-send-btn:disabled:hover {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #9ca3af;
    opacity: 0.9;
    cursor: default;
    pointer-events: none;
}

body.light-mode #panelReplyBar .reply-send-btn.reply-send-btn--visual-test:not(:disabled) {
    background: rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.45);
    color: #1d4ed8;
    opacity: 1;
}

body.light-mode #panelReplyBar .reply-send-btn.reply-send-btn--visual-test:not(:disabled):hover {
    background: rgba(59, 130, 246, 0.3);
}

body.light-mode #panelReplyBar .reply-icon-btn {
    background: #f3f4f6;
    border-color: #e5e7eb;
    color: #374151;
    border-radius: 50%;
}

body.light-mode #panelReplyBar .reply-icon-btn:hover {
    background: #e5e7eb;
    border-color: #d1d5db;
}

body.light-mode .call-options-sheet {
    background: #ffffff;
    border-color: #e5e7eb;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12);
}

body.light-mode .call-options-number {
    color: #111827;
}

body.light-mode .call-options-list {
    border-top-color: #e5e7eb;
}

body.light-mode .call-option-row {
    border-bottom-color: #e5e7eb;
}

body.light-mode .call-option-row:hover {
    background: rgba(0, 0, 0, 0.03);
}

body.light-mode .call-option-row-title {
    color: #111827;
}

body.light-mode .call-option-row-meta {
    color: #6b7280;
}

body.light-mode .call-option-empty {
    color: #6b7280;
}

body.light-mode .call-options-cancel {
    color: #374151;
    border-color: #d1d5db;
}

body.light-mode .call-options-cancel:hover {
    background: #f3f4f6;
}

body.light-mode .call-options-backdrop {
    background: rgba(0, 0, 0, 0.4);
}

/* Disclaimers page title alignment with checkboxes */
body.light-mode .widgets-page .top-bar h2 {
    margin-left: -6px; /* Adjust to align with checkbox column */
}

/* Disclosures page title alignment with checkboxes */
body.light-mode .forms-page .top-bar h2 {
    margin-left: -6px; /* Adjust to align with checkbox column */
}

/* Manage form page title alignment with checkboxes */
body.light-mode .manage-form-page .top-bar h2 {
    margin-left: -6px; /* Adjust to align with checkbox column */
}

/* Manage widget page title alignment with checkboxes */
body.light-mode .manage-widget-page .top-bar h2 {
    margin-left: -6px; /* Adjust to align with checkbox column */
}

/* Create form page title alignment with checkboxes */
body.light-mode .create-form-page .top-bar h2 {
    margin-left: -6px; /* Adjust to align with checkbox column */
    margin-top: -6px; /* Move title up by 2px */
}

/* Create widget page title alignment with checkboxes */
body.light-mode .create-widget-page .top-bar h2 {
    margin-left: -6px; /* Adjust to align with checkbox column */
    margin-top: -6px; /* Move title up by 2px */
}

body.light-mode .delete-selected-btn {
    background: #ef4444;
    color: #ffffff;
}

body.light-mode .delete-selected-btn:hover {
    background: #dc2626;
}

body.light-mode .card-checkbox {
    border: 2px solid #d1d5db;
    background: #ffffff;
}

body.light-mode .card-checkbox.checked {
    background: #3b82f6;
    border-color: #3b82f6;
}

body.light-mode .form-row,
body.light-mode .embed-row,
body.light-mode .embed-row,
body.light-mode .submission-item {
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .form-row:hover,
body.light-mode .embed-row:hover,
body.light-mode .embed-row:hover,
body.light-mode .submission-item:hover {
    background: #f9fafb;
}

body.light-mode .form-row.selected,
body.light-mode .embed-row.selected,
body.light-mode .embed-row.selected,
body.light-mode .submission-item.selected {
    background: rgba(59, 130, 246, 0.15);
    border-color: #3b82f6;
}

body.light-mode .list-header,
body.light-mode .embeds-list-header-row {
    border-bottom: 1px solid #e5e7eb;
    background: #ffffff;
}

body.light-mode .header-cell,
body.light-mode .embeds-header-cell {
    color: #6b7280;
}

body.light-mode .header-cell,
body.light-mode .header-cell span,
body.light-mode .embeds-header-cell,
body.light-mode .embeds-header-cell span {
    color: #6b7280 !important;
}

body.light-mode .header-cell.sortable:hover,
body.light-mode .embeds-header-cell.sortable:hover {
    color: #111827;
}

body.light-mode .header-cell.sortable.active,
body.light-mode .embeds-header-cell.sortable.active {
    color: #111827;
}

body.light-mode .header-checkbox,
body.light-mode .row-checkbox {
    border: 2px solid #d1d5db;
    background: transparent;
}

body.light-mode .header-checkbox:hover,
body.light-mode .row-checkbox:hover {
    border-color: #9ca3af;
}

body.light-mode .header-checkbox.checked,
body.light-mode .row-checkbox.checked {
    background: #3b82f6;
    border-color: #3b82f6;
}

body.light-mode .row-thumbnail {
    border: 1px solid #e5e7eb;
    background: #f3f4f6;
}

body.light-mode .row-title,
body.light-mode .embed-disclosure-title {
    color: #0A2540;
}

/* Submissions page specific styles */
body.light-mode .submission-id {
    color: #6b7280;
}

body.light-mode .submission-info {
    color: #111827;
}

body.light-mode .submission-date {
    color: #111827;
}

body.light-mode .submission-ip {
    color: #111827;
}

body.light-mode .submission-item.expanded .submission-answers-container {
    border-top: 1px solid #e5e7eb;
}

body.light-mode .answer-question {
    color: #111827;
}

body.light-mode .answer-value {
    color: #4b5563;
}

body.light-mode .answer-item {
    border-bottom: 1px solid #e5e7eb;
}

body.light-mode .row-description {
    color: #6b7280;
}

body.light-mode .row-stat,
body.light-mode .embed-style,
body.light-mode .embed-date,
body.light-mode .embed-consent-count,
body.light-mode .embed-deliveries-count {
    color: #111827;
}

body.light-mode .row-label {
    color: #9ca3af;
}

body.light-mode .status-badge {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

body.light-mode .status-badge.published {
    background: #d1fae5;
    color: #065f46;
    border-color: #6ee7b7;
}

body.light-mode .status-badge.draft {
    background: #fef3c7;
    color: #92400e;
    border-color: #fcd34d;
}

body.light-mode .status-badge.sent {
    background: #d1fae5;
    color: #065f46;
    border-color: #6ee7b7;
}

body.light-mode .row-actions {
    gap: 8px;
}

body.light-mode .action-button,
body.light-mode .embed-action-btn {
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

body.light-mode .action-button:hover,
body.light-mode .embed-action-btn:hover {
    background: #e5e7eb;
    color: #111827;
    border-color: #d1d5db;
}

body.light-mode .row-menu-btn,
body.light-mode .embed-menu-btn {
    background: transparent;
    color: #6b7280;
}

body.light-mode .row-menu-btn:hover,
body.light-mode .embed-menu-btn:hover {
    background: #f3f4f6;
    color: #111827;
}

body.light-mode .dropdown-menu,
body.light-mode .row-dropdown,
body.light-mode .embed-dropdown {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
}

body.light-mode .dropdown-item,
body.light-mode .row-dropdown-item,
body.light-mode .embed-dropdown-item {
    color: #111827;
}

body.light-mode .dropdown-item:hover,
body.light-mode .row-dropdown-item:hover,
body.light-mode .embed-dropdown-item:hover {
    background: #f3f4f6;
}

body.light-mode .dropdown-item.danger,
body.light-mode .row-dropdown-item.delete,
body.light-mode .embed-dropdown-item.delete {
    color: #ef4444;
}

body.light-mode .dropdown-item.danger:hover,
body.light-mode .row-dropdown-item.delete:hover,
body.light-mode .embed-dropdown-item.delete:hover {
    background: #fef2f2;
}

body.light-mode .pagination,
body.light-mode .pagination-container {
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

body.light-mode .pagination-info {
    color: #6b7280;
}

body.light-mode .pagination-button,
body.light-mode .pagination-btn {
    background: #ffffff;
    color: #6b7280;
    border: 1px solid #e5e7eb;
}

body.light-mode .pagination-button:hover:not(:disabled),
body.light-mode .pagination-btn:hover:not(:disabled) {
    background: #f3f4f6;
    color: #111827;
    border-color: #d1d5db;
}

body.light-mode .pagination-button:disabled,
body.light-mode .pagination-btn:disabled {
    color: #d1d5db;
    border-color: #f3f4f6;
}

body.light-mode .empty-state,
body.light-mode .empty-embeds {
    color: #6b7280;
}

body.light-mode .empty-state h3,
body.light-mode .empty-embeds-text,
body.light-mode .empty-state-text {
    color: #111827;
}

body.light-mode .empty-state p,
body.light-mode .empty-embeds-subtext,
body.light-mode .empty-state-subtext {
    color: #6b7280;
}

body.light-mode .create-button,
body.light-mode .empty-embeds-button,
body.light-mode .empty-state-button {
    background: #111827;
    color: #ffffff;
    border-color: #111827;
}

body.light-mode .create-button:hover,
body.light-mode .empty-embeds-button:hover,
body.light-mode .empty-state-button:hover {
    background: #1f2937;
    border-color: #1f2937;
}

body.light-mode .submissions-link,
body.light-mode .clickable-submission,
body.light-mode .clickable-disclosure-link {
    color: inherit;
}

body.light-mode .form-row:hover .submissions-link,
body.light-mode .embed-row:hover .submissions-link,
body.light-mode .embed-row:hover .clickable-submission,
body.light-mode .embed-row:hover .clickable-disclosure-link {
    color: #3b82f6;
}

/* Linked disclosure icon (eye icon) */
body.light-mode .row-stat a[href*="clearproof.ai"] {
    color: #6b7280 !important;
}

body.light-mode .row-stat a[href*="clearproof.ai"]:hover {
    color: #3b82f6 !important;
}

body.light-mode .row-stat a[href*="clearproof.ai"] svg {
    fill: currentColor;
}

/* No linked disclosure dash */
body.light-mode .row-stat span[style*="rgba(255,255,255,0.3)"] {
    color: #d1d5db !important;
}

/* ======================================
   ANALYTICS SECTION - LIGHT MODE
   ====================================== */

/* Submissions Section */
body.light-mode .submissions-section {
    background: transparent !important;
}

body.light-mode .submissions-header {
    background: #f3f4f6 !important;
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
}

body.light-mode .submissions-header h2 {
    color: #111827 !important;
}

body.light-mode .submissions-container {
    background: transparent;
}

body.light-mode .submission-header {
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    color: #6b7280 !important;
}

body.light-mode .submission-answers h4 {
    color: #111827 !important;
}

body.light-mode .submission-answer {
    background: #f9fafb !important;
    color: #4b5563 !important;
}

body.light-mode .submission-answer strong {
    color: #111827 !important;
}

/* Analytics Cards - Inline Styles Override */
body.light-mode div[style*="background:#3a3a3a"] {
    background: #f3f4f6 !important;
}

body.light-mode div[style*="border:1px solid #555555"],
body.light-mode div[style*="border: 1px solid #555555"] {
    border: none !important;
}

body.light-mode div[style*="color:#fff"] {
    color: #111827 !important;
}

body.light-mode div[style*="color:#9ca3af"] {
    color: #6b7280 !important;
}

body.light-mode div[style*="color:#6b7280"] {
    color: #9ca3af !important;
}

body.light-mode div[style*="color:#e5e7eb"] {
    color: #4b5563 !important;
}

/* Chart Background */
body.light-mode div[style*="background:#2a2a2a"] {
    background: #e5e7eb !important;
}

body.light-mode div[style*="background:#1a1a1a"] {
    background: #f3f4f6 !important;
}

body.light-mode div[style*="background:#0f0f0f"] {
    background: #f9fafb !important;
}

body.light-mode div[style*="border:1px solid #333"],
body.light-mode div[style*="border: 1px solid #333"] {
    border: none !important;
}

body.light-mode div[style*="border:1px solid #2a2a2a"],
body.light-mode div[style*="border: 1px solid #2a2a2a"] {
    border: none !important;
}

/* Survey Bar Charts - Change from white to blue */
body.light-mode .bar-fill {
    background: linear-gradient(90deg, #3b82f6, #60a5fa) !important;
}

body.light-mode div[style*="background:linear-gradient(90deg, #ffffff"] {
    background: linear-gradient(90deg, #3b82f6, #60a5fa) !important;
}

/* Consent History Section */
body.light-mode div[style*="background:#2a2a2a"][style*="border-bottom:1px solid #555555"] {
    background: #f3f4f6 !important;
    border-bottom: none !important;
}

body.light-mode div[style*="background:#2a2a2a"][style*="border-bottom"] h3 {
    color: #111827 !important;
}

body.light-mode div[style*="background:#2a2a2a"][style*="border-bottom"] h3[style*="color:#fff"] {
    color: #111827 !important;
}

body.light-mode div[style*="background:#2a2a2a"] label {
    color: #6b7280 !important;
}

body.light-mode select[style*="background:#3a3a3a"] {
    background: #ffffff !important;
    color: #111827 !important;
    border: 1px solid #d1d5db !important;
}

body.light-mode select[style*="background:#3a3a3a"] option {
    background: #ffffff !important;
    color: #111827 !important;
}

/* Date Range Dropdown */
body.light-mode .dropdown-trigger {
    background: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
    color: #111827 !important;
    box-shadow: none !important;
}

body.light-mode .dropdown-trigger:hover {
    background: #e5e7eb !important;
}

body.light-mode .dropdown-trigger svg path {
    stroke: #111827 !important;
}

body.light-mode .dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

body.light-mode .dropdown-item {
    color: #111827 !important;
    border-bottom: 1px solid #e5e7eb !important;
}

body.light-mode .dropdown-item:hover {
    background: #f3f4f6 !important;
}

body.light-mode .dropdown-item:last-child {
    border-bottom: none !important;
}

/* Custom Date Range Inputs */
body.light-mode input[type="date"][style*="background:#3a3a3a"] {
    background: #ffffff !important;
    border: 1px solid #d1d5db !important;
    color: #111827 !important;
    box-shadow: none !important;
}

body.light-mode input[type="date"][style*="background:#3a3a3a"]:focus {
    border-color: #3b82f6 !important;
    outline: none !important;
}

body.light-mode span[style*="color:#b0b0b0"] {
    color: #6b7280 !important;
}

body.light-mode button[style*="background:#4a4a4a"][onclick*="applyCustomDateRange"] {
    background: #3b82f6 !important;
    border: 1px solid #3b82f6 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

body.light-mode button[style*="background:#4a4a4a"][onclick*="applyCustomDateRange"]:hover {
    background: #2563eb !important;
    border-color: #2563eb !important;
}

/* SVG Elements in Charts */
body.light-mode svg line[stroke="#4b5563"],
body.light-mode svg line[stroke="#374151"] {
    stroke: rgba(0,0,0,0.15) !important;
}

body.light-mode svg text[fill="#9ca3af"] {
    fill: #6b7280 !important;
}

body.light-mode svg polyline[stroke="#10b981"] {
    stroke: #10b981 !important;
}

body.light-mode svg circle[fill="#10b981"] {
    fill: #10b981 !important;
}

/* Tooltip */
body.light-mode .tooltip {
    background: #111827 !important;
    color: #ffffff !important;
}

/* Empty State */
body.light-mode .empty-state {
    color: #6b7280 !important;
}

body.light-mode .empty-state p {
    color: #6b7280 !important;
}

/* Consent List Items */
body.light-mode .consent-item {
    background: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
}

body.light-mode .consent-item:hover {
    background: #f9fafb !important;
}

body.light-mode .consent-item.selected {
    background: rgba(59, 130, 246, 0.15) !important;
    border-color: #3b82f6;
}

body.light-mode .consent-item.expanded .consent-details-container {
    border-top: 1px solid #e5e7eb !important;
}

body.light-mode .consent-header {
    color: #6b7280 !important;
}

body.light-mode .consent-date {
    color: #111827 !important;
}

body.light-mode .consent-id {
    color: #6b7280 !important;
}

body.light-mode .consent-info {
    color: #111827 !important;
}

body.light-mode .consent-info span {
    color: #111827 !important;
}

body.light-mode .consent-ip {
    color: #111827 !important;
}

body.light-mode .consent-meta {
    color: #6b7280 !important;
}

body.light-mode .consent-meta-item {
    color: #6b7280 !important;
}

body.light-mode .consent-meta-item span {
    color: #6b7280 !important;
}

body.light-mode .consent-details {
    background: transparent !important;
}

body.light-mode .detail-item {
    border-bottom: 1px solid #e5e7eb !important;
}

body.light-mode .detail-label {
    color: #111827 !important;
}

body.light-mode .detail-value {
    color: #4b5563 !important;
}

body.light-mode .consents-list {
    background: transparent !important;
}

body.light-mode .consents-list .list-header {
    border-bottom: 1px solid #e5e7eb !important;
    background: #ffffff !important;
}

/* Pagination in Analytics */
body.light-mode .pagination-container {
    background: transparent;
}

body.light-mode .pagination-btn {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    color: #111827;
}

body.light-mode .pagination-btn:hover:not(:disabled) {
    background: #e5e7eb;
}

body.light-mode .pagination-btn:disabled {
    background: rgba(0,0,0,0.05);
    color: #d1d5db;
}

body.light-mode .pagination-btn.active {
    background: #3b82f6;
    color: #ffffff;
    border-color: #3b82f6;
}

body.light-mode .pagination-info {
    color: #4b5563;
}

/* Medium badges */
body.light-mode .medium-badge {
    background: transparent;
    border: 1px solid #d1d5db;
    color: #6b7280;
}

body.light-mode .medium-badge.more-indicator {
    background: transparent;
    border: 1px solid #d1d5db;
    color: #6b7280;
}

body.light-mode .medium-tooltip {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    color: #111827;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Loading state */
body.light-mode .loading-state {
    color: #6b7280;
}

/* Row metadata and stats */
body.light-mode .row-meta {
    color: #6b7280;
}

body.light-mode .row-stat-count {
    color: #111827;
}

/* Embed ID */
body.light-mode .embed-id {
    color: #9ca3af;
}

/* Toolbar Styles */
body.light-mode .toolbar {
    background: #ffffff;
    border-right: 1px solid #e5e7eb;
}

body.light-mode .toolbar-section h3 {
    color: #6b7280;
}


body.light-mode .header-inputs label,
body.light-mode .form-group label {
    color: #6b7280;
}

body.light-mode .header-inputs input,
body.light-mode .form-input {
    background: #f9fafb;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .header-inputs input:focus,
body.light-mode .form-input:focus {
    border-color: #3b82f6;
    background: #ffffff;
}

body.light-mode .header-inputs input::placeholder,
body.light-mode .form-input::placeholder {
    color: #9ca3af;
}

body.light-mode .submit-align-selector {
    border-color: #e5e7eb;
    background: #f9fafb;
}
body.light-mode .submit-align-selector .submit-align-btn {
    color: #6b7280;
    border-right-color: #e5e7eb;
}
body.light-mode .submit-align-selector .submit-align-btn:hover {
    color: #111827;
    background: #f3f4f6;
}
body.light-mode .submit-align-selector .submit-align-btn.active {
    color: #111827;
    background: #e5e7eb;
}

body.light-mode .header-align-selector {
    border-color: #e5e7eb;
    background: #f9fafb;
}
body.light-mode .header-align-selector .header-align-btn {
    color: #6b7280;
    border-right-color: #e5e7eb;
}
body.light-mode .header-align-selector .header-align-btn:hover {
    color: #111827;
    background: #f3f4f6;
}
body.light-mode .header-align-selector .header-align-btn.active {
    color: #111827;
    background: #e5e7eb;
}

body.light-mode .notifications-selector {
    border-color: #e5e7eb;
    background: #f9fafb;
}
body.light-mode .notifications-selector .notifications-btn {
    color: #6b7280;
    border-right-color: #e5e7eb;
}
body.light-mode .notifications-selector .notifications-btn:hover {
    color: #111827;
    background: #f3f4f6;
}
body.light-mode .notifications-selector .notifications-btn.active {
    color: #111827;
    background: #e5e7eb;
}

body.light-mode .form-notification-chip {
    background: #f3f4f6 !important;
    border-color: #e5e7eb !important;
    color: #374151 !important;
}

body.light-mode .form-notification-chip-remove {
    color: #6b7280 !important;
}

body.light-mode .form-notification-chip-remove:hover {
    color: #111827 !important;
}

/* Custom Select Dropdown */
body.light-mode .custom-select select {
    background: #f9fafb;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .custom-select select:hover {
    border-color: #9ca3af;
    background: #f3f4f6;
}

body.light-mode .custom-select select:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

body.light-mode .custom-select::after {
    border-top-color: #6b7280;
}

body.light-mode .custom-select select option {
    background: #ffffff;
    color: #111827;
}

/* Disclosure Search */
body.light-mode .disclosure-search-input {
    background: #f9fafb;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .disclosure-search-input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}

body.light-mode .disclosure-search-input::placeholder {
    color: #9ca3af;
}

body.light-mode .disclosure-search-results {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Email campaign analytics – light mode */

body.light-mode #emailAnalyticsPanel {
    background: #f9fafb;
    color: #111827;
}

body.light-mode .analytics-heading {
    color: #111827;
}

body.light-mode .analytics-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
}

body.light-mode .analytics-card-label {
    color: #6b7280;
}

body.light-mode .analytics-card-value {
    color: #111827;
}

body.light-mode .analytics-section-title {
    color: #111827;
}

body.light-mode .analytics-pruned-notice {
    background: #fffbeb;
    border-color: #fbbf24;
    color: #92400e;
}

body.light-mode .analytics-table {
    background: #ffffff;
    border-color: #e5e7eb;
}

body.light-mode .analytics-table th {
    background: #f3f4f6;
    color: #6b7280;
}

body.light-mode .analytics-table td {
    color: #111827;
    border-top-color: #e5e7eb;
}

body.light-mode .analytics-table tr:hover td {
    background: #f9fafb;
}

/* Muted helper rows like “No clicks yet” / “No recipient list” */
body.light-mode .analytics-table td[style*="rgba(255,255,255,0.5)"] {
    color: #9ca3af !important;
}

/* Links list inside Recipients */
body.light-mode .analytics-recipient-link span {
    color: #6b7280;
}


body.light-mode .disclosure-search-result {
    border-bottom: 1px solid #f3f4f6;
}

body.light-mode .disclosure-search-result:hover {
    background: #f9fafb;
}

body.light-mode .disclosure-search-result-icon {
    stroke: #6b7280;
}

body.light-mode .disclosure-search-result-title {
    color: #111827;
}

body.light-mode .disclosure-search-result-meta {
    color: #9ca3af;
}

body.light-mode .disclosure-search-loading,
body.light-mode .disclosure-search-no-results {
    color: #6b7280;
}

body.light-mode .selected-disclosure {
    background: #e5e7eb;
    border: 1px solid #d1d5db;
    color: #111827;
}

body.light-mode .selected-disclosure-text {
    color: #111827;
}

body.light-mode .clear-disclosure-btn {
    background: #f3f4f6;
    color: #6b7280;
}

body.light-mode .clear-disclosure-btn:hover {
    background: #e5e7eb;
    color: #111827;
}

/* Notification Clear All Button */
body.light-mode .notification-clear-btn {
    background: transparent !important;
    border: 1px solid #d1d5db !important;
    color: #6b7280 !important;
}

body.light-mode .notification-clear-btn:hover {
    background: transparent !important;
    color: #111827 !important;
    border-color: #9ca3af !important;
}

body.light-mode .notification-clear-btn:disabled {
    background: transparent !important;
    color: #d1d5db !important;
    border-color: #e5e7eb !important;
    opacity: 0.5 !important;
}

/* Draggable Modules */
body.light-mode .draggable-module {
    background: #f3f4f6;
    border: 2px dashed #d1d5db;
}

body.light-mode .draggable-module:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
}

body.light-mode .draggable-module:active {
    background: #d1d5db;
}

body.light-mode .draggable-module.disabled,
body.light-mode .draggable-module.already-added {
    background: #f3f4f6;
    border-color: #e5e7eb;
    opacity: 0.5;
}

body.light-mode .module-icon {
    stroke: #111827;
    fill: #111827;
}

body.light-mode .module-text h4 {
    color: #111827;
}

body.light-mode .module-text p {
    color: #4b5563;
}

body.light-mode .module-content h4 {
    color: #111827;
}

body.light-mode .module-content p {
    color: #4b5563;
}

body.light-mode .module-badge {
    background: #3b82f6;
    color: #ffffff;
}

/* Toolbar Loading State */
body.light-mode .toolbar-loading {
    color: #6b7280;
}

body.light-mode .loading-spinner {
    border: 2px solid #e5e7eb;
    border-top: 2px solid #3b82f6;
}

body.light-mode .loading-text {
    color: #6b7280;
}

/* Preview Area - NO CHANGES IN LIGHT MODE */
/* All preview elements maintain their original styling */

/* Submit Button (disabled / focus — primary colors set in Primary CTA block above) */
body.light-mode .submit-button:disabled:not(.pl-dash-editor-save-btn) {
    background: #9ca3af !important;
    color: #e5e7eb !important;
    border-color: #9ca3af !important;
}

body.light-mode .submit-button:focus:not(.pl-dash-editor-save-btn),
body.light-mode .submit-button:active:not(.pl-dash-editor-save-btn) {
    outline: none !important;
    border-color: #111827 !important;
    box-shadow: none !important;
}

/* Keyboard Hint */
body.light-mode .keyboard-hint {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

body.light-mode .keyboard-hint-text {
    color: #111827;
}

/* Message Display */
body.light-mode #message {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    color: #111827;
}

/* Toast Notifications - Ensure error messages stay red in light mode */
body.light-mode .error-message {
    background: rgba(239,68,68,0.95) !important;
    border: 1px solid rgba(239,68,68,0.3) !important;
    color: #ffffff !important;
}

body.light-mode .success-message {
    background: rgba(34,197,94,0.95) !important;
    border: 1px solid rgba(34,197,94,0.3) !important;
    color: #ffffff !important;
}

/* Media Items / Blocks / Preview Content - NO CHANGES IN LIGHT MODE */
/* All preview content elements maintain their original styling */

/* Delete Bar - Light Mode */
body.light-mode .delete-bar {
    background: #000000;
    border: 1px solid #000000;
}

body.light-mode .delete-bar-text {
    color: #ffffff;
}

body.light-mode .delete-bar-count {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

body.light-mode .delete-bar-btn {
    background: #ffffff;
    color: #000000;
}

body.light-mode .delete-bar-btn:hover {
    background: #f3f4f6;
    color: #000000;
}

body.light-mode .delete-bar-close {
    color: #ffffff;
}

body.light-mode .delete-bar-close:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}

/* Confirmation Modal - Light Mode */
body.light-mode .confirmation-modal-overlay {
    background: rgba(0, 0, 0, 0.3);
}

body.light-mode .confirmation-modal-content {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

body.light-mode .confirmation-modal-content h3 {
    color: #111827 !important;
}

body.light-mode .confirmation-modal-content p {
    color: #6b7280 !important;
}

body.light-mode .confirmation-modal-checkbox {
    background: #f9fafb !important;
    border-color: #e5e7eb !important;
}

body.light-mode .confirmation-modal-checkbox::before {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.02) 0%, transparent 100%) !important;
}

body.light-mode .confirmation-modal-checkbox:hover {
    background: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

body.light-mode .confirmation-modal-checkbox label {
    color: #374151 !important;
}

body.light-mode .confirmation-modal-checkbox:hover label {
    color: #111827 !important;
}

body.light-mode .confirmation-modal-checkbox input[type="checkbox"] {
    border-color: #9ca3af !important;
}

body.light-mode .confirmation-modal-checkbox input[type="checkbox"]:hover {
    border-color: #6b7280 !important;
    background: #ffffff !important;
}

body.light-mode .confirmation-modal-checkbox input[type="checkbox"]:checked {
    background: #111827 !important;
    border-color: #111827 !important;
}

body.light-mode .confirmation-modal-checkbox input[type="checkbox"]:checked::after {
    border-color: #ffffff !important;
}

body.light-mode .confirmation-modal-btn-cancel {
    background: #ffffff !important;
    color: #111827 !important;
    border: 1px solid #d1d5db !important;
}

body.light-mode .confirmation-modal-btn-cancel:hover {
    background: #f9fafb !important;
    border-color: #9ca3af !important;
}

body.light-mode .confirmation-modal-btn-confirm {
    background: #ef4444 !important;
    color: #ffffff !important;
}

body.light-mode .confirmation-modal-btn-confirm:hover {
    background: #dc2626 !important;
}

body.light-mode .confirmation-modal-btn-confirm.confirmation-modal-btn-confirm-primary {
    background: #3b82f6 !important;
    color: #ffffff !important;
}

body.light-mode .confirmation-modal-btn-confirm.confirmation-modal-btn-confirm-primary:hover {
    background: #2563eb !important;
}

body.light-mode .confirmation-modal-field label {
    color: #4b5563 !important;
}

body.light-mode .confirmation-modal-field input[type='text'] {
    background: #ffffff !important;
    border: 1px solid #d1d5db !important;
    color: #111827 !important;
}

body.light-mode .confirmation-modal-field input[type='text']:focus {
    outline: 2px solid rgba(59, 130, 246, 0.45) !important;
    border-color: #3b82f6 !important;
}

/* Per Page Dropdown - Light Mode */
body.light-mode .per-page-label {
    color: #6b7280 !important;
}

body.light-mode .per-page-dropdown-trigger {
    background: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
    color: #111827 !important;
    box-shadow: none !important;
}

body.light-mode .per-page-dropdown-trigger:hover {
    background: #e5e7eb !important;
    border-color: #9ca3af !important;
}

body.light-mode .per-page-dropdown-trigger svg path {
    stroke: #111827 !important;
}

body.light-mode .per-page-dropdown-menu {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}

body.light-mode .per-page-dropdown-item {
    color: #111827 !important;
    border-bottom: 1px solid #e5e7eb !important;
}

body.light-mode .per-page-dropdown-item:hover {
    background: #f3f4f6 !important;
}

/* Coming Soon / Empty State - Light Mode */
body.light-mode .coming-soon-title {
    color: #111827 !important;
}

body.light-mode .coming-soon-message {
    color: #6b7280 !important;
}

body.light-mode .phone-page .empty-state-icon svg {
    color: #9ca3af;
}

/* AI badge + panels (Messages, Email campaigns, Phone) */
body.light-mode .messages-ai-badge-btn,
body.light-mode .campaigns-ai-badge-btn,
body.light-mode .phone-ai-badge-btn {
    border: 1px solid rgba(124, 58, 237, 0.35);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.14), rgba(59, 130, 246, 0.1));
    color: #4c1d95;
    box-shadow: none;
}

body.light-mode .messages-ai-badge-btn:hover,
body.light-mode .campaigns-ai-badge-btn:hover,
body.light-mode .phone-ai-badge-btn:hover {
    border-color: rgba(124, 58, 237, 0.55);
    box-shadow: 0 0 0 1px rgba(139, 92, 246, 0.15);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(59, 130, 246, 0.12));
}

body.light-mode .messages-ai-badge-btn[aria-expanded="true"],
body.light-mode .campaigns-ai-badge-btn[aria-expanded="true"],
body.light-mode .phone-ai-badge-btn[aria-expanded="true"] {
    border-color: rgba(124, 58, 237, 0.6);
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.26), rgba(59, 130, 246, 0.16));
    color: #4c1d95;
}

body.light-mode .messages-ai-icon,
body.light-mode .campaigns-ai-icon,
body.light-mode .phone-ai-icon {
    color: #7c3aed;
}

body.light-mode .messages-ai-badge-chevron,
body.light-mode .campaigns-ai-badge-chevron,
body.light-mode .phone-ai-badge-chevron {
    opacity: 0.85;
    color: inherit;
}

body.light-mode .messages-ai-dropdown,
body.light-mode .campaigns-ai-dropdown,
body.light-mode .phone-ai-dropdown {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12);
}

body.light-mode .messages-ai-menu-item,
body.light-mode .campaigns-ai-menu-item,
body.light-mode .phone-ai-menu-item {
    color: #111827;
}

body.light-mode .messages-ai-menu-item:hover,
body.light-mode .campaigns-ai-menu-item:hover,
body.light-mode .phone-ai-menu-item:hover {
    background: #f3f4f6;
}

body.light-mode .messages-ai-summary-panel,
body.light-mode .campaigns-ai-summary-panel,
body.light-mode .phone-ai-summary-panel {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.12);
}

body.light-mode .messages-ai-summary-head,
body.light-mode .campaigns-ai-summary-head,
body.light-mode .phone-ai-summary-head {
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
}

body.light-mode .messages-ai-summary-title,
body.light-mode .campaigns-ai-summary-title,
body.light-mode .phone-ai-summary-title {
    color: #111827;
}

body.light-mode .messages-ai-summary-title .messages-ai-icon,
body.light-mode .campaigns-ai-summary-title .campaigns-ai-icon,
body.light-mode .phone-ai-summary-title .phone-ai-icon {
    color: #7c3aed;
}

body.light-mode .messages-ai-summary-close,
body.light-mode .campaigns-ai-summary-close,
body.light-mode .phone-ai-summary-close {
    background: #f3f4f6;
    color: #6b7280;
}

body.light-mode .messages-ai-summary-close:hover,
body.light-mode .campaigns-ai-summary-close:hover,
body.light-mode .phone-ai-summary-close:hover {
    background: #e5e7eb;
    color: #111827;
}

body.light-mode .messages-ai-summary-body,
body.light-mode .campaigns-ai-summary-body,
body.light-mode .phone-ai-summary-body {
    color: #374151;
}

body.light-mode .messages-ai-summary-meta,
body.light-mode .campaigns-ai-summary-meta {
    color: #9ca3af;
}

body.light-mode .messages-ai-summary-loading,
body.light-mode .campaigns-ai-summary-loading,
body.light-mode .phone-ai-summary-loading {
    color: #6b7280;
}

body.light-mode .messages-ai-summary-loading-text,
body.light-mode .campaigns-ai-summary-loading-text,
body.light-mode .phone-ai-summary-loading-text {
    color: #6b7280;
}

body.light-mode .messages-ai-summary-loading-dot,
body.light-mode .campaigns-ai-summary-loading-dot,
body.light-mode .phone-ai-summary-loading-dot {
    background: rgba(17, 24, 39, 0.55);
}