/* assets/styles/theme.css */
  :root {
  /* ... existing variables ... */
    /* Background Colors */
    --color-bg-primary: #F3F4F6; /* Tailwind gray-100 - Main body background */
    --color-bg-secondary: #FFFFFF; /* Tailwind white - Cards, sidebar, header sections */
    --color-bg-accent-primary: #785EFF; /* Custom purple - Accent backgrounds like plan card */
    --color-bg-accent-secondary: #F0EEFF; /* Custom light purple - Active sidebar item bg */
    --color-bg-interactive-disabled: #E5E7EB; /* Tailwind gray-200 - e.g., Toggle off state, progress track */
    --color-bg-hover-neutral: #F3F4F6; /* Tailwind gray-100 - e.g. sidebar link hover */
    --color-avatar-default-bg: #EEF1FF; /* Original light-blue-2 */
    --color-bg-interactive-disabled-hover: #D1D5DB; /* gray-300 */
    --color-bg-surface-neutral-subtle: var(--color-bg-hover-neutral); /* New for toggle containers - LIGHT MODE */

    /* Text Colors */
    --color-text-primary: #1F2937;    /* Tailwind gray-800 - Primary text, headings */
    --color-text-secondary: #6B7280;  /* Tailwind gray-500 - Secondary text, subtitles */
    --color-text-tertiary: #4B5563;   /* Tailwind gray-600 - Less prominent text, e.g. inactive sidebar links */
    --color-text-accent: #785EFF;      /* Custom purple - Links, accent text */
    --color-text-on-accent: #FFFFFF;  /* Tailwind white - Text on dark/accented backgrounds */
    --color-text-placeholder: #9CA3AF; /* Tailwind gray-400 - Placeholder text */
    --color-text-disabled: #9CA3AF;   /* Tailwind gray-400 - Disabled text */
    --color-text-heading: #12064D; /* Very dark purple for H1 titles */
    --color-text-error: #DC2626; /* red-600 */

    /* Border Colors */
    --color-border-primary: #D1D5DB; /* Tailwind gray-300 - Main borders for cards, sections */
    --color-border-secondary: #D1D5DB;/* Tailwind gray-300 - Secondary, slightly stronger borders */
    --color-border-interactive: #D1D5DB; /* Tailwind gray-300 - Borders for interactive elements like buttons */
    --color-border-focus: #785EFF;   /* Custom purple - Focus ring color (used with ring utilities) */
    --color-border-accent-soft: #D9D1FF; /* Custom light purple border for badges etc. */

    /* Interactive Element Colors (Hovers, Focus - can also be utility classes) */
    --color-interactive-accent-hover: #6A4EE8; /* Darker purple for hover on accent elements */

    /* Additional Background Colors */
    --color-bg-tertiary: #F9FAFB; /* gray-50 - lighter than secondary for subtle elements */

    /* Additional Border Colors */
    --color-border-tertiary: #F3F4F6; /* gray-100 - very subtle border */

    /* Theme-Specific Shadow & Effect Variables (Colored/Custom Only) */
    --shadow-focus-blue: 0 0 0 3px rgba(59, 130, 246, 0.1);
    --shadow-focus-blue-strong: 0 0 0 3px rgba(59, 130, 246, 0.15);
    --shadow-accent-purple: 0 4px 12px rgba(120, 94, 255, 0.15), 0 2px 4px rgba(120, 94, 255, 0.1);
    --shadow-success-green: 0 2px 8px rgba(34, 197, 94, 0.2);
    --shadow-danger-red: 0 2px 8px rgba(239, 68, 68, 0.2);
    --shadow-danger-strong: 0 4px 12px rgba(185, 28, 28, 0.3);
    --shadow-tag: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.02);
    --shadow-tag-remove: 0 2px 6px rgba(0, 0, 0, 0.25);
    --shadow-notification: 0 4px 12px rgba(0, 0, 0, 0.15);
    --glow-accent-light: drop-shadow(0 0 2px rgba(59, 130, 246, 0.3));
    --glow-accent-strong: drop-shadow(0 0 6px rgba(59, 130, 246, 0.5));
    --overlay-white-20: rgba(255, 255, 255, 0.2);

    /* Scrollbar */
    --color-scrollbar-track: #F3F4F6; /* Tailwind gray-100 */

    /* Badges */
    --color-badge-owner-bg: #DBEAFE; /* Tailwind blue-100 */
    --color-badge-owner-text: #1E40AF; /* Tailwind blue-800 */
    --color-badge-member-bg: #F3F4F6; /* Tailwind gray-100 */
    --color-badge-member-text: #1F2937; /* Tailwind gray-800 */

    /* Icons */
    --color-icon-export-csv: #16A34A; /* green-600 */
    --color-icon-export-json: #2563EB; /* blue-600 */
    --color-icon-export-xlsx: #059669; /* emerald-600 */
    --color-icon-export-qr: #9333EA; /* purple-600 */

    /* Alerts */
    --color-alert-warning-bg: #FFFBEB; /* yellow-50 */
    --color-alert-warning-border: #FEF3C7; /* yellow-200 */
    --color-alert-warning-text: #B45309; /* yellow-700 */
    --color-alert-warning-icon: #F59E0B; /* yellow-500 */
    --color-alert-warning-link-hover: #78350F; /* yellow-900 */
    --color-border-status-warning-border: #FDE68A; /* yellow-300 */

    /* Alert Error */
    --color-alert-error-bg: #FEF2F2; /* red-50 */
    --color-alert-error-border: #FECACA; /* red-200 */
    --color-alert-error-text: #B91C1C; /* red-700 */
    --color-alert-error-icon: #EF4444; /* red-500 */
    --color-alert-error-link-hover: #7F1D1D; /* red-900 */

    /* Alert Info */
    --color-alert-info-bg: #EFF6FF; /* blue-50 */
    --color-alert-info-border: #DBEAFE; /* blue-100 */
    --color-alert-info-text: #1E40AF; /* blue-800 */
    --color-alert-info-foreground: #2563EB; /* blue-600 */
    --color-alert-info-background: #BFDBFE; /* blue-200 */
    --color-alert-info-hover-bg: #DBEAFE; /* blue-100 */

    /* Calendar */
    --color-calendar-day-text: var(--color-text-tertiary);
    --color-calendar-day-text-muted: #9CA3AF; /* gray-400 */
    --color-calendar-day-selected-bg: var(--color-bg-accent-primary);
    --color-calendar-day-selected-text: var(--color-text-on-accent);
    --color-calendar-day-today-bg: var(--color-bg-accent-secondary);
    --color-calendar-day-today-text: var(--color-text-accent);
    --color-calendar-day-today-border: var(--color-border-focus);
    --color-calendar-day-hover-bg: var(--color-bg-hover-neutral);
    --color-calendar-day-in-range-bg: #E0E7FF;
    --color-calendar-day-in-range-text: var(--color-text-accent);

    /* StatsCard Icon BGs */
    --color-icon-bg-links: #FDF2F8; /* fuchsia-100 */
    --color-icon-bg-clicks: #CFFAFE; /* cyan-100 */
    --color-icon-bg-countries: #F0FDF4; /* green-100 */
    --color-icon-bg-topLink: #F5F3FF; /* purple-100 */
    --color-icon-bg-topCountry: #FEFCE8; /* yellow-100 */
    --color-icon-bg-topDevice: #E0E7FF; /* indigo-100 */
    --color-icon-bg-topBrowser: #CCFBF1; /* teal-100 */
    
    /* Form Section Icon BGs */
    --color-icon-bg-audio: #F3E8FF; /* purple-100 */
    --color-icon-text-audio: #7C3AED; /* purple-600 */
    --color-icon-bg-countdown: #FEF2F2; /* red-50 */
    --color-icon-text-countdown: #DC2626; /* red-600 */
    
    /* Status Colors for Form Elements */
    --color-status-error-soft-background: #FEF2F2; /* red-50 */
    --color-status-error-foreground: #DC2626; /* red-600 */

    /* StatsCard Icon Text/Stroke */
    --color-icon-text-links: #C026D3; /* fuchsia-600 */
    --color-icon-text-clicks: #0891B2; /* cyan-600 */
    --color-icon-text-countries: #16A34A; /* green-600 */
    --color-icon-text-topLink: #7E22CE; /* purple-600 */
    --color-icon-text-topLink-hover: #6B21A8; /* purple-700 */
    --color-icon-text-topCountry: #7E22CE; /* purple-600 (using same as topLink for consistency on yellow bg) */
    --color-icon-text-topDevice: #4F46E5; /* indigo-600 */
    --color-icon-text-topBrowser: #0D9488; /* teal-600 */

    /* StatsCard Delta Text */
    --color-text-positive: #16A34A; /* green-600 */
    --color-text-negative: #DC2626; /* red-600 */

    /* Specific Icon Colors (Example from original setup - can be removed if StatsCard covers all) */
    --color-icon-bg-set1: #FCE7F3; 
    --color-icon-text-set1: #DB2777; 
    --color-icon-bg-set2: #CCFBF1; 
    --color-icon-text-set2: #0D9488; 

    /* LiveView Indicators */
    --color-indicator-error-bg: #EF4444; /* red-500 */
    --color-indicator-error-text: #FFFFFF; /* white text on red background */
    --color-indicator-success-bg: #22C55E; /* green-500 */
    --color-indicator-success-text: #FFFFFF; /* white text on green background */

    /* Activity Feed Normal State */
    --color-activity-normal-bg: #FDF2F8; /* fuchsia-100 - light purple/pink for normal activity */
    --color-activity-normal-text: #C026D3; /* fuchsia-600 - darker purple/pink text */

    /* LiveView Active Link Fallback Badges */
    --color-badge-live-cyan-bg: #CFFAFE; /* cyan-100 */
    --color-badge-live-cyan-text: #0E7490; /* cyan-700 */
    --color-badge-live-cyan-pulse: #06B6D4; /* cyan-500 */
    --color-badge-live-cyan-border: #A5F3FC; /* cyan-200 */

    --color-badge-live-green-bg: #D1FAE5; /* green-100 */
    --color-badge-live-green-text: #059669; /* green-700 */
    --color-badge-live-green-pulse: #10B981; /* green-500 */
    --color-badge-live-green-border: #A7F3D0; /* green-200 */
    
    /* LiveView Default Activity Tag */
    --color-tag-neutral-bg: #6B7280; /* gray-500 */

    /* Activity Feed Device Tags */
    --color-tag-device-mobile-bg: #22C55E;  /* green-500 */
    --color-tag-device-desktop-bg: #3B82F6; /* blue-500 */
    --color-tag-device-tablet-bg: #14B8A6;  /* teal-500 */
    --color-tag-device-other-bg: var(--color-tag-neutral-bg);

    /* DataMap */
    --color-map-ocean: #334155; /* slate-700 - Ocean/sphere background for globe */
    --color-map-fill-default: #E5E7EB; /* gray-200 */
    --color-map-border: #9CA3AF; /* gray-400 */
    --color-map-highlight-fill: var(--color-bg-accent-primary); /* Original: #785EFF */
    --color-map-no-data-highlight-fill: #D1D5DB; /* gray-300 */
    --color-map-highlight-border: #FFFFFF;
    /* Accent Purple Scale for Map Data - Light Mode */
    --color-map-fill-scale-1: rgba(120, 94, 255, 0.2);
    --color-map-fill-scale-2: rgba(120, 94, 255, 0.35);
    --color-map-fill-scale-3: rgba(120, 94, 255, 0.5);
    --color-map-fill-scale-4: rgba(120, 94, 255, 0.65);
    --color-map-fill-scale-5: rgba(120, 94, 255, 0.8);
    --color-map-fill-scale-6: rgba(120, 94, 255, 0.95);

    /* RecentVisitorsTable Custom Tooltip */
    --color-tooltip-custom-bg: #1F2937;  /* gray-800 */
    --color-tooltip-custom-text: #F9FAFB; /* gray-50 */

    /* RecentVisitorsTable Status Indicators */
    --color-status-flagged-bg: #FEE2E2;   /* red-100 */
    --color-status-flagged-text: #B91C1C; /* red-700 */
    --color-status-clean-bg: #DCFCE7;     /* green-100 */
    --color-status-clean-text: #166534;    /* green-700 */

    /* Universal Modal Overlay */
    --color-overlay-bg: rgba(75, 85, 99, 0.5); /* gray-600 @ 50% opacity */

    /* UniversalModal Status Icons */
    --color-icon-status-success-bg: #DCFCE7;    /* green-100 */
    --color-icon-status-success-text: #16A34A;  /* green-600 */
    --color-icon-status-error-bg: #FEE2E2;      /* red-100 */
    --color-icon-status-error-text: #DC2626;    /* red-600 */
    --color-icon-status-warning-bg: #FEF9C3;    /* yellow-100 */
    --color-icon-status-warning-text: #CA8A04;  /* yellow-600 */
    --color-icon-status-info-bg: #DBEAFE;       /* blue-100 */
    --color-icon-status-info-text: #2563EB;     /* blue-600 */

    /* Statuses for Roadmap/General Use */
    --color-text-warning: #EA580C; /* orange-600 */
    --color-bg-status-warning-bg: #FFEDD5; /* orange-100 */
    --color-text-status-warning-text: #C2410C; /* orange-700 */
    --color-text-info: #2563EB; /* blue-600 */
    --color-bg-status-info-bg: #DBEAFE; /* blue-100 */
    --color-text-status-info-text: #1D4ED8; /* blue-700 */
    --color-bg-status-upcoming-bg: #F3E8FF; /* purple-100 */
    --color-text-status-upcoming-text: #7E22CE; /* purple-700 */

  /* Universal Modal Danger Button */
    --color-button-danger-bg: #DC2626;        /* red-600 */
    --color-button-danger-text: #FFFFFF;       /* white */
    --color-button-danger-hover-bg: #B91C1C;  /* red-700 */
    --color-button-danger-focus-ring: #F87171; /* red-400 */

    /* Status Badge Colors - Light Mode */
    --color-status-clean-background: #ECFDF5;     /* green-50 */
    --color-status-clean-foreground: #059669;     /* emerald-600 */
    --color-status-clean-hover-bg: #D1FAE5;       /* green-100 */
    --color-status-flagged-background: #FEF2F2;   /* red-50 */
    --color-status-flagged-foreground: #DC2626;   /* red-600 */
    --color-status-flagged-hover-bg: #FEE2E2;     /* red-100 */

    /* Links Page Action Button Icon Soft Hover Backgrounds */
    --color-hover-accent-links-soft-bg: #FCE7F3;    /* pink-100 (used for fuchsia icon) */
    --color-hover-accent-clicks-soft-bg: #A5F3FC;   /* cyan-200 */
    --color-hover-accent-brand-soft-bg: #EEF2FF;   /* indigo-50 (for brand purple icon) */
    --color-hover-accent-countries-soft-bg: #DCFCE7;/* green-100 */
    --color-hover-accent-error-soft-bg: #FEE2E2;    /* red-100 */

    /* Settings Page - Plan Card Badge Overlay */
    --color-badge-overlay-bg: rgba(255, 255, 255, 0.2);
    
    --color-border-status-flagged-soft: #FECACA; /* red-200 */
    --color-button-danger-soft-bg: #FEF2F2;    /* red-50 */

    /* Profile Page - Password Strength Meter Specific */
    --color-strength-weak-bg: #FEE2E2;        /* red-100 */
    --color-text-strength-weak: #B91C1C;     /* red-700 */
    --color-strength-medium-bg: #FFEDD5;     /* orange-100 */
    --color-text-strength-medium: #C2410C;   /* orange-700 */
    --color-strength-strong-bg: #FEF9C3;     /* yellow-100 */
    --color-text-strength-strong: #A16207;   /* yellow-700 */
    --color-strength-very-strong-bg: #DCFCE7;/* green-100 */
    --color-text-strength-very-strong: #166534; /* green-700 */

    /* Custom icon text color for team dashboard */
    --color-icon-text-custom-yellow: #D97706; /* yellow-600 */

    /* Hover color for link icons */
    --color-icon-text-links-hover: #A21CAF; /* fuchsia-700 */

    /* Link Type Badges */
    --color-tag-type-landing-bg: #F5F3FF; /* purple-100 */
    --color-tag-type-landing-text: #5B21B6; /* purple-700 */
    --color-tag-type-deeplink-bg: #FDF2F8; /* fuchsia-100 */
    --color-tag-type-deeplink-text: #A21CAF; /* fuchsia-700 */
    --color-tag-type-unknown-bg: #E5E7EB; /* gray-200 */
    --color-tag-type-unknown-text: #374151; /* gray-700 */

    /* Support Page - Ticket Status */
    --color-status-closed-bg: #F3F4F6; /* gray-100 */
    --color-status-closed-text: #4B5563; /* gray-600 */

    /* Support Page - Reply Bubbles */
    --color-reply-bubble-admin-bg: #F0EEFF; /* Custom light purple (bg-accent-secondary light) */
    --color-reply-bubble-admin-text: #3730A3; /* indigo-800 */
    --color-reply-bubble-user-bg: #DBEAFE;  /* blue-100 */
    --color-reply-bubble-user-text: #1E40AF; /* blue-800 */

    /* Support Page - Active Tab Border */
    --color-border-tab-active: var(--color-text-accent);

    /* Admin Dashboard - General */
    --color-admin-bg-secondary-accent: #F5F7FF; /* Specific light purplish-blue/gray */
    --color-admin-text-heading-primary: #12064D; /* Specific dark purple for headings */

    /* Admin Dashboard - "Open Support Tickets" Card */
    --color-admin-card-warning-bg: #FFF5E6; /* light orange */
    --color-admin-card-warning-border: #FED7AA; /* orange-300 */
    --color-admin-card-warning-text-title: #9A3412; /* orange-700 */
    --color-admin-card-warning-text-value: #7C2D12; /* orange-800 */
    --color-admin-card-warning-text-link: #EA580C; /* orange-600 */
    --color-admin-card-warning-icon: #F97316; /* orange-500 */

    /* Admin Dashboard - "Top Links" Table Type Badges */
    --color-admin-badge-landing-bg: #DBEAFE; /* blue-100 */
    --color-admin-badge-landing-text: #1E40AF; /* blue-800 */
    --color-admin-badge-deeplink-bg: #F3E8FF; /* purple-100 */
    --color-admin-badge-deeplink-text: #5B21B6; /* purple-700 */

    /* Admin Dashboard - "Create Lifetime User" Button (Green) */
    --color-admin-button-success-bg: #16A34A; /* green-600 */
    --color-admin-button-success-hover-bg: #15803D; /* green-700 */
    --color-admin-button-success-text: #FFFFFF;

    /* Admin Dashboard - Chart Colors */
    --color-admin-chart-primary-background: rgba(120, 94, 255, 0.2); /* Accent purple with alpha */
    --color-admin-chart-primary-border: #785EFF; /* Accent purple solid */
    --color-admin-chart-primary-point-bg: #785EFF;

    /* Admin User Detail - Current Plan Card */
    --color-admin-card-accent-primary-bg: #785EFF; /* Main accent purple */
    --color-admin-card-accent-primary-text: #FFFFFF;
    --color-admin-card-accent-primary-text-muted: rgba(255, 255, 255, 0.9);
    --color-admin-card-accent-primary-badge-neutral-bg: rgba(255, 255, 255, 0.2);
    --color-admin-card-accent-primary-badge-neutral-text: #FFFFFF;

    /* Admin User Detail - Send Password Reset Button */
    --color-admin-button-accent-soft-bg: #EAE7FF; /* Light purple */
    --color-admin-button-accent-soft-text: #785EFF;
    --color-admin-button-accent-soft-hover-bg: #D8D2FF;

    /* Admin Newsletter - Preview Button */
    --color-admin-button-info-bg: #2563EB; /* blue-600 */
  --color-admin-button-info-hover-bg: #2563EB; /* blue-600 */
    --color-admin-button-info-text: #FFFFFF;

    /* Admin Support - Close Inactive Button (Soft Danger) */
    --color-admin-button-danger-soft-bg: #FEE2E2; /* red-100 */
    --color-admin-button-danger-soft-text: #B91C1C; /* red-700 */
    --color-admin-button-danger-soft-hover-bg: #FECACA; /* red-200 */
    --color-admin-button-danger-soft-border: #FCA5A5; /* red-300 */

    /* Create Link Page - Phone Frame */
    --color-phone-frame-border: #1F2937; /* gray-800 for light mode, a dark color */
    --color-phone-frame-notch: var(--color-phone-frame-border);

    /* Create Link Page - Input Fields Default State */
    --color-bg-input-default: #FFFFFF; /* Pure white for light mode inputs */
    --color-border-input-default: #D1D5DB; /* UPDATED: Was gray-200 (#E5E7EB), now gray-300 to match border-secondary */
    --color-text-input-default: #1F2937; /* gray-800 */
    --color-text-input-placeholder-default: #9CA3AF; /* gray-400 */
    --color-bg-input-focus: #FFFFFF; /* white - focus bg matches default bg in light mode */

    /* Create Link Page - Toggle Switch */
    --color-toggle-slider-off-bg: #CBD5E1; /* DEPRECATED: gray-300 -> slate-300 for light off */
    /* NEW Toggle Slider Specific Variables - Light Mode */
    --color-bg-toggle-slider-off-default: #E5E7EB;  /* TRACK OFF: gray-200 */
    --color-bg-toggle-slider-on-success: #1DB954;   /* TRACK ON SUCCESS: Spotify Green */
    --color-bg-toggle-slider-on-accent: var(--color-bg-accent-primary); /* TRACK ON ACCENT */
    
    --color-bg-toggle-knob-off-default: #A1A1AA;   /* KNOB OFF: zinc-400 */
    --color-bg-toggle-knob-on-default: #FFFFFF;    /* KNOB ON (all types): white */
    --color-bg-toggle-knob-off-hover: #94A3B8;    /* KNOB OFF HOVER: slate-400 */

    /* Custom Properties for Step Indicators (New) */
    --color-bg-step-indicator-completed-background: #22C55E; /* Tailwind green-500, vibrant green */
    --color-text-step-indicator-completed-foreground: #FFFFFF; /* White checkmark */

    --color-bg-text-label-translucent: rgba(255, 255, 255, 0.8); /* white with 80% opacity for light mode */

    /* Link Stats Page - Device Icons */
    --color-icon-bg-device-desktop: #CFFAFE; /* cyan-100 */
    --color-icon-text-device-desktop: #0891B2; /* cyan-600 */
    --color-icon-bg-device-mobile: #FDF2F8; /* fuchsia-100 */
    --color-icon-text-device-mobile: #C026D3; /* fuchsia-600 */
    --color-icon-bg-device-tablet: #F5F3FF; /* purple-100 */
    --color-icon-text-device-tablet: #7E22CE; /* purple-600 */
    --color-icon-bg-device-tv: #EEF2FF; /* indigo-100 */
    --color-icon-text-device-tv: #4338CA; /* indigo-700 */
    --color-icon-bg-device-console: #FFF7ED; /* orange-100 */
    --color-icon-text-device-console: #C2410C; /* orange-700 */
    --color-icon-bg-device-bot: #FEE2E2; /* red-100 */
    --color-icon-text-device-bot: #B91C1C; /* red-700 */
    --color-icon-bg-device-unknown: #F3F4F6; /* gray-100 */
    --color-icon-text-device-unknown: #4B5563; /* gray-600 */

    /* Link Stats Page - Device Progress Bar Fills */
    --color-bg-progress-device-desktop: #06B6D4; /* cyan-500 */ /* Adjusted from 600 for better visibility */
    --color-bg-progress-device-mobile: #DB2777; /* fuchsia-600 */
    --color-bg-progress-device-tablet: #8B5CF6; /* purple-500 */
    --color-bg-progress-device-tv: #4F46E5; /* indigo-600 */
    --color-bg-progress-device-console: #EA580C; /* orange-600 */
    --color-bg-progress-device-bot: #DC2626; /* red-600 */
    --color-bg-progress-device-unknown: #6B7280; /* gray-500 */

    /* Link Stats Page - Browser Segmented Bar Fills */
    --color-bg-browser-segment-chrome: #2563EB; /* blue-600 */
    --color-bg-browser-segment-safari: #06B6D4; /* cyan-500 */
    --color-bg-browser-segment-firefox: #EA580C; /* orange-600 */
    --color-bg-browser-segment-edge: #0D9488; /* teal-600 */
    --color-bg-browser-segment-opera: #DC2626; /* red-600 */
    --color-bg-browser-segment-samsung: #4F46E5; /* indigo-600 */
    --color-bg-browser-segment-duckduckgo: #F59E0B; /* yellow-500 */
    --color-bg-browser-segment-other: #6B7280; /* gray-500 */
    --color-bg-browser-segment-defaultunknown: #7E22CE; /* purple-600 */

    /* Link Stats Page - Referrer Icons */
    --color-icon-bg-referrer-social: var(--color-icon-bg-device-mobile); /* Use fuchsia like mobile */
    --color-icon-text-referrer-social: var(--color-icon-text-device-mobile);
    --color-icon-bg-referrer-search: var(--color-icon-bg-device-tablet); /* Use purple like tablet */
    --color-icon-text-referrer-search: var(--color-icon-text-device-tablet);
    --color-icon-bg-referrer-direct: var(--color-icon-bg-device-desktop); /* Use cyan like desktop */
    --color-icon-text-referrer-direct: var(--color-icon-text-device-desktop);
    --color-icon-bg-referrer-other: var(--color-icon-bg-device-unknown); /* Use gray like unknown */
    --color-icon-text-referrer-other: var(--color-icon-text-device-unknown);

    /* Link Stats Page - Referrer Progress Bar Fills */
    --color-bg-progress-referrer-social: var(--color-bg-progress-device-mobile);
    --color-bg-progress-referrer-search: var(--color-bg-progress-device-tablet);
    --color-bg-progress-referrer-direct: var(--color-bg-progress-device-desktop);
    --color-bg-progress-referrer-other: var(--color-bg-progress-device-unknown);
    
    /* ShieldProtectionCard Status Indicators */
    --color-bg-status-clean-indicator: #22C55E; /* green-500 */
    --color-bg-status-flagged-indicator: #EF4444; /* red-500 */

    /* ShieldProtectionCard Progress Bars */
    --color-bg-shield-type-vpn: #DB2777; /* fuchsia-600 */
    --color-bg-shield-type-datacenter: #06B6D4; /* cyan-500 */
    --color-bg-shield-type-bot: #8B5CF6; /* purple-500 */

    /* ShieldProtectionCard Radial Chart Strokes */
    --color-stroke-shield-radial-track: #E5E7EB; /* Tailwind gray-200 */
    --color-stroke-shield-radial-value: #C026D3; /* Tailwind fuchsia-600 */

    /* Leaderboards Rank Badges - Light Mode */
    --color-rank-badge-1st-bg: rgba(251, 191, 36, 0.1); /* yellow-400 with opacity */
    --color-rank-badge-1st-text: #B45309; /* yellow-700 for better contrast */
    --color-rank-badge-1st-border: #F59E0B; /* yellow-500 */
    --color-rank-badge-2nd-bg: #9CA3AF; /* gray-400 - Silver */
    --color-rank-badge-2nd-text: #FFFFFF; /* white */
    --color-rank-badge-3rd-bg: #F97316; /* orange-500 - Bronze */
    --color-rank-badge-3rd-text: #FFFFFF; /* white */
    --color-rank-badge-other-bg: #E5E7EB; /* gray-200 - Other ranks */
    --color-rank-badge-other-text: #6B7280; /* gray-500 */

    /* Notification Badges */
    --color-notification-badge-bg: #785EFF; /* Main accent purple - matches brand */
    --color-notification-badge-text: #FFFFFF; /* White text for good contrast */
    --color-notification-badge-pulse: rgba(120, 94, 255, 0.4); /* Pulse animation color */

    /* Traffic Sources Platform Colors - Light Mode */
    --color-platform-twitter-bg: #000000;  /* Twitter/X black */
    --color-platform-facebook-bg: #1877F2; /* Facebook blue */
    --color-platform-instagram-bg: #E4405F; /* Instagram pink */
    --color-platform-linkedin-bg: #0A66C2; /* LinkedIn blue */
    --color-platform-youtube-bg: #FF0000;  /* YouTube red */
    --color-platform-google-bg: #4285F4;   /* Google blue */
    --color-platform-pinterest-bg: #BD081C; /* Pinterest red */
    --color-platform-tiktok-bg: #000000;   /* TikTok black */
    --color-platform-reddit-bg: #FF4500;   /* Reddit orange */
    --color-platform-whatsapp-bg: #25D366; /* WhatsApp green */
    --color-platform-telegram-bg: #0088CC; /* Telegram blue */
    --color-platform-bing-bg: #00BCF2;     /* Bing blue */
    --color-platform-snapchat-bg: #FFFC00; /* Snapchat yellow */
    --color-platform-discord-bg: #5865F2;  /* Discord blurple */
    --color-platform-duckduckgo-bg: #DE5833; /* DuckDuckGo orange */
    --color-platform-yahoo-bg: #720E9E;    /* Yahoo purple */
    --color-platform-yandex-bg: #FF0000;   /* Yandex red */
    --color-platform-baidu-bg: #2932E1;    /* Baidu blue */
    --color-platform-gmail-bg: #EA4335;    /* Gmail red */
    --color-platform-outlook-bg: #0078D4;  /* Outlook blue */
    --color-platform-protonmail-bg: #6D4AFF; /* ProtonMail purple */
    --color-platform-direct-bg: #6B7280;   /* Direct gray */
    --color-platform-other-bg: #8B5CF6;    /* Other purple */

    /* Traffic Sources Category Colors - Light Mode */
    --color-category-social-bg: #1877F2;   /* Social blue (Facebook blue) */
    --color-category-search-bg: #34A853;   /* Search green (Google green) */
    --color-category-direct-bg: #6B7280;   /* Direct gray */
    --color-category-email-bg: #F59E0B;    /* Email yellow/orange */
    --color-category-other-bg: #8B5CF6;    /* Other purple */

      /* Social Media Platform Colors - Light Mode */
  --color-social-instagram: #E1306C;     /* Instagram pink */
  --color-social-tiktok: #000000;        /* TikTok black */
  --color-social-twitter: #1DA1F2;       /* Twitter blue */
  --color-social-youtube: #FF0000;       /* YouTube red */
  --color-social-facebook: #1877F2;      /* Facebook blue */
  --color-social-linkedin: #0A66C2;      /* LinkedIn blue */
  --color-social-snapchat: #FFFC00;      /* Snapchat yellow */
  --color-social-telegram: #0088CC;      /* Telegram blue */
  --color-social-discord: #5865F2;       /* Discord blurple */
  --color-social-twitch: #9146FF;        /* Twitch purple */
  --color-social-onlyfans: #00AFF0;      /* OnlyFans blue */
  --color-social-patreon: #FF424D;       /* Patreon red */
  --color-social-spotify: #1DB954;       /* Spotify green */
  --color-social-reddit: #FF4500;        /* Reddit orange */
  --color-social-pinterest: #BD081C;     /* Pinterest red */
  --color-social-github: #181717;        /* GitHub black */
  --color-social-behance: #1769FF;       /* Behance blue */
  --color-social-dribbble: #EA4C89;      /* Dribbble pink */
  --color-social-threads: #000000;       /* Threads black */
    --color-social-whatsapp: #25D366;      /* WhatsApp green */
