/* ============================================================
   TurkuazSiteYonetimi — Layout & Core Styles
   Mobile-first responsive admin panel
   ============================================================ */


/* Global scrollbar */
* { scrollbar-width: thin; scrollbar-color: rgba(0,0,0,.15) transparent; }
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: rgba(0,0,0,.15); border-radius: 3px; }
*::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,.25); }
[data-bs-theme="dark"] * { scrollbar-color: rgba(255,255,255,.15) transparent; }
[data-bs-theme="dark"] *::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); }
[data-bs-theme="dark"] *::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.25); }

/* Odeme yontemi dropdown hover */
#odemeYontemiDropdown button:hover { background: var(--bs-tertiary-bg); }

/* Disabled buton muted gorunum */
.btn:disabled, .btn.disabled {
  opacity: .5;
  cursor: not-allowed;
}
.btn-primary:disabled, .btn-primary.disabled {
  background-color: var(--bs-secondary-bg);
  border-color: var(--bs-secondary-bg);
  color: var(--bs-secondary-color);
}

/* Outline buton hover'da ikon rengi */
.btn-outline-secondary:hover i,
.btn-outline-secondary:hover .bi,
.btn-outline-danger:hover i,
.btn-outline-danger:hover .bi { color: inherit !important; }

/* --- CSS Custom Properties --- */
:root {
  --tk-sidebar-width: 260px;
  --tk-sidebar-collapsed-width: 0px;
  --tk-topbar-height: 56px;
  --tk-sidebar-bg: var(--bs-primary, #0d9488);
  --tk-sidebar-hover: rgba(255,255,255,0.1);
  --tk-sidebar-active: rgba(255,255,255,0.18);
  --tk-sidebar-text: rgba(255,255,255,0.7);
  --tk-sidebar-text-hover: rgba(255,255,255,0.9);
  --tk-sidebar-text-active: #ffffff;
  --tk-sidebar-section: rgba(255,255,255,0.4);
  --tk-sidebar-border: rgba(255,255,255,0.1);
  --tk-body-bg: #f1f5f9;
  --tk-card-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --tk-card-shadow-hover: 0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);
  --tk-transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

[data-bs-theme="dark"] {
  --tk-sidebar-hover: rgba(255,255,255,0.06);
  --tk-sidebar-active: rgba(255,255,255,0.12);
  --tk-sidebar-section: rgba(255,255,255,0.35);
  --tk-sidebar-border: rgba(255,255,255,0.08);
  --tk-body-bg: #0f172a;
  --tk-card-shadow: 0 1px 3px rgba(0,0,0,0.2), 0 1px 2px rgba(0,0,0,0.15);
  --tk-card-shadow-hover: 0 4px 12px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.2);
}

/* ============================================================
   TOAST — Custom style
   ============================================================ */
.tk-toast {
  background: var(--bs-body-bg);
  border: none;
  border-radius: 0.625rem;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.08);
  overflow: hidden;
  min-width: 300px;
  max-width: 420px;
  animation: toastSlideIn 0.35s ease;
}

.tk-toast.hiding {
  animation: toastSlideOut 0.25s ease forwards;
}

.tk-toast-body {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1rem;
}

.tk-toast-icon {
  font-size: 1.2rem;
  flex-shrink: 0;
}

.tk-toast-content {
  flex: 1;
  min-width: 0;
}

.tk-toast-message {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--bs-body-color);
  line-height: 1.4;
}

.tk-toast-close {
  border: none;
  background: transparent;
  color: var(--bs-secondary-color);
  opacity: 0.4;
  font-size: 1rem;
  padding: 0;
  cursor: pointer;
  transition: opacity 0.15s ease;
  flex-shrink: 0;
}

.tk-toast-close:hover {
  opacity: 0.8;
}

/* Progress bar */
.tk-toast-progress {
  height: 3px;
  width: 100%;
  animation: toastProgress linear forwards;
  transform-origin: left;
  opacity: 0.6;
}

@keyframes toastProgress {
  from { transform: scaleX(1); }
  to { transform: scaleX(0); }
}

@keyframes toastSlideIn {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes toastSlideOut {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(30px);
  }
}

/* ============================================================
   TOOLTIP — Custom style
   ============================================================ */
.tooltip {
  --bs-tooltip-bg: var(--bs-primary);
  --bs-tooltip-color: #fff;
  --bs-tooltip-opacity: 1;
  --bs-tooltip-border-radius: 0.5rem;
  --bs-tooltip-padding-x: 0.75rem;
  --bs-tooltip-padding-y: 0.4rem;
  --bs-tooltip-font-size: 0.75rem;
}

.tooltip-inner {
  font-weight: normal;
  letter-spacing: 0.01em;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  max-width: 280px;
}

.bs-tooltip-top .tooltip-arrow::before { border-top-color: var(--bs-primary) !important; }
.bs-tooltip-bottom .tooltip-arrow::before { border-bottom-color: var(--bs-primary) !important; }
.bs-tooltip-start .tooltip-arrow::before { border-left-color: var(--bs-primary) !important; }
.bs-tooltip-end .tooltip-arrow::before { border-right-color: var(--bs-primary) !important; }

/* --- Badge Global --- */
.badge {
  font-weight: 600 !important;
  --bs-badge-font-size: 0.90em;
}

/* --- Base --- */
body {
  background-color: var(--tk-body-bg);
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  overflow-x: hidden;
  color: #4b5563;
}

[data-bs-theme="dark"] body {
  color: #a1a9b8;
}

/* ============================================================
   SIDEBAR
   ============================================================ */
.sidebar {
  position: fixed;
  top: 0;
  left: 0;
  width: var(--tk-sidebar-width);
  height: 100vh;
  background-color: var(--tk-sidebar-bg);
  color: var(--tk-sidebar-text);
  display: flex;
  flex-direction: column;
  z-index: 1060;
  transition: transform var(--tk-transition);
  overflow: hidden;
}

/* --- Sidebar Header --- */
.sidebar-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1.25rem;
  height: var(--tk-topbar-height);
  background-color: var(--bs-body-bg);
  border-bottom: 1px solid var(--bs-border-color);
  flex-shrink: 0;
  transition: background-color 0.15s ease;
}

.sidebar-header .sidebar-title {
  color: var(--bs-body-color);
}

a.sidebar-header:hover {
  background-color: var(--bs-tertiary-bg);
}

.sidebar-logo {
  width: 34px;
  height: 34px;
  object-fit: contain;
  border-radius: 0.5rem;
  flex-shrink: 0;
}
.sidebar-logo-full {
  max-height: 38px;
  max-width: 180px;
  object-fit: contain;
}

.sidebar-brand-icon {
  width: 34px;
  height: 34px;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  flex-shrink: 0;
}

.sidebar-title {
  font-weight: 600;
  font-size: 0.95rem;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}

