/**
 * WebTicaret.tr - Modern Account Security Center & Profile CSS
 */

.account-body {
  background-color: #F8FAFC;
  min-height: 100vh;
  margin: 0;
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  color: #0F172A;
}

/* Subnav Tabs */
.account-subnav {
  background: #102A4C;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.account-subnav__inner {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 20px;
}

.account-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
}

.account-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 18px;
  color: #94A3B8;
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 500;
  border-bottom: 3px solid transparent;
  transition: color 0.15s ease, border-color 0.15s ease;
  white-space: nowrap;
}

.account-tab:hover {
  color: #FFFFFF;
}

.account-tab--active {
  color: #FF6B0B;
  border-bottom-color: #FF6B0B;
  font-weight: 600;
}

/* Container */
.account-container {
  max-width: 1140px;
  width: 100%;
  min-width: 0;
  margin: 0 auto;
  padding: 36px 20px 60px;
  box-sizing: border-box;
}

.account-page-header {
  margin-bottom: 28px;
}

.account-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #FF6B0B;
  background: rgba(255, 107, 11, 0.1);
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 8px;
}

.account-title {
  font-size: 24px;
  font-weight: 800;
  color: #0B192C;
  margin: 0 0 6px;
}

.account-subtitle {
  font-size: 14px;
  color: #64748B;
  margin: 0;
}

/* Alerts */
.account-alert {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-radius: 8px;
  font-size: 13.5px;
  margin-bottom: 24px;
  line-height: 1.4;
}

.account-alert--success {
  background: #ECFDF5;
  border: 1px solid #A7F3D0;
  color: #065F46;
}

.account-alert--warning {
  background: #FFFBEB;
  border: 1px solid #FDE68A;
  color: #92400E;
}

.account-alert--danger {
  background: #FEF2F2;
  border: 1px solid #FCA5A5;
  color: #991B1B;
}

.alert-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

/* Grid */
.security-grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 24px;
  align-items: start;
}

@media (max-width: 900px) {
  .security-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .security-main,
  .security-sidebar {
    min-width: 0;
  }
}

.account-table-scroll {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 768px) {
  .account-supporter-grid,
  .account-ad-summary-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .account-campaign-card {
    min-width: 0;
  }

  .account-table-scroll table {
    width: max-content !important;
    min-width: 100%;
  }

  .security-card__header--split,
  .email-status-row,
  .session-item,
  .device-item,
  .media-upload-box {
    flex-wrap: wrap;
  }

  .account-container input:not([type="checkbox"]):not([type="radio"]),
  .account-container select,
  .account-container textarea,
  .account-main input:not([type="checkbox"]):not([type="radio"]),
  .account-main select,
  .account-main textarea {
    max-width: 100%;
    font-size: 16px;
  }
}

@media (max-width: 430px) {
  .account-container {
    padding: 24px 14px 48px;
  }

  .security-card__header,
  .security-card__body {
    padding-left: 16px;
    padding-right: 16px;
  }

  .account-supporter-grid > div,
  .account-ad-summary-grid > div {
    min-width: 0;
    padding: 16px !important;
  }

  .session-item,
  .device-item,
  .email-status-row {
    align-items: flex-start;
    gap: 10px;
  }
}

/* Cards */
.security-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  margin-bottom: 24px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(11, 25, 44, 0.04);
}

.security-card__header {
  padding: 20px 24px;
  border-bottom: 1px solid #F1F5F9;
  display: flex;
  align-items: center;
  gap: 14px;
}

.security-card__header--split {
  justify-content: space-between;
}

.security-card__icon-wrapper {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background: rgba(255, 107, 11, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FF6B0B;
  flex-shrink: 0;
}

.card-icon {
  width: 20px;
  height: 20px;
}

.security-card__title {
  font-size: 16px;
  font-weight: 700;
  color: #0B192C;
  margin: 0 0 2px;
}

.security-card__desc {
  font-size: 12.5px;
  color: #64748B;
  margin: 0;
}

.security-card__body {
  padding: 20px 24px;
}

/* Email Row */
.email-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #F8FAFC;
  border-radius: 8px;
  border: 1px solid #E2E8F0;
}

.email-display {
  margin-left: 8px;
  color: #0F172A;
}

.status-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 20px;
}

.status-pill--success {
  background: #ECFDF5;
  color: #059669;
}

.status-pill--warning {
  background: #FFFBEB;
  color: #D97706;
}

.pill-icon {
  width: 14px;
  height: 14px;
}

.verify-action-box {
  margin-top: 14px;
  padding: 14px;
  background: #FFFBEB;
  border: 1px dashed #FDE68A;
  border-radius: 8px;
}

.verify-action-text {
  font-size: 13px;
  color: #92400E;
  margin: 0 0 12px;
}

/* Sessions & Devices List */
.sessions-list, .devices-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.session-item, .device-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 8px;
}

.session-item--current {
  border-color: #A7F3D0;
  background: #F0FDF4;
}

.session-item__title, .device-item__title {
  font-size: 14px;
  font-weight: 600;
  color: #0F172A;
  display: flex;
  align-items: center;
  gap: 8px;
}

.badge-current {
  font-size: 11px;
  background: #DCFCE7;
  color: #166534;
  padding: 2px 8px;
  border-radius: 12px;
  font-weight: 600;
}

