html {
  scroll-behavior: smooth;
}

/* Base Typography System */
body {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.5rem;
  color: var(--color-text);
  background-color: #f8f9fa; /* slate-50 equivalent */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Corporate Typography Hierarchy */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 600 !important;
  margin: 0 0 1rem 0 !important;
  color: #0f172a !important; /* slate-900 */
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
}

h1 {
  font-size: 1.5rem !important; /* text-2xl */
  font-weight: 600 !important; /* font-semibold */
  margin-bottom: 1.5rem !important;
  color: #0f172a !important; /* slate-900 */
}

h2 {
  font-size: 1.25rem !important; /* text-xl */
  font-weight: 500 !important; /* font-medium */
  margin-bottom: 1.25rem !important;
  color: #1e293b !important; /* slate-800 */
}

h3 {
  font-size: 1.125rem !important; /* text-lg */
  font-weight: 500 !important;
  margin-bottom: 1rem !important;
  color: #334155 !important; /* slate-700 */
}

h4 {
  font-size: 1rem !important; /* text-base */
  font-weight: 500 !important;
  margin-bottom: 0.875rem !important;
  color: #334155 !important; /* slate-700 */
}

h5 {
  font-size: 0.875rem !important; /* text-sm */
  font-weight: 500 !important;
  margin-bottom: 0.75rem !important;
  color: #475569 !important; /* slate-600 */
}

h6 {
  font-size: 0.75rem !important; /* text-xs */
  font-weight: 500 !important;
  margin-bottom: 0.625rem !important;
  color: #64748b !important; /* slate-500 */
}

/* Remove hover effects on headings for corporate look */
h1:hover,
h2:hover,
h3:hover,
h4:hover,
h5:hover,
h6:hover {
  color: inherit !important;
  transition: none !important;
}

/* Special styling for headings in cards */
.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,
.bg-white h1,
.bg-white h2,
.bg-white h3,
.bg-white h4,
.bg-white h5,
.bg-white h6 {
  margin-top: 0 !important;
}

/* Dark mode support for headings */
.dark h1,
.dark h2,
.dark h3,
.dark h4,
.dark h5,
.dark h6 {
  color: rgb(209, 213, 219) !important; /* text-gray-300 */
}

.dark h1 {
  color: rgb(243, 244, 246) !important; /* text-gray-100 */
}

/* Override any conflicting Tailwind classes */
.text-gray-800 h1,
.text-gray-800 h2,
.text-gray-800 h3,
.text-gray-800 h4,
.text-gray-800 h5,
.text-gray-800 h6 {
  color: rgb(55, 65, 81) !important;
}

/**
 * Modern Form inputs - Corporate Style
 */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
input[type="file"],
textarea,
select {
  background-color: #ffffff;
  color: #334155 !important; /* slate-700 */
  border: 1px solid #cbd5e1 !important; /* slate-300 */
  border-radius: 0.375rem !important; /* rounded-md */
  padding: 0.625rem 0.75rem !important; /* px-3 py-2.5 */
  font-size: 0.875rem !important;
  transition: all 0.2s ease !important;
  outline: none !important;
}

/* Override for floating controls */
.floatingLabel input[type="text"],
.floatingLabel input[type="password"],
.floatingLabel input[type="email"],
.floatingLabel input[type="number"],
.floatingLabel input[type="tel"],
.floatingLabel input[type="url"],
.floatingLabel input[type="search"],
.floatingLabel input[type="date"],
.floatingLabel input[type="month"],
.floatingLabel input[type="week"],
.floatingLabel input[type="time"],
.floatingLabel input[type="datetime"],
.floatingLabel input[type="datetime-local"],
.floatingLabel input[type="color"],
.floatingLabel input[type="file"],
.floatingLabel textarea,
.floatingLabel select {
  padding: 0.625rem 0.75rem 0.625rem 0.75rem !important; /* px-3 py-2.5 */
  font-size: 0.875rem !important; /* text-sm */
  border: 1px solid #cbd5e1 !important;
}

.dropzone-file {
  background-color: #ffffff;
  color: #64748b !important; /* slate-500 */
  border: 1px solid #cbd5e1;
  border-radius: 0.375rem;
}

input[type="checkbox"] {
  background-color: #ffffff;
  border: 1px solid #cbd5e1;
  border-radius: 0.25rem;
  cursor: pointer;
}

/** Form input focus - using mavi ton */
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
input[type="file"]:focus,
textarea:focus,
select:focus,
.dropzone-file:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px rgba(0, 31, 97, 0.1) !important; /* ring-2 ring-mavi-ton/10 */
}

textarea:focus,
select:focus {
  border-color: var(--color-accent) !important;
  box-shadow: 0 2px 3px 1px var(--color-shadow) !important;
}

/** Form input hover */
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover,
input[type="number"]:hover,
input[type="tel"]:hover,
input[type="url"]:hover,
input[type="search"]:hover,
input[type="date"]:hover,
input[type="month"]:hover,
input[type="week"]:hover,
input[type="time"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="color"]:hover,
input[type="file"]:hover,
textarea:hover,
select:hover,
.dropzone-file:hover {
  border-color: #94a3b8 !important; /* slate-400 */
}

