/* ==========================================================================
   TASKFLOW THEME CORE CONFIGURATIONS
   Change these variables to apply fonts, colors, and layout shapes globally!
   ========================================================================== */

/* 1. Central Font Imports (Default: Poppins) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root {
    /* 2. Global Font Family Configuration (Single Source of Truth) */
    --font-family-base: 'Poppins', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --bs-body-font-family: var(--font-family-base);

    /* 3. Theme Color Palette Configuration (Black-based midnight slate) */
    --primary-color: #0c1427;       /* Primary Solid Brand Black */
    --primary-light: #f1f5f9;       /* Light border / hover highlight slate */
    --theme-color: var(--primary-color); /* Central Theme Color */
    
    /* 4. Global Typography & Colors */
    --bg-color: #fafbfc;            /* Sleek off-white Jira workspace background */
    --text-dark: #0f172a;           /* Dark Slate Text */
    --text-muted: #64748b;          /* Light Slate Secondary Text */
    
    /* 5. Centralized Border Shapes & Shadows */
    --card-radius: 12px;            /* Clean corporate tight border radius */
    --btn-radius: 8px;              /* Button corner radius */
    --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.02), 0 1px 2px rgba(0, 0, 0, 0.01);
}

/* ==========================================================================
   Coloris Color Picker Custom Overrides
   ========================================================================== */
.clr-field {
    display: block !important;
    width: 100%;
    position: relative;
}
.clr-field button {
    border-radius: 6px !important;
    width: 22px !important;
    height: 22px !important;
    left: 10px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
}
.clr-field input, .coloris-input {
    padding-left: 48px !important;
    font-family: var(--bs-font-monospace, monospace);
    font-size: 0.88rem !important;
    border-radius: 8px !important;
    background-color: #ffffff !important;
}

#clr-picker {
    z-index: 200000 !important;
}