.session-item__meta, .device-item__meta {
  font-size: 12px;
  color: #64748B;
  margin-top: 4px;
}

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: none;
  border-radius: 6px;
  font-family: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
  text-decoration: none;
}

.btn--primary {
  background: #FF6B0B;
  color: #FFFFFF;
}

.btn--primary:hover {
  background: #E05A00;
}

.btn--danger-outline {
  background: transparent;
  border: 1px solid #FCA5A5;
  color: #DC2626;
}

.btn--danger-outline:hover {
  background: #FEF2F2;
}

.btn--muted {
  background: #E2E8F0;
  color: #334155;
}

.btn--muted:hover {
  background: #CBD5E1;
}

.btn--sm {
  padding: 8px 14px;
  font-size: 13px;
}

.btn--md {
  padding: 10px 18px;
  font-size: 14px;
}

.btn--xs {
  padding: 4px 10px;
  font-size: 11.5px;
}

.btn-icon {
  width: 16px;
  height: 16px;
}

/* Timeline */
.activity-timeline {
  display: flex;
  flex-direction: column;
  gap: 16px;
  position: relative;
  padding-left: 12px;
}

.activity-timeline::before {
  content: '';
  position: absolute;
  left: 15px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: #E2E8F0;
}

.activity-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  position: relative;
}

.activity-item__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-top: 5px;
  flex-shrink: 0;
  z-index: 1;
}

.activity-item__dot--success { background: #10B981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2); }
.activity-item__dot--warning { background: #F59E0B; box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.2); }
.activity-item__dot--primary { background: #FF6B0B; box-shadow: 0 0 0 3px rgba(255, 107, 11, 0.2); }
.activity-item__dot--muted { background: #94A3B8; box-shadow: 0 0 0 3px rgba(148, 163, 184, 0.2); }
.activity-item__dot--info { background: #3B82F6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2); }

.activity-item__title {
  font-size: 13px;
  font-weight: 600;
  color: #0F172A;
}

.activity-item__time {
  font-size: 11.5px;
  color: #64748B;
  margin-top: 2px;
}

/* Account-area dark theme compatibility for legacy inline presentation rules. */
.kp-balance-card{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;margin-bottom:24px;overflow:hidden;background:linear-gradient(135deg,#102a4c,#173e6d);color:#fff;border-radius:16px;box-shadow:0 10px 24px rgba(16,42,76,.14)}.kp-balance-card span{display:block;color:#cbd5e1;font-size:12px;font-weight:650;text-transform:uppercase;letter-spacing:.06em}.kp-balance-card strong{display:block;margin-top:3px;color:#fff;font-size:34px}.kp-balance-card small{font-size:14px}.kp-balance-card p{max-width:520px;margin:0;color:#dbe4ee;font-size:12px;line-height:1.65}.kp-rule-list{display:grid;gap:10px}.kp-rule-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px}.kp-rule-card strong,.kp-rule-card span{display:block}.kp-rule-card span{margin-top:3px;color:#ff6b0b;font-size:12px;font-weight:700}.kp-table{width:100%;border-collapse:collapse;font-size:13px}.kp-table th,.kp-table td{padding:12px 16px;text-align:left;border-bottom:1px solid #f1f5f9}.kp-table th{background:#f8fafc;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.04em}.kp-table__points{color:#102a4c;font-weight:800}.account-empty{padding:30px;color:#64748b;text-align:center;font-size:13px}

body.dark-theme.account-body,
body.dark-theme.account-body .account-main {
  background: var(--color-bg) !important;
  color: var(--color-text);
}

body.dark-theme.account-body :is(.security-card,.content-row,.account-main [style*="background: #FFFFFF"],.account-main [style*="background:#FFFFFF"]) {
  background: var(--color-surface) !important;
  border-color: var(--color-border) !important;
}

body.dark-theme.account-body :is(.security-card__header,.email-status-row,.session-item,.device-item,.account-main [style*="background: #F8FAFC"],.account-main [style*="background:#F8FAFC"]) {
  background: var(--color-surface-subtle) !important;
  border-color: var(--color-border) !important;
}

body.dark-theme.account-body :is(h1,h2,h3,h4,strong,.account-title,.security-card__title,.session-item__title,.device-item__title,[style*="color: #0F172A"],[style*="color:#0F172A"],[style*="color: #0B192C"]) {
  color: var(--color-text) !important;
}

body.dark-theme.account-body :is(p,small,td,.account-subtitle,.security-card__desc,.auth-help-text,[style*="color: #64748B"],[style*="color:#64748B"],[style*="color: #475569"]) {
  color: var(--color-text-secondary) !important;
}

body.dark-theme.account-body :is(input,select,textarea) {
  background: var(--color-surface-subtle);
  color: var(--color-text);
}

body.dark-theme.account-body .kp-rule-card,body.dark-theme.account-body .kp-table th{background:var(--color-surface-subtle);border-color:var(--color-border)}body.dark-theme.account-body .kp-table td{border-color:var(--color-border)}body.dark-theme.account-body .kp-table__points{color:var(--color-text)}

@media(max-width:640px){.kp-balance-card,.kp-rule-card{align-items:stretch;flex-direction:column}.kp-balance-card{padding:21px}.kp-rule-card .btn{width:100%}}