@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@400;600;700&family=Roboto:wght@300;400;500;700&family=Montserrat:wght@700;800&display=swap');

:root {
    --primary-color: #AF886E;      /* Bronz/Toprak */
    --gold-bright: #FFD700;        /* Parlak Altın */
    --ana-arkaplan: #1a1a1a;       
    --kutu-arkaplan: #222222;      
    --yazi-beyaz: #e0e0e0;
    --yazi-gri: #a0a0a0;
    --border-rengi: #333333;
}

body {
    font-family: 'Roboto', sans-serif;
    color: var(--yazi-beyaz);
    margin: 0;
    padding: 0;
    background-color: var(--ana-arkaplan);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E");
    min-height: 100vh;
    padding-top: 135px; /* Sabit Header Boşluğu */
}

/* --- SABİT HEADER KAPSAYICISI --- */
.sticky-header-group {
    position: fixed;
    top: 0; left: 0; width: 100%;
    z-index: 1000;
    box-shadow: 0 4px 15px rgba(0,0,0,0.8);
    background-color: #111;
}

/* NAVBAR */
.navbar {
    background-color: #111;
    border-bottom: 2px solid var(--primary-color);
    padding: 10px 0;
    position: relative;
}
.navbar-brand { padding: 0; margin: 0; display: flex; align-items: center; }

/* MENÜ LİNKLERİ */
.navbar-nav .nav-link {
    color: var(--yazi-beyaz) !important; font-weight: 600; text-transform: uppercase; font-size: 0.95rem; margin-left: 55px; padding-bottom: 10px; position: relative; transition: color 0.3s ease, transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1.2);
}
.navbar-nav .nav-link::after { content: ''; position: absolute; width: 0; height: 2px; bottom: 0; left: 50%; background-color: var(--primary-color); transition: width 0.3s ease-in-out, transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1.2); transform: translateX(-50%); }
.navbar-nav .nav-link.active::after { width: 100%; }
.navbar-nav:hover .nav-link.active::after { width: 0; }
.navbar-nav .nav-link.active:hover::after { width: 100%; }
.navbar-nav .nav-link:hover::after { width: 100%; }
.navbar-nav .nav-link:hover { color: var(--primary-color) !important; transform: translateY(-3px) scale(1.08); text-shadow: 0 5px 15px rgba(0,0,0,0.4); }

/* HAMBURGER MENÜ (Çerçevesiz) */
.navbar-toggler { border: none !important; outline: none !important; box-shadow: none !important; background: transparent !important; padding: 0 10px; }
.navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(175, 136, 110, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); width: 30px; height: 30px; }

/* ORTAK RENKLER */
h1, h2, h3, h4, h5, .text-warning { color: var(--primary-color) !important; }
.border-warning { border-color: var(--primary-color) !important; }
.btn-outline-light:hover { background-color: var(--primary-color); border-color: var(--primary-color); }

/* --- TICKER (PERFORMANS) --- */
.ticker-wrap { 
    background-color: #080808; 
    border-top: 1px solid #333; 
    border-bottom: 1px solid var(--primary-color);
    color: #ccc; 
    padding: 8px 0; 
    white-space: nowrap; 
    overflow: hidden; 
    position: relative; 
    width: 100%;
    transform: translateZ(0); 
    -webkit-transform: translateZ(0);
}
.ticker-content { 
    display: inline-block; 
    padding-left: 100%; 
    animation: ticker-move 35s linear infinite; 
    will-change: transform; 
    transform: translate3d(0, 0, 0); 
    -webkit-transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 1000px;
}
.ticker-item i { color: var(--primary-color); margin-right: 5px; }
@keyframes ticker-move { 0% { transform: translate3d(0, 0, 0); } 100% { transform: translate3d(-100%, 0, 0); } }

