/**
 * Path: assets/css/concept-b-override.css
 * Description: Konsept B — "Dijital Yazma Eser" Tam Görsel Dönüşüm
 * Version: 1.0.0
 *
 * Bu dosya mevcut dark tema üzerine binen bir override katmanıdır.
 * Varsayılan olarak LIGHT (fildişi/krem) temayı zorlar.
 */

/* ========================================
   GLOBAL OVERRIDE: Light Parchment Theme
   ======================================== */

/* ROOT VARIABLE OVERRIDES — Nuclear fix for all white text */
:root {
    /* Override --white used as text color everywhere → now dark */
    --white: #2C2416 !important;

    /* Override navy backgrounds → warm cream */
    --navy-deep: #F5F0E4 !important;
    --navy-medium: #EDE7D9 !important;
    --navy-light: #E8E0CE !important;

    /* Override glass surfaces → warm cream */
    --glass-white: rgba(251, 248, 240, 0.7) !important;
    --glass-white-strong: rgba(251, 248, 240, 0.9) !important;
    --glass-border: rgba(193, 183, 160, 0.5) !important;
    --glass-dark: rgba(245, 240, 228, 0.9) !important;

    /* Gray overrides for readability */
    --gray-900: #2C2416 !important;
    --gray-700: #4A463B !important;
    --gray-500: #6B5D4C !important;
}

body {
    background: #F5F0E4 !important;
    color: #2C2416 !important;
    font-family: 'Lora', 'Inter', Georgia, serif !important;
}

/* ========================================
   NAVBAR: Warm ivory navbar
   ======================================== */
.nav-wrapper {
    background: rgba(245, 240, 228, 0.97) !important;
    border-bottom: 1px solid #C4B899 !important;
    backdrop-filter: blur(12px) !important;
    box-shadow: 0 2px 20px rgba(44, 36, 22, 0.06) !important;
}

