/** @format */

:root {
    /* ── Nav / Header colours ────────────────────────────────────────────── */
    --rpp-main-background-colour: #0e1633;
    --rpp-main-text-colour: #e1b540; /* ── Nav / Header colours ────────────────────────────────────────────── */
    --Report-Menu-Background: #e7e7e7;
    --rpp-color-on-primary: #000000;

    /* ── Table header colours ────────────────────────────────────────────── */
    --rpp-table-col-primary: #577399; /* dark key columns   */
    --rpp-table-col-secondary: #495867; /* standard columns   */
    --rpp-table-border: #000000;

    /* ── Layout dimensions ───────────────────────────────────────────────── */
    --rpp-nav-height: 80px;
    --rpp-header-height: 150px;
    --rpp-header-inner-margin: 10px;
    --rpp-logo-height: 120px;
    --rpp-error-max-width: 520px;

    /* ── Z-index layers ─────────────────────────────────────────────────── */
    --rpp-z-nav: 100;
    --rpp-z-loader: 99999;

    /* ── Font sizes ─────────────────────────────────────────────────────── */
    --rpp-font-section-label: 16px;
    --rpp-font-loading: 34px;
    --rpp-font-error-icon: 48px;
    --rpp-font-error-text: 22px;
    --rpp-font-recognitionscoring: 16px;
    --rpp-font-paragraph: 14px;

    /* ── Spacing ──────────────────────────────────────────────────────── */
    --rpp-spacing-sm: 5px;

    --rpp-spacing-md: 16px;
    --rpp-panel-padding-x: 1rem;

    /* ── Misc ─────────────────────────────────────────────────────────── */
    --rpp-line-height-body: 1.6;

    /* ── Recognition key colours ────────────────────────────────────────── */
    --rpp-recognition-medal-bg: #00b050;
    --rpp-recognition-medal-color: #ffffff;
    --rpp-recognition-yellowcard-bg: #ffff00;
    --rpp-recognition-yellowcard-color: #000000;
    --rpp-recognition-training-bg: #073763;
    --rpp-recognition-training-color: #ffffff;
    --rpp-recognition-values-bg: #ffffff;
    --rpp-recognition-values-color: #000000;
    --rpp-recognition-values-border: #000000;

    /*---bit of space */
    --rpp-margin-top: 10px;
    --rpp-padding-small: 5px;

    /* ── Performance band colours ───────────────────────────────────────── */
    --rpp-band-high-bg: #00b050; /* green  — 70 and above   */
    --rpp-band-high-color: #ffffff;
    --rpp-band-mid-bg: #ff9900; /* orange — 50 to 69       */
    --rpp-band-mid-color: #ffffff;
    --rpp-band-low-bg: #cc0000; /* red    — below 50       */
    --rpp-band-low-color: #ffffff;

    /* ── Elements ───────────────────────────────────────── */
    --Elements_default-bg: #ffffff;

    /* ═══════════════════════════════════════════════════════════════════
     * Bootstrap-Style Color Scale
     * ═══════════════════════════════════════════════════════════════════
     * Based on Bootstrap 5 color system for consistent theming
     */

    /* ── Theme Colors ────────────────────────────────────────────────── */
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-danger: #dc3545;
    --bs-warning: #ffc107;
    --bs-info: #0dcaf0;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;

    /* ── Gray Scale ──────────────────────────────────────────────────── */
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;

    /* ── Color Shades (Lighter/Darker Variations) ────────────────────── */
    /* Primary variations */
    --bs-primary-light: #6ea8fe;
    --bs-primary-dark: #0a58ca;

    /* Secondary variations */
    --bs-secondary-light: #a7acb1;
    --bs-secondary-dark: #565e64;

    /* Success variations */
    --bs-success-light: #75b798;
    --bs-success-dark: #146c43;

    /* Danger variations */
    --bs-danger-light: #ea868f;
    --bs-danger-dark: #b02a37;

    /* Warning variations */
    --bs-warning-light: #ffda6a;
    --bs-warning-dark: #cc9a06;

    /* Info variations */
    --bs-info-light: #6edff6;
    --bs-info-dark: #087990;

    /* ── Semantic Colors ─────────────────────────────────────────────── */
    --bs-white: #ffffff;
    --bs-black: #000000;
    --bs-body-color: #212529;
    --bs-body-bg: #ffffff;
    --bs-border-color: #dee2e6;
    --bs-link-color: #0d6efd;
    --bs-link-hover-color: #0a58ca;

    /* ═══════════════════════════════════════════════════════════════════
     * Leaderboard Achievement Colors
     * ═══════════════════════════════════════════════════════════════════
     * Colors for medals, achievements, and recognition tiers
     */

    /* ── Achievement Tiers ───────────────────────────────────────────── */
    --rpp-gold: #ffbe00;
    --rpp-silver: #d9d9d9;
    --rpp-bronze: #aca46c;
    --rpp-developer: #ffb9b9;

    --Min_Width_For_Table_Cell: 80px;
}