/* tokens/color.tokens.css */
/* ACCLINK Enterprise Design System v1.0 */
/* Semantic Color Tokens */

:root {
    /* ---------------------------------------------------------------------- */
    /* Foundation Palette (Raw Hexes)                                         */
    /* ---------------------------------------------------------------------- */
    
    /* Neutrals / Grays */
    --gray-50:  #F9FAFB;
    --gray-100: #F3F4F6;
    --gray-200: #E5E7EB;
    --gray-300: #D1D5DB;
    --gray-400: #9CA3AF;
    --gray-500: #6B7280;
    --gray-600: #4B5563;
    --gray-700: #374151;
    --gray-800: #1F2937;
    --gray-900: #111827;
    --gray-950: #030712;

    /* Corporate Accent (ACCLINK Blue) */
    --brand-50:  #EFF6FF;
    --brand-100: #DBEAFE;
    --brand-200: #BFDBFE;
    --brand-300: #93C5FD;
    --brand-400: #60A5FA;
    --brand-500: #3B82F6;
    --brand-600: #2563EB; /* Primary Accent */
    --brand-700: #1D4ED8; /* Hover */
    --brand-800: #1E40AF;
    --brand-900: #1E3A8A;

    /* Functional Colors */
    --blue-50:  #EFF6FF;
    --blue-600: #2563EB;
    
    --amber-50:  #FFFBEB;
    --amber-500: #F59E0B;
    
    --red-50:  #FEF2F2;
    --red-600: #DC2626;
    
    --green-500: #16A34A;
    --green-600: #22C55E;

    /* ---------------------------------------------------------------------- */
    /* Light Theme Semantic Tokens (Default)                                */
    /* ---------------------------------------------------------------------- */
    
    /* Surfaces */
    --color-surface-background: #F8F9FC;
    --color-surface-base:       #FFFFFF;
    --color-surface-elevated:   #FFFFFF;
    --color-surface-floating:   #EEF1F6;
    --color-surface-modal:      #FFFFFF;
    --color-surface-overlay:    #64748b;

    /* Text */
    --color-text-primary:   #0F172A;
    --color-text-secondary: #334155;
    --color-text-muted:     #475569;
    --color-text-inverse:   #FFFFFF;
    --color-text-brand:     var(--brand-700);

    /* Borders */
    --color-border-subtle:   #E5E7EB;
    --color-border-default:  #D1D5DB;
    --color-border-strong:   #D1D5DB;
    --color-border-focus:    #1D4ED8;

    /* Actions / Buttons */
    --color-action-primary-default: #1D4ED8;
    --color-action-primary-hover:   #1E40AF;
    --color-action-primary-active:  #1E3A8A;
    --color-action-primary-text:    #FFFFFF;

    --color-action-secondary-default: #FFFFFF;
    --color-action-secondary-hover:   #F9FAFB;
    --color-action-secondary-active:  #F3F4F6;
    --color-action-secondary-border:  #D1D5DB;
    --color-action-secondary-text:    #0F172A;

    --color-action-danger-default: var(--red-600);
    --color-action-danger-text:    #FFFFFF;

    --color-action-disabled-bg:   #F3F4F6;
    --color-action-disabled-text: #6B7280;

    /* Feedback / Status */
    --color-status-success-bg:     #DCFCE7;
    --color-status-success-text:   #15803D;
    
    --color-status-warning-bg:     #FEF3C7;
    --color-status-warning-text:   #B45309;
    
    --color-status-danger-bg:      #FEE2E2;
    --color-status-danger-text:    #B91C1C;
    
    --color-status-info-bg:        #DBEAFE;
    --color-status-info-text:      #1D4ED8;
    
    --color-status-neutral-bg:     #F3F4F6;
    --color-status-neutral-text:   #6B7280;

    /* ---------------------------------------------------------------------- */
    /* Infrastructure & Network Semantic Tokens                             */
    /* ---------------------------------------------------------------------- */
    --color-network-online:      #22C55E;
    --color-network-offline:     #EF4444;
    --color-network-warning:     #F59E0B;
    --color-network-maintenance: #6366F1;
    --color-network-unknown:     #64748B;

    --color-device-olt:          #2563EB;
    --color-device-pon:          #0891B2;
    --color-device-splitter:     #4F46E5;
    --color-device-router:       #7C3AED;
    --color-device-switch:       #475569;
    --color-device-backbone:     #1D4ED8;

    --color-client-active:       #16A34A;
    --color-client-suspended:    #F59E0B;
    --color-client-cut:          #DC2626;
    --color-client-new:          #06B6D4;
}

/* ---------------------------------------------------------------------- */
/* Opacity/Alpha Tokens                                                   */
/* ---------------------------------------------------------------------- */
:root {
    --opacity-subtle:   0.05;
    --opacity-light:    0.08;
    --opacity-medium:   0.15;
    --opacity-strong:   0.25;
    --opacity-denser:   0.4;
    --opacity-heavy:    0.6;
    --opacity-near:     0.8;
    --opacity-full:     1;
}

/* Dark Theme Overrides */
[data-theme="dark"] {
    /* Surfaces */
    --color-surface-background: #0F172A; 
    --color-surface-base:       #1E293B; 
    --color-surface-elevated:   #243044;
    --color-surface-floating:   #334155; 
    --color-surface-modal:      #1E293B; 
    --color-surface-overlay:    #020617;

    /* Text */
    --color-text-primary:   #F1F5F9;
    --color-text-secondary: #CBD5E1;
    --color-text-muted:     #94A3B8;
    --color-text-inverse:   #0F172A;
    --color-text-brand:     #3B82F6;

    /* Borders */
    --color-border-subtle:   #243044;
    --color-border-default:  #334155;
    --color-border-strong:   #475569;
    --color-border-focus:    #3B82F6;

    /* Actions */
    --color-action-primary-default: #3B82F6;
    --color-action-primary-hover:   #60A5FA;
    --color-action-primary-active:  #2563EB;
    --color-action-primary-text:    #0F172A;
    
    --color-action-secondary-default: #1E293B;
    --color-action-secondary-hover:   #334155;
    --color-action-secondary-active:  #475569;
    --color-action-secondary-border:  #334155;
    --color-action-secondary-text:    #F1F5F9;

    --color-action-disabled-bg:   #1A2438;
    --color-action-disabled-text: #94A3B8;

    /* Feedback / Status — solid backgrounds (no rgba) */
    --color-status-success-bg:     #14532D;
    --color-status-success-text:   #4ADE80;
    
    --color-status-warning-bg:     #78350F;
    --color-status-warning-text:   #FBBF24;
    
    --color-status-danger-bg:      #7F1D1D;
    --color-status-danger-text:    #F87171;
    
    --color-status-info-bg:        #1E3A5F;
    --color-status-info-text:      #60A5FA;
    
    --color-status-neutral-bg:     #1A2438;
    --color-status-neutral-text:   #94A3B8;
}