.navbar {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.nav-logo-text {
    color: #2C2416 !important;
}

.nav-logo-text span {
    color: #B8860B !important;
}

.nav-logo-icon {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
}

.nav-menu a {
    color: #4A463B !important;
}

.nav-menu a:hover,
.nav-menu a.active {
    color: #B8860B !important;
}

.btn-ghost {
    color: #4A463B !important;
    border-color: #C4B899 !important;
}

.btn-ghost:hover {
    background: rgba(184, 134, 11, 0.08) !important;
    color: #B8860B !important;
}

.btn-primary {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(184, 134, 11, 0.3) !important;
}

.btn-primary:hover {
    box-shadow: 0 8px 24px rgba(184, 134, 11, 0.4) !important;
    transform: translateY(-2px);
}

/* ========================================
   HERO SECTION: Warm parchment with pattern
   ======================================== */
.hero {
    background: linear-gradient(170deg, #F5F0E4 0%, #EDE7D9 40%, #F5F0E4 100%) !important;
    color: #2C2416 !important;
}

.hero-bg {
    background: transparent !important;
}

.hero-bg::before {
    background: radial-gradient(ellipse at 25% 15%, rgba(184, 134, 11, 0.12) 0%, transparent 55%),
                radial-gradient(ellipse at 75% 85%, rgba(123, 45, 59, 0.06) 0%, transparent 55%) !important;
}

.hero-bg::after {
    background: radial-gradient(circle at 100% 0%, rgba(184, 134, 11, 0.06) 0%, transparent 50%),
                radial-gradient(circle at 85% 15%, rgba(184, 134, 11, 0.03) 0%, transparent 30%) !important;
}

.hero-badge {
    background: rgba(184, 134, 11, 0.08) !important;
    border: 1px solid rgba(184, 134, 11, 0.25) !important;
    color: #8B6914 !important;
    backdrop-filter: none !important;
}

.hero-title {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

.hero-title .highlight {
    background: linear-gradient(135deg, #B8860B, #8B6914) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.hero-subtitle {
    color: #6B5D4C !important;
}

.hero-stats {
    border-top-color: #C4B899 !important;
}

.stat-number {
    color: #B8860B !important;
}

.stat-label {
    color: #6B5D4C !important;
}

/* ========================================
   TRANSLATOR CARD: Manuscript page frame
   ======================================== */
.translator-card {
    background: #FBF8F0 !important;
    border: 2px solid #D4A843 !important;
    backdrop-filter: none !important;
    box-shadow: 0 8px 40px rgba(44, 36, 22, 0.1),
                0 0 0 1px rgba(184, 134, 11, 0.1) !important;
    border-radius: 16px !important;
}

.translator-card:hover {
    border-color: #B8860B !important;
    box-shadow: 0 12px 48px rgba(44, 36, 22, 0.15),
                0 0 0 1px rgba(184, 134, 11, 0.25) !important;
}

.translator-tabs {
    background: #EDE7D9 !important;
    border-bottom: 1px solid #C4B899 !important;
}

.tab-btn {
    color: #6B5D4C !important;
    font-family: 'Lora', serif !important;
}

.tab-btn.active {
    color: #2C2416 !important;
    background: rgba(184, 134, 11, 0.06) !important;
}

.tab-btn.active::after {
    background: #B8860B !important;
}

.editor-pane {
    background: #F5F0E4 !important;
}

.editor-pane:first-child {
    background: #FBF8F0 !important;
}

.lang-label {
    color: #8C8471 !important;
}

.editor-textarea {
    color: #2C2416 !important;
    font-family: 'Lora', serif !important;
}

.editor-textarea::placeholder {
    color: #A89880 !important;
}

.char-counter,
.editor-footer {
    color: #8C8471 !important;
}

.output-area {
    color: #7B2D3B !important;
}

.output-placeholder {
    color: #A89880 !important;
    font-family: 'Lora', serif !important;
}

.tool-btn {
    background: rgba(184, 134, 11, 0.06) !important;
    border: 1px solid #C4B899 !important;
    color: #6B5D4C !important;
}

.tool-btn:hover {
    background: #B8860B !important;
    color: #FBF8F0 !important;
    border-color: #B8860B !important;
}

.translate-action {
    border-top: 1px solid #C4B899 !important;
    background: #EDE7D9 !important;
}

.btn-translate {
    background: linear-gradient(135deg, #7B2D3B, #A0455A) !important;
    color: #FBF8F0 !important;
    box-shadow: 0 4px 16px rgba(123, 45, 59, 0.35) !important;
    border: 1px solid rgba(184, 134, 11, 0.3) !important;
}

.btn-translate:hover {
    box-shadow: 0 8px 28px rgba(123, 45, 59, 0.45) !important;
}

/* Translation mode bar */
.translation-mode-bar {
    background: #EDE7D9 !important;
    border-top: 1px solid #C4B899 !important;
}

.mode-label {
    color: #6B5D4C !important;
}

.mode-option {
    color: #6B5D4C !important;
    background: transparent !important;
    border: 1px solid transparent !important;
}

.mode-option.active {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
    border-color: #B8860B !important;
}

.mode-option:hover:not(.active) {
    background: rgba(184, 134, 11, 0.08) !important;
}

/* Editor grid border */
.editor-grid {
    background: #C4B899 !important;
    border-radius: 12px !important;
}

/* ========================================
   SECTIONS: Warm alternating backgrounds
   ======================================== */
.section {
    background: #F5F0E4 !important;
}

#recent-translations {
    background: #EDE7D9 !important;
}

#features {
    background: linear-gradient(180deg, #F5F0E4 0%, #EDE7D9 100%) !important;
}

.section-tag {
    background: rgba(184, 134, 11, 0.1) !important;
    color: #B8860B !important;
}

.section-title {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

.section-subtitle {
    color: #6B5D4C !important;
}

/* ========================================
   FEATURE CARDS: Ivory cards with gold accent
   ======================================== */
.card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    box-shadow: 0 2px 12px rgba(44, 36, 22, 0.06) !important;
    color: #2C2416 !important;
    backdrop-filter: none !important;
}

.card:hover {
    border-color: #B8860B !important;
    box-shadow: 0 8px 24px rgba(184, 134, 11, 0.12) !important;
    transform: translateY(-4px);
}

.card-icon {
    background: linear-gradient(135deg, rgba(184, 134, 11, 0.1), rgba(184, 134, 11, 0.05)) !important;
    color: #B8860B !important;
    border: 1px solid rgba(184, 134, 11, 0.2) !important;
}

.card-title {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

.card p {
    color: #6B5D4C !important;
}

/* ========================================
   RECENT TRANSLATIONS: Warm cards
   ======================================== */
.translation-item {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
}

.translation-item:hover {
    border-color: #B8860B !important;
    box-shadow: 0 8px 24px rgba(44, 36, 22, 0.1) !important;
}

.translation-source p {
    color: #2C2416 !important;
}

.translation-target p.ottoman-text {
    color: #7B2D3B !important;
}

.translation-info {
    border-top-color: #E2DAC8 !important;
    color: #8C8471 !important;
}

.auth-card {
    background: rgba(251, 248, 240, 0.95) !important;
    border: 2px solid #D4A843 !important;
    box-shadow: 0 20px 50px rgba(44, 36, 22, 0.15) !important;
    backdrop-filter: blur(8px) !important;
}

.auth-card h3 {
    color: #2C2416 !important;
}

.auth-card p {
    color: #6B5D4C !important;
}

.auth-card i {
    color: #B8860B !important;
    filter: none !important;
}

.recent-translations-wrapper.restricted-view::after {
    background: linear-gradient(to bottom, rgba(237, 231, 217, 0) 0%, #EDE7D9 90%) !important;
}

/* ========================================
   WORD OF THE DAY: Premium warm widget
   ======================================== */
.wod-section {
    background: #2C2416 !important;
    color: #F5F0E4 !important;
}

.wod-widget {
    background: rgba(251, 248, 240, 0.06) !important;
    border: 1px solid rgba(212, 168, 67, 0.3) !important;
    backdrop-filter: blur(12px) !important;
}

.wod-widget::before {
    background: radial-gradient(circle, rgba(184, 134, 11, 0.15), transparent 70%) !important;
}

.wod-word {
    color: #D4A843 !important;
}

.wod-meaning {
    border-left-color: #D4A843 !important;
    color: rgba(245, 240, 228, 0.8) !important;
}

.wod-content .section-title {
    color: #F5F0E4 !important;
}

.wod-content .section-subtitle {
    color: rgba(245, 240, 228, 0.6) !important;
}

.wod-content .section-tag {
    color: #D4A843 !important;
}

/* ========================================
   HOW IT WORKS: Warm styling
   ======================================== */
#nasil-calisir {
    background: linear-gradient(180deg, #EDE7D9 0%, #F5F0E4 100%) !important;
}

#nasil-calisir h4 {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

#nasil-calisir p {
    color: #6B5D4C !important;
}

/* ========================================
   FAQ: Warm accordion
   ======================================== */
#sss {
    background: #F5F0E4 !important;
}

.faq-item-home {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
}

.faq-q-btn {
    color: #2C2416 !important;
}

.faq-a-content {
    color: #6B5D4C !important;
}

.faq-item-home.active {
    border-color: #B8860B !important;
}

/* ========================================
   TESTIMONIALS: Warm cards
   ======================================== */
#yorumlar {
    background: #EDE7D9 !important;
}

.testimonial-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.testimonial-card.featured {
    border-color: #B8860B !important;
    box-shadow: 0 8px 32px rgba(184, 134, 11, 0.15) !important;
}

.testimonial-text {
    color: #4A463B !important;
}

.testimonial-name {
    color: #2C2416 !important;
}

.testimonial-role {
    color: #8C8471 !important;
}

.testimonial-stars i {
    color: #D4A843 !important;
}

.testimonial-avatar {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
}

/* ========================================
   PRICING: Warm styling
   ======================================== */
#pricing {
    background: #F5F0E4 !important;
}

/* ========================================
   WISDOM BOX: Ottoman accent
   ======================================== */
.wisdom-box {
    background: linear-gradient(135deg, rgba(184, 134, 11, 0.06), rgba(123, 45, 59, 0.03)) !important;
    border: 1px solid rgba(184, 134, 11, 0.2) !important;
}

.wisdom-box::before {
    background: linear-gradient(180deg, #B8860B, #7B2D3B, transparent) !important;
}

.wisdom-ottoman {
    color: #B8860B !important;
}

.wisdom-turkish {
    color: #6B5D4C !important;
}

.wisdom-source {
    color: #8C8471 !important;
}

/* ========================================
   CREDIT STATUS BAR
   ======================================== */
.credit-status-bar {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
}

.credit-status-label {
    color: #6B5D4C !important;
}

.credit-highlight {
    color: #B8860B !important;
}

/* ========================================
   FOOTER: Dark leather
   ======================================== */
footer,
.footer {
    background: #2C2416 !important;
    color: #E8E0D0 !important;
    border-top: 2px solid #B8860B !important;
}

footer a,
.footer a {
    color: #D4A843 !important;
}

footer a:hover,
.footer a:hover {
    color: #FBF8F0 !important;
}

/* ========================================
   ANNOUNCEMENT BAR: Ottoman style
   ======================================== */
#announcementBar {
    background: linear-gradient(135deg, #2C2416, #3D3224) !important;
    border-bottom: 1px solid rgba(212, 168, 67, 0.3) !important;
}

/* ========================================
   SCROLLBAR: Warm styling
   ======================================== */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #EDE7D9;
}

::-webkit-scrollbar-thumb {
    background: #C4B899;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #B8860B;
}

/* ========================================
   MOBILE MENU: Warm version
   ======================================== */
.mobile-menu {
    background: #FBF8F0 !important;
    border-bottom: 1px solid #C4B899 !important;
}

.mobile-menu a {
    color: #2C2416 !important;
}

/* ========================================
   SELECTION: Ottoman gold highlight
   ======================================== */
::selection {
    background: rgba(184, 134, 11, 0.2);
    color: #2C2416;
}

/* ========================================
   TRANSLITERATION AREA
   ======================================== */
.transliteration-toggle {
    color: #6B5D4C !important;
    border-color: #C4B899 !important;
}

.transliteration-content {
    background: #EDE7D9 !important;
    color: #2C2416 !important;
}

/* ========================================
   PLANS / PRICING PAGE: Full Override
   ======================================== */
.plans-page {
    background: #F5F0E4 !important;
}

.plans-header h1 {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

.plans-header p {
    color: #6B5D4C !important;
}

.pricing-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    backdrop-filter: none !important;
    box-shadow: 0 4px 16px rgba(44, 36, 22, 0.08) !important;
}

.pricing-card:hover {
    border-color: #B8860B !important;
    box-shadow: 0 12px 32px rgba(184, 134, 11, 0.15) !important;
}

.pricing-card.featured {
    border-color: #B8860B !important;
    background: linear-gradient(180deg, rgba(184, 134, 11, 0.06), #FBF8F0) !important;
    box-shadow: 0 8px 32px rgba(184, 134, 11, 0.2) !important;
}

.plan-name {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

.plan-price {
    color: #B8860B !important;
}

.plan-price small {
    color: #8C8471 !important;
}

.plan-desc {
    color: #6B5D4C !important;
}

.plan-header {
    border-bottom-color: #D1C7B2 !important;
}

.feature-item {
    color: #4A463B !important;
    border-bottom-color: #E2DAC8 !important;
}

.feature-item i {
    color: #B8860B !important;
}

.feature-item .text-success {
    color: #059669 !important;
}

.feature-item .text-muted {
    color: #A89880 !important;
}

.feature-item.highlight {
    background: rgba(184, 134, 11, 0.08) !important;
    color: #2C2416 !important;
}

.popular-badge {
    color: #FBF8F0 !important;
}

.btn-outline {
    background: transparent !important;
    border: 1px solid #C4B899 !important;
    color: #4A463B !important;
}

.btn-outline:hover {
    background: rgba(184, 134, 11, 0.08) !important;
    border-color: #B8860B !important;
    color: #B8860B !important;
}

.btn-primary-plan {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
}

/* Plans page FAQ */
.faq-item {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
}

.faq-item.active {
    border-color: #B8860B !important;
}

.faq-question {
    color: #2C2416 !important;
}

.faq-question:hover {
    background: rgba(184, 134, 11, 0.04) !important;
}

.faq-question h4 {
    color: #2C2416 !important;
}

.faq-answer {
    color: #6B5D4C !important;
}

.faq-header .section-title {
    color: #2C2416 !important;
}

/* Loading state */
.loading-state p,
.error-state p {
    color: #6B5D4C !important;
}

/* ========================================
   UPLOAD DOCUMENT PAGE
   ======================================== */
.upload-section,
.upload-page {
    background: #F5F0E4 !important;
    color: #2C2416 !important;
}

/* ========================================
   GENERIC GLOBAL: Catch-all for inline white text
   ======================================== */
[style*="color:rgba(255,255,255"],
[style*="color: rgba(255,255,255"],
[style*="color:rgba(255, 255, 255"],
[style*="color: rgba(255, 255, 255"] {
    color: #6B5D4C !important;
}

[style*="color:var(--white)"] {
    color: #2C2416 !important;
}

/* ========================================
   DASHBOARD: Ottoman Leather Sidebar + Ivory Content
   ======================================== */
.dashboard-layout {
    background: #F5F0E4 !important;
}

/* Sidebar — warm leather/mahogany */
.dashboard-sidebar {
    background: #2C2416 !important;
    border-right: 1px solid rgba(184, 134, 11, 0.2) !important;
}

.sidebar-header {
    border-bottom-color: rgba(184, 134, 11, 0.15) !important;
}

.sidebar-logo {
    color: #F5F0E4 !important;
}

.sidebar-logo-text {
    color: #F5F0E4 !important;
}

.sidebar-logo-text span {
    color: #D4A843 !important;
}

.sidebar-logo-icon {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #2C2416 !important;
}

.sidebar-profile {
    border-bottom-color: rgba(184, 134, 11, 0.15) !important;
}

.profile-name {
    color: #F5F0E4 !important;
}

.profile-badge {
    background: rgba(184, 134, 11, 0.1) !important;
    border-color: rgba(184, 134, 11, 0.2) !important;
    color: #D4A843 !important;
}

.nav-section-title {
    color: rgba(212, 168, 67, 0.5) !important;
}

.nav-item {
    color: rgba(245, 240, 228, 0.65) !important;
}

.nav-item:hover {
    background: rgba(184, 134, 11, 0.1) !important;
    color: #F5F0E4 !important;
}

.nav-item.active {
    background: linear-gradient(135deg, rgba(184, 134, 11, 0.15), rgba(184, 134, 11, 0.05)) !important;
    color: #D4A843 !important;
    border-left-color: #D4A843 !important;
}

.sidebar-footer {
    border-top-color: rgba(184, 134, 11, 0.15) !important;
}

.back-to-site {
    background: rgba(184, 134, 11, 0.08) !important;
    border-color: rgba(184, 134, 11, 0.2) !important;
    color: rgba(245, 240, 228, 0.65) !important;
}

.back-to-site:hover {
    color: #D4A843 !important;
    border-color: #D4A843 !important;
}

/* Main Content Area */
.dashboard-main {
    background: #F5F0E4 !important;
    color: #2C2416 !important;
}

.page-header h1 {
    color: #2C2416 !important;
}

.page-header p {
    color: #6B5D4C !important;
}

/* Stat Cards */
.stat-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    backdrop-filter: none !important;
}

.stat-card:hover {
    border-color: #B8860B !important;
}

.stat-info h3 {
    color: #8C8471 !important;
}

.stat-info .value {
    color: #2C2416 !important;
}

/* Content Cards */
.content-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    backdrop-filter: none !important;
}

.card-header {
    color: #2C2416 !important;
}

.card-title {
    color: #2C2416 !important;
}

/* ========================================
   GENERIC: "glass" variables overhaul
   ======================================== */

/* ========================================
   HOMEPAGE PRICING CARDS (index.php #pricing)
   Different class names than plans.php
   ======================================== */
.pricing-name {
    color: #2C2416 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
}

.pricing-price {
    color: #B8860B !important;
    font-size: 2.5rem !important;
    font-weight: 700 !important;
}

.pricing-price span {
    color: #8C8471 !important;
}

.pricing-features {
    list-style: none !important;
    padding: 0 !important;
}

.pricing-features li {
    color: #4A463B !important;
    padding: 0.5rem 0 !important;
    border-bottom: 1px solid #E2DAC8 !important;
}

.pricing-features li:last-child {
    border-bottom: none !important;
}

.pricing-features li i {
    color: #B8860B !important;
    margin-right: 8px !important;
}

.pricing-features li i.fa-times {
    color: #A89880 !important;
}

/* Pricing card generic override — catches ALL pricing cards everywhere */
.pricing-card,
.pricing-card * {
    color: #2C2416;
}

.pricing-card h3,
.pricing-card h4,
.pricing-card strong {
    color: #2C2416 !important;
}

.pricing-card p,
.pricing-card span,
.pricing-card div:not(.popular-badge) {
    color: #4A463B !important;
}

.pricing-card li {
    color: #4A463B !important;
}

/* ========================================
   FOOTER: Polished Dark Leather
   ======================================== */
.footer {
    padding: 4rem 0 2rem !important;
}

.footer-logo {
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #F5F0E4 !important;
}

.footer-logo span {
    color: #D4A843 !important;
}

.footer-desc {
    color: rgba(245, 240, 228, 0.6) !important;
    font-size: 0.9rem !important;
    line-height: 1.6 !important;
}

.footer-column h4 {
    color: #D4A843 !important;
    font-family: 'Cormorant Garamond', Georgia, serif !important;
    font-size: 1.1rem !important;
    margin-bottom: 1rem !important;
}

.footer-links li a {
    color: rgba(245, 240, 228, 0.6) !important;
    transition: color 0.2s !important;
}

.footer-links li a:hover {
    color: #D4A843 !important;
}

.footer-social a {
    color: rgba(245, 240, 228, 0.5) !important;
}

.footer-social a:hover {
    color: #D4A843 !important;
}

.footer-bottom {
    border-top: 1px solid rgba(184, 134, 11, 0.15) !important;
    color: rgba(245, 240, 228, 0.4) !important;
}

.footer-bottom a {
    color: #D4A843 !important;
}

/* ========================================
   NAVBAR: Decorative Tezhip Gold Bottom Line
   ======================================== */
.nav-wrapper::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 5%;
    width: 90%;
    height: 2px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(184, 134, 11, 0.15) 10%,
        rgba(184, 134, 11, 0.4) 30%,
        #B8860B 50%,
        rgba(184, 134, 11, 0.4) 70%,
        rgba(184, 134, 11, 0.15) 90%,
        transparent 100%
    );
    pointer-events: none;
}

