/*
 * Shared appearance layer for İlan Kontrol Merkezi.
 * The existing page styles remain the source of truth for layout and behavior;
 * this file only adds the theme surface and the shared theme switch.
 */

html {
    color-scheme: light;
}

html[data-theme="dark"] {
    color-scheme: dark;

    /* Calm, neutral dark palette. No saturated purple surfaces. */
    --bg: #0d1117;
    --bg-color: #0d1117;
    --surface: #151b23;
    --surface-color: #151b23;
    --surface-hover: #1c2631;
    --border: #2a3542;
    --border-color: #2a3542;
    --border-subtle: #202a35;
    --text-main: #e6edf3;
    --text-muted: #93a4b8;
    --text-light: #6f8094;
    --text-color: #e6edf3;

    --primary: #8fb5d6;
    --primary-hover: #b1cbe2;
    --primary-light: #1c3043;
    --primary-contrast: #0b121a;

    --success: #78c7a4;
    --success-bg: #173228;
    --success-border: #2d654f;
    --danger: #e18b8b;
    --danger-bg: #382126;
    --danger-border: #704047;
    --warning: #e1b36f;
    --warning-bg: #392d1d;
    --warning-border: #76572d;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(255, 255, 255, 0.018);
    --shadow-md: 0 8px 22px rgba(0, 0, 0, 0.26), 0 0 0 1px rgba(255, 255, 255, 0.018);
    --shadow-lg: 0 18px 48px rgba(0, 0, 0, 0.44), 0 0 0 1px rgba(255, 255, 255, 0.025);
}

