/**
 * CSS Custom Properties (Variables)
 * Universe Moodle Theme - Tam Renk Paleti
 *
 * @package AycaHanim
 */

:root {
    /* ============== ANA RENK SİSTEMİ ============== */
    --main-theme-color: #4f5ccc;

    /* Ana renk gradyanları (açıktan koyuya) */
    --primary-color-100: #edeffa;
    --primary-color-200: #dcdef5;
    --primary-color-300: #cacef0;
    --primary-color-400: #a7aee6;
    --primary-color-500: #727dd6;
    --primary-color-600: #4f5ccc;
    --primary-color-700: #2c3472;
    --primary-color-800: #24295c;
    --primary-color-900: #181c3d;

    /* ============== BOOTSTRAP OVERRIDE ============== */
    --blue: #406CD2;
    --purple: #D0C6F0;
    --red: #ef1010;
    --orange: #4c2101;
    --yellow: #F7B742;
    --green: #027654;
    --white: #fff;
    --gray: #757474;
    --gray-dark: #434343;

    /* Bootstrap semantic colors */
    --primary: #4f5ccc;
    --secondary: #757474;
    --success: #027654;
    --info: #406CD2;
    --warning: #F7B742;
    --danger: #ef1010;
    --light: #F5F5F5;
    --dark: #212121;

    /* ============== GRI TONLARI (8 seviye) ============== */
    --gray-100: #F5F5F5;
    --gray-200: #EEEEEE;
    --gray-300: #E1E1E1;
    --gray-400: #D8D8D8;
    --gray-500: #B7B7B7;
    --gray-600: #757474;
    --gray-700: #6B6B6B;
    --gray-800: #434343;
    --gray-900: #212121;

    /* ============== TOPBAR ============== */
    --topbar-color: #cacef0;
    --topbar-color-2: #fff;
    --dm-topbar-color: #0d0d0f;
    --dm-topbar-color-2: #0d0d0f;
    --topbar-btn-text: #212121;
    --topbar-btn-hover: #fff;
    --topbar-btn-hover-text: #4f5ccc;
    --dm-topbar-btn-text: #b3b3b6;
    --dm-topbar-btn-hover: #202025;
    --dm-topbar-btn-hover-text: #797980;
    --topbar-height: 60px;

    /* ============== FOOTER ============== */
    --footer-color: #181c3d;
    --footer-text-color: #edeffa;

    /* ============== BUTONLAR ============== */
    --btn-primary-color-bg: #4f5ccc;
    --btn-primary-color-text: #fff;
    --btn-primary-color-bg-hover: #727dd6;
    --btn-primary-color-bg-hover-text: #fff;
    --btn-secondary-color-bg: #F5F5F5;
    --btn-secondary-color-text: #434343;
    --btn-secondary-color-bg-hover: #EEEEEE;
    --btn-secondary-color-bg-hover-text: #434343;

    /* ============== INPUT'LAR ============== */
    --input-bg: #fff;
    --input-border-color: var(--gray-300);
    --input-focus-border-color: var(--main-theme-color);
    --input-focus-shadow: rgba(79, 92, 204, 0.25);

    /* ============== KART ============== */
    --card-bg: #fff;
    --card-border-radius: 20px;
    --card-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
    --card-hover-shadow: 0 .25rem .75rem rgba(11, 11, 11, 0.1);

    /* ============== BODY ============== */
    --body-bg: #F5F5F5;
    --body-color: #3f4259;
    --text-color: #212121;
    --text-color-secondary: #757474;
    --text-secondary: #757474;
    --text-muted: #B7B7B7;
    --border-color: #E1E1E1;

    /* ============== TEMA YARDIMCI ============== */
    --main-theme-bg: rgba(79, 92, 204, 0.08);
    --main-theme-dark: #2c3472;
    --main-theme-color-darken: #2c3472;
    --main-theme-color-hover: #727dd6;
    --main-theme-color-light: #eef0ff;

    /* ============== RUI (Universe Theme) UYUMLULUK ============== */
    --rui-body-bg: #F5F5F5;
    --rui-body-color: #212121;
    --rui-body-color-secondary: #757474;
    --rui-border-color: #E1E1E1;
    --rui-card-bg: #fff;

    /* ============== DURUM RENKLERİ ============== */
    --success-bg: rgba(2, 118, 84, 0.1);
    --success-color: #027654;
    --success-color-light: #e6f5ef;
    --warning-bg: rgba(247, 183, 66, 0.1);
    --info-light: rgba(64, 108, 210, 0.1);
    --text-primary: #4f5ccc;
    --bg-dark: #212121;
    --bg-secondary: #757474;
    --gray-50: #FAFAFA;
    --card-bg-dark: #1c1c1f;
    --dark-color: #212121;
    --dark-bg: #131316;
    --dark-card-bg: #1c1c1f;
    --dark-text-color: #e4e4e7;
    --dark-text-secondary: #a1a1aa;
    --dark-border-color: #27272a;
    --dark-input-bg: #27272a;

    /* ============== FONT SİZE SKALASI ============== */
    --text-xs: 0.65rem;
    --text-sm: 0.75rem;
    --text-base: 0.875rem;
    --text-md: 0.8125rem;
    --text-lg: 1rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 2rem;
    --text-hero: 2.5rem;
    --text-hero-md: 1.875rem;
    --text-hero-sm: 1.25rem;

    /* ============== BORDER RADIUS ============== */
    --radius-xs: 4px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 40px;
    --radius-pill: 40px;

    /* ============== SPACING ============== */
    --section-padding: 60px;
    --section-padding-mobile: 30px;
    --card-gap: 40px;
    --card-gap-mobile: 10px;

    /* ============== SHADOWS ============== */
    --shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, 0.075);
    --shadow-md: 0 .25rem .75rem rgba(11, 11, 11, 0.1);
    --shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);

    /* ============== TRANSITION ============== */
    --transition-fast: 0.15s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.35s ease-in-out;

    /* ============== Z-INDEX ============== */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-offcanvas-backdrop: 1040;
    --z-offcanvas: 1045;
    --z-modal-backdrop: 1050;
    --z-modal: 1055;
    --z-popover: 1070;
    --z-tooltip: 1080;
    --z-topbar: 1230;

    /* ============== BREAKPOINTS ============== */
    --breakpoint-sm: 320px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1100px;
    --breakpoint-xl: 1300px;
    --breakpoint-xxl: 1900px;

    /* ============== CONTAINER ============== */
    --container-max-width: 1300px;
    --container-padding: 15px;
}