/* ========================================
   GIRIH PATTERN: Increased Visibility
   ======================================== */
.ottoman-girih-pattern {
    opacity: 0.12 !important;
}

.hero .ottoman-girih-pattern {
    opacity: 0.08 !important;
}

/* ========================================
   HERO BG: Subtle warm dot texture
   ======================================== */
.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(
        circle,
        rgba(184, 134, 11, 0.06) 1px,
        transparent 1px
    );
    background-size: 24px 24px;
    z-index: 0;
    pointer-events: none;
}

/* ========================================
   MICRO-ANIMATIONS: Subtle ink & hover effects
   ======================================== */

/* Cards: Gold underline reveal on hover */
.card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: linear-gradient(135deg, #B8860B, #D4A843);
    transition: width 0.4s ease, left 0.4s ease;
}

.card:hover::after {
    width: 60%;
    left: 20%;
}

/* Translate button: subtle glow pulse */
.btn-translate {
    animation: gentlePulse 3s infinite ease-in-out !important;
}

@keyframes gentlePulse {
    0%, 100% { box-shadow: 0 4px 16px rgba(123, 45, 59, 0.35); }
    50% { box-shadow: 0 4px 24px rgba(123, 45, 59, 0.5), 0 0 40px rgba(184, 134, 11, 0.1); }
}

