/**
 * Hesabım alanı — kurumsal / premium görünüm (tüm hesabim*.html)
 * body.account-bg ile kapsamlı; site geneline sızmaz.
 */

/* —— Temel sayfa —— */
html {
  overflow-x: hidden;
  max-width: 100%;
  -webkit-text-size-adjust: 100%;
}

body.account-bg {
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  -webkit-tap-highlight-color: transparent;
  background-color: #f1f5f9;
  background-image:
    radial-gradient(ellipse 120% 90% at 100% -10%, rgba(249, 115, 22, 0.09), transparent 52%),
    radial-gradient(ellipse 90% 70% at 0% 100%, rgba(37, 99, 235, 0.07), transparent 48%),
    radial-gradient(ellipse 60% 50% at 50% 50%, rgba(148, 163, 184, 0.06), transparent 60%);
  background-attachment: scroll;
}

@media (max-width: 640px) {
  body.account-bg header nav {
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  body.account-bg header nav a,
  body.account-bg header nav button {
    min-height: 44px;
  }
  body.account-bg main {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

.dark body.account-bg .card-bg {
  background-color: #1e293b;
  border-color: #334155;
}

.dark body.account-bg {
  background: linear-gradient(168deg, #0b1220 0%, #0f172a 35%, #1e293b 70%, #172554 100%);
}

.card-hover {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 40px -12px rgba(59, 130, 246, 0.15), 0 0 0 1px rgba(59, 130, 246, 0.06);
}

.shadow-card-modern {
  box-shadow:
    0 4px 24px -4px rgba(15, 23, 42, 0.08),
    0 0 0 1px rgba(15, 23, 42, 0.04);
}
.dark .shadow-card-modern {
  box-shadow:
    0 4px 24px -4px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.06);
}

/* —— Üst bar —— */
body.account-bg #bg-site-root > header {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom-color: rgba(148, 163, 184, 0.35);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65) inset, 0 4px 24px -8px rgba(15, 23, 42, 0.08);
}

.dark body.account-bg #bg-site-root > header {
  background: rgba(15, 23, 42, 0.88);
  border-bottom-color: rgba(51, 65, 85, 0.6);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
}

/* —— Ana içerik alanı —— */
body.account-bg main {
  padding-top: 2rem;
  padding-bottom: 3rem;
}

@media (min-width: 1024px) {
  body.account-bg main {
    padding-top: 2.5rem;
    padding-bottom: 3.5rem;
  }
}

/* Yükleme kartı */
body.account-bg #loading {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(248, 250, 252, 0.95) 100%);
  border-color: rgba(148, 163, 184, 0.35);
  box-shadow:
    0 20px 50px -24px rgba(15, 23, 42, 0.15),
    0 0 0 1px rgba(148, 163, 184, 0.12);
}

.dark body.account-bg #loading {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.98) 0%, rgba(15, 23, 42, 0.95) 100%);
}

/* —— Kenar menü (masaüstü) —— */
body.account-bg #hesabim-aside-nav.settings-sidebar {
  padding: 0.5rem;
  background: linear-gradient(165deg, #ffffff 0%, #f8fafc 55%, #f1f5f9 100%);
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 1.125rem;
  box-shadow:
    0 16px 40px -20px rgba(15, 23, 42, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.8) inset;
}

.dark body.account-bg #hesabim-aside-nav.settings-sidebar {
  background: linear-gradient(165deg, #1e293b 0%, #172033 100%);
  border-color: rgba(71, 85, 105, 0.55);
  box-shadow: 0 16px 40px -20px rgba(0, 0, 0, 0.35);
}

.settings-sidebar .settings-nav-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.8rem 0.95rem;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: rgb(51 65 85);
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
  border: 1px solid transparent;
}

.dark .settings-sidebar .settings-nav-item {
  color: rgb(203 213 225);
}

.settings-sidebar .settings-nav-item:hover {
  background: rgba(249, 115, 22, 0.09);
  color: rgb(234 88 12);
  border-color: rgba(249, 115, 22, 0.12);
}

.dark .settings-sidebar .settings-nav-item:hover {
  background: rgba(249, 115, 22, 0.14);
  color: rgb(251 146 60);
  border-color: rgba(249, 115, 22, 0.2);
}