--color-social-messenger: #006AFF;     /* Messenger blue */
--color-social-bluesky: #0085FF;       /* Bluesky blue */
--color-social-generic: #6B7280;       /* Generic gray */

  /* Onboarding Experience Colors - Light Mode */
  --color-onboarding-card-bg: #FFFFFF;                    /* Card backgrounds */
  --color-onboarding-card-border: #E5E7EB;               /* Card borders */
  --color-onboarding-card-hover-bg: #F8FAFC;             /* Card hover background */
  --color-onboarding-card-hover-border: var(--color-bg-accent-primary); /* Card hover border */
  --color-onboarding-card-selected-bg: #F0EEFF;          /* Selected card background */
  --color-onboarding-card-selected-border: var(--color-bg-accent-primary); /* Selected card border */
  --color-onboarding-icon-bg: #F3F4F6;                   /* Icon background */
  --color-onboarding-icon-text: #6B7280;                 /* Icon color */
  --color-onboarding-icon-selected-bg: var(--color-bg-accent-primary); /* Selected icon background */
  --color-onboarding-icon-selected-text: #FFFFFF;        /* Selected icon color */
  --color-onboarding-step-bg: #F3F4F6;                   /* Step indicator background */
  --color-onboarding-step-text: #6B7280;                 /* Step indicator text */
  --color-onboarding-step-active-bg: var(--color-bg-accent-primary); /* Active step background */
  --color-onboarding-step-active-text: #FFFFFF;          /* Active step text */
  --color-onboarding-step-completed-bg: #10B981;         /* Completed step background */
  --color-onboarding-step-completed-text: #FFFFFF;       /* Completed step text */
  --color-onboarding-gradient-start: var(--color-bg-accent-primary); /* Gradient start */
  --color-onboarding-gradient-end: #6D28D9;              /* Gradient end */
  --color-onboarding-success-bg: #ECFDF5;                /* Success background */
  --color-onboarding-success-border: #A7F3D0;            /* Success border */
  --color-onboarding-success-text: #065F46;              /* Success text */
  --color-onboarding-preview-frame: #F9FAFB;             /* Preview frame background */
  --color-onboarding-preview-border: #E5E7EB;            /* Preview frame border */

  /* NEW VARIABLES FOR CHARTS & GLOWS (Light Mode) */
  --color-tooltip-chart-bg: rgba(255, 255, 255, 0.95);
  --color-tooltip-chart-border: rgba(0, 0, 0, 0.08);
  --color-tooltip-chart-text: #1F2937;
  
  --color-glow-primary: rgba(120, 94, 255, 0.2);
  --color-glow-link: rgba(244, 63, 94, 0.2);
  --color-glow-location: rgba(14, 165, 233, 0.2);
  
  --color-chart-grid: #E5E7EB;
  --color-chart-axis-label: #6B7280;

  /* KANBAN BOARD - Light Mode */
  --color-kanban-bg: #F1F5F9; /* slate-100 - Main board background */
  --color-kanban-column-bg: #F8FAFC; /* slate-50 - Column background */
  --color-kanban-column-header-bg: #F8FAFC; /* slate-50 - Column header */
  --color-kanban-column-border: #E2E8F0; /* slate-200 - Column border */
  --color-kanban-column-content-bg: rgba(248, 250, 252, 0.52); /* slate-50 with opacity - Column content area */
  --color-kanban-card-bg: #FFFFFF; /* pure white - Card background */
  --color-kanban-card-bg-glass: rgba(255, 255, 255, 0.82); /* glass card background */
  --color-kanban-card-bg-glass-strong: rgba(255, 255, 255, 0.92); /* stronger glass card background (hover/drag) */
  --color-kanban-card-border: #E2E8F0; /* slate-200 - Card border */
  --color-kanban-card-hover-border: #785EFF; /* accent purple - Card hover border */
  --color-kanban-card-shadow: 0 1px 2px rgba(15, 23, 42, 0.10), 0 14px 30px -18px rgba(120, 94, 255, 0.28); /* depth + subtle brand glow */
  --color-kanban-card-hover-shadow: 0 6px 18px rgba(15, 23, 42, 0.14), 0 22px 48px -24px rgba(120, 94, 255, 0.38); /* hover depth + glow */
  --color-kanban-accent: #785EFF; /* accent purple */
  --color-kanban-accent-light: rgba(120, 94, 255, 0.05); /* light accent bg */
  --color-kanban-accent-soft-bg: rgba(120, 94, 255, 0.08); /* soft accent bg (chips, buttons) */
  --color-kanban-accent-soft-bg-hover: rgba(120, 94, 255, 0.12); /* soft accent bg hover */
  --color-kanban-column-bg-glass: rgba(248, 250, 252, 0.74); /* glass column background */
  --color-kanban-column-header-bg-glass: rgba(248, 250, 252, 0.78); /* glass column header background */
  --color-kanban-surface-highlight: rgba(255, 255, 255, 0.22); /* specular highlight */
  --color-kanban-surface-highlight-strong: rgba(255, 255, 255, 0.34); /* stronger specular highlight */
  --color-kanban-surface-border: rgba(120, 94, 255, 0.16); /* accent-tinted glass edge */
  --color-kanban-column-shadow: 0 1px 1px rgba(15, 23, 42, 0.06), 0 16px 40px -30px rgba(120, 94, 255, 0.20);
  --color-kanban-column-hover-shadow: 0 8px 24px rgba(15, 23, 42, 0.10), 0 22px 52px -34px rgba(120, 94, 255, 0.28);
  }

  html.dark {
    /* Background Colors */
    --color-bg-primary: #111827;    /* Tailwind gray-900 */
    --color-bg-secondary: #1F2937;   /* Tailwind gray-800 */
    --color-bg-accent-primary: #6D28D9; /* Tailwind violet-700 */
    --color-bg-accent-secondary: #4C1D95; /* Tailwind violet-900 */
    --color-bg-interactive-disabled: #374151; /* Tailwind gray-700 */
    --color-bg-hover-neutral: #374151; /* Tailwind gray-700 */
    --color-avatar-default-bg: #3730A3; /* Darker violet, similar to accent-soft */
    --color-bg-interactive-disabled-hover: #4B5563; /* gray-600 */
    --color-bg-surface-neutral-subtle: var(--color-bg-secondary); /* New for toggle containers - DARK MODE - Changed to primary for more contrast */

    /* Text Colors */
    --color-text-primary: #F3F4F6;    /* Tailwind gray-100 */
    --color-text-secondary: #9CA3AF;   /* Tailwind gray-400 */
    --color-text-tertiary: #D1D5DB;   /* Tailwind gray-300 */
    --color-text-accent: #A78BFA;      /* Tailwind violet-400 */
    --color-text-on-accent: #FFFFFF;  /* Tailwind white */
    --color-text-placeholder: #6B7280; /* Tailwind gray-500 */
    --color-text-disabled: #4B5563;   /* Tailwind gray-600 */
    --color-text-heading: var(--color-text-primary); 
    --color-text-error: #F87171; /* red-400 */

    /* Border Colors */
    --color-border-primary: #4B5563; /* Tailwind gray-600 */
    --color-border-secondary: #4B5563;/* Tailwind gray-600 */
    --color-border-interactive: #4B5563; /* Tailwind gray-600 */
    --color-border-focus: #A78BFA;   /* Tailwind violet-400 */
    --color-border-accent-soft: #4C1D95; /* Match dark --color-bg-accent-secondary (violet-900) */

    /* Interactive Element Colors */
    --color-interactive-accent-hover: #8B5CF6; /* Tailwind violet-500 */

    /* Additional Background Colors */
    --color-bg-tertiary: #374151; /* gray-700 - lighter than secondary for subtle elements */

    /* Additional Border Colors */
    --color-border-tertiary: #4B5563; /* gray-600 - very subtle border */

    /* Theme-Specific Shadow & Effect Variables (Colored/Custom Only) */
    --shadow-focus-blue: 0 0 0 3px rgba(147, 197, 253, 0.1); /* blue-300 for dark */
    --shadow-focus-blue-strong: 0 0 0 3px rgba(147, 197, 253, 0.15);
    --shadow-accent-purple: 0 4px 12px rgba(167, 139, 250, 0.15), 0 2px 4px rgba(167, 139, 250, 0.1);
    --shadow-success-green: 0 2px 8px rgba(74, 222, 128, 0.2);
    --shadow-danger-red: 0 2px 8px rgba(248, 113, 113, 0.2);
    --shadow-danger-strong: 0 4px 12px rgba(239, 68, 68, 0.3);
    --shadow-tag: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.06);
    --shadow-tag-remove: 0 2px 6px rgba(0, 0, 0, 0.35);
    --shadow-notification: 0 4px 12px rgba(0, 0, 0, 0.25);
    --glow-accent-light: drop-shadow(0 0 2px rgba(147, 197, 253, 0.3));
    --glow-accent-strong: drop-shadow(0 0 6px rgba(147, 197, 253, 0.5));
    --overlay-white-20: rgba(255, 255, 255, 0.2);

    /* Scrollbar */
    --color-scrollbar-track: #374151; /* Tailwind gray-700 */

    /* Badges */
    --color-badge-owner-bg: #1E3A8A; /* Tailwind blue-900 */
    --color-badge-owner-text: #BFDBFE; /* Tailwind blue-200 */
    --color-badge-member-bg: #374151; /* Tailwind gray-700 */
    --color-badge-member-text: #D1D5DB; /* Tailwind gray-300 */

    /* Icons */
    --color-icon-export-csv: #34D399; /* green-400 */
    --color-icon-export-json: #60A5FA; /* blue-400 */
    --color-icon-export-xlsx: #34D399; /* emerald-400 */
    --color-icon-export-qr: #C084FC; /* purple-400 */

    /* Alerts */
    --color-alert-warning-bg: #422006; 
    --color-alert-warning-border: #5F370E; 
    --color-alert-warning-text: #FDE68A; /* yellow-300 */
    --color-alert-warning-icon: #FCD34D; /* yellow-400 */
    --color-alert-warning-link-hover: #FEF3C7; /* yellow-200 */
    --color-border-status-warning-border: #EAB308; /* yellow-600 */

    /* Alert Error */
    --color-alert-error-bg: #450A0A; /* red-950 */
    --color-alert-error-border: #B91C1C; /* red-700 */
    --color-alert-error-text: #FCA5A5; /* red-300 */
    --color-alert-error-icon: #F87171; /* red-400 */
    --color-alert-error-link-hover: #FEE2E2; /* red-100 */

    /* Alert Info */
    --color-alert-info-bg: #1E3A8A; /* blue-800 */
    --color-alert-info-border: #1D4ED8; /* blue-700 */
    --color-alert-info-text: #93C5FD; /* blue-300 */
    --color-alert-info-foreground: #60A5FA; /* blue-400 */
    --color-alert-info-background: #1E40AF; /* blue-800 */
    --color-alert-info-hover-bg: #1D4ED8; /* blue-700 */

    /* Calendar */
    --color-calendar-day-text: var(--color-text-tertiary);
    --color-calendar-day-text-muted: #4B5563; /* gray-600 */
    --color-calendar-day-selected-bg: var(--color-bg-accent-primary);
    --color-calendar-day-selected-text: var(--color-text-on-accent);
    --color-calendar-day-today-bg: var(--color-bg-accent-secondary);
    --color-calendar-day-today-text: var(--color-text-accent);
    --color-calendar-day-today-border: var(--color-border-focus);
    --color-calendar-day-hover-bg: var(--color-bg-hover-neutral);
    --color-calendar-day-in-range-bg: #312E81;
    --color-calendar-day-in-range-text: var(--color-text-accent);

    /* StatsCard Icon BGs */
    --color-icon-bg-links: #701A75; /* fuchsia-900 */
    --color-icon-bg-clicks: #164E63; /* cyan-900 */
    --color-icon-bg-countries: #14532D; /* green-900 */
    --color-icon-bg-topLink: #5B21B6; /* purple-800 */
    --color-icon-bg-topCountry: #713F12; /* yellow-900 */
    --color-icon-bg-topDevice: #312E81; /* indigo-900 */
    --color-icon-bg-topBrowser: #134E4A; /* teal-900 */
    
    /* Form Section Icon BGs */
    --color-icon-bg-audio: #581C87; /* purple-800 */
    --color-icon-text-audio: #C084FC; /* purple-400 */
    --color-icon-bg-countdown: #7F1D1D; /* red-800 */
    --color-icon-text-countdown: #FCA5A5; /* red-300 */
    
    /* Status Colors for Form Elements */
    --color-status-error-soft-background: #7F1D1D; /* red-800 */
    --color-status-error-foreground: #FCA5A5; /* red-300 */

    /* StatsCard Icon Text/Stroke */
    --color-icon-text-links: #F0ABFC; /* fuchsia-300 */
    --color-icon-text-clicks: #67E8F9; /* cyan-300 */
    --color-icon-text-countries: #4ADE80; /* green-400 */
    --color-icon-text-topLink: #C084FC; /* purple-400 */
    --color-icon-text-topLink-hover: #D8B4FE; /* purple-300 (lighter for dark hover) */
    --color-icon-text-topCountry: #C084FC; /* purple-400 */
    --color-icon-text-topDevice: #A5B4FC; /* indigo-300 */
    --color-icon-text-topBrowser: #5EEAD4; /* teal-300 */

    /* StatsCard Delta Text */
    --color-text-positive: #4ADE80; /* green-400 */
    --color-text-negative: #F87171; /* red-400 */

    /* Specific Icon Colors (Dark Mode Example - can be removed if StatsCard covers all) */
    --color-icon-bg-set1: #581C87; 
    --color-icon-text-set1: #E9D5FF; 
    --color-icon-bg-set2: #115E59; 
    --color-icon-text-set2: #99F6E4; 

    /* LiveView Indicators */
    --color-indicator-error-bg: #F87171; /* red-400 */
    --color-indicator-error-text: #1F2937; /* gray-800 for better contrast on lighter red in dark mode */
    --color-indicator-success-bg: #4ADE80; /* green-400 */
    --color-indicator-success-text: #1F2937; /* gray-800 for better contrast on lighter green in dark mode */

    /* Activity Feed Normal State */
    --color-activity-normal-bg: #701A75; /* fuchsia-900 - darker purple/pink background for dark mode */
    --color-activity-normal-text: #F0ABFC; /* fuchsia-300 - lighter purple/pink text for dark mode */

    /* LiveView Active Link Fallback Badges */
    --color-badge-live-cyan-bg: #164E63; /* cyan-900 */
    --color-badge-live-cyan-text: #A5F3FC; /* cyan-200 */
    --color-badge-live-cyan-pulse: #67E8F9; /* cyan-300 */
    --color-badge-live-cyan-border: #22D3EE; /* cyan-400 */

    --color-badge-live-green-bg: #14532D; /* green-900 */
    --color-badge-live-green-text: #A7F3D0; /* green-200 */
    --color-badge-live-green-pulse: #4ADE80; /* green-400 */
    --color-badge-live-green-border: #6EE7B7; /* green-300 */

    /* LiveView Default Activity Tag */
    --color-tag-neutral-bg: #9CA3AF; /* gray-400 */

    /* Activity Feed Device Tags */
    --color-tag-device-mobile-bg: #4ADE80;  /* green-400 */
    --color-tag-device-desktop-bg: #60A5FA; /* blue-400 */
    --color-tag-device-tablet-bg: #2DD4BF;  /* teal-400 */
    --color-tag-device-other-bg: var(--color-tag-neutral-bg);

    /* DataMap */
    --color-map-ocean: #1e293b; /* slate-800 - Ocean/sphere background for globe (darker for dark mode) */
    --color-map-fill-default: #4B5563; /* gray-600 */
    --color-map-border: #6B7280; /* gray-500 */
    --color-map-highlight-fill: var(--color-bg-accent-primary); /* Already themed for dark via bg-accent-primary */
    --color-map-no-data-highlight-fill: #374151; /* gray-700 */
    --color-map-highlight-border: #1F2937; /* gray-800 */
    /* Lighter/Vibrant Purple Scale for Dark Mode Map Data (violet-400 base) */
    --color-map-fill-scale-1: rgba(167, 139, 250, 0.2);
    --color-map-fill-scale-2: rgba(167, 139, 250, 0.35);
    --color-map-fill-scale-3: rgba(167, 139, 250, 0.5);
    --color-map-fill-scale-4: rgba(167, 139, 250, 0.65);
    --color-map-fill-scale-5: rgba(167, 139, 250, 0.8);
    --color-map-fill-scale-6: rgba(167, 139, 250, 0.95);

    /* RecentVisitorsTable Custom Tooltip */
    --color-tooltip-custom-bg: #374151;  /* gray-700 */
    --color-tooltip-custom-text: #E5E7EB; /* gray-200 */

    /* RecentVisitorsTable Status Indicators */
    --color-status-flagged-bg: #5F2120;    /* Custom dark red (approx from red-900 #7f1d1d) */
    --color-status-flagged-text: #FCA5A5;   /* red-300 */
    --color-status-clean-bg: #22C55E;     /* MODIFIED: Was #1A3D2D (dark green), now green-500 for brighter success */
    --color-status-clean-text: #86EFAC;    /* green-300 */

    /* Universal Modal Overlay */
    --color-overlay-bg: rgba(17, 24, 39, 0.75); /* gray-900 @ 75% opacity */

    /* UniversalModal Status Icons */
    --color-icon-status-success-bg: #1A3D2D;    /* Dark green */
    --color-icon-status-success-text: #4ADE80;  /* green-400 */
    --color-icon-status-error-bg: #5F2120;      /* Dark red */
    --color-icon-status-error-text: #F87171;    /* red-400 */
    --color-icon-status-warning-bg: #4A3B03;    /* Dark yellow */
    --color-icon-status-warning-text: #FACC15;  /* yellow-400 */
    --color-icon-status-info-bg: #1E3A8A;      /* Dark blue */
    --color-icon-status-info-text: #60A5FA;    /* blue-400 */

    /* Statuses for Roadmap/General Use */
    --color-text-warning: #F97316; /* orange-500 */ /* Brighter orange for dark mode */
    --color-bg-status-warning-bg: #7C2D12; /* orange-900 */
    --color-text-status-warning-text: #FB923C; /* orange-400 */
    --color-text-info: #60A5FA; /* blue-400 */
    --color-bg-status-info-bg: #1E40AF; /* blue-800 */ /* Darker than universal modal info */
    --color-text-status-info-text: #93C5FD; /* blue-300 */
    --color-bg-status-upcoming-bg: #581C87; /* purple-800 */ /* Darker than universal modal info */
    --color-text-status-upcoming-text: #D8B4FE; /* purple-300 */

    /* Universal Modal Danger Button */
    --color-button-danger-bg: #EF4444;        /* red-500 */
    --color-button-danger-text: #FFFFFF;       /* white */
    --color-button-danger-hover-bg: #DC2626;  /* red-600 */
    --color-button-danger-focus-ring: #FCA5A5; /* red-300 */

    /* Status Badge Colors - Dark Mode */
    --color-status-clean-background: #064E3B;     /* emerald-900 */
    --color-status-clean-foreground: #6EE7B7;     /* emerald-300 */
    --color-status-clean-hover-bg: #065F46;       /* emerald-800 */
    --color-status-flagged-background: #7F1D1D;   /* red-800 */
    --color-status-flagged-foreground: #FCA5A5;   /* red-300 */
    --color-status-flagged-hover-bg: #991B1B;     /* red-700 */

    /* Links Page Action Button Icon Soft Hover Backgrounds */
    --color-hover-accent-links-soft-bg: #86198F;    /* pink-800 */
    --color-hover-accent-clicks-soft-bg: #155E75;   /* cyan-800 */
    --color-hover-accent-brand-soft-bg: #3730A3;   /* indigo-800 */
    --color-hover-accent-countries-soft-bg: #166534;/* green-800 */
    --color-hover-accent-error-soft-bg: #991B1B;    /* red-800 */

    /* Settings Page - Plan Card Badge Overlay */
    --color-badge-overlay-bg: rgba(0, 0, 0, 0.2);
    
    --color-border-status-flagged-soft: #7f1d1d; /* red-800 or red-900 */
    --color-button-danger-soft-bg: #450a0a;    /* red-950 */

    /* Profile Page - Password Strength Meter Specific */
    --color-strength-weak-bg: #5F2120;        /* Dark red (e.g. red-900ish from Tailwind) */
    --color-text-strength-weak: #FCA5A5;     /* red-300 */
    --color-strength-medium-bg: #7C2D12;     /* Dark orange (orange-900 from Tailwind) */
    --color-text-strength-medium: #FDBA74;   /* orange-300 */
    --color-strength-strong-bg: #713F12;     /* Dark yellow (yellow-900 from Tailwind) */
    --color-text-strength-strong: #FDE047;   /* yellow-300 */
    --color-strength-very-strong-bg: #14532D;/* Dark green (green-900 from Tailwind) */
    --color-text-strength-very-strong: #86EFAC; /* green-300 */

    /* Custom icon text color for team dashboard */
    --color-icon-text-custom-yellow: #FCD34D; /* yellow-400 */

    /* Hover color for link icons */
    --color-icon-text-links-hover: #E879F9; /* fuchsia-400 */

    /* Link Type Badges */
    --color-tag-type-landing-bg: #4338CA; /* indigo-700 */
    --color-tag-type-landing-text: #C7D2FE; /* indigo-200 */
    --color-tag-type-deeplink-bg: #701A75; /* fuchsia-900 */
    --color-tag-type-deeplink-text: #F0ABFC; /* fuchsia-300 */
    --color-tag-type-unknown-bg: #374151; /* gray-700 */
    --color-tag-type-unknown-text: #D1D5DB; /* gray-300 */

    /* Support Page - Ticket Status */
    --color-status-closed-bg: #374151; /* gray-700 */
    --color-status-closed-text: #D1D5DB; /* gray-300 */

    /* Support Page - Reply Bubbles */
    --color-reply-bubble-admin-bg: #4C1D95; /* violet-900 (bg-accent-secondary dark) */
    --color-reply-bubble-admin-text: #E0E7FF; /* indigo-200 */
    --color-reply-bubble-user-bg: #1E3A8A;  /* blue-900 */
    --color-reply-bubble-user-text: #BFDBFE; /* blue-200 */

    /* Support Page - Active Tab Border */
    --color-border-tab-active: var(--color-text-accent);

    /* Admin Dashboard - General */
    --color-admin-bg-secondary-accent: #272E3F; /* Darker gray-blue, e.g., slate-800 adjusted */
    --color-admin-text-heading-primary: #E0E7FF; /* Light indigo/off-white */

    /* Admin Dashboard - "Open Support Tickets" Card */
    --color-admin-card-warning-bg: #4A2C0D; /* Dark orange/brown */
    --color-admin-card-warning-border: #9A3412; /* orange-700 (lighter in dark mode context) */
    --color-admin-card-warning-text-title: #FED7AA; /* orange-300 */
    --color-admin-card-warning-text-value: #FB923C; /* orange-400 */
    --color-admin-card-warning-text-link: #FDBA74; /* orange-300 */
    --color-admin-card-warning-icon: #FB923C; /* orange-400 */

    /* Admin Dashboard - "Top Links" Table Type Badges */
    --color-admin-badge-landing-bg: #1E3A8A; /* blue-900 */
    --color-admin-badge-landing-text: #BFDBFE; /* blue-200 */
    --color-admin-badge-deeplink-bg: #5B21B6; /* purple-800 */
    --color-admin-badge-deeplink-text: #D8B4FE; /* purple-300 */
    
    /* Admin Dashboard - "Create Lifetime User" Button (Green) */
    --color-admin-button-success-bg: #22C55E; /* green-500 */
    --color-admin-button-success-hover-bg: #16A34A; /* green-600 */
    --color-admin-button-success-text: #F0FDF4; /* green-50 */

    /* Admin Dashboard - Chart Colors */
    --color-admin-chart-primary-background: rgba(167, 139, 250, 0.2); /* violet-400 with alpha */
    --color-admin-chart-primary-border: #A78BFA; /* violet-400 solid */
    --color-admin-chart-primary-point-bg: #A78BFA;

    /* Admin User Detail - Current Plan Card */
    --color-admin-card-accent-primary-bg: #6D28D9; /* violet-700 */
    --color-admin-card-accent-primary-text: #F3F4F6; /* gray-100 */
    --color-admin-card-accent-primary-text-muted: rgba(229, 231, 235, 0.9); /* gray-200 with alpha */
    --color-admin-card-accent-primary-badge-neutral-bg: rgba(255, 255, 255, 0.1); /* Lighter transparent white */
    --color-admin-card-accent-primary-badge-neutral-text: #F3F4F6; /* gray-100 */

    /* Admin User Detail - Send Password Reset Button */
    --color-admin-button-accent-soft-bg: #4C1D95; /* violet-900 */
    --color-admin-button-accent-soft-text: #A78BFA; /* violet-400 */
    --color-admin-button-accent-soft-hover-bg: #5B21B6; /* violet-800 */

    /* Admin Newsletter - Preview Button */
    --color-admin-button-info-bg: #3B82F6; /* blue-500 */
    --color-admin-button-info-hover-bg: #2563EB; /* blue-600 */
    --color-admin-button-info-text: #EFF6FF; /* blue-50 */

    /* Admin Support - Close Inactive Button (Soft Danger) */
    --color-admin-button-danger-soft-bg: #450A0A; /* red-950 */
    --color-admin-button-danger-soft-text: #FCA5A5; /* red-300 */
    --color-admin-button-danger-soft-hover-bg: #7F1D1D; /* red-800 or red-900 */
    --color-admin-button-danger-soft-border: #B91C1C; /* red-700 */

    /* Create Link Page - Phone Frame */
    --color-phone-frame-border: #4B5563; /* gray-600 for dark mode */
    --color-phone-frame-notch: var(--color-phone-frame-border);

    /* Create Link Page - Input Fields Default State - Updated to match original screenshot */
    --color-bg-input-default: #2D3748; /* Dark charcoal gray (e.g., slate-800) */
    --color-border-input-default: #374151; /* Lighter subtle border (e.g., gray-700) */
    --color-text-input-default: #F7FAFC; /* gray-100 */
    --color-text-input-placeholder-default: #A0AEC0; /* gray-500 */
    --color-bg-input-focus: #2D3748; /* Background matches default on focus in dark mode */

    /* Create Link Page - Toggle Switch */
    --color-toggle-slider-off-bg: #6B7280; /* DEPRECATED: gray-500 for dark off */
    /* NEW Toggle Slider Specific Variables - Dark Mode */
    --color-bg-toggle-slider-off-default: #3A3F4B;  /* TRACK OFF: Example color */
    --color-bg-toggle-slider-on-success: #1DB954;   /* TRACK ON SUCCESS: Spotify Green */
    --color-bg-toggle-slider-on-accent: var(--color-bg-accent-primary); /* TRACK ON ACCENT */

    --color-bg-toggle-knob-off-default: #777C88;   /* KNOB OFF: Example color */
    --color-bg-toggle-knob-on-default: #FFFFFF;    /* KNOB ON (all types): white */
    --color-bg-toggle-knob-off-hover: #AAB0BB;    /* KNOB OFF HOVER: Example color */

    /* Custom Properties for Step Indicators (New) - Dark Mode */
    --color-bg-step-indicator-completed-background: #16A34A; /* Tailwind green-600, slightly darker green for dark mode */

    --color-bg-text-label-translucent: rgba(31, 41, 55, 0.75); /* gray-800 (var(--color-bg-secondary) in dark) with 75% opacity for dark mode */

    /* Link Stats Page - Device Icons */
    --color-icon-bg-device-desktop: #164E63; /* cyan-900 */
    --color-icon-text-device-desktop: #67E8F9; /* cyan-300 */
    --color-icon-bg-device-mobile: #701A75; /* fuchsia-900 */
    --color-icon-text-device-mobile: #F0ABFC; /* fuchsia-300 */
    --color-icon-bg-device-tablet: #5B21B6; /* purple-800 */
    --color-icon-text-device-tablet: #C084FC; /* purple-400 */
    --color-icon-bg-device-tv: #312E81; /* indigo-900 */
    --color-icon-text-device-tv: #A5B4FC; /* indigo-300 */
    --color-icon-bg-device-console: #7C2D12; /* orange-900 */
    --color-icon-text-device-console: #FDBA74; /* orange-300 */
    --color-icon-bg-device-bot: #7F1D1D; /* red-800/900 */
    --color-icon-text-device-bot: #FCA5A5; /* red-300 */
    --color-icon-bg-device-unknown: #374151; /* gray-700 */
    --color-icon-text-device-unknown: #D1D5DB; /* gray-300 */

    /* Link Stats Page - Device Progress Bar Fills */
    --color-bg-progress-device-desktop: #22D3EE; /* cyan-400 */
    --color-bg-progress-device-mobile: #E879F9; /* fuchsia-400 */
    --color-bg-progress-device-tablet: #A78BFA; /* purple-400 */
    --color-bg-progress-device-tv: #818CF8; /* indigo-400 */
    --color-bg-progress-device-console: #FB923C; /* orange-400 */
    --color-bg-progress-device-bot: #F87171; /* red-400 */
    --color-bg-progress-device-unknown: #9CA3AF; /* gray-400 */

    /* Link Stats Page - Browser Segmented Bar Fills */
    --color-bg-browser-segment-chrome: #60A5FA; /* blue-400 */
    --color-bg-browser-segment-safari: #22D3EE; /* cyan-400 */
    --color-bg-browser-segment-firefox: #FB923C; /* orange-400 */
    --color-bg-browser-segment-edge: #2DD4BF; /* teal-400 */
    --color-bg-browser-segment-opera: #F87171; /* red-400 */
    --color-bg-browser-segment-samsung: #818CF8; /* indigo-400 */
    --color-bg-browser-segment-duckduckgo: #FCD34D; /* yellow-400 */
    --color-bg-browser-segment-other: #9CA3AF; /* gray-400 */
    --color-bg-browser-segment-defaultunknown: #A78BFA; /* purple-400 */
    
    /* Link Stats Page - Referrer Icons */
    --color-icon-bg-referrer-social: var(--color-icon-bg-device-mobile);
    --color-icon-text-referrer-social: var(--color-icon-text-device-mobile);
    --color-icon-bg-referrer-search: var(--color-icon-bg-device-tablet);
    --color-icon-text-referrer-search: var(--color-icon-text-device-tablet);
    --color-icon-bg-referrer-direct: var(--color-icon-bg-device-desktop);
    --color-icon-text-referrer-direct: var(--color-icon-text-device-desktop);
    --color-icon-bg-referrer-other: var(--color-icon-bg-device-unknown);
    --color-icon-text-referrer-other: var(--color-icon-text-device-unknown);

    /* Link Stats Page - Referrer Progress Bar Fills */
    --color-bg-progress-referrer-social: var(--color-bg-progress-device-mobile);
    --color-bg-progress-referrer-search: var(--color-bg-progress-device-tablet);
    --color-bg-progress-referrer-direct: var(--color-bg-progress-device-desktop);
    --color-bg-progress-referrer-other: var(--color-bg-progress-device-unknown);

    /* ShieldProtectionCard Status Indicators */
    --color-bg-status-clean-indicator: #4ADE80; /* green-400 */
    --color-bg-status-flagged-indicator: #F87171; /* red-400 */

    /* ShieldProtectionCard Progress Bars */
    --color-bg-shield-type-vpn: #E879F9; /* fuchsia-400 */
    --color-bg-shield-type-datacenter: #22D3EE; /* cyan-400 */
    --color-bg-shield-type-bot: #A78BFA; /* purple-400 */

    /* ShieldProtectionCard Radial Chart Strokes */
    --color-stroke-shield-radial-track: #374151; /* Tailwind gray-700 */
    --color-stroke-shield-radial-value: #E879F9; /* Tailwind fuchsia-400 */

    /* Leaderboards Rank Badges - Dark Mode */
    --color-rank-badge-1st-bg: rgba(234, 179, 8, 0.15); /* yellow-500 with opacity */
    --color-rank-badge-1st-text: #FEF08A; /* yellow-200 */
    --color-rank-badge-1st-border: #FACC15; /* yellow-400 */
    --color-rank-badge-2nd-bg: #6B7280; /* gray-500 - Silver */
    --color-rank-badge-2nd-text: #F9FAFB; /* gray-50 */
    --color-rank-badge-3rd-bg: #EA580C; /* orange-600 - Bronze */
    --color-rank-badge-3rd-text: #FFFFFF; /* white */
    --color-rank-badge-other-bg: #4B5563; /* gray-600 - Other ranks */
    --color-rank-badge-other-text: #9CA3AF; /* gray-400 */

    /* Notification Badges */
    --color-notification-badge-bg: #6D28D9; /* Dark mode accent purple - violet-700 */
    --color-notification-badge-text: #FFFFFF; /* White text for good contrast */
    --color-notification-badge-pulse: rgba(109, 40, 217, 0.4); /* Pulse animation color */

    /* Traffic Sources Platform Colors - Dark Mode */
    --color-platform-twitter-bg: #000000;  /* Twitter/X black (same as light mode for consistency) */
    --color-platform-facebook-bg: #1877F2; /* Facebook blue (same) */
    --color-platform-instagram-bg: #E4405F; /* Instagram pink (same) */
    --color-platform-linkedin-bg: #0A66C2; /* LinkedIn blue (same) */
    --color-platform-youtube-bg: #FF0000;  /* YouTube red (same) */
    --color-platform-google-bg: #4285F4;   /* Google blue (same) */
    --color-platform-pinterest-bg: #E60023; /* Pinterest red (brighter for dark) */
    --color-platform-tiktok-bg: #000000;   /* TikTok black (same as light mode for consistency) */
    --color-platform-reddit-bg: #FF4500;   /* Reddit orange (same) */
    --color-platform-whatsapp-bg: #25D366; /* WhatsApp green (same) */
    --color-platform-telegram-bg: #0088CC; /* Telegram blue (same) */
    --color-platform-bing-bg: #00BCF2;     /* Bing blue (same) */
    --color-platform-snapchat-bg: #FFFC00; /* Snapchat yellow (same) */
    --color-platform-discord-bg: #5865F2;  /* Discord blurple (same) */
    --color-platform-duckduckgo-bg: #DE5833; /* DuckDuckGo orange (same) */
    --color-platform-yahoo-bg: #9B59B6;    /* Yahoo purple (brighter for dark) */
    --color-platform-yandex-bg: #FF4444;   /* Yandex red (brighter for dark) */
    --color-platform-baidu-bg: #4169E1;    /* Baidu blue (brighter for dark) */
    --color-platform-gmail-bg: #EA4335;    /* Gmail red (same) */
    --color-platform-outlook-bg: #0078D4;  /* Outlook blue (same) */
    --color-platform-protonmail-bg: #6D4AFF; /* ProtonMail purple (same) */
    --color-platform-direct-bg: #9CA3AF;   /* Direct gray (lighter for dark) */
    --color-platform-other-bg: #A78BFA;    /* Other purple (lighter for dark) */

    /* Traffic Sources Category Colors - Dark Mode */
    --color-category-social-bg: #1877F2;   /* Social blue (Facebook blue) */
    --color-category-search-bg: #4ADE80;   /* Search green (brighter for dark) */
    --color-category-direct-bg: #9CA3AF;   /* Direct gray (lighter for dark) */
    --color-category-email-bg: #FBBF24;    /* Email yellow (brighter for dark) */
    --color-category-other-bg: #A78BFA;    /* Other purple (lighter for dark) */

    /* Social Media Platform Colors - Dark Mode */
    --color-social-instagram: #E1306C;     /* Instagram pink */
    --color-social-tiktok: #FFFFFF;        /* TikTok white (inverted for dark mode) */
    --color-social-twitter: #1DA1F2;       /* Twitter blue */
    --color-social-youtube: #FF0000;       /* YouTube red */
    --color-social-facebook: #1877F2;      /* Facebook blue */
    --color-social-linkedin: #0A66C2;      /* LinkedIn blue */
    --color-social-snapchat: #FFFC00;      /* Snapchat yellow */
    --color-social-telegram: #0088CC;      /* Telegram blue */
    --color-social-discord: #5865F2;       /* Discord blurple */
    --color-social-twitch: #9146FF;        /* Twitch purple */
    --color-social-onlyfans: #00AFF0;      /* OnlyFans blue */
    --color-social-patreon: #FF424D;       /* Patreon red */
    --color-social-spotify: #1DB954;       /* Spotify green */
    --color-social-reddit: #FF4500;        /* Reddit orange */
    --color-social-pinterest: #E60023;     /* Pinterest red (brighter for dark) */
    --color-social-github: #FFFFFF;        /* GitHub white (inverted for dark mode) */
    --color-social-behance: #1769FF;       /* Behance blue */
    --color-social-dribbble: #EA4C89;      /* Dribbble pink */
    --color-social-threads: #FFFFFF;       /* Threads white (inverted for dark mode) */
      --color-social-whatsapp: #25D366;      /* WhatsApp green */
  --color-social-messenger: #006AFF;     /* Messenger blue */
  --color-social-bluesky: #0085FF;       /* Bluesky blue */
  --color-social-generic: #9CA3AF;       /* Generic gray (lighter for dark) */

    /* Onboarding Experience Colors - Dark Mode */
    --color-onboarding-card-bg: #1F2937;                   /* Card backgrounds */
    --color-onboarding-card-border: #374151;               /* Card borders */
    --color-onboarding-card-hover-bg: #374151;             /* Card hover background */
    --color-onboarding-card-hover-border: var(--color-bg-accent-primary); /* Card hover border */
    --color-onboarding-card-selected-bg: #4C1D95;          /* Selected card background */
    --color-onboarding-card-selected-border: var(--color-bg-accent-primary); /* Selected card border */
    --color-onboarding-icon-bg: #374151;                   /* Icon background */
    --color-onboarding-icon-text: #9CA3AF;                 /* Icon color */
    --color-onboarding-icon-selected-bg: var(--color-bg-accent-primary); /* Selected icon background */
    --color-onboarding-icon-selected-text: #FFFFFF;        /* Selected icon color */
    --color-onboarding-step-bg: #374151;                   /* Step indicator background */
    --color-onboarding-step-text: #9CA3AF;                 /* Step indicator text */
    --color-onboarding-step-active-bg: var(--color-bg-accent-primary); /* Active step background */
    --color-onboarding-step-active-text: #FFFFFF;          /* Active step text */
    --color-onboarding-step-completed-bg: #059669;         /* Completed step background */
    --color-onboarding-step-completed-text: #FFFFFF;       /* Completed step text */
    --color-onboarding-gradient-start: var(--color-bg-accent-primary); /* Gradient start */
    --color-onboarding-gradient-end: #5B21B6;              /* Gradient end */
    --color-onboarding-success-bg: #064E3B;                /* Success background */
    --color-onboarding-success-border: #065F46;            /* Success border */
    --color-onboarding-success-text: #6EE7B7;              /* Success text */
    --color-onboarding-preview-frame: #374151;             /* Preview frame background */
    --color-onboarding-preview-border: #4B5563;            /* Preview frame border */

    /* NEW VARIABLES FOR CHARTS & GLOWS (Dark Mode) */
    --color-tooltip-chart-bg: rgba(20, 21, 24, 0.95);
    --color-tooltip-chart-border: rgba(255, 255, 255, 0.08);
    --color-tooltip-chart-text: #F3F4F6;
    
    --color-glow-primary: rgba(167, 139, 250, 0.2);
    --color-glow-link: rgba(244, 113, 113, 0.2);
    --color-glow-location: rgba(56, 189, 248, 0.2);

    --color-chart-grid: #373A40;
    --color-chart-axis-label: #9CA3AF;

  /* KANBAN BOARD - Dark Mode */
  --color-kanban-bg: #0F172A; /* slate-900 - Main board background */
  --color-kanban-column-bg: #1E293B; /* slate-800 - Column background */
  --color-kanban-column-header-bg: #1E293B; /* slate-800 - Column header */
  --color-kanban-column-border: #334155; /* slate-700 - Column border */
  --color-kanban-column-content-bg: rgba(15, 23, 42, 0.28); /* slate-900 with opacity - Column content area */
  --color-kanban-card-bg: #1E293B; /* slate-800 - Card background */
  --color-kanban-card-bg-glass: rgba(30, 41, 59, 0.62); /* glass card background */
  --color-kanban-card-bg-glass-strong: rgba(30, 41, 59, 0.74); /* stronger glass card background (hover/drag) */
  --color-kanban-card-border: #334155; /* slate-700 - Card border */
  --color-kanban-card-hover-border: #A78BFA; /* violet-400 - Card hover border */
  --color-kanban-card-shadow: 0 1px 2px rgba(0, 0, 0, 0.28), 0 14px 34px -22px rgba(167, 139, 250, 0.26); /* depth + subtle brand glow */
  --color-kanban-card-hover-shadow: 0 8px 26px rgba(0, 0, 0, 0.34), 0 26px 56px -36px rgba(167, 139, 250, 0.34); /* hover depth + glow */
  --color-kanban-accent: #A78BFA; /* violet-400 */
  --color-kanban-accent-light: rgba(167, 139, 250, 0.05); /* light accent bg */
  --color-kanban-accent-soft-bg: rgba(167, 139, 250, 0.10); /* soft accent bg (chips, buttons) */
  --color-kanban-accent-soft-bg-hover: rgba(167, 139, 250, 0.16); /* soft accent bg hover */
  --color-kanban-column-bg-glass: rgba(30, 41, 59, 0.66); /* glass column background */
  --color-kanban-column-header-bg-glass: rgba(30, 41, 59, 0.70); /* glass column header background */
  --color-kanban-surface-highlight: rgba(255, 255, 255, 0.08); /* specular highlight */
  --color-kanban-surface-highlight-strong: rgba(255, 255, 255, 0.12); /* stronger specular highlight */
  --color-kanban-surface-border: rgba(167, 139, 250, 0.22); /* accent-tinted glass edge */
  --color-kanban-column-shadow: 0 1px 1px rgba(0, 0, 0, 0.24), 0 18px 48px -34px rgba(167, 139, 250, 0.20);
  --color-kanban-column-hover-shadow: 0 12px 34px rgba(0, 0, 0, 0.30), 0 26px 64px -42px rgba(167, 139, 250, 0.26);
  }

  /* Social Media Manager - SortableJS Styling */
  .social-media-manager .sortable-ghost {
    opacity: 0.5;
    background-color: var(--color-bg-accent-secondary) !important;
    border-color: var(--color-border-focus) !important;
    transform: rotate(2deg);
  }

  .social-media-manager .social-item.sortable-chosen {
    cursor: grabbing !important;
  }

  .social-media-manager .drag-handle:hover {
    cursor: grab;
  }

  .social-media-manager .drag-handle:active {
    cursor: grabbing;
  } 

/* Globe.gl Tooltip Override - Remove default wrapper styling */
.scene-tooltip {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  pointer-events: none !important;
}

.scene-tooltip > div {
  background: transparent !important;
  border: none !important;  
  box-shadow: none !important;
  padding: 0 !important;
}