/* Gold icon spin on card hover */
.card:hover .card-icon i {
    animation: gentleSpin 0.6s ease;
}

@keyframes gentleSpin {
    0% { transform: rotateY(0deg); }
    100% { transform: rotateY(360deg); }
}

/* Nav links: gold underline transition */
.nav-menu a::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    width: 0;
    height: 2px;
    background: #B8860B;
    transition: width 0.3s ease, left 0.3s ease;
}

.nav-menu a:hover::after,
.nav-menu a.active::after {
    width: 100%;
    left: 0;
}

/* Stat numbers: count-up feel */
.stat-number {
    transition: transform 0.3s ease !important;
}

.stat-item:hover .stat-number {
    transform: scale(1.05);
}

/* ========================================
   LIGHT TEXT PROTECTION
   Elements that NEED actual white/light text
   after --white was overridden to dark
   ======================================== */

/* Buttons with colored backgrounds need light text */
.btn-primary,
.btn-primary-plan,
.btn-translate,
.popular-badge,
.mode-option.active {
    color: #FBF8F0 !important;
}

/* Gold icon containers on colored backgrounds */
.stat-icon,
.sidebar-logo-icon,
.profile-avatar,
.nav-logo-icon {
    color: #FBF8F0 !important;
}

/* Announcement bar */
#announcementBar,
#announcementBar * {
    color: #F5F0E4 !important;
}

