/* ===================================================================== MEGA MAĞAZA — tasarım dili (WoodMart Mega Electronics / Megamarket esinli) Yalnız "mega" bileşen setli paketlerde (: Mega Mağaza, Garaj, Showroom, Gece) yüklenir (Services/Theme/ThemePresetRegistry). Klasik'e etkisi yok. Sunucudan gelen token'lar (theme-tokens bloğu, ThemeResolver/MegaPalette/FooterPaletteHelper): --mgz-font-heading / --mgz-font-body, --mgz-nav-*, --mgz-cat-*, --mgz-accent-text, --mgz-accent-soft, --ftr-*, --on-primary. Marka rengi (--primaryColor) tenant'ındır; burada TANIMLANMAZ. Kural: renk literal'i yalnız custom property tanımında; transition: all yok (lint-theme-css.mjs). Token'lar BİLEREK :root'ta (özgüllük 0,1,0): bu dosya yalnız Mega'da yüklenir; sıra tokens.css → sunucu theme-tokens bloğu (:root) → tenant CSS (:root) olduğundan sonrakiler ezebilir. html[data-theme-preset] seçicisi (0,1,1) sunucu ve tenant token'larını yanlışlıkla ezerdi. ===================================================================== */ :root { /* Yüzey / metin / çerçeve */ --mgz-page: #f3f4f6; --mgz-surface: #ffffff; --mgz-surface-2: #f8f9fb; --mgz-surface-3: #eef0f4; --mgz-border: #e5e7eb; --mgz-border-strong: #d1d5db; --mgz-text: #111827; --mgz-text-body: #374151; --mgz-text-muted: #6b7280; --mgz-overlay: rgba(17, 24, 39, .82); --mgz-overlay-soft: rgba(17, 24, 39, .06); /* Durum renkleri (beyaz üstünde ≥4.5:1) */ --mgz-ok: #047857; --mgz-ok-bg: #ecfdf5; --mgz-bad: #b91c1c; --mgz-bad-bg: #fef2f2; --mgz-warn: #b45309; --mgz-warn-bg: #fffbeb; --mgz-amber: #fbbf24; /* kampanya rozeti zemini (koyu yazıyla ≥10:1) */ /* Şekil ve derinlik */ --mgz-radius-card: 10px; --mgz-radius-ctl: 8px; --mgz-radius-badge: 6px; --mgz-shadow-rest: 0 1px 2px rgba(17, 24, 39, .05); --mgz-shadow-hover: 0 10px 28px rgba(17, 24, 39, .10); --mgz-shadow-pop: 0 18px 40px rgba(17, 24, 39, .16); --mgz-ease: cubic-bezier(.2, .7, .2, 1); /* Fallback'ler (sunucu token'ı yoksa) */ --mgz-font-heading: var(--site-font-family, system-ui, sans-serif); --mgz-font-body: var(--site-font-family, system-ui, sans-serif); --mgz-accent-text: var(--primaryColor); --mgz-accent-soft: var(--mgz-surface-3); --mgz-nav-bg: var(--mgz-text); --mgz-nav-fg: var(--mgz-surface); --mgz-cta-bg: var(--primaryColor); --mgz-cta-fg: var(--mgz-surface); --mgz-cta-hover: var(--mgz-nav-bg); --mgz-cat-bg: var(--mgz-cta-bg); --mgz-cat-fg: var(--mgz-cta-fg); /* Eski CSS'in bağlandığı token'lar */ --page-bg: var(--mgz-page); --header-border: var(--mgz-border); --header-hover: var(--mgz-surface-2); } html[data-theme-kit="mega"] body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: var(--mgz-text-body); } /* --------------------------------------------------------------------- Tipografi ezmesi — app.css/custom.css "Bai Jamjuree"yi bu seçicilerde SABİT yazıyor (grep listesi, 2026-09-25). Başlık/UI → --mgz-font-heading, metin → --mgz-font-body. "Kendi fontum" seçiliyse iki token da tenant fontuna bağlanır (ThemeResolver). --------------------------------------------------------------------- */ html[data-theme-kit="mega"] :is(h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, .eyebrow, .font-primary, .cus-btn, .cus-btn-2, .cus-btn-3, .coming-soon-cd ul li h2) { font-family: var(--mgz-font-heading); } html[data-theme-kit="mega"] :is(p, .text-16, b, strong, .form-control, .input-group input, .info-card, .mobile-nav__wrapper .mobile-nav__content .main-menu__list li a, .featured-product-card .image-box .sale-label, .featured-product-list .image-box .sale-label, .mega-nav-menu > li > a, .mega-nav-item span) { font-family: var(--mgz-font-body); } /* --------------------------------------------------------------------- Butonlar — Bootstrap mavisi yerine marka rengi (--mgz-cta-*: kırmızı zeminde beyaz yazı, dolgu 4.5:1). --------------------------------------------------------------------- */ html[data-theme-kit="mega"] .btn-primary { --bs-btn-bg: var(--mgz-cta-bg); --bs-btn-border-color: var(--mgz-cta-bg); --bs-btn-color: var(--mgz-cta-fg); --bs-btn-hover-bg: var(--mgz-nav-bg); --bs-btn-hover-border-color: var(--mgz-nav-bg); --bs-btn-hover-color: var(--mgz-nav-fg); --bs-btn-active-bg: var(--mgz-nav-bg); --bs-btn-active-border-color: var(--mgz-nav-bg); --bs-btn-active-color: var(--mgz-nav-fg); border-radius: var(--mgz-radius-ctl); font-weight: 600; } html[data-theme-kit="mega"] .btn-outline-primary { --bs-btn-color: var(--mgz-accent-text); --bs-btn-border-color: var(--primaryColor); --bs-btn-hover-bg: var(--mgz-cta-bg); --bs-btn-hover-border-color: var(--mgz-cta-bg); --bs-btn-hover-color: var(--mgz-cta-fg); border-radius: var(--mgz-radius-ctl); font-weight: 600; } html[data-theme-kit="mega"] :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--primaryColor); outline-offset: 2px; } @media (prefers-reduced-motion: reduce) { html[data-theme-kit="mega"] *, html[data-theme-kit="mega"] *::before, html[data-theme-kit="mega"] *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }