/* ROC-P Directory - CSS Variables */
/* Default colors are defined here. These can be overridden via Plugin Settings. */
/* When users change colors in Settings > Plugin Settings, those values will override these defaults. */

/**
 * CSS Variables
 * 
 * Global CSS variables for colors, spacing, and styling.
 * These can be overridden by theme or plugin settings.
 * 
 * @package ROC-P-Directory
 * @since 1.0.0
 */

:root {
    /* Primary Brand Color - Theme Purple */
    --roc-primary: #6C4086;
    --roc-primary-hover: #5A2D74;
    
    /* Button Colors - Use Primary Purple */
    --roc-btn-primary: #6C4086;
    --roc-btn-primary-hover: #5A2D74;
    
    /* Secondary and Tertiary Colors */
    --roc-secondary: #FBF6E3;
    --roc-tertiary: #E1BA43;
    
    /* Text Colors */
    --roc-text-dark: #333;
    --roc-text-medium: #666;
    --roc-title: #6C4086;
    
    /* Background Colors */
    --roc-bg-footer: #FBF6E3;
    --roc-bg-form: #EDEEF2;
    --roc-bg-white: #fff;
    --roc-bg-light: #EDEEF2;
    --roc-bg-light-gray: #e9ecef;
    
    /* Border Colors */
    --roc-border-dark: #666;
    --roc-border-light: #CCCCCC;
    --roc-border-light-gray: #e9ecef;
    
    /* Status Colors */
    --roc-error: #dc3545;
    --roc-error-bg: #fee;
    --roc-error-border: #fcc;
    --roc-error-text: #c33;
    
    /* Transitions */
    --transition: all 0.3s ease;
    
    /* Font Family - Sans Serif */
    --body: sans-serif;
}

/* Global font-family for entire plugin - applies to all elements */
.roc-p-directory-container,
.roc-p-directory-container * {
    font-family: var(--body);
}