.settings-sidebar .settings-nav-item.active {
  background: linear-gradient(135deg, rgba(255, 247, 237, 0.95) 0%, rgba(255, 237, 213, 0.65) 100%);
  color: rgb(194 65 12);
  font-weight: 600;
  border-color: rgba(249, 115, 22, 0.25);
  box-shadow:
    inset 3px 0 0 0 rgb(249 115 22),
    0 4px 14px -6px rgba(249, 115, 22, 0.35);
}

.dark .settings-sidebar .settings-nav-item.active {
  color: rgb(253 186 116);
  background: linear-gradient(135deg, rgba(124 45 18 / 0.35) 0%, rgba(30 27 23 / 0.5) 100%);
  border-color: rgba(251, 146, 60, 0.25);
}

/* Mobil çekmece menü */
body.account-bg #hesabim-menu-panel {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
  box-shadow: 8px 0 40px -8px rgba(15, 23, 42, 0.2);
}

.dark body.account-bg #hesabim-menu-panel {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
}

body.account-bg #hesabim-menu-panel .border-b {
  border-color: rgba(148, 163, 184, 0.25);
}

/* —— İçerik kartları (panel bölümleri) —— */
body.account-bg .min-w-0.flex-1.space-y-8 > section {
  border-radius: 1.25rem !important;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.32) !important;
  background: linear-gradient(180deg, #ffffff 0%, #fafbfc 100%) !important;
  box-shadow:
    0 4px 6px -1px rgba(15, 23, 42, 0.05),
    0 20px 48px -24px rgba(15, 23, 42, 0.12),
    0 0 0 1px rgba(255, 255, 255, 0.6) inset !important;
}

.dark body.account-bg .min-w-0.flex-1.space-y-8 > section {
  background: linear-gradient(180deg, #1e293b 0%, #172033 100%) !important;
  border-color: rgba(71, 85, 105, 0.55) !important;
  box-shadow:
    0 12px 40px -20px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.04) inset !important;
}

/* Panel üst şerit */
body.account-bg .min-w-0.flex-1.space-y-8 > section > div:first-of-type {
  background: linear-gradient(180deg, rgba(248, 250, 252, 0.98) 0%, rgba(241, 245, 249, 0.65) 100%);
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
}

.dark body.account-bg .min-w-0.flex-1.space-y-8 > section > div:first-of-type {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.95) 0%, rgba(15, 23, 42, 0.5) 100%);
  border-bottom-color: rgba(71, 85, 105, 0.45) !important;
}

body.account-bg .min-w-0.flex-1.space-y-8 > section h1,
body.account-bg .min-w-0.flex-1.space-y-8 > section > div:first-of-type h2 {
  letter-spacing: -0.025em;
  font-size: 1.125rem;
  line-height: 1.35;
}

@media (min-width: 640px) {
  body.account-bg .min-w-0.flex-1.space-y-8 > section h1,
  body.account-bg .min-w-0.flex-1.space-y-8 > section > div:first-of-type h2 {
    font-size: 1.25rem;
  }
}

/* Panel başlığındaki ikon kutusu */
body.account-bg .min-w-0.flex-1.space-y-8 > section > div:first-of-type span.flex.h-10.w-10.rounded-xl {
  box-shadow:
    0 4px 14px -6px rgba(37, 99, 235, 0.3),
    0 0 0 1px rgba(37, 99, 235, 0.1);
}

.dark body.account-bg .min-w-0.flex-1.space-y-8 > section > div:first-of-type span.flex.h-10.w-10.rounded-xl {
  box-shadow:
    0 4px 14px -6px rgba(59, 130, 246, 0.25),
    0 0 0 1px rgba(96, 165, 250, 0.15);
}

/* —— Çalışan: yetenek / ödeme alt kartları —— */
body.account-bg #panel-worker-settings .space-y-8.p-5 > div.rounded-xl:first-of-type {
  background: linear-gradient(145deg, rgba(236, 253, 245, 0.92) 0%, rgba(240, 253, 250, 0.55) 45%, rgba(255, 255, 255, 0.92) 100%);
  border: 1px solid rgba(16, 185, 129, 0.28) !important;
  box-shadow:
    inset 0 1px 0 0 rgba(255, 255, 255, 0.85),
    0 10px 28px -14px rgba(5, 150, 105, 0.22);
}