/* ELMAS (DIAMOND - SİLÜETSİZ/SİYAH) */
.market-hero-container { display: flex; justify-content: center; align-items: center; height: 100%; }
.market-hero { position: relative; width: 350px; height: 350px; display: flex; align-items: center; justify-content: center; text-align: center; clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); background: linear-gradient(135deg, #8c6a54 0%, #d4af37 50%, #8c6a54 100%); box-shadow: 0 20px 50px rgba(0,0,0,0.5); transition: all 0.3s ease; }
.hero-inner-diamond { 
    position: absolute; top: 5px; left: 5px; right: 5px; bottom: 5px; 
    background: #0a0a0a; /* SİMSİYAH ZEMİN */
    clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); 
    display: flex; align-items: center; justify-content: center; 
    overflow: hidden; 
}

.hero-caption { position: relative; z-index: 10; padding: 15px; max-width: 70%; }
.hero-title { font-family: 'Exo 2', sans-serif; font-size: 1.8rem; font-weight: 800; color: var(--primary-color); text-shadow: 0 2px 10px rgba(0,0,0,0.8); margin-bottom: 8px; line-height: 1.1; text-transform: uppercase; }
.hero-subtitle { color: #ccc; font-size: 0.9rem; font-weight: 400; margin: 0 auto 15px auto; font-family: 'Montserrat', sans-serif; }
.hero-btn { border: 2px solid var(--primary-color); color: var(--primary-color) !important; background: rgba(0,0,0,0.3); border-radius: 50px; padding: 8px 25px; font-size: 0.9rem; font-weight: bold; text-transform: uppercase; transition: all 0.3s ease; display: inline-block; text-decoration: none; backdrop-filter: blur(5px); }
.hero-btn:hover { background-color: var(--primary-color); color: #fff !important; box-shadow: 0 0 25px rgba(175, 136, 110, 0.8); transform: translateY(-2px) scale(1.05); }

/* --- SEKME (TAB) BUTONLARI --- */
.nav-tabs { border-bottom: none !important; gap: 10px; justify-content: center; }
.nav-tabs .nav-link { color: #777 !important; background: transparent !important; border: none !important; margin: 0 5px; padding: 10px 25px; font-weight: 600; text-transform: uppercase; position: relative; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); opacity: 0.8; }
.nav-tabs .nav-link::after { content: ''; position: absolute; bottom: 0; left: 50%; width: 0; height: 3px; background-color: var(--primary-color); transition: width 0.3s ease-out; transform: translateX(-50%); }
.nav-tabs .nav-link.active { color: #fff !important; font-weight: 800; opacity: 1; text-shadow: 0 0 15px rgba(255, 255, 255, 0.4); }
.nav-tabs .nav-link.active::after { width: 80%; }
.nav-tabs:hover .nav-link.active { color: #777 !important; text-shadow: none; }
.nav-tabs:hover .nav-link.active::after { width: 0; }
.nav-tabs .nav-link:hover { color: var(--primary-color) !important; opacity: 1; transform: translateY(-5px) scale(1.1); text-shadow: 0 5px 15px rgba(175, 136, 110, 0.4); }
.nav-tabs .nav-link:hover::after { width: 80%; background-color: var(--primary-color); }
.nav-tabs .nav-link.active:hover { color: #fff !important; text-shadow: 0 0 15px rgba(255, 255, 255, 0.6); }
.nav-tabs .nav-link.active:hover::after { width: 80%; background-color: var(--primary-color); }

/* KARTLAR VE HAKKIMIZDA */
.branch-card, .about-section { background-color: #181818; border: 1px solid #333; border-radius: 0; padding: 35px; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); position: relative; box-shadow: 0 5px 15px rgba(0,0,0,0.5); }
.branch-card:hover, .about-section:hover { transform: translateY(-10px); border-color: var(--primary-color); box-shadow: 0 20px 40px -5px rgba(175, 136, 110, 0.4); }
.branch-card h3 { font-family: 'Exo 2', sans-serif; font-size: 1.6rem; font-weight: 700; color: var(--primary-color); margin-bottom: 10px; text-transform: uppercase; display: flex; align-items: center; justify-content: center; gap: 10px; }
.branch-logo-icon, .about-logo-icon { width: auto; object-fit: contain; }
.branch-logo-icon { height: 35px; } .about-logo-icon { height: 50px; margin-bottom: 20px; }
.branch-card p { color: #b0b0b0; font-size: 0.95rem; margin-bottom: 8px; line-height: 1.5; }
.branch-card hr { border-color: var(--primary-color); opacity: 0.3; margin: 15px 0; width: 100%; }
.branch-card a { text-decoration: none; color: #e0e0e0; transition: color 0.3s; font-weight: 500; } .branch-card a:hover { color: var(--primary-color); } .branch-card i { color: var(--primary-color); vertical-align: middle; }
.about-bg-pattern { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: radial-gradient(var(--primary-color) 1px, transparent 1px); background-size: 30px 30px; opacity: 0.03; z-index: 0; pointer-events: none; }
.about-content { position: relative; z-index: 1; width: 100%; }

/* TABLOLAR */
.content-box { background-color: var(--kutu-arkaplan); border: 1px solid var(--border-rengi); border-radius: 8px; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.5); margin-bottom: 30px; padding: 20px; }
#canli-view .content-box, #gise-view .content-box { padding: 0; }
.custom-table { width: 100%; border-collapse: collapse; }
.custom-table th { background-color: #151515; color: #bbb; padding: 12px; font-size: 0.85rem; text-transform: uppercase; font-weight: 600; border-bottom: 1px solid #444; }
.custom-table td { padding: 12px; border-bottom: 1px solid #333; vertical-align: middle; }
.special-table { table-layout: fixed; }
.special-table th:first-child, .special-table td:first-child { width: 40%; text-align: left; }
.special-table th:nth-child(2), .special-table td:nth-child(2), .special-table th:nth-child(3), .special-table td:nth-child(3) { width: 30%; text-align: center; }
.main-name { color: var(--primary-color) !important; font-family: 'Exo 2', sans-serif; font-weight: 700; text-align: left; padding-left: 20px !important; }
.main-price { color: #fff; font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 1.25rem; text-align: center; }
.sub-label { color: #888; font-size: 0.85rem; text-align: left; padding-left: 40px !important; }
.sub-value { color: #ccc; font-family: monospace; text-align: center; font-size: 0.9rem; }

/* MOD BUTONLARI */
.mode-switch-container { background-color: #1a1a1a; border: 1px solid #333; border-radius: 50px; padding: 5px; display: inline-flex; margin-bottom: 20px; }
.mode-btn { background: transparent; border: none; color: #777; padding: 10px 25px; border-radius: 40px; font-weight: 600; cursor: pointer; transition: background-color 0.4s ease-in-out, color 0.4s ease-in-out; }
.mode-btn.active { background-color: var(--primary-color); color: #fff; font-weight: bold; }

@keyframes fadeInEffect { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.view-section { animation: fadeInEffect 0.6s ease-out; }

@keyframes flash-green { 0% { color: #2ecc71; text-shadow: 0 0 10px rgba(46,204,113,0.4); } 100% { color: inherit; } }
@keyframes flash-red { 0% { color: #e74c3c; text-shadow: 0 0 10px rgba(231,76,60,0.4); } 100% { color: inherit; } }
.fiyat-artti { animation: flash-green 1s ease-out; color: #2ecc71 !important; }
.fiyat-azaldi { animation: flash-red 1s ease-out; color: #e74c3c !important; }

/* FOOTER */
.site-footer { background-color: #0a0a0a; border-top: 1px solid var(--primary-color); padding-top: 60px; padding-bottom: 20px; color: #bbb; font-size: 0.9rem; position: relative; }
.footer-logo { height: 60px; width: auto; margin-right: 15px; }
.footer-brand-text { height: 35px; width: auto; opacity: 0.9; }
.footer-title { color: var(--primary-color); font-family: 'Exo 2', sans-serif; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 1px; }
.footer-links { list-style: none; padding: 0; } .footer-links li { margin-bottom: 10px; }
.footer-links a { color: #bbb; text-decoration: none; transition: color 0.3s ease; } .footer-links a:hover { color: var(--primary-color); padding-left: 5px; }
.social-icons { display: flex; gap: 15px; }
.social-btn { width: 40px; height: 40px; border: 1px solid #444; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--primary-color); text-decoration: none; transition: all 0.3s ease; }
.social-btn:hover { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); transform: translateY(-3px); box-shadow: 0 5px 15px rgba(175, 136, 110, 0.4); }
.copyright-bar { border-top: 1px solid #222; margin-top: 40px; padding-top: 20px; text-align: center; font-size: 0.8rem; color: #666; }

/* PİYASA EKRANI MODERN BAŞLIK */
.market-header-box { background: linear-gradient(90deg, #151515 0%, #1f1f1f 100%); border: 1px solid #333; border-left: 5px solid var(--primary-color); padding: 25px 30px; margin-bottom: 30px; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }
.market-header-title { font-family: 'Exo 2', sans-serif; font-size: 1.8rem; font-weight: 700; color: var(--primary-color); margin: 0; display: flex; align-items: center; gap: 15px; text-transform: uppercase; letter-spacing: 1px; }
.market-header-title i { background: rgba(175, 136, 110, 0.1); padding: 10px; border-radius: 5px; font-size: 1.5rem; }
.market-header-time { text-align: right; border-left: 1px solid #444; padding-left: 25px; }
.market-header-time small { display: block; color: #888; font-size: 0.75rem; font-weight: 600; letter-spacing: 1px; margin-bottom: 3px; text-transform: uppercase; }
.market-header-time div { font-family: 'Roboto', monospace; font-size: 1.5rem; font-weight: 700; color: #fff; text-shadow: 0 0 10px rgba(255, 255, 255, 0.1); }

/* MOBİL UYUMLULUK */
@media (max-width: 992px) {
    .navbar-brand { display: flex; flex-direction: row !important; align-items: center; justify-content: flex-start; width: auto; }
    .navbar-brand img:first-child { height: 45px !important; margin-bottom: 0; margin-right: 10px; }
    .navbar-brand img.d-lg-none { height: 25px !important; margin-left: 0 !important; margin-top: 2px; }
    
    .market-hero { width: 340px; height: 340px; max-width: 95vw; margin-bottom: 30px; }
    .hero-title { font-size: 1.15rem; margin-bottom: 5px; line-height: 1.3; }
    .hero-caption { width: 100%; padding: 0 40px; }
    .hero-subtitle { font-size: 0.75rem; margin-bottom: 10px; }
    .hero-btn { padding: 5px 15px; font-size: 0.75rem; margin-top: 5px; }

    .navbar-nav .nav-link { margin-left: 0; text-align: center; padding: 15px 0; }
    .navbar-nav .nav-link::after { display: none; }
    .branch-card { text-align: center !important; padding: 30px !important; }
    .market-hero-container { margin: 40px 0; }
    .footer-brand-text { height: 30px; }
    .site-footer { text-align: center; }
    .social-icons { justify-content: center; }
    .footer-logo { margin-right: 10px !important; margin-bottom: 0 !important; display: inline-block !important; margin-left: 0 !important; }
    .market-header-box { flex-direction: column !important; text-align: center !important; gap: 15px; padding: 20px; justify-content: center !important; }
    .market-header-title { justify-content: center; font-size: 1.4rem; width: 100%; }
    .market-header-time { text-align: center !important; border-left: none; border-top: 1px solid #333; padding-left: 0; padding-top: 15px; width: 100%; }
}