/* --- Sidebar Nav --- */
.sidebar-nav {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0.5rem 0;
}

.sidebar-nav::-webkit-scrollbar {
  width: 3px;
}
.sidebar-nav::-webkit-scrollbar-thumb {
  background-color: rgba(255,255,255,0.12);
  border-radius: 3px;
}

.sidebar-nav .nav-link {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.1rem 0.75rem;
  padding: 0.6rem 1.25rem;
  margin: 1px 0.5rem;
  color: var(--tk-sidebar-text);
  font-size: 0.875rem;
  font-weight: 400;
  border-radius: 0.5rem;
  transition: all 0.15s ease;
  text-decoration: none;
}

/* Sidebar hint (menü açıklama metni) */
.sidebar-hint {
  display: block;
  width: 100%;
  padding-left: 2rem;
  font-size: 0.675rem;
  color: var(--tk-sidebar-section);
  font-weight: 400;
  line-height: 1.2;
  margin-top: -0.1rem;
}

.sidebar-nav .nav-link:hover {
  background-color: var(--tk-sidebar-hover);
  color: var(--tk-sidebar-text-hover);
}

.sidebar-nav .nav-link.active {
  background-color: var(--tk-sidebar-active);
  color: var(--tk-sidebar-text-active);
  font-weight: 500;
}

.sidebar-nav .nav-link.active::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 60%;
  border-radius: 0 3px 3px 0;
}

.sidebar-nav .nav-item {
  position: relative;
}

.sidebar-nav .nav-link i {
  font-size: 1.05rem;
  width: 1.25rem;
  text-align: center;
  flex-shrink: 0;
  opacity: 0.7;
}

.sidebar-nav .nav-link:hover i,
.sidebar-nav .nav-link.active i {
  opacity: 1;
}

.nav-section {
  padding: 1.25rem 1.25rem 0.35rem 1.75rem;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--tk-sidebar-section);
  text-transform: uppercase;
  list-style: none;
}

/* (sidebar-footer kaldirildi) */

/* ============================================================
   SIDEBAR — Mobile & Desktop States
   ============================================================ */

/* MOBILE (default: hidden) */
.sidebar {
  transform: translateX(-100%);
}
.sidebar.show {
  transform: translateX(0);
}

/* Overlay (mobile only) */
.sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 1055;
  opacity: 0;
  transition: opacity var(--tk-transition);
}
.sidebar-overlay.show {
  display: block;
  opacity: 1;
}

/* DESKTOP (lg+): sidebar visible, collapse ile gizlenebilir */
@media (min-width: 992px) {
  .sidebar {
    transform: translateX(0);
  }
  .sidebar.collapsed {
    transform: translateX(-100%);
  }
  .sidebar-overlay {
    display: none !important;
  }
}

/* DESKTOP: main-wrapper expanded (sidebar collapsed) */
@media (min-width: 992px) {
  .main-wrapper.expanded {
    margin-left: 0;
  }
}

/* ============================================================
   MAIN WRAPPER
   ============================================================ */
.main-wrapper {
  min-height: 100vh;
  transition: margin-left var(--tk-transition);
}

@media (min-width: 992px) {
  .main-wrapper {
    margin-left: var(--tk-sidebar-width);
  }
}

/* ============================================================
   TOPBAR
   ============================================================ */
.topbar {
  position: sticky;
  top: 0;
  height: var(--tk-topbar-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1rem;
  background-color: var(--bs-body-bg);
  border-bottom: 1px solid var(--bs-border-color);
  z-index: 1040;
  gap: 0.5rem;
}

[data-bs-theme="dark"] .topbar,
[data-bs-theme="dark"] .sidebar-header {
  border-bottom: none;
}

@media (min-width: 768px) {
  .topbar {
    padding: 0 1.5rem;
  }
}

.topbar-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 0.5rem;
  border: none;
  background: transparent;
  color: var(--bs-secondary-color);
  transition: background-color 0.15s ease, color 0.15s ease;
  position: relative;
  cursor: pointer;
  opacity: 0.7;
}

.topbar-btn:hover {
  background-color: var(--bs-tertiary-bg);
  color: var(--bs-body-color);
  opacity: 1;
}

/* Bell ring animation */
@keyframes bell-ring {
  0%   { transform: rotate(0); }
  10%  { transform: rotate(14deg); }
  20%  { transform: rotate(-12deg); }
  30%  { transform: rotate(10deg); }
  40%  { transform: rotate(-8deg); }
  50%  { transform: rotate(5deg); }
  60%  { transform: rotate(-3deg); }
  70%  { transform: rotate(0); }
  100% { transform: rotate(0); }
}

.topbar-btn.has-notification {
  opacity: 1;
}

.topbar-btn.has-notification .bell-ring {
  animation: bell-ring 1.5s ease-in-out infinite;
  animation-delay: 3s;
  transform-origin: top center;
}

.topbar-btn .badge {
  position: absolute;
  top: 2px;
  right: 2px;
  font-size: 0.55rem;
  padding: 0.2em 0.45em;
  line-height: 1;
}

/* --- User Button & Dropdown --- */
.topbar-user-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.65rem;
  border-radius: 0.5rem;
  border: none;
  background: transparent;
  color: var(--bs-secondary-color);
  font-size: 0.8125rem;
  font-weight: 500;
  transition: background-color 0.15s ease, color 0.15s ease;
  cursor: pointer;
  opacity: 0.75;
}

.topbar-user-btn:hover {
  background-color: var(--bs-tertiary-bg);
  color: var(--bs-body-color);
  opacity: 1;
}

.topbar-user-btn::after {
  display: none;
}

.topbar-user-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}
.topbar-user-avatar-placeholder {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(var(--bs-secondary-rgb), .08);
  color: var(--bs-secondary-color);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .9rem;
  flex-shrink: 0;
}
.topbar-user-info {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
  text-align: left;
}
.topbar-user-name {
  font-size: .8rem;
  font-weight: 600;
  color: var(--bs-body-color);
}
.topbar-user-role {
  font-size: .65rem;
  color: var(--bs-secondary-color);
  opacity: .7;
}

/* User Dropdown (hover ile açılır) */
.user-dropdown-wrap {
  position: relative;
}
.user-dropdown-wrap::after {
  content: '';
  position: absolute;
  top: 100%;
  right: 0;
  width: 100%;
  height: .5rem;
  pointer-events: none;
}
.user-dropdown-wrap:hover::after {
  pointer-events: auto;
}