html[data-theme="dark"] body {
    background: var(--bg-color, var(--bg)) !important;
    color: var(--text-main);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .app-header,
html[data-theme="dark"] .shell,
html[data-theme="dark"] .main-container,
html[data-theme="dark"] .card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .item-row,
html[data-theme="dark"] .ad-row,
html[data-theme="dark"] .cat-table-card,
html[data-theme="dark"] .wm-card,
html[data-theme="dark"] .dup-card,
html[data-theme="dark"] .header,
html[data-theme="dark"] .login-card {
    transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

html[data-theme="dark"] .app-header,
html[data-theme="dark"] .card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .item-row,
html[data-theme="dark"] .ad-row,
html[data-theme="dark"] .cat-table-card,
html[data-theme="dark"] .wm-card,
html[data-theme="dark"] .dup-card,
html[data-theme="dark"] .header {
    background-color: var(--surface-color) !important;
    border-color: var(--border-color) !important;
    box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .app-header {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
}

html[data-theme="dark"] .brand-icon,
html[data-theme="dark"] .logo-badge {
    background: linear-gradient(135deg, #6f99b8 0%, #3f647f 100%) !important;
    box-shadow: 0 5px 16px rgba(63, 100, 127, 0.34) !important;
}

html[data-theme="dark"] .app-title h1,
html[data-theme="dark"] .app-title p,
html[data-theme="dark"] .findings-list {
    color: var(--text-main) !important;
}

html[data-theme="dark"] .app-title p,
html[data-theme="dark"] .findings-list {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] .brand-text h1,
html[data-theme="dark"] .brand-text p,
html[data-theme="dark"] .app-title h1,
html[data-theme="dark"] .item-title,
html[data-theme="dark"] .item-meta,
html[data-theme="dark"] .ad-title,
html[data-theme="dark"] .ad-meta,
html[data-theme="dark"] .ad-title-text,
html[data-theme="dark"] .desc-box,
html[data-theme="dark"] .findings-box,
html[data-theme="dark"] .db-info,
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] label,
html[data-theme="dark"] strong {
    color: var(--text-main);
}

html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .item-meta,
html[data-theme="dark"] .ad-meta,
html[data-theme="dark"] .page-info-text,
html[data-theme="dark"] .training-modal-status,
html[data-theme="dark"] .db-info,
html[data-theme="dark"] .url-permission-status,
html[data-theme="dark"] .url-permission-card p,
html[data-theme="dark"] .url-permission-help {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] .nav-btn,
html[data-theme="dark"] .btn,
html[data-theme="dark"] .btn-compact,
html[data-theme="dark"] .btn-copy-id,
html[data-theme="dark"] .pill-btn,
html[data-theme="dark"] .tab-btn,
html[data-theme="dark"] .select-compact,
html[data-theme="dark"] .input-compact,
html[data-theme="dark"] .search-input,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    background: var(--surface-color) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .nav-btn:hover,
html[data-theme="dark"] .btn:hover,
html[data-theme="dark"] .btn-compact:hover,
html[data-theme="dark"] .btn-copy-id:hover,
html[data-theme="dark"] .pill-btn:hover,
html[data-theme="dark"] .tab-btn:hover {
    background: var(--surface-hover) !important;
    border-color: #3b4a5b !important;
}

html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-primary-compact,
html[data-theme="dark"] .nav-btn.primary,
html[data-theme="dark"] .btn-submit,
html[data-theme="dark"] .tab-btn.active,
html[data-theme="dark"] .wm-modal-nav-btn:hover {
    background: var(--primary) !important;
    color: var(--primary-contrast) !important;
    border-color: var(--primary) !important;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary-compact:hover,
html[data-theme="dark"] .nav-btn.primary:hover,
html[data-theme="dark"] .btn-submit:hover {
    background: var(--primary-hover) !important;
    color: var(--primary-contrast) !important;
}

html[data-theme="dark"] .btn-success-compact,
html[data-theme="dark"] .btn-training,
html[data-theme="dark"] .btn-recheck,
html[data-theme="dark"] .btn-danger-compact,
html[data-theme="dark"] .btn-outline-danger,
html[data-theme="dark"] .nav-btn.danger {
    color: var(--text-main) !important;
}

html[data-theme="dark"] .btn-success-compact,
html[data-theme="dark"] .badge-approved,
html[data-theme="dark"] .badge-hesap-approved,
html[data-theme="dark"] .agreement-match,
html[data-theme="dark"] .cat-status-active,
html[data-theme="dark"] .dup-badge-success,
html[data-theme="dark"] .finding-item.info {
    background: var(--success-bg) !important;
    color: #a0e6c5 !important;
    border-color: var(--success-border) !important;
}

html[data-theme="dark"] .btn-danger-compact,
html[data-theme="dark"] .btn-outline-danger,
html[data-theme="dark"] .badge-rejected,
html[data-theme="dark"] .badge-hesap-rejected,
html[data-theme="dark"] .rejection-box,
html[data-theme="dark"] .hesap-rejection-box,
html[data-theme="dark"] .finding-item.reject,
html[data-theme="dark"] .dup-badge-danger,
html[data-theme="dark"] .alert-error {
    background: var(--danger-bg) !important;
    color: #f0aaaa !important;
    border-color: var(--danger-border) !important;
}

html[data-theme="dark"] .badge-manual,
html[data-theme="dark"] .badge-hesap-pending,
html[data-theme="dark"] .agreement-mismatch,
html[data-theme="dark"] .manual-box,
html[data-theme="dark"] .finding-item.manual,
html[data-theme="dark"] .dup-badge-warning,
html[data-theme="dark"] .cat-status-unconfigured {
    background: var(--warning-bg) !important;
    color: #f0ca91 !important;
    border-color: var(--warning-border) !important;
}

html[data-theme="dark"] .cat-status-passive,
html[data-theme="dark"] .badge.neutral,
html[data-theme="dark"] .dup-badge-info {
    background: #24313e !important;
    color: #b4c1cf !important;
    border-color: #3a4b5e !important;
}

html[data-theme="dark"] .btn-training,
html[data-theme="dark"] .btn-recheck {
    background: var(--primary-light) !important;
    color: #b5d1e9 !important;
    border-color: #41627c !important;
}

html[data-theme="dark"] .btn-training:hover,
html[data-theme="dark"] .btn-recheck:hover {
    background: #29445b !important;
    border-color: #6587a4 !important;
}

html[data-theme="dark"] .status-badge.approved,
html[data-theme="dark"] .status-badge.rejected,
html[data-theme="dark"] .status-badge.manual_review,
html[data-theme="dark"] .status-badge.error {
    color: var(--text-main) !important;
}

html[data-theme="dark"] .status-badge.approved { background: var(--success-bg) !important; border-color: var(--success-border) !important; }
html[data-theme="dark"] .status-badge.rejected { background: var(--danger-bg) !important; border-color: var(--danger-border) !important; }
html[data-theme="dark"] .status-badge.manual_review { background: var(--warning-bg) !important; border-color: var(--warning-border) !important; }
html[data-theme="dark"] .status-badge.error { background: #202a35 !important; border-color: #3a4a5b !important; }

html[data-theme="dark"] .tab-segmented,
html[data-theme="dark"] .tab-btn,
html[data-theme="dark"] .item-meta-chip,
html[data-theme="dark"] .ad-cat-tag,
html[data-theme="dark"] .stat-card.total .stat-icon,
html[data-theme="dark"] .stat-card.total .stat-icon-wrapper,
html[data-theme="dark"] .score-pill,
html[data-theme="dark"] .dup-card-header,
html[data-theme="dark"] .dup-card-footer,
html[data-theme="dark"] .dup-diff-header,
html[data-theme="dark"] .dup-diff-box,
html[data-theme="dark"] .training-modal-header,
html[data-theme="dark"] .ad-details-panel,
html[data-theme="dark"] .manual-form-accordion summary,
html[data-theme="dark"] .cat-table th,
html[data-theme="dark"] .wm-progress-bar {
    background: var(--surface-hover) !important;
    color: var(--text-muted);
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .tab-item.active {
    background: var(--surface-color) !important;
    color: var(--primary) !important;
}

html[data-theme="dark"] .tab-badge,
html[data-theme="dark"] .ad-cat-tag,
html[data-theme="dark"] .item-meta-chip {
    background: #24313e !important;
    color: #b4c1cf !important;
}

html[data-theme="dark"] .tab-item.active .tab-badge,
html[data-theme="dark"] .badge-chip,
html[data-theme="dark"] .ad-id-link {
    background: var(--primary-light) !important;
    color: #afd0eb !important;
}

html[data-theme="dark"] .ad-id-link,
html[data-theme="dark"] .ad-id-link:hover {
    color: #afd0eb !important;
}

html[data-theme="dark"] .id-input-card {
    border-top-color: var(--primary) !important;
}

html[data-theme="dark"] .id-textarea,
html[data-theme="dark"] .id-textarea:focus {
    background: #101720 !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .id-textarea:focus,
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] .url-permission-field input:focus,
html[data-theme="dark"] .url-permission-field textarea:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(143, 181, 214, 0.16) !important;
}

html[data-theme="dark"] ::placeholder {
    color: #728397 !important;
    opacity: 1;
}

html[data-theme="dark"] .ad-item-card:hover,
html[data-theme="dark"] .item-row:hover,
html[data-theme="dark"] .ad-row:hover,
html[data-theme="dark"] .dup-card:hover,
html[data-theme="dark"] .wm-card:hover {
    border-color: #415265 !important;
    box-shadow: var(--shadow-md);
}

html[data-theme="dark"] .findings-box,
html[data-theme="dark"] .desc-box,
html[data-theme="dark"] .training-modal-panel,
html[data-theme="dark"] .dup-diff-container,
html[data-theme="dark"] .dup-item-side.left,
html[data-theme="dark"] .dup-item-side.right,
html[data-theme="dark"] pre,
html[data-theme="dark"] .rejection-template-box,
html[data-theme="dark"] .training-box,
html[data-theme="dark"] .training-modal-summary,
html[data-theme="dark"] .url-permission-intro {
    background: var(--surface-hover) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .rejection-template-box,
html[data-theme="dark"] .rejection-box,
html[data-theme="dark"] .hesap-rejection-box,
html[data-theme="dark"] .training-box,
html[data-theme="dark"] .ai-box,
html[data-theme="dark"] .manual-box {
    border-left-color: currentColor;
}

html[data-theme="dark"] .ai-box {
    background: var(--primary-light) !important;
    color: #b5d1e9 !important;
    border-color: #41627c !important;
}

html[data-theme="dark"] .training-box {
    color: #c3d8eb !important;
    border-left-color: var(--primary) !important;
}

html[data-theme="dark"] .training-modal-summary {
    color: #c3d8eb !important;
}

html[data-theme="dark"] .url-permission-intro {
    color: #c3d8eb !important;
}

html[data-theme="dark"] .url-permission-intro span {
    color: #a8c9e5 !important;
}

html[data-theme="dark"] .cat-table td,
html[data-theme="dark"] .cat-table tr:hover td {
    background: var(--surface-color) !important;
    color: var(--text-main);
    border-color: var(--border-subtle) !important;
}

html[data-theme="dark"] .cat-table tr:hover td {
    background: var(--surface-hover) !important;
}

html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .url-permission-empty {
    background: var(--surface-color) !important;
    color: var(--text-muted) !important;
    border-color: #46576a !important;
}

html[data-theme="dark"] .wm-card.is-var {
    background: #382126 !important;
    border-color: var(--danger-border) !important;
}

html[data-theme="dark"] .wm-card.is-scanning {
    border-color: var(--primary) !important;
    box-shadow: 0 0 15px rgba(143, 181, 214, 0.22) !important;
}

html[data-theme="dark"] .wm-card.is-yok {
    background: #173228 !important;
    border-color: var(--success-border) !important;
}

html[data-theme="dark"] .wm-thumb-box {
    background: #080c11 !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] .wm-reticle span {
    background: rgba(15, 24, 33, 0.92) !important;
    color: #b5d1e9 !important;
}

html[data-theme="dark"] .wm-reticle {
    border-color: rgba(143, 181, 214, 0.72) !important;
    background: rgba(143, 181, 214, 0.08) !important;
}

html[data-theme="dark"] .wm-modal-select-btn.not-selected {
    color: var(--text-main) !important;
}

html[data-theme="dark"] .wm-modal-top-bar,
html[data-theme="dark"] .wm-modal-bottom-bar {
    background: rgba(13, 17, 23, 0.92) !important;
    border-color: rgba(170, 195, 218, 0.16) !important;
}

html[data-theme="dark"] .wm-modal-nav-btn {
    background: rgba(13, 17, 23, 0.86) !important;
    color: #e6edf3 !important;
}

html[data-theme="dark"] .login-card {
    background: #151b23 !important;
    border-color: #2a3542 !important;
    box-shadow: var(--shadow-lg) !important;
}

html[data-theme="dark"] .login-header {
    background: #101720 !important;
    border-color: #202a35 !important;
}

html[data-theme="dark"] .login-header h1 { color: #e6edf3 !important; }
html[data-theme="dark"] .login-header p { color: #93a4b8 !important; }
html[data-theme="dark"] .form-group label { color: #b9c7d5 !important; }

html[data-theme="dark"] .form-group input {
    background: #0d141c !important;
    color: #e6edf3 !important;
    border-color: #2f3d4c !important;
}

html[data-theme="dark"] .form-group input:focus {
    border-color: var(--primary) !important;
    box-shadow: 0 0 0 3px rgba(143, 181, 214, 0.18) !important;
}

html[data-theme="dark"] .ip-badge {
    background: #101720 !important;
    border-color: #202a35 !important;
    color: #8192a6 !important;
}

html[data-theme="dark"] .ip-badge strong { color: #9bc4e5 !important; }

html[data-theme="dark"] .pulse-dot {
    box-shadow: 0 0 0 0 rgba(120, 199, 164, 0.68);
}

html[data-theme="dark"] .stat-card.total .num,
html[data-theme="dark"] .stat-card.total .val {
    color: var(--text-main) !important;
}

html[data-theme="dark"] .stat-card.approved .num,
html[data-theme="dark"] .stat-card.approved .val { color: var(--success) !important; }
html[data-theme="dark"] .stat-card.rejected .num,
html[data-theme="dark"] .stat-card.rejected .val { color: var(--danger) !important; }
html[data-theme="dark"] .stat-card.manual .num,
html[data-theme="dark"] .stat-card.manual .val { color: var(--warning) !important; }

html[data-theme="dark"] .btn-copy-reason {
    background: var(--danger-bg) !important;
    color: #f0aaaa !important;
    border-color: var(--danger-border) !important;
}

html[data-theme="dark"] .btn-copy-reason:hover {
    background: #4a2930 !important;
}

html[data-theme="dark"] .toast {
    background: #e6edf3 !important;
    color: #101720 !important;
}

/* The legacy checker uses inline light colors; keep its structure but recolor it. */
html[data-theme="dark"] .controls .btn,
html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background:white"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background:#ffffff"] {
    background: var(--surface-color) !important;
    color: var(--text-main) !important;
    border-color: var(--border-color) !important;
}

html[data-theme="dark"] [style*="color: #0f172a"],
html[data-theme="dark"] [style*="color:#0f172a"],
html[data-theme="dark"] [style*="color: #111827"],
html[data-theme="dark"] [style*="color:#111827"],
html[data-theme="dark"] [style*="color: #1f2937"],
html[data-theme="dark"] [style*="color:#1f2937"] {
    color: var(--text-main) !important;
}

html[data-theme="dark"] [style*="background: #f8fafc"],
html[data-theme="dark"] [style*="background:#f8fafc"],
html[data-theme="dark"] [style*="background: #f1f5f9"],
html[data-theme="dark"] [style*="background:#f1f5f9"],
html[data-theme="dark"] [style*="background: #fafafa"],
html[data-theme="dark"] [style*="background:#fafafa"] {
    background: var(--surface-hover) !important;
}

html[data-theme="dark"] [style*="background: #f3f4f6"],
html[data-theme="dark"] [style*="background:#f3f4f6"],
html[data-theme="dark"] [style*="background: #e5e7eb"],
html[data-theme="dark"] [style*="background:#e5e7eb"] {
    background: var(--surface-hover) !important;
    color: var(--text-main) !important;
}

html[data-theme="dark"] [style*="background: #dbeafe"],
html[data-theme="dark"] [style*="background:#dbeafe"],
html[data-theme="dark"] [style*="background: #e0e7ff"],
html[data-theme="dark"] [style*="background:#e0e7ff"] {
    background: var(--primary-light) !important;
    color: #b5d1e9 !important;
    border-color: #41627c !important;
}

html[data-theme="dark"] [style*="color: #374151"],
html[data-theme="dark"] [style*="color:#374151"],
html[data-theme="dark"] [style*="color: #1e40af"],
html[data-theme="dark"] [style*="color:#1e40af"],
html[data-theme="dark"] [style*="color: #3730a3"],
html[data-theme="dark"] [style*="color:#3730a3"] {
    color: #b5d1e9 !important;
}

html[data-theme="dark"] [style*="border-color: #cbd5e1"],
html[data-theme="dark"] [style*="border-color:#cbd5e1"] {
    border-color: var(--border-color) !important;
}

/* Shared theme control. It is injected into the existing top action row. */
.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 32px;
    padding: 6px 11px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.theme-toggle:hover {
    background: #f1f5f9;
    border-color: #94a3b8;
}

.theme-toggle:focus-visible {
    outline: 3px solid rgba(79, 70, 229, 0.22);
    outline-offset: 2px;
}

html[data-theme="dark"] .theme-toggle {
    background: #1b2733 !important;
    color: #d8e5f0 !important;
    border-color: #3a4b5e !important;
}

html[data-theme="dark"] .theme-toggle:hover {
    background: #243342 !important;
    border-color: #587089 !important;
}

html[data-theme="dark"] .theme-toggle:focus-visible {
    outline-color: rgba(143, 181, 214, 0.34);
}

html[data-theme="light"] body:has(.login-card) {
    background: #f4f7fb !important;
    color: #0f172a !important;
}

html[data-theme="light"] .login-card {
    background: #ffffff !important;
    border-color: #dbe3ec !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.12) !important;
}

html[data-theme="light"] .login-header {
    background: #f8fafc !important;
    border-color: #e7edf4 !important;
}

html[data-theme="light"] .login-header h1 { color: #0f172a !important; }
html[data-theme="light"] .login-header p { color: #64748b !important; }
html[data-theme="light"] .form-group label { color: #334155 !important; }

html[data-theme="light"] .form-group input {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: #cbd5e1 !important;
}

html[data-theme="light"] .ip-badge {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #64748b !important;
}

html[data-theme="light"] .ip-badge strong { color: #0369a1 !important; }

html[data-theme="light"] .alert-error {
    background: #fef2f2 !important;
    border-color: #fecaca !important;
    color: #b91c1c !important;
}

.theme-toggle-floating {
    position: fixed;
    top: 18px;
    right: 18px;
    z-index: 1001;
}

@media (max-width: 760px) {
    .theme-toggle {
        min-height: 34px;
        padding-inline: 10px;
    }

    .theme-toggle-floating {
        top: 12px;
        right: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html[data-theme="dark"] body,
    html[data-theme="dark"] .app-header,
    html[data-theme="dark"] .card,
    html[data-theme="dark"] .stat-card,
    html[data-theme="dark"] .item-row,
    html[data-theme="dark"] .ad-row,
    html[data-theme="dark"] .wm-card,
    html[data-theme="dark"] .dup-card,
    .theme-toggle {
        transition: none !important;
    }
}