/** Form input disabled */
input[type="text"]:disabled,
input[type="password"]:disabled,
input[type="email"]:disabled,
input[type="number"]:disabled,
input[type="tel"]:disabled,
input[type="url"]:disabled,
input[type="search"]:disabled,
input[type="date"]:disabled,
input[type="month"]:disabled,
input[type="week"]:disabled,
input[type="time"]:disabled,
input[type="datetime"]:disabled,
input[type="datetime-local"]:disabled,
input[type="color"]:disabled,
input[type="file"]:disabled,
input[type="checkbox"]:disabled,
input[type="textarea"]:disabled,
textarea:disabled,
.dropzone-file:disabled,
.django-select2:disabled,
select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.select2-container {
  width: 100% !important;
  height: 3rem !important; /* 48px */
  min-width: 216px !important;
}

.select2-container .select2-selection--single {
  display: block !important;
  width: 100% !important;
  height: 3rem !important; /* 48px */
  font-size: 0.875rem !important /* 14px */;
  line-height: 1.25rem !important /* 20px */;
  /* 10px */
  /* 10px */
  /* 10px */
  /* 16px */
  padding: 1rem 0.625rem 0.625rem !important;
  /*border-radius: 0.5rem !important !* 8px *!;*/
  appearance: none;
  /*border-width: 1px;*/
  background-color: var(--input-background) !important;
  color: var(--input-text) !important;
  border: 1px solid var(--input-border) !important;
  border-radius: var(--input-radius) !important;
}