.user-dropdown {
  position: absolute;
  top: calc(100% + .5rem);
  right: 0;
  min-width: 0;
  width: max-content;
  overflow: visible;
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: .375rem;
  padding: 0;
  pointer-events: none;
  opacity: 0;
  transform: scale(.96) translateY(-4px);
  transform-origin: top right;
  filter: blur(4px);
  transition: opacity .25s cubic-bezier(.4,0,.2,1),
              transform .25s cubic-bezier(.4,0,.2,1),
              filter .25s cubic-bezier(.4,0,.2,1);
}
.user-dropdown-wrap:hover .user-dropdown {
  pointer-events: auto;
  opacity: 1;
  transform: scale(1) translateY(0);
  filter: blur(0);
}

/* Arrow */
.user-dropdown::before {
  content: '';
  position: absolute;
  top: -7px;
  right: 14px;
  width: 12px;
  height: 12px;
  background: var(--bs-body-bg);
  border-top: 1px solid var(--bs-border-color);
  border-left: 1px solid var(--bs-border-color);
  transform: rotate(45deg);
  z-index: -1;
}

/* Header */
.user-dropdown-header {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .75rem 1rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.user-dropdown-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(var(--bs-secondary-rgb), .08);
  color: var(--bs-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}
.user-dropdown-avatar-img {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

/* Body */
.user-dropdown-body {
  overflow: hidden;
  border-radius: .375rem;
}

.user-dropdown-item,
.user-dropdown-item:any-link,
.user-dropdown-item:visited,
button.user-dropdown-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  width: 100%;
  padding: .6rem 1rem;
  border: none;
  border-bottom: 1px solid var(--bs-border-color);
  background: none;
  text-decoration: none;
  font-size: .8125rem;
  font-weight: 500;
  color: var(--bs-secondary-color) !important;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s, color .15s;
  text-align: left;
}
.user-dropdown-body form:last-child .user-dropdown-item,
.user-dropdown-body > .user-dropdown-item:last-child {
  border-bottom: none;
}
.user-dropdown-item:hover {
  background: var(--bs-tertiary-bg);
  color: var(--bs-body-color);
}

/* Icon circles */
.user-dropdown-icon {
  width: 28px;
  height: 28px;
  border-radius: .375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .8rem;
  color: var(--bs-secondary);
  background: rgba(var(--bs-secondary-rgb), .08);
  flex-shrink: 0;
  transition: background .15s;
}
.user-dropdown-item:hover .user-dropdown-icon {
  background: rgba(var(--bs-secondary-rgb), .12);
}

/* Danger variant */
.user-dropdown-item--danger {
  color: var(--bs-danger);
}
.user-dropdown-item--danger:hover {
  background: rgba(var(--bs-danger-rgb), .05);
  color: var(--bs-danger);
}
.user-dropdown-icon--danger {
  color: var(--bs-danger);
  background: rgba(var(--bs-danger-rgb), .08);
}
.user-dropdown-item--danger:hover .user-dropdown-icon--danger {
  background: rgba(var(--bs-danger-rgb), .12);
}

/* Admin Dropdown (Topbar gear — hover ile açılır) */
.admin-dropdown-wrap {
  position: relative;
}
/* Görünmez köprü — buton ile dropdown arası boşluğu kapatır */
.admin-dropdown-wrap::after {
  content: '';
  position: absolute;
  top: 100%;
  right: 0;
  width: 100%;
  height: .5rem;
  pointer-events: none;
}
.admin-dropdown-wrap:hover::after {
  pointer-events: auto;
}

.admin-dropdown {
  position: absolute;
  top: calc(100% + .5rem);
  right: 0;
  min-width: 0;
  width: max-content;
  overflow: visible;
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: .375rem;
  pointer-events: none;
  opacity: 0;
  transform: scale(.96) translateY(-4px);
  transform-origin: top right;
  filter: blur(4px);
  transition: opacity .25s cubic-bezier(.4,0,.2,1),
              transform .25s cubic-bezier(.4,0,.2,1),
              filter .25s cubic-bezier(.4,0,.2,1);
}

.admin-dropdown-wrap:hover .admin-dropdown {
  pointer-events: auto;
  opacity: 1;
  transform: scale(1) translateY(0);
  filter: blur(0);
}

/* Arrow — dropdown'un arkasında, border ile çerçeveli */
.admin-dropdown::before {
  content: '';
  position: absolute;
  top: -7px;
  right: 14px;
  width: 12px;
  height: 12px;
  background: var(--bs-body-bg);
  border-top: 1px solid var(--bs-border-color);
  border-left: 1px solid var(--bs-border-color);
  transform: rotate(45deg);
  z-index: -1;
}

.admin-dropdown-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  border-radius: .375rem;
}

.admin-dropdown-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .85rem 1rem;
  text-decoration: none;
  color: var(--bs-secondary-color);
  font-size: .8125rem;
  border-bottom: 1px solid var(--bs-border-color);
  border-right: 1px solid var(--bs-border-color);
  transition: background .15s, color .15s;
  white-space: nowrap;
}

.admin-dropdown-item:nth-child(2n) {
  border-right: none;
}
.admin-dropdown-item:nth-last-child(-n+2) {
  border-bottom: none;
}
/* tek kalan son öğe — tam genişlik */
.admin-dropdown-item:nth-last-child(1):nth-child(odd) {
  grid-column: 1 / -1;
  border-right: none;
}

.admin-dropdown-item:hover {
  background: color-mix(in srgb, var(--bs-primary) 8%, transparent);
  color: var(--bs-primary);
}
.admin-dropdown-item:hover .admin-dropdown-icon {
  background: rgba(var(--bs-secondary-rgb), .10);
}

.admin-dropdown-icon {
  width: 32px;
  height: 32px;
  border-radius: .5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .875rem;
  color: var(--bs-secondary);
  background: rgba(var(--bs-secondary-rgb), .08);
  transition: background .2s, color .2s, transform .2s;
  flex-shrink: 0;
}

.admin-dropdown-label {
  font-weight: 500;
}

/* ============================================================
   MAIN CONTENT
   ============================================================ */
.main-content {
  padding: 1rem;
}

@media (min-width: 576px) {
  .main-content {
    padding: 1.25rem;
  }
}

@media (min-width: 768px) {
  .main-content {
    padding: 1.5rem;
  }
}

/* Inline Dropdown (sayfa içi hover dropdown) */
.inline-dropdown-wrap {
  position: relative;
  display: inline-block;
}
.inline-dropdown-wrap::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: .4rem;
  pointer-events: none;
}
.inline-dropdown-wrap:hover::after {
  pointer-events: auto;
}
.inline-dropdown {
  position: absolute;
  top: calc(100% + .4rem);
  right: 0;
  min-width: 0;
  width: max-content;
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: .375rem;
  overflow: hidden;
  z-index: 1050;
  pointer-events: none;
  opacity: 0;
  transform: scale(.96) translateY(-4px);
  transform-origin: top right;
  transition: opacity .2s ease, transform .2s ease;
}
.inline-dropdown-wrap:hover .inline-dropdown {
  pointer-events: auto;
  opacity: 1;
  transform: scale(1) translateY(0);
}