#announcementBar a {
    color: #D4A843 !important;
}

/* Dark sections that need light text */
.wod-section *:not(.section-tag) {
    color: #F5F0E4;
}

.wod-section .section-tag {
    color: #D4A843 !important;
}

.wod-section .wod-word {
    color: #D4A843 !important;
}

.wod-section .section-title {
    color: #F5F0E4 !important;
}

/* Footer text protection */
footer *,
.footer * {
    color: #E8E0D0;
}

footer a,
.footer a {
    color: #D4A843 !important;
}

.footer-logo {
    color: #F5F0E4 !important;
}

.footer-logo span {
    color: #D4A843 !important;
}

/* Dashboard sidebar text protection */
.dashboard-sidebar *:not(.sidebar-logo-icon) {
    color: rgba(245, 240, 228, 0.65);
}

.dashboard-sidebar .sidebar-logo-text {
    color: #F5F0E4 !important;
}

.dashboard-sidebar .sidebar-logo-text span {
    color: #D4A843 !important;
}

.dashboard-sidebar .profile-name {
    color: #F5F0E4 !important;
}

.dashboard-sidebar .nav-item.active {
    color: #D4A843 !important;
}

.dashboard-sidebar .nav-section-title {
    color: rgba(212, 168, 67, 0.5) !important;
}

/* Step icons (numbered circles with gold bg) */
.steps-grid div[style*="background: linear-gradient"] i {
    color: #FBF8F0 !important;
}

/* ========================================
   MEGA CATCH-ALL: Override ALL inline white text
   across ALL pages (upload_document, checkout, 
   login, register, dashboard, history, etc.)
   ======================================== */

/* === ALL PAGES: General Page Backgrounds === */
.plans-page,
.upload-section,
.upload-page,
.checkout-page,
.login-page,
.register-page,
.auth-page,
.history-page,
.subscription-page,
.support-page,
.settings-page,
.ocr-page,
.alphabet-page,
.quiz-page {
    background: #F5F0E4 !important;
    color: #2C2416 !important;
}

/* === UPLOAD DOCUMENT PAGE === */
.upload-area {
    background: #FBF8F0 !important;
    border: 2px dashed #C4B899 !important;
    color: #2C2416 !important;
}

.upload-area p {
    color: #6B5D4C !important;
}

.upload-area i {
    color: #B8860B !important;
}

.upload-area:hover {
    border-color: #B8860B !important;
    background: rgba(184, 134, 11, 0.04) !important;
}

.pdf-preview,
.pdf-preview p {
    color: #6B5D4C !important;
}

.process-steps div {
    color: #4A463B !important;
}

.page-stat-label {
    color: #8C8471 !important;
}

.history-preview {
    color: #6B5D4C !important;
}

.history-date {
    color: #8C8471 !important;
}

.engine-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.engine-card h4,
.engine-card h3 {
    color: #2C2416 !important;
}

.engine-features li {
    color: #4A463B !important;
}

.engine-features li .fa-minus {
    color: #C4B899 !important;
}

.accuracy-stars .fa-star.dim {
    color: #D1C7B2 !important;
}

.cost-est-label {
    color: #6B5D4C !important;
}

.cost-est-total .cost-est-label {
    color: #4A463B !important;
}

/* === LOGIN / REGISTER PAGES === */
.auth-container,
.auth-form-container,
.login-container,
.register-container {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.auth-container h1,
.auth-container h2,
.auth-container h3,
.login-container h1,
.register-container h1 {
    color: #2C2416 !important;
}

.auth-container p,
.auth-container label,
.login-container p,
.register-container p {
    color: #6B5D4C !important;
}

.form-group label {
    color: #4A463B !important;
}

.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
    background: #F5F0E4 !important;
    border: 1px solid #C4B899 !important;
    color: #2C2416 !important;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: #A89880 !important;
}