.dark body.account-bg #panel-worker-settings .space-y-8.p-5 > div.rounded-xl:first-of-type {
  background: linear-gradient(145deg, rgba(6, 78, 59, 0.35) 0%, rgba(15, 23, 42, 0.6) 100%);
  border-color: rgba(52, 211, 153, 0.22) !important;
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
}

body.account-bg #panel-worker-settings .space-y-8.p-5 > div.rounded-xl:nth-of-type(2) {
  background: linear-gradient(145deg, rgba(224, 242, 254, 0.95) 0%, rgba(239, 246, 255, 0.55) 50%, rgba(255, 255, 255, 0.9) 100%);
  border: 1px solid rgba(14, 165, 233, 0.28) !important;
  box-shadow:
    inset 0 1px 0 0 rgba(255, 255, 255, 0.85),
    0 10px 28px -14px rgba(2, 132, 199, 0.2);
}

.dark body.account-bg #panel-worker-settings .space-y-8.p-5 > div.rounded-xl:nth-of-type(2) {
  background: linear-gradient(145deg, rgba(12, 74, 110, 0.35) 0%, rgba(15, 23, 42, 0.65) 100%);
  border-color: rgba(56, 189, 248, 0.22) !important;
}

/* —— Form kontrolleri (#content içi) —— */
body.account-bg #content input[type='text'],
body.account-bg #content input[type='email'],
body.account-bg #content input[type='number'],
body.account-bg #content input[type='search'],
body.account-bg #content input[type='tel'],
body.account-bg #content textarea,
body.account-bg #content select {
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

body.account-bg #content input[type='text']:focus,
body.account-bg #content input[type='email']:focus,
body.account-bg #content input[type='number']:focus,
body.account-bg #content input[type='search']:focus,
body.account-bg #content input[type='tel']:focus,
body.account-bg #content textarea:focus,
body.account-bg #content select:focus {
  outline: none;
  border-color: rgba(249, 115, 22, 0.45) !important;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.14);
}

.dark body.account-bg #content input:focus,
.dark body.account-bg #content textarea:focus,
.dark body.account-bg #content select:focus {
  border-color: rgba(251, 146, 60, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(251, 146, 60, 0.12);
}

/* —— Öne çıkan kaydet butonları —— */
body.account-bg #worker-settings-save,
body.account-bg #profile-photo-save {
  background: linear-gradient(180deg, #fb923c 0%, #ea580c 100%) !important;
  border: 1px solid rgba(234, 88, 12, 0.35);
  box-shadow:
    0 6px 20px -4px rgba(234, 88, 12, 0.45),
    0 1px 0 rgba(255, 255, 255, 0.2) inset;
}

body.account-bg #worker-settings-save:hover,
body.account-bg #profile-photo-save:hover {
  filter: brightness(1.05);
}

/* Profil: “Ana sayfada gör” ikincil CTA */
body.account-bg #panel-profile a.border-brand {
  box-shadow: 0 2px 8px -2px rgba(249, 115, 22, 0.25);
}

/* Yasak banner */
body.account-bg #account-ban-banner:not(.hidden) {
  box-shadow: 0 8px 24px -12px rgba(225, 29, 72, 0.25);
}

/* Liste satırları — hafif hover */
body.account-bg #content .divide-y > a,
body.account-bg #content .divide-y > button,
body.account-bg #content .divide-y > div {
  transition: background-color 0.15s ease;
}

body.account-bg #content .divide-y > a:hover,
body.account-bg #content .divide-y > button:hover,
body.account-bg #content .divide-y > div:hover {
  background-color: rgba(248, 250, 252, 0.85);
}

.dark body.account-bg #content .divide-y > a:hover,
.dark body.account-bg #content .divide-y > button:hover,
.dark body.account-bg #content .divide-y > div:hover {
  background-color: rgba(30, 41, 59, 0.65);
}

/* Profil kartı içi — avatar halkası */
body.account-bg #user-avatar-wrap {
  box-shadow:
    0 8px 24px -8px rgba(37, 99, 235, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.5) inset;
}