/* Mobil dropdown toggle */
@media (max-width: 991.98px) {
  /* Hover yerine toggle (JS ile .open class eklenir) */
  .admin-dropdown-wrap:hover .admin-dropdown,
  .inline-dropdown-wrap:hover .inline-dropdown,
  .user-dropdown-wrap:hover .user-dropdown { pointer-events: none; opacity: 0; transform: scale(.96) translateY(-4px); }
  .admin-dropdown-wrap:hover::after,
  .inline-dropdown-wrap:hover::after,
  .user-dropdown-wrap:hover::after { pointer-events: none; }

  .admin-dropdown-wrap.open .admin-dropdown,
  .inline-dropdown-wrap.open .inline-dropdown,
  .user-dropdown-wrap.open .user-dropdown { pointer-events: auto; opacity: 1; transform: scale(1) translateY(0); filter: blur(0); }
  .admin-dropdown-wrap.open::after,
  .inline-dropdown-wrap.open::after,
  .user-dropdown-wrap.open::after { pointer-events: auto; }

  /* Stat kartları — mobilde daha kalın ve büyük font */
  .stat-card .stat-value,
  .stat-card .fw-bold,
  .card .fw-bold.fs-5 { font-weight: 800 !important; -webkit-text-stroke: .3px; font-size: 1.5rem !important; }

  /* Topbar — nav butonu büyük */
  #sidebar-toggle { width: 42px; height: 42px; }
  #sidebar-toggle-icon { font-size: 1.8rem !important; }

  /* Sidebar nav — mobilde büyük font */
  .sidebar-nav .nav-link { font-size: .95rem; padding: .7rem 1.25rem; }
  .sidebar-nav .nav-link i { font-size: 1.1rem; }

  /* Stat kartları — tek kalan son kart tam genişlik */
  .row > [class*="col-6"]:last-child:nth-child(odd) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Tablolar — mobilde sütunlar sıkışmasın, yatay scroll ile */
  .table-responsive .table {
    min-width: 700px;
  }
  .table-responsive .table th,
  .table-responsive .table td {
    white-space: nowrap;
  }

  /* Tarih hızlı seçim butonları — mobilde grid */
  #tarihSecim {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: .35rem !important;
  }
  #tarihSecim .vr { display: none; }
  #tarihSecim .btn { font-size: .78rem; padding: .4rem .25rem; white-space: nowrap; }

  /* Filtre — mobilde arama col-12, select'ler col-6 yan yana */
  .row.g-2.align-items-end,
  form.row.g-2 {
    flex-wrap: wrap !important;
    gap: .5rem !important;
  }
  .row.g-2.align-items-end > .col,
  form.row.g-2 > .col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
  .row.g-2.align-items-end > .col-auto:has(select),
  form.row.g-2 > .col-auto:has(select) {
    flex: 1 1 0 !important;
    max-width: 100% !important;
  }
  .row.g-2.align-items-end > .col-auto:has(select):only-child,
  form.row.g-2 > .col-auto:has(select):only-child {
    flex: 0 0 100% !important;
  }
  .row.g-2.align-items-end > .col-auto select,
  form.row.g-2 > .col-auto select {
    width: 100% !important;
  }
  .row.g-2.align-items-end input[type="text"],
  form.row.g-2 input[type="text"] {
    font-size: .9rem !important;
    padding: .6rem .75rem !important;
  }

  /* Tablo — mobilde aksiyon butonları büyük */
  .table .btn-sm { padding: .35rem .5rem; font-size: .85rem; }
  .table .badge { font-size: .72rem; }

  /* Aidatlar — mobilde tutar ve durum belirgin */
  .table .fw-medium { font-weight: 700 !important; font-size: .9rem; }

  /* Settings dropdown mobil — tek sütun, kompakt */
  .admin-dropdown-grid { grid-template-columns: 1fr; }
  .admin-dropdown-item { padding: .65rem .85rem; font-size: .78rem; border-right: none !important; border-bottom: 1px solid var(--bs-border-color) !important; }
  .admin-dropdown-item:last-child { border-bottom: none !important; }
  .admin-dropdown-item:nth-last-child(1):nth-child(odd) { grid-column: auto; }
  .admin-dropdown-icon { width: 28px; height: 28px; font-size: .75rem; }
}

/* Profil Avatar — hover overlay */
.profil-avatar-wrap {
  position: relative;
  display: block;
  width: 76px;
  height: 76px;
  border-radius: 50%;
  cursor: pointer;
  overflow: hidden;
  flex-shrink: 0;
}
.profil-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  transition: filter .2s;
}
.profil-avatar-placeholder {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: rgba(var(--bs-primary-rgb), .1);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: filter .2s;
}
.profil-avatar-placeholder span {
  color: var(--bs-primary);
  font-weight: 700;
  font-size: 1.75rem;
}
.profil-avatar-overlay {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, .45);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity .2s;
}
.profil-avatar-overlay i {
  color: #fff;
  font-size: 1.25rem;
}
.profil-avatar-wrap:hover .profil-avatar-overlay {
  opacity: 1;
}
.profil-avatar-wrap:hover .profil-avatar-img,
.profil-avatar-wrap:hover .profil-avatar-placeholder {
  filter: brightness(.85);
}

/* Nav Pills — proje geneli uyumlu stil */
.nav-pills .nav-link {
  font-size: .8125rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  border-radius: .5rem !important;
  padding: .5rem .75rem;
  transition: color .15s ease, background-color .15s ease, border-color .15s ease;
  border-left: 3px solid transparent;
}
.nav-pills .nav-link.active {
  color: var(--bs-primary);
  background: rgba(var(--bs-primary-rgb), .08);
  font-weight: 600;
  border-left: 3px solid var(--bs-primary);
  border-radius: .5rem !important;
}
.nav-pills .nav-link:not(.active):hover {
  color: var(--bs-body-color);
  background: var(--bs-tertiary-bg);
}

/* ============================================================
   FORM ERRORS — Proje geneli
   ============================================================ */

/* Tahakkuk tip toggle (segmented control) */
.tahakkuk-tip-toggle {
  display: flex;
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  overflow: hidden;
}
.tahakkuk-tip-btn {
  flex: 1;
  border: none;
  background: none;
  padding: .55rem .75rem;
  font-size: .8125rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  cursor: pointer;
  transition: all .15s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
}
.tahakkuk-tip-btn + .tahakkuk-tip-btn {
  border-left: 1px solid var(--bs-border-color);
}
.tahakkuk-tip-btn.active {
  background: var(--bs-primary);
  color: #fff;
  font-weight: 600;
}
.tahakkuk-tip-btn:not(.active):hover {
  background: var(--bs-tertiary-bg);
}