/* === CHECKOUT PAGE === */
.checkout-container,
.payment-card,
.order-summary {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.checkout-container h1,
.checkout-container h2,
.checkout-container h3,
.order-summary h3 {
    color: #2C2416 !important;
}

.checkout-container p,
.order-summary p {
    color: #6B5D4C !important;
}

/* === TRANSLATION HISTORY === */
.history-table,
.history-card,
.history-item {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.history-table th {
    background: #EDE7D9 !important;
    color: #4A463B !important;
}

.history-table td {
    color: #2C2416 !important;
    border-bottom-color: #E2DAC8 !important;
}

/* === USER SUBSCRIPTION / SETTINGS / SUPPORT === */
.subscription-card,
.settings-card,
.support-card,
.profile-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.subscription-card h3,
.settings-card h3,
.support-card h3 {
    color: #2C2416 !important;
}

.subscription-card p,
.settings-card p,
.support-card p {
    color: #6B5D4C !important;
}

/* === ALPHABET & QUIZ PAGES === */
.alphabet-grid,
.quiz-container {
    color: #2C2416 !important;
}

.letter-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.quiz-option {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

/* === TABLES: generic override === */
table {
    color: #2C2416 !important;
}

table th {
    background: #EDE7D9 !important;
    color: #4A463B !important;
}

table td {
    color: #2C2416 !important;
    border-bottom-color: #E2DAC8 !important;
}

/* === MODALS / ALERTS: keep them readable === */
.swal2-popup {
    background: #FBF8F0 !important;
    color: #2C2416 !important;
}

.swal2-title {
    color: #2C2416 !important;
}

.swal2-html-container {
    color: #6B5D4C !important;
}

/* === MASTER CATCH-ALL: Force all inline white text === */
/* This catches ALL elements with inline style white text */
/* Using attribute selectors with !important */
h1, h2, h3, h4, h5, h6 {
    color: #2C2416;
}

p, span, li, td, th, label, div {
    color: inherit;
}

/* Override design-system.css that sets body/page defaults */
.page-content,
.main-content,
main {
    background: #F5F0E4 !important;
    color: #2C2416 !important;
}

/* General text helpers */
.text-muted {
    color: #8C8471 !important;
}

.text-light,
.text-white {
    color: #2C2416 !important;
}

/* Badges */
.badge {
    color: #FBF8F0 !important;
}

/* Tabs */
.nav-tabs .nav-link {
    color: #4A463B !important;
}

.nav-tabs .nav-link.active {
    color: #B8860B !important;
    border-bottom-color: #B8860B !important;
}

/* Dropdowns */
.dropdown-menu {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
}

.dropdown-item {
    color: #2C2416 !important;
}

.dropdown-item:hover {
    background: #EDE7D9 !important;
}

/* Tooltips */
.tooltip-inner {
    background: #2C2416 !important;
    color: #F5F0E4 !important;
}

/* Status indicators */
.status-badge,
.tag {
    color: #FBF8F0 !important;
}

/* Progress bars */
.progress {
    background: #EDE7D9 !important;
}

.progress-bar {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
}

/* ========================================
   MURAKKAA DARK MODE
   Warm leather/mahogany — NOT cold navy
   Activated via body.dark-mode class
   ======================================== */
body.dark-mode {
    --white: #E8DCC8 !important;
    --navy-deep: #1A1410 !important;
    --navy-medium: #221C15 !important;
    --navy-light: #2D251C !important;
    --glass-white: rgba(232, 220, 200, 0.06) !important;
    --glass-white-strong: rgba(232, 220, 200, 0.1) !important;
    --glass-border: rgba(184, 134, 11, 0.15) !important;
    --glass-dark: rgba(26, 20, 16, 0.9) !important;
    --gray-900: #E8DCC8 !important;
    --gray-700: #C4B89E !important;
    --gray-500: #9A8E7A !important;
}

body.dark-mode {
    background: #1A1410 !important;
    color: #E8DCC8 !important;
}

/* Dark mode: Navbar */
body.dark-mode .nav-wrapper {
    background: rgba(26, 20, 16, 0.97) !important;
    border-bottom-color: rgba(184, 134, 11, 0.15) !important;
}

body.dark-mode .nav-logo-text {
    color: #E8DCC8 !important;
}

body.dark-mode .nav-menu a {
    color: #C4B89E !important;
}

body.dark-mode .nav-menu a:hover,
body.dark-mode .nav-menu a.active {
    color: #D4A843 !important;
}

body.dark-mode .btn-ghost {
    color: #C4B89E !important;
    border-color: rgba(184, 134, 11, 0.2) !important;
}

/* Dark mode: Hero */
body.dark-mode .hero {
    background: linear-gradient(170deg, #1A1410 0%, #221C15 40%, #1A1410 100%) !important;
    color: #E8DCC8 !important;
}

body.dark-mode .hero-title {
    color: #E8DCC8 !important;
}

body.dark-mode .hero-subtitle {
    color: #9A8E7A !important;
}

body.dark-mode .hero-badge {
    background: rgba(184, 134, 11, 0.12) !important;
    border-color: rgba(184, 134, 11, 0.25) !important;
    color: #D4A843 !important;
}

body.dark-mode .hero-stats {
    border-top-color: rgba(184, 134, 11, 0.15) !important;
}

body.dark-mode .stat-label {
    color: #9A8E7A !important;
}

/* Dark mode: Translator Card */
body.dark-mode .translator-card {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.25) !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.3) !important;
}

body.dark-mode .translator-tabs {
    background: #1A1410 !important;
    border-bottom-color: rgba(184, 134, 11, 0.15) !important;
}

body.dark-mode .tab-btn {
    color: #9A8E7A !important;
}

body.dark-mode .tab-btn.active {
    color: #E8DCC8 !important;
}

body.dark-mode .editor-pane,
body.dark-mode .editor-pane:first-child {
    background: #1A1410 !important;
}

body.dark-mode .editor-textarea {
    color: #E8DCC8 !important;
}

body.dark-mode .editor-textarea::placeholder {
    color: #6B5D4C !important;
}

body.dark-mode .editor-grid {
    background: rgba(184, 134, 11, 0.1) !important;
}

body.dark-mode .translate-action {
    background: #1A1410 !important;
    border-top-color: rgba(184, 134, 11, 0.15) !important;
}

body.dark-mode .translation-mode-bar {
    background: #1A1410 !important;
    border-top-color: rgba(184, 134, 11, 0.15) !important;
}

body.dark-mode .tool-btn {
    background: rgba(184, 134, 11, 0.08) !important;
    border-color: rgba(184, 134, 11, 0.15) !important;
    color: #9A8E7A !important;
}

body.dark-mode .lang-label {
    color: #6B5D4C !important;
}

body.dark-mode .char-counter {
    color: #6B5D4C !important;
}

body.dark-mode .mode-option {
    color: #9A8E7A !important;
}

body.dark-mode .output-placeholder {
    color: #6B5D4C !important;
}

/* Dark mode: Sections */
body.dark-mode .section {
    background: #1A1410 !important;
}

body.dark-mode #recent-translations {
    background: #221C15 !important;
}

body.dark-mode #features {
    background: linear-gradient(180deg, #1A1410 0%, #221C15 100%) !important;
}

body.dark-mode #nasil-calisir {
    background: linear-gradient(180deg, #221C15 0%, #1A1410 100%) !important;
}

body.dark-mode #yorumlar {
    background: #221C15 !important;
}

