/**
 * Entity Selector Variables
 * Bootstrap 4 compatible values for PrestaShop admin theme
 *
 * Imports shared variables from prestashop-admin package
 * and maps them to $es-* prefixed aliases for this package
 */

// Import shared variables from prestashop-admin
@use '../../../prestashop-admin/assets/scss/variables' as admin;

// =============================================================================
// Base Colors
// =============================================================================

$es-white: #ffffff !default;
$es-black: #000000 !default;

// Primary (from prestashop-admin)
$es-primary: admin.$primary !default;
$es-primary-hover: #1a9ab7 !default;
$es-primary-light: rgba(37, 185, 215, 0.1) !default;

// Semantic colors (from prestashop-admin)
$es-success: admin.$success !default;
$es-success-light: #d4edda !default;
$es-success-dark: #1e7e34 !default;

$es-danger: admin.$danger !default;
$es-danger-light: #f8d7da !default;
$es-danger-dark: #bd2130 !default;

$es-warning: admin.$warning !default;
$es-warning-light: #fff3cd !default;

$es-info: admin.$info !default;
$es-info-light: #d1ecf1 !default;

// =============================================================================
// Gray Scale (Bootstrap 4)
// =============================================================================

$es-gray-100: admin.$light !default;
$es-gray-200: #e9ecef !default;
$es-gray-300: admin.$border-color !default;
$es-gray-400: #ced4da !default;
$es-gray-500: #adb5bd !default;
$es-gray-600: admin.$secondary !default;
$es-gray-700: #495057 !default;
$es-gray-800: admin.$dark !default;
$es-gray-900: #212529 !default;

// Slate (subtle variations)
$es-slate-50: #f8fafc !default;
$es-slate-100: #f1f5f9 !default;
$es-slate-200: #e2e8f0 !default;
$es-slate-300: #cbd5e1 !default;
$es-slate-400: #94a3b8 !default;
$es-slate-500: #64748b !default;
$es-slate-600: #475569 !default;
$es-slate-700: #334155 !default;
$es-slate-800: #1e293b !default;
$es-slate-900: #0f172a !default;

// Cyan
$es-cyan-50: #ecfeff !default;
$es-cyan-100: #cffafe !default;
$es-cyan-200: #a5f3fc !default;
$es-cyan-500: #06b6d4 !default;
$es-cyan-600: #0891b2 !default;
$es-cyan-700: #0e7490 !default;

// =============================================================================
// Semantic Aliases
// =============================================================================

$es-bg-header: $es-gray-100 !default;
$es-bg-hover: $es-gray-200 !default;
$es-bg-active: $es-gray-200 !default;
$es-bg-body: $es-white !default;

$es-border-color: admin.$border-color !default;
$es-border-light: $es-gray-200 !default;
$es-border-dark: $es-gray-400 !default;

$es-text-primary: $es-gray-900 !default;
$es-text-secondary: $es-gray-700 !default;
$es-text-muted: $es-gray-600 !default;
$es-text-light: $es-gray-500 !default;

// =============================================================================
// Spacing (Bootstrap 4 compatible, derived from admin.$spacer)
// =============================================================================

$es-spacing-xs: admin.$spacer * 0.25 !default;  // 4px
$es-spacing-sm: admin.$spacer * 0.5 !default;   // 8px
$es-spacing-md: admin.$spacer !default;         // 16px
$es-spacing-lg: admin.$spacer * 1.5 !default;   // 24px
$es-spacing-xl: admin.$spacer * 2 !default;     // 32px

// =============================================================================
// Border Radius (from prestashop-admin)
// =============================================================================

$es-radius-sm: admin.$border-radius-sm !default;
$es-radius-md: admin.$border-radius !default;
$es-radius-lg: admin.$border-radius-lg !default;
$es-radius-xl: 0.5rem !default;
$es-radius-full: 50rem !default;

// =============================================================================
// Box Shadows (Bootstrap 4 compatible)
// =============================================================================

$es-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !default;
$es-shadow-md: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !default;
$es-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175) !default;
$es-shadow-xl: 0 1.5rem 4rem rgba(0, 0, 0, 0.2) !default;

// =============================================================================
// Transitions
// =============================================================================

$es-transition-fast: 0.15s ease-in-out !default;
$es-transition-normal: 0.2s ease-in-out !default;
$es-transition-slow: 0.3s ease-in-out !default;

// =============================================================================
// Z-Index (below Bootstrap modal)
// =============================================================================

$es-z-dropdown: 1000 !default;
$es-z-modal: 1050 !default;
$es-z-popover: 1060 !default;
$es-z-tooltip: 1070 !default;

// =============================================================================
// Typography
// =============================================================================

$es-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !default;

$es-font-size-xs: 0.75rem !default;   // 12px
$es-font-size-sm: 0.875rem !default;  // 14px
$es-font-size-base: 1rem !default;    // 16px
$es-font-size-lg: 1.125rem !default;  // 18px

$es-font-weight-normal: 400 !default;
$es-font-weight-medium: 500 !default;
$es-font-weight-semibold: 600 !default;
$es-font-weight-bold: 700 !default;

$es-line-height-tight: 1.25 !default;
$es-line-height-normal: 1.5 !default;