/**
 * Koyu Tema - Tum sayfalar icin tutarli dark mode
 */

:root {
    --primary-color: #e2b45f;
    --primary-dark: #b8852f;
    --secondary-color: #b97d42;
    --accent-color: #ffd37a;
    --success-color: #4caf50;
    --danger-color: #f06a6a;
    --warning-color: #ffb347;
    --text-color: #f5ecd9;
    --text-light: #c8bda7;
    --bg-color: #120f0c;
    --bg-secondary: #1b1713;
    --white: #fffaf2;
    --card-bg: #201a15;
    --border-color: #3b3128;
    --shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
    --shadow-lg: 0 14px 36px rgba(0, 0, 0, 0.45);
}

body {
    background:
        radial-gradient(circle at top, rgba(226, 180, 95, 0.08), transparent 28%),
        linear-gradient(180deg, #120f0c 0%, #17120e 100%);
    color: var(--text-color);
}

h1, h2, h3, h4, h5, h6,
.info-value,
.transaction-description,
.price,
.stat-value {
    color: var(--text-color);
}

.navbar,
.footer,
.welcome-section,
.hero-section,
.info-section,
.fortune-container,
.profile-card,
.fortune-card,
.empty-state,
.package-card,
.payment-info,
.auth-box {
    background-color: var(--card-bg);
    border-color: var(--border-color);
}

.navbar {
    border-bottom: 1px solid var(--border-color);
    backdrop-filter: blur(10px);
}

.footer {
    border-top: 1px solid var(--border-color);
}

.nav-link,
.footer p,
.fortune-intro,
.current-credit,
.empty-state p,
.payment-info p,
.step p,
.hero-content p,
.auth-header p,
.transaction-date,
.fortune-date,
.empty-text {
    color: var(--text-light);
}

.nav-link:hover,
.nav-link.active {
    background-color: rgba(226, 180, 95, 0.12);
    color: var(--accent-color);
}

.site-notification-button {
    color: var(--text-light);
}

.site-notification-button:hover,
.site-notification-button[aria-expanded="true"] {
    background-color: rgba(226, 180, 95, 0.12);
    color: var(--accent-color);
}

.site-notification-panel,
.site-toast {
    background-color: var(--card-bg);
    border-color: var(--border-color);
}

.site-notification-panel-header,
.site-notification-item {
    border-color: var(--border-color);
}

.site-notification-clear,
.site-notification-item-title,
.site-toast-title {
    color: var(--primary-color);
}

.site-notification-item-body,
.site-notification-item-time,
.site-notification-empty,
.site-toast-body {
    color: var(--text-light);
}

.site-notification-item:hover,
.site-notification-item.is-unread {
    background-color: rgba(226, 180, 95, 0.08);
}

.fortune-card:hover {
    border-color: rgba(226, 180, 95, 0.18);
}

.fortune-card:focus-visible {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(226, 180, 95, 0.16);
}

.fortune-card-link,
.fortune-card-title {
    color: var(--primary-color);
}

.auth-page {
    background:
        radial-gradient(circle at top left, rgba(226, 180, 95, 0.18), transparent 25%),
        linear-gradient(135deg, #120f0c 0%, #1b1713 50%, #2b1e13 100%);
}

.auth-form input,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="date"],
textarea,
.form-select {
    background-color: var(--bg-secondary);
    color: var(--text-color);
    border-color: var(--border-color);
}

.auth-form input::placeholder,
input::placeholder,
textarea::placeholder {
    color: #958772;
}

.auth-form small {
    color: var(--text-light);
}

.auth-form input:focus,
input:focus,
textarea:focus,
.form-select:focus {
    background-color: #241d17;
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(226, 180, 95, 0.18);
}

.credit-warning {
    background-color: rgba(255, 179, 71, 0.12);
    border: 1px solid rgba(255, 179, 71, 0.22);
}

.credit-card {
    background: linear-gradient(135deg, #8c6127 0%, #d7a24d 100%);
    color: #fff8ec;
}

.upload-box,
.transaction-item,
.stat-item,
.fortune-text {
    background-color: var(--bg-secondary);
    border-color: var(--border-color);
}

.upload-box .preview {
    background-color: #16120f;
}

.upload-box.has-preview {
    background: linear-gradient(180deg, rgba(226, 180, 95, 0.08), rgba(32, 26, 21, 0.92));
}

.waiting-message {
    background: linear-gradient(180deg, rgba(226, 180, 95, 0.08), rgba(32, 26, 21, 0.96));
    border-color: rgba(226, 180, 95, 0.25);
    box-shadow: 0 0 28px rgba(226, 180, 95, 0.12);
}

.waiting-message h3,
.option-group label,
.upload-text,
.welcome-section h2,
.fortune-container h2,
.profile-card h3,
.info-section h3,
.package-header h3,
.payment-info h3,
.empty-state h3,
.hero-content h3,
.auth-header h1,
.nav-brand h1 {
    color: var(--primary-color);
}

.waiting-timer,
.package-badge {
    color: #1a140f;
    background: linear-gradient(135deg, #ffd37a 0%, #e2b45f 100%);
}

.btn-primary {
    background: linear-gradient(135deg, #e2b45f 0%, #b8852f 100%);
    color: #1a140f;
    box-shadow: 0 8px 20px rgba(184, 133, 47, 0.28);
}

.btn-primary:hover {
    box-shadow: 0 10px 26px rgba(184, 133, 47, 0.4);
}

.btn-secondary {
    background: linear-gradient(135deg, #8d6136 0%, #a56e34 100%);
    color: #fff6ea;
}

.btn-icon {
    color: var(--text-light);
}

.btn-primary:disabled {
    background: #3a3028;
    color: #998b77;
    box-shadow: none;
}

.alert-success {
    background-color: rgba(76, 175, 80, 0.15);
    border-color: rgba(76, 175, 80, 0.3);
    color: #90d69d;
}

.alert-danger {
    background-color: rgba(240, 106, 106, 0.12);
    border-color: rgba(240, 106, 106, 0.3);
    color: #ffaaaa;
}

.alert-warning {
    background-color: rgba(255, 179, 71, 0.12);
    border-color: rgba(255, 179, 71, 0.3);
    color: #ffd08b;
}

.status-pending {
    background-color: rgba(255, 179, 71, 0.14);
    color: #ffd08b;
}

.status-ready,
.status-notified {
    background-color: rgba(76, 175, 80, 0.14);
    color: #9fe1ab;
}

.package-card.popular {
    border-color: var(--primary-color);
    box-shadow: 0 0 30px rgba(226, 180, 95, 0.12);
}

.fortune-card-photos img,
.fortune-photos img {
    filter: saturate(0.95) contrast(1.02);
}

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: #120f0c;
}

::-webkit-scrollbar-thumb {
    background: #3b3128;
    border-radius: 999px;
}

::-webkit-scrollbar-thumb:hover {
    background: #6f573d;
}

::selection {
    background-color: rgba(226, 180, 95, 0.35);
    color: #fff8ec;
}