body.dark-mode .section-title {
    color: #E8DCC8 !important;
}

body.dark-mode .section-subtitle {
    color: #9A8E7A !important;
}

body.dark-mode .section-tag {
    background: rgba(184, 134, 11, 0.12) !important;
    color: #D4A843 !important;
}

/* Dark mode: Cards */
body.dark-mode .card {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.12) !important;
    color: #E8DCC8 !important;
}

body.dark-mode .card:hover {
    border-color: rgba(184, 134, 11, 0.3) !important;
}

body.dark-mode .card-title {
    color: #E8DCC8 !important;
}

body.dark-mode .card p {
    color: #9A8E7A !important;
}

body.dark-mode .card-icon {
    background: linear-gradient(135deg, rgba(184, 134, 11, 0.15), rgba(184, 134, 11, 0.05)) !important;
    border-color: rgba(184, 134, 11, 0.2) !important;
}

/* Dark mode: Pricing */
body.dark-mode .pricing-card {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.12) !important;
    color: #E8DCC8 !important;
}

body.dark-mode .pricing-card * {
    color: #E8DCC8;
}

body.dark-mode .pricing-card p,
body.dark-mode .pricing-card div:not(.popular-badge) {
    color: #9A8E7A !important;
}

body.dark-mode .pricing-card li {
    color: #C4B89E !important;
}

body.dark-mode .plan-name,
body.dark-mode .pricing-name {
    color: #E8DCC8 !important;
}

body.dark-mode .plan-desc {
    color: #9A8E7A !important;
}

body.dark-mode .feature-item {
    color: #C4B89E !important;
    border-bottom-color: rgba(184, 134, 11, 0.1) !important;
}

/* Dark mode: Testimonials */
body.dark-mode .testimonial-card {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.12) !important;
    color: #E8DCC8 !important;
}

body.dark-mode .testimonial-text {
    color: #C4B89E !important;
}

/* Dark mode: FAQ */
body.dark-mode .faq-item,
body.dark-mode .faq-item-home {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.12) !important;
}

body.dark-mode .faq-question h4,
body.dark-mode .faq-q-btn {
    color: #E8DCC8 !important;
}

body.dark-mode .faq-answer,
body.dark-mode .faq-a-content {
    color: #9A8E7A !important;
}

/* Dark mode: Translation items */
body.dark-mode .translation-item {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.12) !important;
}

body.dark-mode .translation-source p {
    color: #E8DCC8 !important;
}

body.dark-mode .translation-info {
    border-top-color: rgba(184, 134, 11, 0.1) !important;
    color: #6B5D4C !important;
}

/* Dark mode: Auth card */
body.dark-mode .auth-card {
    background: rgba(34, 28, 21, 0.95) !important;
    border-color: rgba(184, 134, 11, 0.25) !important;
}

body.dark-mode .auth-card h3 {
    color: #E8DCC8 !important;
}

body.dark-mode .auth-card p {
    color: #9A8E7A !important;
}

body.dark-mode .recent-translations-wrapper.restricted-view::after {
    background: linear-gradient(to bottom, rgba(34, 28, 21, 0) 0%, #221C15 90%) !important;
}

/* Dark mode: Forms */
body.dark-mode .form-control,
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="password"],
body.dark-mode textarea,
body.dark-mode select {
    background: #1A1410 !important;
    border-color: rgba(184, 134, 11, 0.15) !important;
    color: #E8DCC8 !important;
}

/* Dark mode: Content cards (dashboard) */
body.dark-mode .stat-card,
body.dark-mode .content-card {
    background: #221C15 !important;
    border-color: rgba(184, 134, 11, 0.12) !important;
}

body.dark-mode .stat-info h3 {
    color: #6B5D4C !important;
}

body.dark-mode .stat-info .value {
    color: #E8DCC8 !important;
}

body.dark-mode .dashboard-main {
    background: #1A1410 !important;
    color: #E8DCC8 !important;
}

body.dark-mode .page-header h1 {
    color: #E8DCC8 !important;
}

body.dark-mode .page-header p {
    color: #9A8E7A !important;
}

/* Dark mode: Headings */
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
    color: #E8DCC8;
}

/* Dark mode: Scrollbar */
body.dark-mode::-webkit-scrollbar-track {
    background: #1A1410;
}

body.dark-mode::-webkit-scrollbar-thumb {
    background: #3D3224;
}

/* Dark mode: SweetAlert */
body.dark-mode .swal2-popup {
    background: #221C15 !important;
    color: #E8DCC8 !important;
}

body.dark-mode .swal2-title {
    color: #E8DCC8 !important;
}

body.dark-mode .swal2-html-container {
    color: #9A8E7A !important;
}

/* ========================================
   DARK MODE TOGGLE BUTTON
   ======================================== */
.dark-mode-toggle {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid rgba(184, 134, 11, 0.3);
    background: #FBF8F0;
    color: #B8860B;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.dark-mode-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 24px rgba(184, 134, 11, 0.2);
}

body.dark-mode .dark-mode-toggle {
    background: #221C15;
    color: #D4A843;
    border-color: rgba(184, 134, 11, 0.3);
}

/* ========================================
   CHECKOUT PAGE: Warm Parchment Override
   ======================================== */