/* Crispy form error banner */
.form-errors-banner {
  margin-bottom: .75rem;
  padding: .65rem .9rem;
  border-radius: .5rem;
  border-left: 4px solid var(--bs-danger);
  background: rgba(var(--bs-danger-rgb), .06);
  display: flex;
  flex-direction: column;
  gap: .25rem;
}
.form-error-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .8125rem;
  color: var(--bs-danger);
}
.form-error-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: var(--bs-danger);
}

/* Django errorlist */
ul.errorlist,
.errorlist {
  list-style: none !important;
  margin: 0 0 .75rem !important;
  padding: .65rem 1rem !important;
  border-radius: .5rem;
  border-left: 4px solid var(--bs-danger);
  background: rgba(var(--bs-danger-rgb), .06);
  font-size: .8125rem;
  color: var(--bs-body-color);
}
ul.errorlist li,
.errorlist li {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .15rem 0;
  list-style: none !important;
}
ul.errorlist li::before,
.errorlist li::before {
  content: '';
  display: inline-block;
  width: 16px;
  min-width: 16px;
  height: 16px;
  flex-shrink: 0;
  background-color: var(--bs-danger);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' viewBox='0 0 16 16'%3E%3Cpath d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4zm.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2z'/%3E%3C/svg%3E");
  mask-size: contain;
  mask-repeat: no-repeat;
}

/* Alert overrides */
.alert {
  border: none;
  border-left: 4px solid transparent;
  border-radius: .5rem;
  font-size: .8125rem;
  padding: .75rem 1rem;
  display: flex;
  align-items: center;
  gap: .6rem;
}
.alert-danger {
  background: rgba(var(--bs-danger-rgb), .08);
  border-left-color: var(--bs-danger);
  color: var(--bs-body-color);
}
.alert-warning {
  background: rgba(var(--bs-warning-rgb), .1);
  border-left-color: var(--bs-warning);
  color: var(--bs-body-color);
}
.alert-success {
  background: rgba(var(--bs-success-rgb), .08);
  border-left-color: var(--bs-success);
  color: var(--bs-body-color);
}
.alert-info {
  background: rgba(var(--bs-info-rgb), .08);
  border-left-color: var(--bs-info);
  color: var(--bs-body-color);
}
.alert i:first-child,
.alert .bi:first-child {
  font-size: 1.1rem;
  flex-shrink: 0;
}

/* ============================================================
   FORM ELEMENTS — Enhanced
   ============================================================ */
.form-check-input {
  width: 1.2em;
  height: 1.2em;
  border: 2px solid var(--bs-secondary-color);
  cursor: pointer;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
.form-check-input:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .2);
}

/* ============================================================
   CARDS — Enhanced
   ============================================================ */
.card {
  border: none;
  box-shadow: var(--tk-card-shadow);
  border-radius: 0.75rem;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.card:hover {
  box-shadow: var(--tk-card-shadow-hover);
}

.card-header {
  background-color: transparent;
  border-bottom: 1px solid var(--bs-border-color);
  padding: 1rem 1.25rem;
  font-weight: 600;
}

/* --- Stat Card --- */
.stat-card {
  border: 2px solid transparent;
  box-shadow: var(--tk-card-shadow);
  border-radius: 0.75rem;
  transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
  overflow: hidden;
}
.stat-card.border-secondary {
  border-color: var(--bs-secondary) !important;
}

.stat-card:hover {
  box-shadow: var(--tk-card-shadow-hover);
  transform: translateY(-1px);
}

.stat-card {
  position: relative;
  overflow: hidden;
}

.stat-card .stat-icon {
  width: 44px;
  height: 44px;
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}

/* Büyük arka plan ikonu */
.stat-card .stat-bg-icon {
  position: absolute;
  right: -8px;
  bottom: -8px;
  font-size: 5rem;
  opacity: 0.06;
  z-index: 0;
  line-height: 1;
  pointer-events: none;
}

.stat-card > .card-body {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  position: relative;
  z-index: 1;
}

.stat-card .stat-value {
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1.2;
}

.stat-card .stat-label {
  font-size: 0.95rem;
  color: var(--bs-secondary-color);
  font-weight: 500;
}

/* Proje kart */
.proje-kart {
  transition: transform .2s ease, box-shadow .2s ease;
}
.proje-kart:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(0,0,0,.12) !important;
}
.proje-kart-img img,
.proje-kart-img > div {
  transition: transform .3s ease;
}
.proje-kart:hover .proje-kart-img img,
.proje-kart:hover .proje-kart-img > div {
  transform: scale(1.03);
}
.proje-kart .proje-kart-img {
  overflow: hidden;
}

/* Proje görsel galeri */
.gorsel-thumb:hover { opacity: .8; }
[data-fancybox]:focus { outline: none; }

/* Genel kart arka plan ikonu (stat-card dışı kartlar için) */
.card-bg-icon {
  position: absolute;
  right: -5px;
  bottom: -5px;
  font-size: 3.5rem;
  opacity: 0.07;
  z-index: 0;
  line-height: 1;
}

/* ============================================================
   SAKIN DASHBOARD CARDS
   ============================================================ */

