@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
:root {
  --font-body: 'Inter', sans-serif;
  --font-heading: 'Inter', sans-serif;
  --base-font-size: 15px;

  --text-color: #ffffff;
  --muted-color: #6b7280;
  --background-color: #ffffff;
  --surface-color: #f9fafb;

  --primary-400: #9ca3af;
  --primary-600: #4b5563;
  --primary-700: #4b5563;
  --primary-from: #9ca3af;
  --primary-to: #6b7280;

  --secondary-400: #d1d5db;
  --secondary-600: #9ca3af;
  --secondary-from: #e5e7eb;
  --secondary-to: #d1d5db;

  --success-600: #059669;
  --warning-600: #d97706;
  --danger-600: #dc2626;

  --header-gradient-from: #ffffff;
  --header-gradient-to: #f3f4f6;
  --header-text: #040101;
  
  --footer-gradient-from: #f9fafb;
  --footer-gradient-via: #f3f4f6;
  --footer-gradient-to: #e5e7eb;
  --footer-text: #374151;

  /* Additional theme variables */
  --primary-gradient: linear-gradient(135deg, #9ca3af, #6b7280);
  --danger-gradient: linear-gradient(135deg, #dc2626, #ef4444);
  --success-gradient: linear-gradient(135deg, #059669, #22c55e);
  --border-color: #6b7280;
  --text-secondary: #6b7280;
  --primary-shadow: rgba(75, 85, 99, 0.3);
  --primary-100: rgba(156, 163, 175, 0.1);

  /* Yeni eklenen değişkenler */
  --warning-600: #d97706;
  --warning-700: #b45309;
  --info-600: #0891b2;
  --info-700: #0e7490;
  --info-gradient: linear-gradient(135deg, #0891b2, #0e7490);
  --success-700: #15803d;
  --danger-700: #b91c1c;
}

/* Base */
html, body { font-size: var(--base-font-size); }
body {
  font-family: var(--font-body);
  color: var(--text-color);
  background: var(--background-color);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--text-color);
}

p, li, span, small, label, td, th { color: var(--text-color); }
.muted, .text-muted { color: var(--muted-color) !important; }

/* Header Styles */
.header-critical {
  background: linear-gradient(135deg, var(--header-gradient-from), var(--header-gradient-to)) !important;
  backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.header-critical .nav-link,
.header-critical h1,
.header-critical h2,
.header-critical p,
.header-critical span,
.header-critical i {
  color: var(--header-text) !important;
}

.header-critical .nav-link:hover {
  color: var(--header-text) !important;
  opacity: 0.8;
}

/* Mobile Menu */
.mobile-menu-panel {
  background: linear-gradient(135deg, var(--header-gradient-from), var(--header-gradient-to)) !important;
}

.mobile-menu-panel a,
.mobile-menu-panel span,
.mobile-menu-panel h2,
.mobile-menu-panel p {
  color: var(--header-text) !important;
}

/* Footer Styles */
.footer-theme-bg,
footer,
.footer-section {
  background: linear-gradient(to bottom right, var(--footer-gradient-from), var(--footer-gradient-via), var(--footer-gradient-to)) !important;
}

footer h3,
footer h4,
footer p,
footer span,
footer a,
footer li,
footer i,
.footer-icon,
.footer-section i,
.footer-contact-icon,
.footer-social-icon,
[class*="footer"] i {
  color: var(--footer-text) !important;
}

/* Footer ikonları için özel düzenleme */
.footer-contact-icon {
  background-color: var(--primary-600) !important;
}

.footer-contact-icon i {
  color: white !important;
}

.footer-social-icon {
  background-color: rgba(var(--footer-text), 0.1) !important;
}

.footer-social-icon i {
  color: var(--footer-text) !important;
}

/* Footer iletişim ikonları için özel kurallar */
.footer-contact-icon.bg-amber-600 {
  background-color: var(--primary-600) !important;
}

.footer-contact-icon.bg-green-500 {
  background-color: var(--success-600) !important;
}

.footer-contact-icon i {
  color: white !important;
}

/* Footer sosyal medya ikonları */
.footer-social-icon.bg-amber-600\/20 {
  background-color: rgba(var(--footer-text), 0.1) !important;
}

.footer-social-icon i {
  color: var(--footer-text) !important;
}

/* Footer link ikonları */
.footer-icon {
  color: var(--footer-text) !important;
}

/* Footer başlık ikonları */
h4 .footer-icon {
  color: var(--primary-600) !important;
}

footer a:hover {
  color: var(--primary-600) !important;
  opacity: 0.9;
}

/* İstatistik kartları ve sayaçlar */
.stats-card,
.counter-card,
.info-counter,
.stats-section,
.stats-container,
.stats-box,
.stats-item,
[class*="stats-"] {
  background: var(--surface-color) !important;
}

.stats-icon,
.counter-icon,
.stats-number,
.counter-number,
.stats-value,
.counter-value,
.stats-title,
.counter-title {
  color: var(--primary-600) !important;
}

.stats-icon-bg,
.counter-icon-bg,
.stats-circle,
.counter-circle {
  background: rgba(var(--primary-400), 0.1) !important;
}

/* Workshop sayfası özellikleri */
.workshop-header,
.workshop-hero,
.workshop-banner {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

.workshop-title,
.workshop-subtitle,
.workshop-heading,
.workshop-price,
.workshop-info h1,
.workshop-info h2,
.workshop-detail-title {
  color: var(--header-text) !important;
}

.workshop-detail-section,
.workshop-about,
.workshop-content,
.workshop-section {
  background: var(--surface-color) !important;
  color: var(--text-color) !important;
}

.workshop-meta-item,
.workshop-detail-meta,
.workshop-info-item {
  color: var(--text-color) !important;
}

.workshop-meta-icon,
.workshop-detail-icon,
.workshop-info-icon {
  color: var(--primary-600) !important;
}

.workshop-tag,
.workshop-badge,
.workshop-level {
  background: rgba(var(--primary-600), 0.1) !important;
  color: var(--primary-600) !important;
}

/* Workshop sayfasındaki özel butonlar */
.workshop-action-btn,
.workshop-cta,
.reserve-workshop-btn {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: white !important;
}

/* Workshop sayfasındaki liste öğeleri */
.workshop-list-item,
.workshop-feature-item,
.workshop-benefit-item {
  color: var(--text-color) !important;
}

.workshop-list-icon,
.workshop-feature-icon,
.workshop-benefit-icon {
  color: var(--primary-600) !important;
}

/* Workshop sayfasındaki bölüm başlıkları */
.workshop-section-title,
.workshop-detail-heading {
  color: var(--primary-600) !important;
}

/* İstatistik kartları - özel seçiciler */
.rounded-full.bg-indigo-100,
.rounded-full.bg-purple-100,
.rounded-full.bg-blue-100,
.rounded-full.bg-green-100 {
  background: rgba(var(--primary-600), 0.1) !important;
}

.text-indigo-600,
.text-purple-600,
.text-blue-600,
.text-green-600 {
  color: var(--primary-600) !important;
}

/* İstatistik sayıları */
.text-4xl.font-bold,
.text-3xl.font-bold,
.text-2xl.font-bold {
  color: var(--primary-600) !important;
}

/* İstatistik başlıkları */
.text-gray-500,
.text-gray-600,
.text-gray-700 {
  color: var(--muted-color) !important;
}

/* İkon arka plan renkleri */
.bg-indigo-100,
.bg-purple-100,
.bg-blue-100,
.bg-green-100 {
  background-color: rgba(var(--primary-600), 0.1) !important;
}

/* İkon renkleri */
.text-indigo-600,
.text-purple-600,
.text-blue-600,
.text-green-600 {
  color: var(--primary-600) !important;
}

/* Button tokens */
.btn-primary, .theme-btn-primary {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: #fff !important;
  border: none !important;
}
.btn-primary:hover, .theme-btn-primary:hover { 
  filter: brightness(0.95); 
  transform: translateY(-2px);
}

.btn-secondary, .theme-btn-secondary {
  background: transparent !important;
  border: 2px solid var(--primary-600) !important;
  color: var(--primary-600) !important;
}
.btn-secondary:hover { 
  background: var(--primary-600) !important; 
  color: #fff !important; 
}

/* Status buttons */
.btn-success { background: var(--success-600) !important; color: #fff !important; }
.btn-warning { background: var(--warning-600) !important; color: #fff !important; }
.btn-danger  { background: var(--danger-600)  !important; color: #fff !important; }

/* Override common Tailwind utility colors to theme variables */
.text-blue-400, .text-primary-400 { color: var(--primary-400) !important; }
.text-blue-600, .text-primary, .text-primary-600 { color: var(--primary-600) !important; }
.text-blue-700 { color: var(--primary-700) !important; }
.text-purple-400 { color: var(--secondary-400) !important; }
.text-purple-600 { color: var(--secondary-600) !important; }
.text-green-600 { color: var(--success-600) !important; }
.text-yellow-600 { color: var(--warning-600) !important; }
.text-red-600 { color: var(--danger-600) !important; }

.bg-blue-400  { background-color: var(--primary-400) !important; }
.bg-blue-600  { background-color: var(--primary-600) !important; }
.bg-purple-400{ background-color: var(--secondary-400) !important; }
.bg-purple-600{ background-color: var(--secondary-600) !important; }
.bg-green-600 { background-color: var(--success-600) !important; }
.bg-yellow-600{ background-color: var(--warning-600) !important; }
.bg-red-600   { background-color: var(--danger-600) !important; }

.border-blue-400  { border-color: var(--primary-400) !important; }
.border-blue-600  { border-color: var(--primary-600) !important; }
.border-purple-400{ border-color: var(--secondary-400) !important; }
.border-purple-600{ border-color: var(--secondary-600) !important; }

.from-blue-400 { --tw-gradient-from: var(--primary-from) !important; }
.to-blue-600   { --tw-gradient-to: var(--primary-to) !important; }
.from-purple-400 { --tw-gradient-from: var(--secondary-from) !important; }
.to-purple-600   { --tw-gradient-to: var(--secondary-to) !important; }

/* Gradient backgrounds for sections */
.gradient-bg {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

.gradient-secondary {
  background: linear-gradient(135deg, var(--secondary-from), var(--secondary-to)) !important;
}

/* Links */
a { color: var(--primary-600); }
a:hover { color: var(--primary-700); }

/* Cards / surfaces */
.glass-card, .card, .bg-white {
  background: var(--surface-color) !important;
}

/* Form elements */
.form-control, .form-select, input, textarea, select {
  background: var(--surface-color);
  color: var(--text-color);
  border-color: var(--muted-color);
}

.form-control:focus, input:focus, textarea:focus, select:focus {
  border-color: var(--primary-600);
  box-shadow: 0 0 0 0.2rem rgba(var(--primary-600), 0.25);
}

/* Badges */
.badge-primary { background: var(--primary-600) !important; }
.badge-secondary { background: var(--secondary-600) !important; }
.badge-success { background: var(--success-600) !important; }
.badge-warning { background: var(--warning-600) !important; }
.badge-danger { background: var(--danger-600) !important; }

/* Alert boxes */
.alert-primary { 
  background: rgba(var(--primary-400), 0.1) !important;
  border-color: var(--primary-400) !important;
  color: var(--primary-700) !important;
}

.alert-success { 
  background: rgba(var(--success-600), 0.1) !important;
  border-color: var(--success-600) !important;
  color: var(--success-600) !important;
}

.alert-warning { 
  background: rgba(var(--warning-600), 0.1) !important;
  border-color: var(--warning-600) !important;
  color: var(--warning-600) !important;
}

.alert-danger { 
  background: rgba(var(--danger-600), 0.1) !important;
  border-color: var(--danger-600) !important;
  color: var(--danger-600) !important;
}

/* Specific page overrides */
.hero-section {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

.features-section {
  background: var(--background-color);
}

.workshop-card, .product-card {
  background: var(--surface-color);
  border: 1px solid rgba(var(--muted-color), 0.2);
}

.workshop-card:hover, .product-card:hover {
  border-color: var(--primary-600);
  box-shadow: 0 10px 30px rgba(var(--primary-600), 0.2);
}

/* Admin panel specific */
.admin-sidebar {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

.admin-header {
  background: var(--surface-color);
  border-bottom: 1px solid rgba(var(--muted-color), 0.2);
}

/* Modal overlays */
.modal-backdrop {
  background: rgba(0, 0, 0, 0.7);
}

.modal-content {
  background: var(--surface-color);
  color: var(--text-color);
}

/* Tables */
.table {
  color: var(--text-color);
}

.table thead th {
  background: var(--surface-color);
  color: var(--text-color);
  border-color: rgba(var(--muted-color), 0.2);
}

.table tbody td {
  border-color: rgba(var(--muted-color), 0.1);
}

.table-striped tbody tr:nth-of-type(odd) {
  background: rgba(var(--muted-color), 0.05);
}

/* Pagination */
.page-link {
  color: var(--primary-600);
  background: var(--surface-color);
  border-color: rgba(var(--muted-color), 0.2);
}

.page-link:hover {
  color: var(--primary-700);
  background: rgba(var(--primary-400), 0.1);
}

.page-item.active .page-link {
  background: var(--primary-600);
  border-color: var(--primary-600);
  color: #fff;
}

/* Dropdowns */
.dropdown-menu {
  background: var(--surface-color);
  border: 1px solid rgba(var(--muted-color), 0.2);
}

.dropdown-item {
  color: var(--text-color);
}

.dropdown-item:hover {
  background: rgba(var(--primary-400), 0.1);
  color: var(--primary-600);
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: var(--background-color);
}

::-webkit-scrollbar-thumb {
  background: var(--muted-color);
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--primary-600);
}

/* Price Badges and Buttons */
.price-badge,
.price-button,
.price-tag,
.price-amount,
.bg-gradient-to-r.from-blue-600.to-purple-600,
.bg-gradient-to-r.from-purple-600.to-pink-600,
[class*="from-blue-"][class*="to-purple-"],
[class*="from-purple-"][class*="to-pink-"] {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: white !important;
}

/* Price amount text only (without background) */
.price-amount {
  color: var(--primary-600) !important;
  background: transparent !important;
}

/* Price tags with gradient background */
.price-tag {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: white !important;
}

/* Currency symbols */
.currency-symbol,
.price-text,
.text-2xl.font-bold.text-blue-600,
.text-3xl.font-bold {
  color: var(--primary-600) !important;
}

/* Product and Workshop Cards Price Areas */
.product-price,
.workshop-price,
div[class*="rounded-full"][class*="px-"][class*="py-"],
span[class*="rounded-full"][class*="px-"][class*="py-"] {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: white !important;
}

/* Override inline styles for price elements */
[style*="background: linear-gradient"] {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

/* Special gradient classes */
.bg-gradient-primary {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

.bg-gradient-secondary {
  background: linear-gradient(135deg, var(--secondary-from), var(--secondary-to)) !important;
}

/* Product/Workshop action buttons */
.add-to-cart-btn,
.reserve-btn,
.action-btn {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: white !important;
  transition: all 0.3s ease;
}

.add-to-cart-btn:hover,
.reserve-btn:hover,
.action-btn:hover {
  filter: brightness(1.1);
  transform: translateY(-2px);
}

/* Icon buttons */
.icon-btn,
.btn-icon {
  background: var(--surface-color) !important;
  color: var(--primary-600) !important;
  border: 1px solid var(--primary-600) !important;
}

.icon-btn:hover,
.btn-icon:hover {
  background: var(--primary-600) !important;
  color: white !important;
}

/* Stats and info cards */
.stat-card,
.info-card {
  background: var(--surface-color) !important;
  border: 1px solid rgba(var(--muted-color), 0.2) !important;
}

/* Category badges */
.category-badge,
.tag-badge {
  background: rgba(var(--primary-600), 0.1) !important;
  color: var(--primary-600) !important;
}

/* Rating stars */
.rating-star {
  color: var(--warning-600) !important;
}

/* Discount badges */
.discount-badge {
  background: var(--danger-600) !important;
  color: white !important;
}

/* Stock status */
.in-stock {
  color: var(--success-600) !important;
}

.out-of-stock {
  color: var(--danger-600) !important;
}

/* Breadcrumbs */
.breadcrumb-item {
  color: var(--muted-color) !important;
}

.breadcrumb-item.active {
  color: var(--text-color) !important;
}

/* Tooltips */
.tooltip {
  background: var(--text-color) !important;
  color: var(--background-color) !important;
}

/* Progress bars */
.progress {
  background: var(--surface-color) !important;
}

.progress-bar {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
}

/* Switches and checkboxes */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background: var(--primary-600) !important;
  border-color: var(--primary-600) !important;
}

/* File upload areas */
.upload-area {
  background: var(--surface-color) !important;
  border: 2px dashed var(--muted-color) !important;
}

.upload-area:hover {
  border-color: var(--primary-600) !important;
  background: rgba(var(--primary-400), 0.05) !important;
}

/* Timeline */
.timeline-item::before {
  background: var(--primary-600) !important;
}

.timeline-line {
  background: var(--muted-color) !important;
}

/* Notification badges */
.notification-badge {
  background: var(--danger-600) !important;
  color: white !important;
}

/* Search boxes */
.search-box {
  background: var(--surface-color) !important;
  border: 1px solid var(--muted-color) !important;
}

.search-box:focus {
  border-color: var(--primary-600) !important;
}

/* Tabs */
.nav-tabs .nav-link {
  color: var(--muted-color) !important;
}

.nav-tabs .nav-link.active {
  color: var(--primary-600) !important;
  border-bottom-color: var(--primary-600) !important;
}

/* Accordions */
.accordion-button {
  background: var(--surface-color) !important;
  color: var(--text-color) !important;
}

.accordion-button:not(.collapsed) {
  background: rgba(var(--primary-400), 0.1) !important;
  color: var(--primary-600) !important;
}

/* List group */
.list-group-item {
  background: var(--surface-color) !important;
  color: var(--text-color) !important;
  border-color: rgba(var(--muted-color), 0.2) !important;
}

.list-group-item:hover {
  background: rgba(var(--primary-400), 0.05) !important;
}

/* Chips/Tags */
.chip,
.tag {
  background: rgba(var(--primary-400), 0.1) !important;
  color: var(--primary-600) !important;
}

/* Floating action buttons */
.fab {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
  color: white !important;
  box-shadow: 0 4px 20px rgba(var(--primary-600), 0.4) !important;
}

/* Override all gradient backgrounds to use theme colors */
[class*="bg-gradient-to-"] {
  background: linear-gradient(135deg, var(--primary-from), var(--primary-to)) !important;
} 

/* Logo Styles */
.logo-container {
  background: white !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
}

.logo-container img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.logo-container i {
  color: var(--primary-600) !important;
}

.logo-text {
  color: var(--primary-600) !important;
  font-weight: 700 !important;
}

.logo-subtitle {
  color: var(--muted-color) !important;
}

/* Header logo specific */
.header-critical .logo-container {
  background: white !important;
}

.header-critical .logo-text {
  color: var(--primary-600) !important;
}

.header-critical .logo-subtitle {
  color: var(--muted-color) !important;
}

/* Mobile menu logo specific */
.mobile-menu-panel .logo-container {
  background: white !important;
}

.mobile-menu-panel .logo-text {
  color: white !important;
}

.mobile-menu-panel .logo-subtitle {
  color: rgba(255, 255, 255, 0.7) !important;
}