/* Premium glass cards → warm ivory */
.checkout-container .premium-card {
    background: #FBF8F0 !important;
    border: 1px solid #D1C7B2 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: 0 4px 16px rgba(44, 36, 22, 0.08) !important;
}

.checkout-container .premium-card:hover {
    border-color: #B8860B !important;
    box-shadow: 0 8px 24px rgba(184, 134, 11, 0.12) !important;
}

/* Order Summary heading */
.order-summary h3 {
    color: #2C2416 !important;
    border-bottom-color: #D1C7B2 !important;
}

/* Plan name */
.checkout-container .plan-name {
    color: #2C2416 !important;
}

/* Plan price */
.checkout-container .plan-price {
    color: #B8860B !important;
}

.checkout-container .plan-price span {
    color: #8C8471 !important;
}

/* Feature list items */
.checkout-container .plan-features-mini li {
    color: #4A463B !important;
}

.checkout-container .plan-features-mini li i {
    color: #B8860B !important;
    background: rgba(184, 134, 11, 0.1) !important;
}

/* Total row */
.checkout-container .total-row {
    border-top-color: #D1C7B2 !important;
}

.checkout-container .total-row span:first-child {
    color: #6B5D4C !important;
}

.checkout-container .total-row .total-price {
    color: #2C2416 !important;
}

/* Payment form heading */
.payment-form h2 {
    color: #2C2416 !important;
}

.payment-form h2 i {
    color: #B8860B !important;
}

/* Form labels */
.payment-form .form-group label {
    color: #4A463B !important;
}

.payment-form .form-group label i {
    color: #B8860B !important;
}

/* Form inputs */
.payment-form .form-group input,
.payment-form .form-group select {
    background: rgba(44, 36, 22, 0.03) !important;
    border: 1px solid #D1C7B2 !important;
    color: #2C2416 !important;
}

.payment-form .form-group input:focus,
.payment-form .form-group select:focus {
    border-color: #B8860B !important;
    box-shadow: 0 0 0 3px rgba(184, 134, 11, 0.15) !important;
    background: rgba(184, 134, 11, 0.03) !important;
}

.payment-form .form-group input::placeholder {
    color: #A89880 !important;
}

.payment-form .form-group select option {
    background: #FBF8F0 !important;
    color: #2C2416 !important;
}

/* Checkbox label */
.payment-form .checkbox-label {
    color: #4A463B !important;
}

/* Pay button — uses gold gradient, text must be light */
.checkout-container .btn-pay {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
    box-shadow: 0 4px 16px rgba(184, 134, 11, 0.3) !important;
}

.checkout-container .btn-pay:hover {
    box-shadow: 0 8px 24px rgba(184, 134, 11, 0.4) !important;
}

/* Secure badges */
.checkout-container .secure-badges {
    border-top-color: #D1C7B2 !important;
}

.checkout-container .secure-icon {
    color: #6B5D4C !important;
}

.checkout-container .secure-icon .text-success {
    color: #059669 !important;
}

.checkout-container .secure-icon .text-primary {
    color: #B8860B !important;
}

/* Order summary top gold bar — keep as is */
.order-summary::before {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
}

/* Payment Method Tabs — Concept B */
.checkout-container .pmt-tab {
    background: rgba(44, 36, 22, 0.03) !important;
    border-color: #D1C7B2 !important;
    color: #6B5D4C !important;
}

.checkout-container .pmt-tab.active {
    border-color: #B8860B !important;
    background: rgba(184, 134, 11, 0.08) !important;
    color: #B8860B !important;
}

.checkout-container .pmt-tab.disabled {
    opacity: 0.45 !important;
    background: rgba(44, 36, 22, 0.02) !important;
}

.checkout-container .pmt-badge-maintenance {
    background: rgba(184, 134, 11, 0.1) !important;
    border-color: rgba(184, 134, 11, 0.25) !important;
    color: #8B6914 !important;
}

/* EFT Panel — Concept B */
.checkout-container .eft-bank-info {
    background: rgba(44, 36, 22, 0.03) !important;
    border: 1px solid #D1C7B2 !important;
}

.checkout-container .eft-bank-info h4 {
    color: #B8860B !important;
}

.checkout-container .eft-bank-row {
    border-bottom-color: #E2DAC8 !important;
}

.checkout-container .eft-label {
    color: #8C8471 !important;
}

.checkout-container .eft-value {
    color: #2C2416 !important;
}

.checkout-container .eft-copy-btn {
    background: rgba(184, 134, 11, 0.1) !important;
    border-color: rgba(184, 134, 11, 0.25) !important;
    color: #B8860B !important;
}

.checkout-container .eft-copy-btn:hover {
    background: #B8860B !important;
    color: #FBF8F0 !important;
}

.checkout-container .eft-instruction-item {
    color: #4A463B !important;
}

.checkout-container .eft-step {
    background: linear-gradient(135deg, #B8860B, #D4A843) !important;
    color: #FBF8F0 !important;
}

.checkout-container .eft-footer-note {
    color: #8C8471 !important;
}

.checkout-container .eft-pending-notice {
    background: rgba(52, 152, 219, 0.08) !important;
    border-color: rgba(52, 152, 219, 0.25) !important;
    color: #2980b9 !important;
}

.checkout-container .eft-pending-notice p {
    color: #2980b9 !important;
}

/* ===================================================================
   ERİŞİLEBİLİRLİK (site geneli — her sayfada yüklenir)
   1) prefers-reduced-motion: AOS ve tüm animasyon/geçişleri durdurur
   2) Görünür, marka-uyumlu klavye focus halkası (outline:none telafisi)
   =================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    /* AOS: elemanları gizli/kaydırılmış bırakmadan görünür kıl */
    [data-aos] {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* Klavye/dokunma kullanıcısı için görünür altın focus halkası.
   homepage.css:429 .editor-textarea ve benzeri outline:none'ları telafi eder. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible,
.btn:focus-visible,
.faq-q-btn:focus-visible,
.tab-btn:focus-visible,
.tool-btn:focus-visible,
.editor-textarea:focus-visible {
    outline: 2px solid var(--gold-primary) !important;
    outline-offset: 2px !important;
}