/* Hero kart */
.sakin-hero {
  overflow: hidden;
  position: relative;
}
.sakin-hero-icon {
  width: 40px;
  height: 40px;
  border-radius: .625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.sakin-hero--ok {
  border: 2px solid rgba(var(--bs-success-rgb), .2);
}
.sakin-hero--ok .sakin-hero-icon {
  background: rgba(var(--bs-success-rgb), .1);
  color: var(--bs-success);
}
.sakin-hero--wait {
  border: 2px solid rgba(var(--bs-warning-rgb), .25);
}
.sakin-hero--wait .sakin-hero-icon {
  background: rgba(var(--bs-warning-rgb), .12);
  color: var(--bs-warning-emphasis, #997404);
}
.sakin-hero--late {
  border: 2px solid rgba(var(--bs-warning-rgb), .2);
}
.sakin-hero--late .sakin-hero-icon {
  background: rgba(var(--bs-warning-rgb), .1);
  color: var(--bs-warning-emphasis, #997404);
}
.sakin-hero--danger {
  border: 1px solid rgba(var(--bs-danger-rgb), .35);
  box-shadow: 0 0 0 3px rgba(var(--bs-danger-rgb), .06);
}
.sakin-hero--danger .sakin-hero-icon {
  background: rgba(var(--bs-danger-rgb), .1);
  color: var(--bs-danger);
}
.sakin-hero-social {
  font-size: .75rem;
  color: var(--bs-secondary-color);
  background: var(--bs-tertiary-bg);
  padding: .35rem .65rem;
  border-radius: 2rem;
  white-space: nowrap;
}

/* Teşekkür mesajı */
.sakin-tesekkur {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem .75rem;
  border-radius: .5rem;
  background: var(--bs-tertiary-bg);
  color: var(--bs-secondary-color);
  font-size: .8rem;
  font-weight: 500;
  margin-bottom: .75rem;
}

/* Ödeme sayfası — Trust bar */
.odeme-trust-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .65rem 1rem;
  border-radius: .5rem;
  background: rgba(var(--bs-primary-rgb), .06);
  color: var(--bs-primary);
  font-size: .85rem;
}
.odeme-trust-back {
  font-size: .78rem;
  color: var(--bs-secondary-color);
  text-decoration: none;
  transition: color .15s;
}
.odeme-trust-back:hover {
  color: var(--bs-body-color);
}

/* Ödeme sayfası — Sticky summary */
.odeme-summary-sticky {
  position: sticky;
  top: 5rem;
}

/* Ödeme sayfası — Onay kutuları */
.odeme-consent {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .6rem .85rem;
  border: 1px solid var(--bs-border-color);
  border-radius: .5rem;
  cursor: pointer;
  font-size: .8rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  transition: border-color .15s, background .15s;
}
.odeme-consent:hover {
  border-color: rgba(var(--bs-primary-rgb), .3);
  background: rgba(var(--bs-primary-rgb), .02);
}
.odeme-consent:has(input:checked) {
  border-color: var(--bs-primary);
  background: rgba(var(--bs-primary-rgb), .04);
  color: var(--bs-body-color);
}

/* Ödeme sayfası — Toggle tercihleri */
.odeme-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .85rem 1.25rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.odeme-toggle-row:last-child {
  border-bottom: none;
}
.odeme-toggle-row .form-check-input {
  width: 2.5em;
  height: 1.25em;
}
.odeme-toggle-row .form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* Ödeme sayfası — Form */
.odeme-label {
  font-size: .78rem;
  font-weight: 600;
  color: var(--bs-secondary-color);
  text-transform: uppercase;
  letter-spacing: .03em;
  margin-bottom: .35rem;
}
.odeme-input {
  padding: .7rem .85rem;
  font-size: .9rem;
  border: 1.5px solid var(--bs-border-color);
  border-radius: .5rem;
  transition: border-color .15s, box-shadow .15s;
}
.odeme-input:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .12);
}

/* Ödeme sayfası — Taksit */
.odeme-taksit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .75rem 1rem;
  border: 1.5px solid var(--bs-border-color);
  border-radius: .5rem;
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.odeme-taksit:hover {
  border-color: rgba(var(--bs-primary-rgb), .3);
  background: rgba(var(--bs-primary-rgb), .02);
}
.odeme-taksit--active {
  border-color: var(--bs-primary);
  background: rgba(var(--bs-primary-rgb), .04);
}

/* Ödeme sayfası — Kalemler */
.odeme-section-header {
  padding: .6rem 1.25rem;
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--bs-secondary-color);
  background: var(--bs-tertiary-bg);
  border-bottom: 1px solid var(--bs-border-color);
}
.odeme-section-header:not(:first-child) {
  border-top: 1px solid var(--bs-border-color);
}

.odeme-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .85rem 1.25rem;
  border-bottom: 1px solid var(--bs-border-color);
  cursor: pointer;
  transition: background .12s;
  margin: 0;
}
.odeme-item:last-child {
  border-bottom: none;
}
.odeme-item:hover {
  background: rgba(var(--bs-primary-rgb), .03);
}

.odeme-item .form-check-input {
  width: 1.15em;
  height: 1.15em;
  flex-shrink: 0;
  margin: 0;
}
.odeme-item .form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

.odeme-summary-card {
  border: 2px solid rgba(var(--bs-primary-rgb), .15);
}

/* Aidat durum serit */
.sakin-aidat-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  padding: .75rem 1.25rem;
  font-size: .8125rem;
  font-weight: 600;
  border-radius: .75rem .75rem 0 0;
}
.sakin-aidat-strip-link {
  font-size: .75rem;
  font-weight: 500;
  color: inherit;
  opacity: .7;
  text-decoration: none;
  white-space: nowrap;
  transition: opacity .15s;
}
.sakin-aidat-strip-link:hover {
  opacity: 1;
  color: inherit;
}
.sakin-aidat-strip--ok {
  background: linear-gradient(135deg, rgba(var(--bs-success-rgb), .12), rgba(var(--bs-success-rgb), .04));
  color: var(--bs-success);
}
.sakin-aidat-strip--late {
  background: linear-gradient(135deg, rgba(var(--bs-danger-rgb), .12), rgba(var(--bs-danger-rgb), .04));
  color: var(--bs-danger);
}
.sakin-aidat-strip--wait {
  background: linear-gradient(135deg, rgba(var(--bs-warning-rgb), .15), rgba(var(--bs-warning-rgb), .04));
  color: var(--bs-warning-emphasis, #997404);
}

/* Banka Hesap Kartı */
.sakin-banka-kart {
  border-radius: .75rem;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.04);
  border: 1px solid var(--bs-border-color);
  display: flex;
  flex-direction: column;
}
.sakin-banka-ust {
  position: relative;
  padding: 1.25rem 1.25rem 1rem;
  color: #fff;
  overflow: hidden;
}
.sakin-banka-ust-bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #1e293b 0%, #334155 50%, rgba(var(--bs-primary-rgb), .85) 100%);
  z-index: 0;
}
.sakin-banka-ust-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.08) 0%, transparent 60%);
}
.sakin-banka-ust > * { position: relative; z-index: 1; }

.sakin-banka-logo-wrap {
  background: #fff;
  border-radius: .4rem;
  padding: .3rem .6rem;
  display: flex;
  align-items: center;
  box-shadow: 0 1px 4px rgba(0,0,0,.1);
}
.sakin-banka-logo-wrap img {
  height: 18px;
  max-width: 80px;
  object-fit: contain;
}

.sakin-banka-alt {
  padding: 1rem 1.25rem 1.25rem;
  background: var(--bs-body-bg);
  flex: 1;
}

/* IBAN kutusu */
.sakin-iban-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .65rem 1rem;
  border-radius: .5rem;
  background: var(--bs-tertiary-bg);
  border: 1px dashed var(--bs-border-color);
  cursor: pointer;
  transition: all .2s ease;
  position: relative;
}
.sakin-iban-box:hover {
  border-color: var(--bs-primary);
  border-style: solid;
  background: rgba(var(--bs-primary-rgb), .04);
}
.sakin-iban-box.copied {
  border-color: var(--bs-success);
  border-style: solid;
  background: rgba(var(--bs-success-rgb), .04);
}
.sakin-iban-text {
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .8px;
  color: var(--bs-body-color);
  background: none;
  font-family: 'SF Mono', 'Cascadia Code', 'Consolas', monospace;
}
.sakin-iban-action {
  display: flex;
  align-items: center;
  color: var(--bs-secondary-color);
  font-size: .85rem;
  flex-shrink: 0;
  transition: color .2s;
}
.sakin-iban-box:hover .sakin-iban-action { color: var(--bs-primary); }
.sakin-iban-icon-ok { display: none; color: var(--bs-success); }
.sakin-iban-box.copied .sakin-iban-icon-copy { display: none; }
.sakin-iban-box.copied .sakin-iban-icon-ok { display: inline; }
.sakin-iban-box.copied .sakin-iban-action { color: var(--bs-success); }