.select2-container .select2-selection--multiple {
  display: block;
  /*width: 100% ;*/
  min-height: 2rem !important; /* 48px */
  font-size: 0.875rem !important /* 14px */;
  line-height: 1.25rem !important /* 20px */;
  /* 10px */
  /* 10px */
  /* 10px */
  /* 16px */
  padding: 1rem 0.625rem 0.625rem !important;
  /*border-radius: 0.5rem !important !* 8px *!;*/
  appearance: none;
  /*border-width: 1px;*/
  background-color: var(--input-background) !important;
  color: var(--input-text) !important;
  border: 1px solid var(--input-border) !important;
  border-radius: var(--input-radius) !important;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__arrow {
  height: 100%;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  line-height: 30px;
}

.select2-container--default
  .select2-selection--multiple
  .select2-selection__arrow {
  height: 20%;
}

.select2-container--default
  .select2-selection--multiple
  .select2-selection__rendered {
  line-height: 28px;
}

/*
    MODERN CORPORATE BUTTONS
*/
.elevated-button {
  text-align: center;
  border-radius: 0.375rem; /* rounded-md */
  border: 1px solid transparent;
  padding: 0.5rem 1rem; /* px-4 py-2 */
  font-size: 0.875rem; /* text-sm */
  font-weight: 500; /* font-medium */
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.elevated-button:hover {
  transform: none; /* No scale effects */
  transition: all 0.2s ease;
}

.elevated-button.primary {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
}

.elevated-button.primary:hover,
.elevated-button.primary:active,
.elevated-button.primary.hover,
.elevated-button.primary.active {
  background-color: var(--color-hover-primary);
}

.elevated-button.secondary {
  background-color: #ffffff;
  color: #334155; /* slate-700 */
  border: 1px solid #cbd5e1; /* slate-300 */
}

.elevated-button.secondary:hover,
.elevated-button.secondary:active,
.elevated-button.secondary.hover,
.elevated-button.secondary.active {
  background-color: #f8fafc; /* slate-50 */
  border-color: #94a3b8; /* slate-400 */
}

.elevated-button.accent {
  background-color: var(--color-accent);
  color: var(--color-on-accent);
}

.elevated-button.accent:hover,
.elevated-button.accent:active,
.elevated-button.accent.hover,
.elevated-button.accent.active {
  background-color: var(--color-hover-accent);
}

.elevated-button.success {
  background-color: #10b981; /* emerald-500 */
  color: #ffffff;
}

.elevated-button.success:hover,
.elevated-button.success:active,
.elevated-button.success.hover,
.elevated-button.success.active {
  background-color: #059669; /* emerald-600 */
}

.elevated-button.warning {
  background-color: #f59e0b; /* amber-500 */
  color: #ffffff;
}

.elevated-button.warning:hover,
.elevated-button.warning:active,
.elevated-button.warning.hover,
.elevated-button.warning.active {
  background-color: #d97706; /* amber-600 */
}

.elevated-button.error,
.elevated-button.danger {
  background-color: #ef4444; /* red-500 */
  color: #ffffff;
}

.elevated-button.error:hover,
.elevated-button.error:active,
.elevated-button.error.hover,
.elevated-button.error.active,
.elevated-button.danger:hover,
.elevated-button.danger:active,
.elevated-button.danger.hover,
.elevated-button.danger.active {
  background-color: #dc2626; /* red-600 */
}

.elevated-button.info {
  background-color: var(--color-info);
  color: var(--color-on-info);
}

.elevated-button.info:hover,
.elevated-button.info:active,
.elevated-button.info.hover,
.elevated-button.info.active {
  background-color: var(--color-hover-info);
}

.elevated-button.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.elevated-button.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.elevated-button.disabled:active,
.elevated-button.disabled:focus,
.elevated-button.disabled:before,
.elevated-button.disabled:after {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none !important;
  outline: none !important;
  pointer-events: none;
}

.outlined-button {
  text-align: center;
  border-radius: 0.375rem; /* rounded-md */
  background-color: transparent;
  padding: 0.5rem 1rem; /* px-4 py-2 */
  font-size: 0.875rem; /* text-sm */
  font-weight: 500; /* font-medium */
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.outlined-button.success {
  background-color: transparent;
  border: 1px solid var(--color-success);
  color: var(--color-success);
  /*box-shadow: var(--color-success) 0 0 0 1px;*/
}

.outlined-button.success:hover,
.outlined-button.success.hover {
  background-color: var(--color-hover-success);
  color: var(--color-on-success);
}

.outlined-button.success:active,
.outlined-button.success.active {
  background-color: var(--color-success);
  color: var(--color-on-success);
  box-shadow: var(--color-success) 0 0 0 -2px;
}

.outlined-button.danger {
  background-color: transparent;
  border: solid 1px var(--color-danger);
  color: var(--color-danger);
  /*box-shadow: var(--color-danger) 0 0 0 1px;*/
}

.outlined-button.danger:hover,
.outlined-button.danger.hover {
  background-color: var(--color-hover-danger);
  color: var(--color-on-danger);
}

.outlined-button.danger:active,
.outlined-button.danger.active {
  background-color: var(--color-danger);
  color: var(--color-on-danger);
  box-shadow: var(--color-danger) 0 0 0 -2px;
}

.outlined-button.error {
  background-color: transparent;
  border: solid 1px var(--color-error);
  color: var(--color-error);
  /*box-shadow: var(--color-error) 0 0 0 1px;*/
}

.outlined-button.error:hover,
.outlined-button.error.hover {
  background-color: var(--color-hover-error);
  color: var(--color-on-error);
}

.outlined-button.error:active,
.outlined-button.error.active {
  background-color: var(--color-error);
  color: var(--color-on-error);
  box-shadow: var(--color-error) 0 0 0 -2px;
}

.outlined-button.info {
  background-color: transparent;
  border: solid 1px var(--color-info);
  color: var(--color-info);
  /*box-shadow: var(--color-info) 0 0 0 1px;*/
}

.outlined-button.info:hover,
.outlined-button.info.hover {
  background-color: var(--color-info);
  color: var(--color-on-info);
}

.outlined-button.info:active,
.outlined-button.info.active {
  background-color: var(--color-info);
  color: var(--color-on-info);
  box-shadow: var(--color-info) 0 0 0 -2px;
}

.outlined-button.warning {
  background-color: transparent;
  border: solid 1px var(--color-warning);
  color: var(--color-warning);
  /*box-shadow: var(--color-warning) 0 0 0 1px;*/
}

.outlined-button.warning:hover,
.outlined-button.warning.hover {
  background-color: var(--color-warning);
  color: var(--color-on-warning);
}

.outlined-button.warning:active,
.outlined-button.warning.active {
  background-color: var(--color-warning);
  color: var(--color-on-warning);
  box-shadow: var(--color-warning) 0 0 0 -2px;
}

.outlined-button.primary {
  background-color: transparent;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
  /*box-shadow: var(--color-primary) 0 0 0 1px;*/
}

.outlined-button.primary:hover,
.outlined-button.primary.hover {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
}

.outlined-button.primary:active,
.outlined-button.primary.active {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
  box-shadow: var(--color-primary) 0 0 0 -2px;
}

.outlined-button.secondary {
  background-color: transparent;
  border: 1px solid var(--color-secondary);
  color: var(--color-secondary);
  /*box-shadow: var(--color-primary) 0 0 0 1px;*/
}

.outlined-button.secondary:hover,
.outlined-button.secondary.hover {
  background-color: var(--color-secondary);
  color: var(--color-on-secondary);
}

.outlined-button.secondary:active,
.outlined-button.secondary.active {
  background-color: var(--color-secondary);
  color: var(--color-on-secondary);
  box-shadow: var(--color-secondary) 0 0 0 -2px;
}

.outlined-button.accent {
  background-color: transparent;
  border: 1px solid var(--color-accent);
  color: var(--color-accent);
  /*box-shadow: var(--color-primary) 0 0 0 1px;*/
}

.outlined-button.accent:hover,
.outlined-button.accent.hover {
  background-color: var(--color-accent);
  color: var(--color-on-accent);
}

.outlined-button.accent:active,
.outlined-button.accent.active {
  background-color: var(--color-accent);
  color: var(--color-on-accent);
  box-shadow: var(--color-accent) 0 0 0 -2px;
}

.outlined-button.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.outlined-button.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.outlined-button.disabled:active,
.outlined-button.disabled:focus,
.outlined-button.disabled:before,
.outlined-button.disabled:after {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none !important;
  pointer-events: none;
}

.text-button {
  text-align: center;
  border: none !important;
  border-radius: var(--button-radius);
  padding: 0.5rem 1rem;
  font-size: 1rem;
  cursor: pointer;
}

.text-button.success {
  background-color: transparent;
  color: var(--color-success);
}

.text-button.success:hover,
.text-button.success.hover {
  background-color: var(--color-success);
  color: var(--color-on-success);
}

.text-button.success:active,
.text-button.success.active {
  background-color: var(--color-success);
  color: var(--color-on-success);
  box-shadow: var(--color-success) 0 0 0 -2px;
}

.text-button.danger {
  background-color: transparent;
  color: var(--color-danger);
}

.text-button.danger:hover,
.text-button.danger.hover {
  background-color: var(--color-danger);
  color: var(--color-on-danger);
}

.text-button.danger:active,
.text-button.danger.active {
  background-color: var(--color-danger);
  color: var(--color-on-danger);
  box-shadow: var(--color-danger) 0 0 0 -2px;
}

.text-button.error {
  background-color: transparent;
  color: var(--color-error);
}

.text-button.error:hover,
.text-button.error.hover {
  background-color: var(--color-error);
  color: var(--color-on-error);
}

.text-button.error:active,
.text-button.error.active {
  background-color: var(--color-error);
  color: var(--color-on-error);
  box-shadow: var(--color-error) 0 0 0 -2px;
}

.text-button.info {
  background-color: transparent;
  color: var(--color-info);
}

.text-button.info:hover,
.text-button.info.hover {
  background-color: var(--color-info);
  color: var(--color-on-info);
}

.text-button.info:active,
.text-button.info.active {
  background-color: var(--color-info);
  color: var(--color-on-info);
  box-shadow: var(--color-info) 0 0 0 -2px;
}

.text-button.warning {
  background-color: transparent;
  color: var(--color-warning);
}

.text-button.warning:hover,
.text-button.warning.hover {
  background-color: var(--color-warning);
  color: var(--color-on-warning);
}

.text-button.warning:active,
.text-button.warning.active {
  background-color: var(--color-warning);
  color: var(--color-on-warning);
  box-shadow: var(--color-warning) 0 0 0 -2px;
}

.text-button.primary {
  background-color: transparent;
  color: var(--color-primary);
}

.text-button.primary:hover,
.text-button.primary.hover {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
}

.text-button.primary:active,
.text-button.primary.active {
  background-color: var(--color-primary);
  color: var(--color-on-primary);
  box-shadow: var(--color-primary) 0 0 0 -2px;
}

.text-button.secondary {
  background-color: transparent;
  color: var(--color-secondary);
}

.text-button.secondary:hover,
.text-button.secondary.hover {
  background-color: var(--color-secondary);
  color: var(--color-on-secondary);
}

.text-button.secondary:active,
.text-button.secondary.active {
  background-color: var(--color-secondary);
  color: var(--color-on-secondary);
  box-shadow: var(--color-secondary) 0 0 0 -2px;
}

.text-button.accent {
  background-color: transparent;
  color: var(--color-accent);
}

.text-button.accent:hover,
.text-button.accent.hover {
  background-color: var(--color-accent);
  color: var(--color-on-accent);
}

.text-button.accent:active,
.text-button.accent.active {
  background-color: var(--color-accent);
  color: var(--color-on-accent);
  box-shadow: var(--color-accent) 0 0 0 -2px;
}

.text-button.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.text-button.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.text-button.disabled:active,
.text-button.disabled:focus,
.text-button.disabled:before,
.text-button.disabled:after {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.link {
  font-weight: bold;
  text-decoration: none;
}

.link:hover,
.link.hover {
  text-decoration: underline;
}

.link:active,
.link.active {
  text-decoration: underline;
}

.link.footer {
  font-weight: normal;
}

.link.success {
  color: var(--color-success);
}

.link.danger {
  color: var(--color-danger);
}

.link.info {
  color: var(--color-info);
}

.link.warning {
  color: var(--color-warning);
}

.link.primary {
  color: var(--color-primary);
}

.link.secondary {
  color: var(--color-secondary);
}

.link.accent {
  color: var(--color-accent);
}

.link.error {
  color: var(--color-error);
}

.link.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.link.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.link.disabled:active,
.link.disabled:focus,
.link.disabled:before,
.link.disabled:after {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Corporate Label Styles */
label {
  color: #334155; /* slate-700 */
  font-size: 0.875rem; /* text-sm */
  font-weight: 500; /* font-medium */
  margin-bottom: 0.5rem;
  display: block;
}

label.muted {
  color: #64748b; /* slate-500 */
}

.floatingLabel label {
  color: var(--floating-label-color);
}

/* Modern Card Styles */
.card {
  background-color: #ffffff;
  color: #334155; /* slate-700 */
  border-radius: 0.5rem; /* rounded-lg */
  border: 1px solid #e2e8f0; /* slate-200 */
  box-shadow: none; /* No shadow by default */
  padding: 1.5rem; /* p-6 */
  transition: all 0.2s ease;
}

.card:hover {
  border-color: #cbd5e1; /* slate-300 */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.no-scrollbar {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}

.tabler-icon {
  color: var(--label-color);
  margin: 0.25rem;
}

.elevated-button.primary .tabler-icon {
  color: var(--color-on-primary);
  margin: 0 0.5rem 0 0;
}

.elevated-button.secondary .tabler-icon {
  color: var(--color-on-secondary);
  margin: 0 0.5rem 0 0;
}

.elevated-button.accent .tabler-icon {
  color: var(--color-on-accent);
  margin: 0 0.5rem 0 0;
}

.elevated-button.success .tabler-icon {
  color: var(--color-on-success);
  margin: 0 0.5rem 0 0;
}

.elevated-button.warning .tabler-icon {
  color: var(--color-on-warning);
  margin: 0 0.5rem 0 0;
}

.elevated-button.error .tabler-icon {
  color: var(--color-on-error);
  margin: 0 0.5rem 0 0;
}

.elevated-button.danger .tabler-icon {
  color: var(--color-on-danger);
  margin: 0 0.5rem 0 0;
}

.elevated-button.info .tabler-icon {
  color: var(--color-on-info);
  margin: 0 0.5rem 0 0;
}

.outlined-button.primary .tabler-icon,
.text-button.primary .tabler-icon,
.link.primary .tabler-icon {
  color: var(--color-primary);
  margin: 0 0.5rem 0 0;
}

.outlined-button.secondary .tabler-icon,
.text-button.secondary .tabler-icon,
.link.secondary .tabler-icon {
  color: var(--color-secondary);
  margin: 0 0.5rem 0 0;
}

.outlined-button.accent .tabler-icon,
.text-button.accent .tabler-icon,
.link.accent .tabler-icon {
  color: var(--color-accent);
  margin: 0 0.5rem 0 0;
}

.outlined-button.success .tabler-icon,
.text-button.success .tabler-icon,
.link.success .tabler-icon {
  color: var(--color-success);
  margin: 0 0.5rem 0 0;
}

.outlined-button.warning .tabler-icon,
.text-button.warning .tabler-icon,
.link.warning .tabler-icon {
  color: var(--color-warning);
  margin: 0 0.5rem 0 0;
}

.outlined-button.error .tabler-icon,
.text-button.error .tabler-icon,
.link.error .tabler-icon {
  color: var(--color-error);
  margin: 0 0.5rem 0 0;
}

.outlined-button.danger .tabler-icon,
.text-button.danger .tabler-icon,
.link.danger .tabler-icon {
  color: var(--color-danger);
  margin: 0 0.5rem 0 0;
}

.outlined-button.info .tabler-icon,
.text-button.info .tabler-icon,
.link.info .tabler-icon {
  color: var(--color-info);
  margin: 0 0.5rem 0 0;
}

.outlined-button.primary:hover .tabler-icon,
.text-button.primary:hover .tabler-icon {
  color: var(--color-on-primary);
}

.outlined-button.secondary:hover .tabler-icon,
.text-button.secondary:hover .tabler-icon {
  color: var(--color-on-secondary);
}

.outlined-button.accent:hover .tabler-icon,
.text-button.accent:hover .tabler-icon {
  color: var(--color-on-accent);
}

.outlined-button.success:hover .tabler-icon,
.text-button.success:hover .tabler-icon {
  color: var(--color-on-success);
}

.outlined-button.warning:hover .tabler-icon,
.text-button.warning:hover .tabler-icon {
  color: var(--color-on-warning);
}

.outlined-button.error:hover .tabler-icon,
.text-button.error:hover .tabler-icon {
  color: var(--color-on-error);
}

.outlined-button.danger:hover .tabler-icon,
.text-button.danger:hover .tabler-icon {
  color: var(--color-on-danger);
}

.outlined-button.info:hover .tabler-icon,
.text-button.info:hover .tabler-icon {
  color: var(--color-on-info);
}

.icon-button {
  text-align: center;
  width: 2rem;
  height: 2rem;
  margin: 0.5rem;
  font-weight: bold;
  text-decoration: none;
  transition: 0.3s all;
}

.icon-button:hover,
.icon-button.hover,
.icon-button:hover .tabler-icon {
  transform: scale(1.1);
}

.icon-button:active,
.icon-button.active {
  text-decoration: underline;
  transform: scale(1.05);
}

.icon-button.success,
.icon-button.success .tabler-icon {
  color: var(--color-success);
}

.icon-button.danger,
.icon-button.danger .tabler-icon {
  color: var(--color-danger);
}

.icon-button.info,
.icon-button.info .tabler-icon {
  color: var(--color-info);
}

.icon-button.warning,
.icon-button.warning .tabler-icon {
  color: var(--color-warning);
}

.icon-button.primary,
.icon-button.primary .tabler-icon {
  color: var(--color-primary);
}

.icon-button.secondary,
.icon-button.secondary .tabler-icon {
  color: var(--color-secondary);
}

.icon-button.accent,
.icon-button.accent .tabler-icon {
  color: var(--color-accent);
}

.icon-button.error,
.icon-button.error .tabler-icon {
  color: var(--color-error);
}

.icon-button.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.icon-button.disabled:hover {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.icon-button.disabled:active,
.icon-button.disabled:focus,
.icon-button.disabled:before,
.icon-button.disabled:after {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Menu and Navigation Items */
.top-menu-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  color: #ffffff; /* white text for dark navbar */
  height: 2.5rem; /* 40px - sabit yükseklik */
  gap: 0.25rem; /* chevron icon ile text arası boşluk */
}

.top-menu-item:hover {
  background-color: rgba(255, 255, 255, 0.9); /* Almost white background */
  color: #1f2937 !important; /* Dark gray text for contrast */
}

.top-menu-item:hover .tabler-icon {
  color: #1f2937 !important; /* Dark gray icons on hover */
}

.menu-dropdown {
  position: absolute;
  z-index: 9999;
  background-color: #ffffff;
  color: #334155; /* slate-700 */
  border-radius: 0.5rem; /* rounded-lg */
  border: 1px solid #e2e8f0; /* slate-200 */
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-md */
  margin-top: 0.5rem;
  padding: 0.5rem;
}

.menu-item {
  min-width: 16rem;
  min-height: 2.5rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 0.5rem 0.75rem;
  cursor: pointer;
  transition: all 0.2s ease;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  color: #475569; /* slate-600 */
}

.menu-item:hover {
  background-color: #f8fafc; /* slate-50 */
  color: #1e293b; /* slate-800 */
}

.menu-item:hover .tabler-icon {
  color: #1e293b !important; /* slate-800 */
}

.menu-item .icon {
  width: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.menu-item .text {
  font-size: 1rem;
  font-weight: 500;
}

/* Borders and Dividers */
.border-bottom {
  border-bottom: 1px solid #e2e8f0; /* slate-200 */
}

.border-top {
  border-top: 1px solid #e2e8f0; /* slate-200 */
}

.divider {
  height: 1px;
  background-color: #e2e8f0; /* slate-200 */
  margin-bottom: 0.5rem;
  margin-top: 0.5rem;
}

/* Status Indicators */
.status-indicator {
  width: 0.5rem; /* h-2 w-2 */
  height: 0.5rem;
  border-radius: 9999px; /* rounded-full */
  display: inline-block;
  margin-right: 0.5rem;
}

.status-indicator.success {
  background-color: #10b981; /* emerald-500 */
}

.status-indicator.warning {
  background-color: #f59e0b; /* amber-500 */
}

.status-indicator.error {
  background-color: #ef4444; /* red-500 */
}

.status-indicator.info {
  background-color: var(--color-primary);
}

/* Loading States */
.loading {
  opacity: 0.5;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

/* Focus Styles */
*:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

button:focus-visible,
a:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Search Bars */
.search-input {
  background-color: #ffffff;
  border: 1px solid #e2e8f0; /* slate-200 */
  border-radius: 9999px; /* rounded-full */
  padding: 0.5rem 1rem 0.5rem 2.5rem;
  font-size: 0.875rem;
  color: #334155; /* slate-700 */
  transition: all 0.2s ease;
  width: 100%;
}

.search-input:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(0, 31, 97, 0.1);
}

.search-input::placeholder {
  color: #94a3b8; /* slate-400 */
}

/* Badge Styles */
.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.125rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 500;
  border-radius: 9999px;
  background-color: var(--color-primary);
  color: #ffffff;
}

.badge.secondary {
  background-color: #f1f5f9; /* slate-100 */
  color: #475569; /* slate-600 */
}

/* Container Spacing */
.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.5rem; /* px-6 */
}

/* Section Spacing */
.section {
  padding: 2rem 0; /* space-y-8 */
}

.section-title {
  font-size: 1.25rem; /* text-xl */
  font-weight: 600;
  color: #0f172a; /* slate-900 */
  margin-bottom: 1.5rem;
}

/* Grid Layouts */
.grid-cards {
  display: grid;
  gap: 1.5rem; /* gap-6 */
}

/* Table Styles */
.custom-table {
  width: 100%;
  border-collapse: collapse;
  background-color: transparent;
  color: #334155; /* slate-700 */
  font-size: 0.875rem;
}

.custom-table th {
  background-color: #f8fafc; /* slate-50 */
  color: #64748b; /* slate-500 */
  font-weight: 600;
  text-align: left;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e2e8f0; /* slate-200 */
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.custom-table tr {
  border-bottom: 1px solid #e2e8f0; /* slate-200 */
  transition: all 0.2s ease;
}

.custom-table tr:hover {
  background-color: #f8fafc; /* slate-50 */
  box-shadow: none;
}

.custom-table td {
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e2e8f0; /* slate-200 */
}

/* Alternatif satır renkleri */
.custom-table tbody tr:nth-child(even) {
  background-color: #f8fafc; /* slate-50 - çok hafif */
}

/* Sidebar Menu Styles */
.sidebar_menu .sidebar_menu_item {
  background-color: transparent;
  color: #475569; /* slate-600 */
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 0.875rem;
}

.sidebar_menu .sidebar_menu_item:hover {
  background-color: #f8fafc; /* slate-50 */
  color: #1e293b; /* slate-800 */
}

.sidebar_menu_item.active {
  background-color: rgba(0, 31, 97, 0.05); /* mavi-ton/5 */
  color: var(--color-primary);
  border-left: 3px solid var(--color-primary);
  margin-left: -3px;
}

.sidebar_menu_item:hover .tabler-icon,
.sidebar_menu_item.active .tabler-icon {
  color: var(--color-primary) !important;
}

/* Remove Radial Effects */
.radial-effect-top-left,
.radial-effect-bottom-right {
  display: none;
}

/* Progress Bar */
.progress-bar {
  background-color: #e2e8f0; /* slate-200 */
  border-radius: 9999px;
  height: 0.5rem;
}

.progress-bar .progress {
  background-color: var(--color-primary);
  color: transparent;
  border-radius: 9999px;
  height: 100%;
  transition: width 0.3s ease;
}

/* Breadcrumbs */
.breadcrumbs {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #64748b; /* slate-500 */
}

.breadcrumbs a {
  color: #64748b; /* slate-500 */
  text-decoration: none;
  transition: color 0.2s ease;
}

.breadcrumbs a:hover {
  color: var(--color-primary);
}

.breadcrumbs .separator {
  color: #cbd5e1; /* slate-300 */
}

/* Dark mode adjustments */
.dark body {
  background-color: #1e293b; /* slate-800 */
}

.dark .card {
  background-color: #0f172a; /* slate-900 */
  border-color: #334155; /* slate-700 */
}

.dynamic-form-card-edit-display {
  transition: all 0.3s;
}

.dynamic-form-edit-display {
  background-color: transparent;
  transition: all 0.3s;
}

.dynamic-form-edit-display .actions,
.dynamic-form-edit-display .extra-fields,
.dynamic-form-card-edit-display .actions,
.dynamic-form-card-edit-display .extra-fields {
  display: none;
}

.dynamic-form-edit-display:hover,
.dynamic-form-card-edit-display:hover {
  border: 2px dashed var(--card-border);
}

.dynamic-form-edit-display:hover .actions,
.dynamic-form-edit-display:hover .extra-fields,
.dynamic-form-card-edit-display:hover .actions,
.dynamic-form-card-edit-display:hover .extra-fields {
  display: flex;
}

.choice-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.325rem;
  color: var(--color-muted);
  border: 1px solid var(--color-secondary);
  border-radius: var(--card-radius);
}

.choice-chips .chip {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  transition: all 0.3s;
  cursor: pointer;
}
.choice-chips .chip.selected {
  background-color: var(--color-secondary);
  color: var(--color-on-secondary);
  border: 1px solid var(--color-secondary);
  border-radius: var(--input-radius);
}

.pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.325rem;
  color: var(--color-muted);
}

.pills .pill {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.325rem 0.625rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  transition: all 0.3s;
  cursor: pointer;
  color: var(--color-on-secondary);
  background-color: rgba(var(--color-secondary-rgb), 0.5);
  border-radius: var(--input-radius);
}

.pills .pill.selected {
  background-color: var(--color-secondary);
  color: var(--color-on-secondary);
}

.form_page {
  flex: 0 0 100%; /* Each page takes full width */
}

.display-on-hover-container {
  transition: all 0.3s;
}

.display-on-hover {
  display: none;
  transition: all 0.3s;
}

.display-on-hover-container:hover .display-on-hover {
  display: flex;
}

.corporate-service-wrapper {
}

.button-gradient {
  background: linear-gradient(90deg, #a7e2ff 0%, #0095de 100%);
  border: none;
}

.border-gradient {
  border-color: #a7e2ff;
  border-radius: 24px;
  border-width: 2px;
  border-style: solid;
}

/* Corporate Footer - Gradient Background */
footer {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  color: #ffffff !important;
  border-top: 1px solid #3b82f6 !important;
}

footer a {
  color: #ffffff !important;
  opacity: 0.9 !important;
  transition: opacity 0.2s ease !important;
}

footer a:hover {
  opacity: 1 !important;
}

/* Enhanced Button Gradients - Corporate Style */
.elevated-button.primary {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  color: #ffffff !important;
  border: 1px solid #001f61 !important;
  box-shadow: 0 2px 4px rgba(0, 31, 97, 0.2) !important;
}

.elevated-button.primary:hover,
.elevated-button.primary:active,
.elevated-button.primary.hover,
.elevated-button.primary.active {
  background: linear-gradient(135deg, #001f61 0%, #2563eb 100%) !important;
  box-shadow: 0 4px 8px rgba(0, 31, 97, 0.3) !important;
}

/* Inline style buttons with navy background - Add gradient */
button[style*="background-color: #001f61"],
a[style*="background-color: #001f61"] {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  box-shadow: 0 2px 4px rgba(0, 31, 97, 0.2) !important;
  transition: all 0.2s ease !important;
}

button[style*="background-color: #001f61"]:hover,
a[style*="background-color: #001f61"]:hover {
  background: linear-gradient(135deg, #001f61 0%, #2563eb 100%) !important;
  box-shadow: 0 4px 8px rgba(0, 31, 97, 0.3) !important;
}

/* Title Transition Effects - Modern Corporate Style */
h1, h2, h3, h4, h5, h6,
.font-semibold,
.text-2xl,
.text-xl,
.text-lg,
.text-base,
.text-sm,
.text-xs {
  transition: all 0.3s ease !important;
}

/* Enhanced Title Hover Effects */
h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Title-like divs - apply same effects */
.font-semibold.text-2xl:hover,
.font-semibold.text-xl:hover,
.font-semibold.text-lg:hover,
.font-bold.text-2xl:hover,
.font-bold.text-xl:hover,
.font-bold.text-lg:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Specific title classes used in templates */
.font-semibold.text-2xl.text-gray-800:hover,
.font-bold.text-2xl:hover,
.text-xl.font-semibold:hover,
.text-lg.font-medium:hover,
.text-lg.font-semibold:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Card titles - more subtle effect */
.card h1:hover, .card h2:hover, .card h3:hover, .card h4:hover, .card h5:hover, .card h6:hover,
.card .font-semibold:hover, .card .font-bold:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Table headers - gradient on hover */
th.font-semibold:hover,
th.text-xs.font-semibold:hover,
thead th:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* Navbar menu items - already styled but enhance */
.top-menu-item:hover span {
  color: #1f2937 !important; /* Simple dark gray text */
}

/* Footer link enhancement */
footer .link:hover,
footer a:hover {
  background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* Button text gradient effect */
.elevated-button.primary:hover,
.elevated-button.primary:active {
  color: #ffffff !important;
}

/* Search and filter buttons - ensure consistency */
button[type="submit"]:not(.outlined-button):not(.text-button) {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  color: #ffffff !important;
  border: 1px solid #001f61 !important;
  box-shadow: 0 2px 4px rgba(0, 31, 97, 0.2) !important;
  transition: all 0.2s ease !important;
}

button[type="submit"]:not(.outlined-button):not(.text-button):hover {
  background: linear-gradient(135deg, #001f61 0%, #2563eb 100%) !important;
  box-shadow: 0 4px 8px rgba(0, 31, 97, 0.3) !important;
}

/* Responsive title effects - smaller on mobile */
@media (max-width: 768px) {
  h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
  .font-semibold:hover, .font-bold:hover {
    transform: translateY(-0.5px) !important;
  }
}

/* Accessibility - respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  h1, h2, h3, h4, h5, h6,
  .font-semibold, .font-bold,
  .elevated-button, .outlined-button,
  button, a {
    transition: none !important;
    transform: none !important;
  }
  
  h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
  .font-semibold:hover, .font-bold:hover {
    transform: none !important;
  }
}

/* ========= EXTENDED TITLE & ELEMENT HOVER EFFECTS ========= */

/* Article Titles & Content Headers */
article h1:hover, article h2:hover, article h3:hover, article h4:hover, article h5:hover, article h6:hover,
.article-title:hover,
.prose h1:hover, .prose h2:hover, .prose h3:hover, .prose h4:hover, .prose h5:hover, .prose h6:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Form Labels & Field Labels */
label:hover,
.floatingLabel label:hover,
.form-label:hover,
.field-label:hover,
.filter-label:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
  transition: all 0.3s ease !important;
}

/* Span Titles & Headers */
span.font-semibold:hover,
span.font-bold:hover,
span.title:hover,
span.header:hover,
.subtitle:hover,
.section-title:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* List Page Headers */
.page-title:hover,
.page-header:hover,
.list-title:hover,
.container-title:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Specific Classes Used in Templates */
.text-2xl.font-bold:hover,
.text-xl.font-bold:hover,
.text-lg.font-bold:hover,
.text-base.font-bold:hover,
.font-semibold.text-gray-800:hover,
.font-semibold.text-gray-900:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Category Tags & Badges */
.category-tag:hover,
.badge:hover,
.tag:hover,
.chip:hover,
.pill:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  color: #ffffff !important;
  transform: translateY(-1px) scale(1.05) !important;
  box-shadow: 0 4px 8px rgba(0, 31, 97, 0.3) !important;
}

/* Status Indicators & Tags */
.inline-flex.items-center.px-2.py-1.rounded-full:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  color: #ffffff !important;
  transform: translateY(-1px) scale(1.05) !important;
  box-shadow: 0 2px 4px rgba(0, 31, 97, 0.2) !important;
}

/* Breadcrumb Links */
.breadcrumb a:hover,
nav[aria-label="Breadcrumb"] a:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* Empty State Titles */
.empty-state h3:hover,
.no-data h3:hover,
.text-center h3:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Statistics Cards Text */
.stats-card .text-sm:hover,
.statistics .text-sm:hover,
.metric-label:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Meta Information */
.meta-info:hover,
.text-gray-500:hover,
.text-gray-600:hover,
.text-label_muted:hover {
  background: linear-gradient(135deg, #475569 0%, #64748b 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Navigation Links */
.nav-link:hover,
.menu-link:hover,
.sidebar-link:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Card Hover Effects */
.bg-white:hover .font-semibold,
.bg-background:hover .font-semibold,
.card:hover .font-semibold,
.card:hover .font-bold {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Specific Template Elements */
/* Patient List Page */
.patient-name:hover,
.patient-info:hover,
/* Professional List Page */
.professional-name:hover,
.professional-info:hover,
/* Corporate List Page */
.corporate-name:hover,
.corporate-info:hover,
/* Article List Page */
.article-title:hover,
.article-meta:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Form Control Labels */
.w-full label:hover,
.form-control label:hover,
.field-wrapper label:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Hover Effect on Specific Text Colors */
.text-gray-800:hover,
.text-gray-900:hover,
.text-slate-800:hover,
.text-slate-900:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-1px) !important;
}

/* Interactive Elements Movement */
.hover-lift:hover,
.interactive:hover {
  transform: translateY(-2px) !important;
  transition: transform 0.3s ease !important;
}

/* Section Dividers & Borders */
.section-divider:hover,
.border-title:hover {
  border-color: #001f61 !important;
  transition: border-color 0.3s ease !important;
}

/* Filter & Search Elements */
.filter-item:hover,
.search-item:hover,
.filter-form label:hover {
  background: linear-gradient(135deg, #001f61 0%, #1e40af 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  transform: translateY(-0.5px) !important;
}

/* Override for white text elements in gradient cards */
.bg-gradient-to-br .text-white:hover,
.bg-gradient-to-r .text-white:hover {
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: initial !important;
  background-clip: initial !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

/* Smooth Transitions for All Hoverable Elements */
h1, h2, h3, h4, h5, h6,
.font-semibold, .font-bold,
label, span,
.category-tag, .badge, .tag,
.nav-link, .menu-link,
.text-gray-800, .text-gray-900,
.article-title, .page-title {
  transition: all 0.3s ease !important;
  cursor: default !important;
}

/* Mobile Responsive - Reduced Effects */
@media (max-width: 768px) {
  h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
  .font-semibold:hover, .font-bold:hover,
  label:hover, span:hover {
    transform: translateY(-0.5px) !important;
  }
  
  .category-tag:hover,
  .badge:hover,
  .tag:hover {
    transform: translateY(-0.5px) scale(1.02) !important;
  }
}

/* Dark Theme Support */
.dark h1:hover, .dark h2:hover, .dark h3:hover, .dark h4:hover, .dark h5:hover, .dark h6:hover,
.dark .font-semibold:hover, .dark .font-bold:hover {
  background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* Accessibility - Respect Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  h1, h2, h3, h4, h5, h6,
  .font-semibold, .font-bold,
  label, span, .category-tag, .badge,
  .nav-link, .menu-link {
    transition: none !important;
    transform: none !important;
  }
  
  h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
  .font-semibold:hover, .font-bold:hover,
  label:hover, span:hover,
  .category-tag:hover, .badge:hover {
    transform: none !important;
  }
}
