/* TTI YAZILIM - BİRLEŞİK DİNAMİK TEMA CSS */ /* ============================================ GLOBAL CSS VARIABLES - DİNAMİK TANIMLAMALAR ============================================ */ :root { /* Ana Renkler */ --primary: #3f8f8b; --main: #2b2e2e; --secondary: #2e5f5d; --secondary-2: #6b7474; --white: #ffffff; --surface: #f6f8f8; --critical: #d64545; --warning: #f2a900; --success: #2fa86f; --yellow: #ffc83d; --line: #e0e5e5; --pink: #f06292; --blue: #2f80ed; --orange: #ff7a00; /* Shadow & Effects */ --shadow1: 0px 10px 25px 0px rgba(43, 52, 74, 0.12); --shadow2: 0px 5px 18px 5px rgba(64, 72, 87, 0.15); --card-shadow: 0 4px 20px rgba(0, 0, 0, 0.06); --card-hover: 0 8px 30px rgba(0, 0, 0, 0.12); /* Primary RGBA & Türevler */ --rgba-primary: rgba(63, 143, 139, 0.1); --primary-light: #72c2be; --primary-dark: #0c5c58; --primary-alpha-5: rgba(63, 143, 139, 0.05); --primary-alpha-8: rgba(63, 143, 139, 0.08); --primary-alpha-10: rgba(63, 143, 139, 0.1); --primary-alpha-12: rgba(63, 143, 139, 0.12); --primary-alpha-15: rgba(63, 143, 139, 0.15); --primary-alpha-20: rgba(63, 143, 139, 0.2); --primary-alpha-30: rgba(63, 143, 139, 0.3); --primary-alpha-40: rgba(63, 143, 139, 0.4); /* Main RGBA & Türevler */ --main-light: #5e6161; --main-dark: #000000; --main-alpha-5: rgba(43, 46, 46, 0.05); --main-alpha-8: rgba(43, 46, 46, 0.08); --main-alpha-10: rgba(43, 46, 46, 0.1); --main-alpha-15: rgba(43, 46, 46, 0.15); --main-alpha-20: rgba(43, 46, 46, 0.2); --main-alpha-30: rgba(43, 46, 46, 0.3); --main-alpha-40: rgba(43, 46, 46, 0.4); /* Secondary RGBA & Türevler */ --secondary-light: #619290; --secondary-dark: #002c2a; --secondary-alpha-5: rgba(46, 95, 93, 0.05); --secondary-alpha-8: rgba(46, 95, 93, 0.08); --secondary-alpha-10: rgba(46, 95, 93, 0.1); --secondary-alpha-15: rgba(46, 95, 93, 0.15); --secondary-alpha-20: rgba(46, 95, 93, 0.2); --secondary-alpha-30: rgba(46, 95, 93, 0.3); --secondary-alpha-40: rgba(46, 95, 93, 0.4); /* Success RGBA & Türevler */ --success-light: #62dba2; --success-dark: #00753c; --success-alpha-4: rgba(47, 168, 111, 0.04); --success-alpha-5: rgba(47, 168, 111, 0.05); --success-alpha-8: rgba(47, 168, 111, 0.08); --success-alpha-10: rgba(47, 168, 111, 0.1); --success-alpha-12: rgba(47, 168, 111, 0.12); --success-alpha-15: rgba(47, 168, 111, 0.15); --success-alpha-20: rgba(47, 168, 111, 0.2); --success-alpha-25: rgba(47, 168, 111, 0.25); --success-alpha-30: rgba(47, 168, 111, 0.3); --success-alpha-40: rgba(47, 168, 111, 0.4); /* Critical RGBA & Türevler */ --critical-light: #ff7878; --critical-dark: #a31212; --critical-alpha-5: rgba(214, 69, 69, 0.05); --critical-alpha-8: rgba(214, 69, 69, 0.08); --critical-alpha-10: rgba(214, 69, 69, 0.1); --critical-alpha-12: rgba(214, 69, 69, 0.12); --critical-alpha-15: rgba(214, 69, 69, 0.15); --critical-alpha-20: rgba(214, 69, 69, 0.2); --critical-alpha-30: rgba(214, 69, 69, 0.3); --critical-alpha-40: rgba(214, 69, 69, 0.4); /* Warning RGBA & Türevler */ --warning-light: #ffdc33; --warning-dark: #bf7600; --warning-alpha-5: rgba(242, 169, 0, 0.05); --warning-alpha-8: rgba(242, 169, 0, 0.08); --warning-alpha-10: rgba(242, 169, 0, 0.1); --warning-alpha-12: rgba(242, 169, 0, 0.12); --warning-alpha-15: rgba(242, 169, 0, 0.15); --warning-alpha-20: rgba(242, 169, 0, 0.2); --warning-alpha-30: rgba(242, 169, 0, 0.3); --warning-alpha-40: rgba(242, 169, 0, 0.4); /* Yellow RGBA & Türevler */ --yellow-light: #fffb70; --yellow-dark: #cc950a; --yellow-alpha-5: rgba(255, 200, 61, 0.05); --yellow-alpha-8: rgba(255, 200, 61, 0.08); --yellow-alpha-10: rgba(255, 200, 61, 0.1); --yellow-alpha-12: rgba(255, 200, 61, 0.12); --yellow-alpha-15: rgba(255, 200, 61, 0.15); --yellow-alpha-20: rgba(255, 200, 61, 0.2); --yellow-alpha-30: rgba(255, 200, 61, 0.3); --yellow-alpha-40: rgba(255, 200, 61, 0.4); /* Orange RGBA & Türevler */ --orange-light: #ffad33; --orange-dark: #cc4700; --orange-alpha-5: rgba(255, 122, 0, 0.05); --orange-alpha-8: rgba(255, 122, 0, 0.08); --orange-alpha-10: rgba(255, 122, 0, 0.1); --orange-alpha-12: rgba(255, 122, 0, 0.12); --orange-alpha-15: rgba(255, 122, 0, 0.15); --orange-alpha-20: rgba(255, 122, 0, 0.2); --orange-alpha-30: rgba(255, 122, 0, 0.3); --orange-alpha-40: rgba(255, 122, 0, 0.4); /* Pink RGBA & Türevler */ --pink-light: #ff95c5; --pink-dark: #bd2f5f; --pink-alpha-5: rgba(240, 98, 146, 0.05); --pink-alpha-8: rgba(240, 98, 146, 0.08); --pink-alpha-10: rgba(240, 98, 146, 0.1); --pink-alpha-12: rgba(240, 98, 146, 0.12); --pink-alpha-15: rgba(240, 98, 146, 0.15); --pink-alpha-20: rgba(240, 98, 146, 0.2); --pink-alpha-30: rgba(240, 98, 146, 0.3); --pink-alpha-40: rgba(240, 98, 146, 0.4); /* Blue RGBA & Türevler */ --blue-light: #62b3ff; --blue-dark: #004dba; --blue-alpha-5: rgba(47, 128, 237, 0.05); --blue-alpha-8: rgba(47, 128, 237, 0.08); --blue-alpha-10: rgba(47, 128, 237, 0.1); --blue-alpha-12: rgba(47, 128, 237, 0.12); --blue-alpha-15: rgba(47, 128, 237, 0.15); --blue-alpha-20: rgba(47, 128, 237, 0.2); --blue-alpha-30: rgba(47, 128, 237, 0.3); --blue-alpha-40: rgba(47, 128, 237, 0.4); /* Line RGBA & Türevler */ --line-light: #ffffff; --line-dark: #adb2b2; --line-alpha-5: rgba(224, 229, 229, 0.05); --line-alpha-8: rgba(224, 229, 229, 0.08); --line-alpha-10: rgba(224, 229, 229, 0.1); --line-alpha-15: rgba(224, 229, 229, 0.15); --line-alpha-20: rgba(224, 229, 229, 0.2); --line-alpha-30: rgba(224, 229, 229, 0.3); /* Surface RGBA & Türevler */ --surface-light: #ffffff; --surface-dark: #e9ebeb; --surface-alpha-5: rgba(246, 248, 248, 0.05); --surface-alpha-8: rgba(246, 248, 248, 0.08); --surface-alpha-10: rgba(246, 248, 248, 0.1); --surface-alpha-20: rgba(246, 248, 248, 0.2); --surface-alpha-30: rgba(246, 248, 248, 0.3); /* Gri Tonları */ --gray-light: #f8f8f8; --gray: #d0d0d0; --gray-dark: #999; --text-light: #619290; --bg-light: #ffffff; /* Gradyanlar */ --gradient-primary: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%); --gradient-success: linear-gradient(135deg, var(--success) 0%, var(--success-dark) 100%); --gradient-warning: linear-gradient(135deg, var(--warning) 0%, var(--warning-dark) 100%); --gradient-critical: linear-gradient(135deg, var(--critical) 0%, var(--critical-dark) 100%); --gradient-info: linear-gradient(135deg, var(--blue) 0%, var(--blue-light) 100%); --gradient-orange: linear-gradient(135deg, var(--orange) 0%, var(--orange-dark) 100%); --gradient-yellow: linear-gradient(135deg, var(--yellow) 0%, var(--yellow-dark) 100%); --gradient-pink: linear-gradient(135deg, var(--pink) 0%, var(--pink-dark) 100%); /* Transition */ --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); --transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1); --transition-slow: all 0.5s cubic-bezier(0.4, 0, 0.2, 1); /* Para Birimi */ --currency-symbol: "₺"; /* Slider Heights */ --slider-height-desktop: 85vh; --slider-height-tablet: 70vh; --slider-height-mobile: 65vh; }