/* ============================================================
   PAGE HEADER
   ============================================================ */
.page-header {
  margin-bottom: 1.25rem;
}

.page-header h4,
.page-header h5 {
  font-weight: 700;
  margin-bottom: 0;
  font-size: 1.15rem;
}

@media (min-width: 768px) {
  .page-header h4,
  .page-header h5 {
    font-size: 1.3rem;
  }
}

/* ============================================================
   EMPTY STATE
   ============================================================ */
.empty-state {
  text-align: center;
  padding: 2.5rem 1.5rem;
  color: var(--bs-secondary-color);
}

.empty-state-icon {
  font-size: 2.5rem;
  opacity: 0.2;
  margin-bottom: 0.75rem;
}

.empty-state-text {
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.empty-state-hint {
  font-size: 0.8rem;
  opacity: 0.7;
}

/* ============================================================
   QUICK ACTION BUTTONS
   ============================================================ */
.quick-action {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.625rem 0.875rem;
  border-radius: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--bs-body-color);
  text-decoration: none;
  border: 1px solid var(--bs-border-color);
  transition: all 0.15s ease;
  background: transparent;
}

.quick-action:hover {
  border-color: var(--bs-primary);
  color: var(--bs-primary);
  background-color: rgba(var(--bs-primary-rgb), 0.04);
}

.quick-action i {
  font-size: 1rem;
  opacity: 0.65;
}

.quick-action:hover i {
  opacity: 1;
}

/* --- Quick Action Cards (Dashboard grid) --- */
.quick-action-card {
  transition: all 0.2s ease;
  cursor: pointer;
}

.quick-action-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--tk-card-shadow-hover);
}

.quick-action-card:hover .rounded-circle {
  transform: scale(1.08);
  transition: transform 0.2s ease;
}

/* ============================================================
   TABS (card içi sekmeler)
   ============================================================ */
/* Proje geneli tab rounded fix */
.nav-tabs .nav-link {
  border-radius: .375rem .375rem 0 0;
}

.card-header .nav-tabs {
  gap: 0;
  overflow: hidden;
  border-radius: .75rem .75rem 0 0;
}

.card-header .nav-tabs .nav-link {
  border: none;
  border-top: 2px solid transparent;
  border-radius: 0;
  color: var(--bs-secondary-color);
  font-size: 0.8125rem;
  font-weight: 500;
  padding: 0.75rem 1.25rem;
  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.card-header .nav-tabs .nav-link:hover {
  color: var(--bs-body-color);
  background-color: var(--bs-tertiary-bg);
}

.card-header .nav-tabs .nav-link.active {
    color: var(--bs-primary);
    font-weight: 500;
    border-top-color: var(--bs-primary);
    background: linear-gradient(180deg, rgb(169 169 169 / 13%), rgb(247 249 250 / 0%)) !important;
}

.card-header .nav-tabs .nav-link i {
  opacity: 0.5;
}

.card-header .nav-tabs .nav-link.active i {
  opacity: 1;
}

/* lg border-end for split layout */
@media (min-width: 992px) {
  .border-end-lg { border-right: 1px solid var(--bs-border-color) !important; }
}

/* Detail table inside tabs */
.tab-pane .table-borderless td {
  padding: 0.5rem 0;
  font-size: 0.8125rem;
  border: none !important;
  box-shadow: none !important;
}

.tab-pane .table-borderless tr {
  box-shadow: none !important;
  border-bottom: 1px solid var(--bs-border-color);
}

.tab-pane .table-borderless tr:last-child {
  border-bottom: none;
}

/* TABLES — table.css dosyasından yüklenir (bkz: base.html) */
/* Card içindeki tablo taşma düzeltmesi */
.card:has(.table) { overflow: visible; }
/* table-responsive: desktop'ta scroll yok, mobilde auto */
.table-responsive { overflow-x: inherit; }
@media only screen and (max-width: 768px) {
  .table-responsive { overflow-x: auto; }
}
table .badge { color: inherit; }

/* Table action button group */
/* table-actions: btn-group yerine d-flex gap-1 davranışı */
.table-actions {
  display: flex !important;
  gap: 0.25rem;
  justify-content: flex-end;
}
.table-actions .btn {
  border-radius: var(--bs-border-radius) !important;
}

/* ============================================================
   FORMS
   ============================================================ */
.card-body form .row {
  padding-bottom: 0.75rem;
  margin-bottom: 0.75rem;
  border-bottom: 1px solid var(--bs-border-color);
}

.card-body form .row:last-of-type {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.card-body form label,
.card-body form .form-label {
  color: var(--bs-secondary-color);
  font-size: 0.8125rem;
  font-weight: 500;
}

.card-body form .form-control,
.card-body form .form-select {
  font-size: 0.875rem;
}

/* ============================================================
   MARKDOWN CONTENT
   ============================================================ */
.markdown-content h1, .markdown-content h2, .markdown-content h3,
.markdown-content h4, .markdown-content h5, .markdown-content h6 {
  margin-top: .75rem;
  margin-bottom: .375rem;
  font-weight: 600;
}
.markdown-content h1 { font-size: 1.25rem; }
.markdown-content h2 { font-size: 1.125rem; }
.markdown-content h3 { font-size: 1rem; }
.markdown-content p { margin-bottom: .5rem; }
.markdown-content ul, .markdown-content ol { padding-left: 1.5rem; margin-bottom: .5rem; }
.markdown-content li { margin-bottom: .125rem; }
.markdown-content blockquote {
  border-left: 3px solid var(--bs-border-color);
  padding-left: .75rem;
  color: var(--bs-secondary-color);
  margin: .5rem 0;
}
.markdown-content code { font-size: .85em; padding: .125rem .25rem; background: var(--bs-tertiary-bg); border-radius: .25rem; }
.markdown-content pre { background: var(--bs-tertiary-bg); padding: .75rem; border-radius: .375rem; overflow-x: auto; }
.markdown-content pre code { padding: 0; background: none; }
.markdown-content table { width: 100%; margin-bottom: .5rem; border-collapse: collapse; }
.markdown-content th, .markdown-content td { padding: .375rem .5rem; border: 1px solid var(--bs-border-color); font-size: .8125rem; }
.markdown-content th { background: var(--bs-tertiary-bg); font-weight: 600; }
.markdown-content hr { margin: .75rem 0; }
.markdown-content > *:first-child { margin-top: 0; }
.markdown-content > *:last-child { margin-bottom: 0; }

/* ============================================================
   BELGE CHIP — dosya gösterimi (teklif, proje vb.)
   ============================================================ */
.belge-chip {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .25rem .5rem .25rem .375rem;
  border-radius: .375rem;
  font-size: .7rem;
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
  border: 1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
  transition: border-color .2s, box-shadow .2s;
  max-width: 160px;
}
.belge-chip:hover {
  border-color: var(--bs-primary);
  box-shadow: 0 1px 4px rgba(var(--bs-primary-rgb), .12);
  color: var(--bs-body-color);
  text-decoration: none;
}
.belge-chip-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: .25rem;
  font-size: .65rem;
  flex-shrink: 0;
}
.belge-chip-icon--pdf  { background: rgba(220,38,38,.08); color: #dc2626; }
.belge-chip-icon--img  { background: rgba(59,130,246,.08); color: #3b82f6; }
.belge-chip-icon--doc  { background: rgba(34,197,94,.08);  color: #16a34a; }
.belge-chip-icon--xls  { background: rgba(34,197,94,.08);  color: #16a34a; }
.belge-chip-icon--default { background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); }
.belge-chip-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 90px;
}
.belge-chip-delete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--bs-secondary-color);
  font-size: .6rem;
  padding: 0;
  cursor: pointer;
  transition: background .15s, color .15s;
  flex-shrink: 0;
}
.belge-chip-delete:hover {
  background: rgba(220,38,38,.1);
  color: #dc2626;
}
.belge-chip-add {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  padding: .25rem .625rem;
  border-radius: .375rem;
  font-size: .7rem;
  font-weight: 500;
  border: 1px dashed var(--bs-border-color);
  background: transparent;
  color: var(--bs-secondary-color);
  cursor: pointer;
  transition: border-color .2s, color .2s, background .2s;
}
.belge-chip-add:hover {
  border-color: var(--bs-primary);
  color: var(--bs-primary);
  background: rgba(var(--bs-primary-rgb), .04);
}

/* ============================================================
   LOGIN PAGE
   ============================================================ */
.login-wrapper {
  height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: white;
  overflow: hidden;
}

.login-right {
  display: block;
  flex: 1;
  position: relative;
  overflow: hidden;
  background: #0a0f1a;
}

.login-left {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  overflow-y: auto;
}

.login-card {
  width: 100%;
  max-width: 400px;
}

.login-logo {
  height: 44px;
  transition: transform .3s ease;
}
.login-logo:hover { transform: scale(1.05); }

.login-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px; height: 56px;
  border-radius: .75rem;
  background: rgba(var(--bs-primary-rgb), .1);
  font-size: 1.5rem;
  color: var(--bs-primary);
}

