/**
 * Shared - Base Styles & Utilities
 *
 * @package AskCollab Brand Dashboard
 * @version 1.1.2
 */

/* ========================================
   M3 Design System Variables (Global)
   ======================================== */
:root {
  --m3-navy: #001d35;
  --m3-emerald: #00875a;
  --m3-gold: #b45309;
  --m3-red: #b91c1c;
  --m3-secondary: #535f70;
  --m3-surface: #f1f4f9;
  --m3-white: #ffffff;
  --m3-border: #c4c6d0;
  --m3-dashed: #8c939d;
  
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 16px;
  --radius-sm: 8px;
  
  --font-human: 'Plus Jakarta Sans', sans-serif;
  --font-machine: 'IBM Plex Mono', monospace;
  
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;
}

/* Global Container */
.abd-container {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--space-md);
  box-sizing: border-box;
}

/* Base Body Styles (Only applies to plugin scope) */
.abd-dashboard-layout {
  font-family: var(--font-human);
  color: var(--m3-navy);
  background: var(--m3-surface);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Typography Helpers */
.abd-mono { font-family: var(--font-machine); letter-spacing: -0.02em; }
.abd-human { font-family: var(--font-human); }
.abd-text-sm { font-size: 0.875rem; }
.abd-text-xs { font-size: 0.75rem; }
.abd-text-muted { color: var(--m3-secondary); }

/* Animations */
@keyframes abd-fade-in {
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: translateY(0); }
}

/* Utilities */
.abd-hidden { display: none !important; }
.abd-visible { display: block !important; }