:root {
  --primary-color: #e60b2f; /* Kırmızı */
  --primary-rgb: 230, 11, 47;
  --primary-10: #2c0a12; 
  --primary-20: #3c0e19; 
  --primary-30: #4c1220; 
  --primary-40: #5c1627; 
  --primary-50: #8a0720; 
  --primary-60: #b8092a; 
  --primary-70: #e60b2f; /* primary 70 - main */
  --primary-80: #f0203d; 
  --primary-90: #f35066; 
  --primary-100: #f6808f; 
  
  --secondary-color: #112045; /* Koyu Mavi */
  --secondary-rgb: 17, 32, 69;
  --secondary-10: #070d1d; 
  --secondary-20: #0a132a; 
  --secondary-30: #0e1a38; 
  --secondary-40: #112045; 
  --secondary-50: #153773; 
  --secondary-60: #445f8f; 
  --secondary-70: #7287ab; /* secondary 70 - main */
  --secondary-80: #a1afc7; 
  --secondary-90: #d0d7e3; 
  --secondary-100: #e8ebf1; 
  
  --gray: #3a3a3a; /* gray 10 */
  --gray-10: #3a3a3a; /* gray 10 */
  --gray-20: #444444; /* gray 20 */
  --gray-30: #505050; /* gray 30 */
  --gray-40: #666666; /* gray 40 */
  --gray-50: #888888; /* gray 50 */
  --gray-60: #aaaaaa; /* gray 60 */
  --gray-70: #cccccc; /* gray 70 */
  --gray-80: #dddddd; /* gray 80 */
  --gray-90: #eeeeee; /* gray 90 */
  --gray-100: #ffffff; /* white */
  
  --color-gray: #3a3a3a; /* color gray 10 */
  --color-gray-10: #3a3a3a; /* color gray 10 */
  --color-gray-20: #444444; /* color gray 20 */
  --color-gray-30: #505050; /* color gray 30 */
  --color-gray-40: #666666; /* color gray 40 */
  --color-gray-50: #888888; /* color gray 50 */
  --color-gray-60: #aaaaaa; /* color gray 60 */
  --color-gray-70: #cccccc; /* color gray 70 */
  --color-gray-80: #dddddd; /* color gray 80 */
  --color-gray-90: #eeeeee; /* color gray 90 */
  --color-gray-100: #ffffff; /* color gray 100 */
  
  --white: #ffffff;
  --white-rgb: 255, 255, 255;
  --bg-white: #121925; /* bg color 20 */
  --bg-white-10: #0f1621; /* bg color 10 */
  --bg-white-20: #121925; /* bg color 20 */
  --bg-white-30: #152033; /* bg color 30 */
  --bg-white-40: #192941; /* bg color 40 */
  --bg-white-50: #1e304f; /* bg color 50 */
  
  --black: #151515; /* black */
  --black-rgb: 21, 21, 21;
  
  /* Helper Color */
  --helper-color: #059669; /* green */
  --helper-rgb: 5, 150, 105;
  
  /* Neutral Colors */
  --dark: #030713; /* main dark background */
  --dark-rgb: 3, 7, 19;
  --dark-bg: #030713; /* main background */
  --light-bg: #0f1621; /* slightly lighter bg */
  
  /* Text Colors */
  --text-color: #ffffff; /* white text */
  --text-light: #cccccc; /* light gray text */
  --text-lighter: #aaaaaa; /* lighter gray text */
  --text-white: #ffffff;
  --text-dark: #eeeeee; /* nearly white text */
  --text-light-gray: #aaaaaa; /* light gray */
  --text-gray: #dddddd; /* gray text */

  /* Border Colors */
  --border-color: #252a36; /* dark border */
  --border-light: #1f2330; /* lighter border */
  --border-dark: #31374a; /* darker border */
  
  /* Shadow */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -2px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.6), 0 4px 6px -4px rgba(0, 0, 0, 0.5);
  --card-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -4px rgba(0, 0, 0, 0.3);
  --hover-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.7), 0 8px 10px -6px rgba(0, 0, 0, 0.6);
  --ring-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.4);
  
  /* Typography - E-ticaret için modernize edilmiş */
  --font-family-sans-serif: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --font-family-heading: 'Plus Jakarta Sans', var(--font-family-sans-serif);
  --font-family-base: var(--font-family-sans-serif);
  
  --font-size-base: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xs: 0.75rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  
  --line-height-base: 1.5;
  --line-height-tight: 1.25;
  --line-height-relaxed: 1.75;
  
  /* Spacing */
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-5: 1.5rem;
  --spacing-6: 2rem;
  --spacing-8: 2.5rem;
  --spacing-10: 3rem;
  
  /* Layout */
  --container-max-width: 1320px;
  --grid-gutter-width: 30px;
  
  /* Border Radius */
  --border-radius-sm: 0.25rem;
  --border-radius: 0.5rem;
  --border-radius-lg: 0.75rem;
  --border-radius-xl: 1rem;
  --border-radius-2xl: 1.5rem;
  --border-radius-pill: 50rem;
  --border-radius-circle: 50%;
  
  /* Z-index values */
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal: 1040;
  --z-popover: 1060;
  --z-tooltip: 1070;
  --z-header: 1020;
  --z-above-header: 1030;
  
  /* Form Controls - Modernize edilmiş */
  --input-height: 48px;
  --input-padding-y: 0.75rem;
  --input-padding-x: 1rem;
  --input-bg: #121925;
  --input-border-color: #252a36;
  --input-border-radius: var(--border-radius);
  --input-focus-box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.25);
  --input-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  
  /* Buttons */
  --btn-padding-y: 0.65rem;
  --btn-padding-x: 1.5rem;
  --btn-border-radius: var(--border-radius);
  --btn-transition: all 0.2s ease-in-out;
  --btn-font-weight: var(--font-weight-medium);
  
  /* Cards */
  --card-padding: 1.5rem;
  --card-border-radius: var(--border-radius-lg);
  --card-bg: #0f1621;
  --card-border-color: #252a36;
  
  /* Transitions */
  --transition-base: all 0.2s ease-in-out;
  --transition-fade: opacity 0.15s linear;
  --transition-collapse: height 0.35s ease;
  --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  
  /* Product Grid */
  --product-grid-gap: 30px;
  --product-columns-sm: 1;
  --product-columns-md: 2;
  --product-columns-lg: 3;
  --product-columns-xl: 4;
  
  /* Animation */
  --animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  --animation-duration-fast: 0.15s;
  --animation-duration-normal: 0.3s;
  --animation-duration-slow: 0.5s;
  
  /* Modal */
  --modal-width-sm: 400px;
  --modal-width-md: 600px;
  --modal-width-lg: 800px;
  --modal-shadow: var(--shadow-lg);
  --modal-border-radius: var(--border-radius-lg);
  
  /* Tooltip */
  --tooltip-bg: #252a36;
  --tooltip-color: var(--white);
  --tooltip-padding: 0.5rem 1rem;
  --tooltip-arrow-size: 5px;
  --tooltip-border-radius: var(--border-radius);
  
  /* Badge */
  --badge-padding-y: 0.25rem;
  --badge-padding-x: 0.65rem;
  --badge-border-radius: var(--border-radius-pill);
  --badge-font-size: 75%;
  --badge-font-weight: var(--font-weight-medium);
  
  /* Pagination */
  --pagination-padding-y: 0.5rem;
  --pagination-padding-x: 0.75rem;
  --pagination-border-radius: var(--border-radius);
  --pagination-active-bg: var(--primary-color);
  --pagination-active-color: var(--white);
  
  /* Tables */
  --table-cell-padding-y: 0.75rem;
  --table-cell-padding-x: 1rem;
  --table-border-color: #252a36;
  --table-stripe-bg: #121925;
  --table-hover-bg: #1a2235;
  
  /* Authentication Pages */
  --auth-border-radius: var(--border-radius-lg);
  --auth-card-shadow: var(--shadow-lg);
  --auth-padding: var(--spacing-6);

  --text-color: #fefefe;
}

/* Base styles */
a:hover {
  text-decoration: none !important;
}

/* Icon centering - Global fix */
[class*="ph-"], 
[class^="ph-"],
.icon,
i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  text-align: center !important;
  position: relative !important;
  width: 1em;
  height: 1em;
}

/* Reset for icon containers */
.icon-container,
.social-icon,
[class*="-icon"],
[class*="icon-"],
.btn i,
.nav-link i {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
} 