/* ── Mobil: Login öğeleri büyük ve belirgin (yaşlı kullanıcılar için) ── */
@media (max-width: 767.98px) {
  .login-card {
    max-width: 100%;
  }
  .login-card .form-label {
    font-size: .9375rem;
    margin-bottom: .5rem;
  }
  .login-card .form-control,
  .login-card .form-select {
    font-size: 1.125rem;
    padding: .75rem 1rem;
    border-radius: .5rem;
  }
  .login-card .input-group-text {
    font-size: 1.25rem;
    padding: .75rem .875rem;
  }
  .login-card .login-submit-btn,
  .login-card .btn-primary {
    font-size: 1.0625rem;
    padding: .875rem 1.25rem;
    border-radius: .625rem;
  }
  .login-card p,
  .login-card .small,
  .login-card .text-body-secondary {
    font-size: .875rem !important;
  }
  .login-card .login-alert {
    font-size: .875rem;
    padding: .75rem 1rem;
  }
  .login-card .pin-link {
    font-size: .875rem;
  }
  .login-card .otp-box {
    width: 60px;
    height: 68px;
    font-size: 1.6rem;
    border-radius: .75rem;
  }
  .login-card .otp-container {
    gap: .75rem;
  }
  .login-card .pin-icon-wrap {
    width: 64px;
    height: 64px;
    font-size: 1.75rem;
  }
  .login-card h5 {
    font-size: 1.25rem !important;
  }
  .login-card .pin-gsm-badge {
    font-size: .875rem;
    padding: .2rem .625rem;
  }
  .login-logo {
    height: 56px;
  }
  .login-icon-box {
    width: 68px;
    height: 68px;
    font-size: 1.875rem;
  }
}

@media (min-width: 992px) {
  .login-wrapper {
    flex-direction: row;
  }
  .login-right {
    height: auto;
    min-height: auto;
    flex: 1;
    order: 2;
  }
  .login-left {
    order: 1;
  }
}

/* ============================================================
   UTILITY
   ============================================================ */
.rounded-xl {
  border-radius: 0.75rem !important;
}

/* Focus outline for accessibility */
:focus-visible {
  outline: 2px solid var(--bs-primary);
  outline-offset: 2px;
}

/* Tablo dropdown stilleri — topbar ile tutarlı */
/* .tk-table-floating-dropdown: body'e taşınan (portal) dropdown için aynı stiller */
.table .dropdown-menu,
.tk-table-floating-dropdown {
  min-width: 180px;
  padding: 0.25rem 0;
  border: none;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  border-radius: 0.5rem;
}
.table .dropdown-item,
.tk-table-floating-dropdown .dropdown-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  color: var(--bs-secondary-color);
  border-bottom: 1px solid var(--bs-border-color);
}
.table .dropdown-item:last-child,
.tk-table-floating-dropdown .dropdown-item:last-child { border-bottom: none; }
.table .dropdown-item:hover,
.tk-table-floating-dropdown .dropdown-item:hover { background: var(--bs-tertiary-bg); }
.table .dropdown-item.text-danger:hover,
.tk-table-floating-dropdown .dropdown-item.text-danger:hover { background: rgba(var(--bs-danger-rgb), 0.06); }
.table .dropdown-divider,
.tk-table-floating-dropdown .dropdown-divider { display: none; }

/* Log tabloları — kompakt font */
.log-table>:not(caption)>*>* { font-size: .75rem !important; padding: .4rem .6rem !important; }


/* Warning renk override — text-warning emphasis */
.text-warning { color: var(--bs-warning-text-emphasis) !important; }

/* Smooth scroll */
html {
  scroll-behavior: smooth;
}

/* Footer */
.main-footer {
  border-top: 1px solid var(--bs-border-color);
  margin-top: 2rem;
}

/* Scroll to Top */
#scrollTopBtn {
  align-items: center;
  justify-content: center;
  transition: opacity .3s ease;
}