/* Scalar API Reference Custom Styles */
/* Match your brand colors and styling preferences - similar to Swagger UI */

/* Scalar uses CSS custom properties (CSS variables) for theming */
/* These variables can be set on the scalar-api-reference element */
scalar-api-reference {
    /* Primary brand color - matches Swagger topbar (#4267B2) */
    --scalar-color-1: #4267B2;
    --scalar-color-2: #2196F3;
    --scalar-color-3: #667eea;
    --scalar-color-accent: #764ba2;
    
    /* You can customize other Scalar CSS variables as needed */
    /* Common variables include: */
    /* --scalar-color-text: #333; */
    /* --scalar-color-text-2: #666; */
    /* --scalar-color-bg: #fff; */
    /* --scalar-color-bg-2: #f5f5f5; */
    /* --scalar-border-color: #e0e0e0; */
}

/* Global body/page styling */
body {
    /* Add any global styles that affect the page around Scalar */
}

/* Note: Scalar uses Shadow DOM, so direct CSS targeting of internal elements is limited */
/* For deeper customization, use the custom JavaScript file to manipulate the DOM */
/* or use Scalar's built-in theme options via configuration */