html,body{min-height:100%;}body{min-height:100vh;display:flex;flex-direction:column;}main,.page-wrap,.page-wrap-home,.page-wrap-analysis{flex:1 0 auto;}
/* Header styles: layout, navigation, dropdowns and header shell. */
/* ═══════════════════════════════════════════════════════
EVCcost — Global Design System v3
Tokens: header.php sets data-theme on
═══════════════════════════════════════════════════════ */
/* ── TOKENS ── */
:root {
--c-primary: #2563eb;
--c-primary-h: #1d4ed8;
--c-accent: #0ea5e9;
--c-glow: rgba(37,99,235,.13);
--c-green: #10b981;
--c-amber: #f59e0b;
--c-red: #ef4444;
--bg: #f1f5f9;
--bg2: #e2e8f0;
--surf: #ffffff;
--surf2: #f8fafc;
--brd: rgba(15,23,42,.09);
--brd2: rgba(15,23,42,.05);
--txt: #0f172a;
--txt-2: #475569;
--txt-3: #94a3b8;
--sh-xs: 0 1px 3px rgba(0,0,0,.05),0 1px 2px rgba(0,0,0,.04);
--sh-sm: 0 2px 8px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.05);
--sh-md: 0 4px 16px rgba(0,0,0,.09),0 16px 32px -8px rgba(0,0,0,.12);
--sh-hdr:0 4px 20px rgba(37,99,235,.12),0 1px 3px rgba(0,0,0,.05);
--r: 14px;
--r-sm: 8px;
--r-xs: 5px;
--tr: 0.22s cubic-bezier(.4,0,.2,1);
--hdr-bg: rgba(255,255,255,.9);
--hdr-brd: rgba(255,255,255,.7);
--font: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--mono: 'JetBrains Mono','Fira Code',monospace;
}
html[data-theme="dark"] {
--bg: #0b1629;
--bg2: #0f1e38;
--surf: #111f3a;
--surf2: #182d4a;
--brd: rgba(255,255,255,.07);
--brd2: rgba(255,255,255,.04);
--txt: #e2eaf5;
--txt-2: #8fafc8;
--txt-3: #4d6a88;
--sh-xs: 0 1px 3px rgba(0,0,0,.3);
--sh-sm: 0 2px 8px rgba(0,0,0,.35),0 4px 16px rgba(0,0,0,.3);
--sh-md: 0 4px 16px rgba(0,0,0,.5),0 16px 32px -8px rgba(0,0,0,.55);
--sh-hdr:0 4px 24px rgba(0,0,0,.5);
--hdr-bg: rgba(11,22,41,.92);
--hdr-brd: rgba(255,255,255,.09);
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior: smooth; }
body {
font-family: var(--font);
background: var(--bg);
color: var(--txt);
min-height: 100vh;
padding-top: 80px; /* DEĞİŞTİ: 80px → 74px (header yüksekliği) */
transition: background var(--tr), color var(--tr);
line-height: 1.6;
}
/* ── PAGE LAYOUT ── */
.page-main { width:100%; }
.page-wrap {
max-width: 1320px;
width: min(1320px, calc(100% - 32px));
margin: 18px auto 10px;
padding: 0;
background:transparent;border-radius:0;box-shadow:none;
transition:background var(--tr);
overflow: visible;
}
.page-wrap.page-wrap-info > .main-content,
.page-wrap.page-wrap-tools > .main-content,
.page-wrap.page-wrap-play > .main-content {
padding: 0 !important;
background: transparent !important;
min-height: auto;
}
.page-wrap.page-wrap-compact-top {
padding-top: 0;
}
.page-wrap.page-wrap-compact-top > .main-content.evan-page,
.page-wrap.page-wrap-compact-top > .bc-page {
padding-top: 0;
}
.page-wrap.page-wrap-play {
max-width: 1320px;
width: min(1320px, calc(100% - 32px));
margin-top: 18px;
padding: 0;
background: transparent;
border-radius: 0;
box-shadow: none;
overflow: visible;
}
.page-wrap.page-wrap-play > .main-content,
.page-wrap.page-wrap-play > .tavla-page,
.page-wrap.page-wrap-play > .chess-page,
.page-wrap.page-wrap-play > .monopoly-page,
.page-wrap.page-wrap-play > .koridor-page,
.page-wrap.page-wrap-play > .solo-page,
.page-wrap.page-wrap-play > .tetris-page {
background: transparent !important;
min-height: auto;
padding-top: 0 !important;
}
.page-wrap.page-wrap-play .main-content,
.page-wrap.page-wrap-play .tavla-page,
.page-wrap.page-wrap-play .chess-page,
.page-wrap.page-wrap-play .monopoly-page,
.page-wrap.page-wrap-play .koridor-page,
.page-wrap.page-wrap-play .solo-page,
.page-wrap.page-wrap-play .tetris-page,
.page-wrap.page-wrap-play .racing-page,
.page-wrap.page-wrap-play .hero-page {
background: transparent !important;
}
.page-wrap.page-wrap-play #tavla-app,
.page-wrap.page-wrap-play #chess-app,
.page-wrap.page-wrap-play #monopoly-app,
.page-wrap.page-wrap-play #koridor-app,
.page-wrap.page-wrap-play #solo-app,
.page-wrap.page-wrap-play #tetris-app,
.page-wrap.page-wrap-play #racing-app,
.page-wrap.page-wrap-play #hero-app {
background: transparent !important;
min-height: auto;
padding-top: 0 !important;
}
.page-wrap.page-wrap-play .tv-main,
.page-wrap.page-wrap-play .ch-layout,
.page-wrap.page-wrap-play .game-card,
.page-wrap.page-wrap-play .racing-card,
.page-wrap.page-wrap-play .mp-shell,
.page-wrap.page-wrap-play .kq-shell,
.page-wrap.page-wrap-play .st-shell {
background: transparent !important;
box-shadow: none !important;
border-color: transparent !important;
}
.page-wrap.page-wrap-play .tv-main::before,
.page-wrap.page-wrap-play #chess-app::before,
.page-wrap.page-wrap-play .ch-layout::before,
.page-wrap.page-wrap-play .game-card::before,
.page-wrap.page-wrap-play .game-card::after,
.page-wrap.page-wrap-play .racing-card::before,
.page-wrap.page-wrap-play .racing-card::after {
display: none !important;
}
/* ── New Play Modules: focus, zen, sandbox, personal ───────── */
.page-wrap.page-wrap-play .mod-card {
background: transparent !important;
border-color: transparent !important;
border-radius: 0 !important;
box-shadow: none !important;
overflow: visible !important;
}
.page-wrap.page-wrap-play .mod-card::before {
display: none !important;
}
.page-wrap.page-wrap-play > .main-content.mode-work {
background: linear-gradient(160deg, #0a1e2e, #0d2a3e) !important;
border-radius: 28px;
padding: clamp(20px, 4vw, 40px) 12px 48px !important;
}
.page-wrap.page-wrap-play > .main-content.mode-break {
background: linear-gradient(160deg, #0a1e0f, #0d2e1a) !important;
border-radius: 28px;
padding: clamp(20px, 4vw, 40px) 12px 48px !important;
}
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .mod-sub,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .month-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .hint-text,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .top-row > span,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .top-bar > span,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .top-row [style*="color:#87bfdb"],
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .top-row [style*="color:#4a8ca8"],
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .mod-card > [style*="color:#4a8ca8"] {
color: #334155 !important;
text-shadow: none !important;
}
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .channel-card,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .master-row,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .kpi-card,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .chart-shell,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .puzzle-shell,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .panel,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ctrl-panel,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .preview-panel,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .arena,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .stage,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .word-arena,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .result-panel,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .score-chip,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .stat-chip,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .meta-chip,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .stat-card,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .cal-shell,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ball-stage {
background: linear-gradient(180deg, rgba(13,39,58,.96), rgba(7,25,38,.88)) !important;
border-color: rgba(95,179,228,.26) !important;
color: #eaf6ff !important;
}
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ch-name,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .phase-msg,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .result-detail,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .stat-val,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .feed-msg,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .feed-val,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ctrl-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .picker-title {
color: #f8fbff !important;
}
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ch-desc,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .master-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .vol-val,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .kpi-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .chart-title,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .legend-item,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .feed-time,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .phase-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .stat-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .day-header,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .preview-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ctrl-section-title,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .panel .ctrl-label,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .panel-title {
color: #8bdcff !important;
}
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .option-btn,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .level-btn,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .tab-btn,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .mode-btn,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ctrl-chip,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .btn-secondary,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .btn-reset,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .nav-btn,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .setting-chip {
background: linear-gradient(180deg, rgba(15,42,60,.96), rgba(8,29,43,.94)) !important;
border-color: rgba(98,177,223,.34) !important;
color: #dff5ff !important;
}
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .option-btn:hover,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .level-btn:hover,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .level-btn.active,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .tab-btn:hover,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .tab-btn.active,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .mode-btn:hover,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .mode-btn.active,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ctrl-chip:hover,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .ctrl-chip.active,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .setting-chip:hover,
html:not([data-theme="dark"]) .page-wrap.page-wrap-play .setting-chip.active {
border-color: rgba(74,219,255,.68) !important;
color: #fff !important;
}
.page-wrap.page-wrap-tfile,
.page-wrap.page-wrap-feature-page,
.page-wrap.page-wrap-tools {
max-width: 1320px;
width: min(1320px, calc(100% - 32px));
margin: 18px auto 10px;
padding: 0;
background: transparent;
border-radius: 0;
box-shadow: none;
overflow: visible;
}
.page-wrap.page-wrap-tfile > .main-content {
padding: 0 !important;
background: transparent;
min-height: auto;
}
.page-wrap.page-wrap-tools > .main-content {
padding: 0 !important;
background: transparent;
min-height: auto;
}
.page-wrap.page-wrap-tfile .container,
.page-wrap.page-wrap-tfile .evbm-content {
width: 100%;
max-width: 1320px;
margin: 0 auto;
}
.page-wrap.page-wrap-tfile .evbm-outer {
padding: 0;
}
.page-wrap.page-wrap-feature-page > .main-content.evan-page,
.page-wrap.page-wrap-feature-page > .bc-page {
width: 100%;
max-width: none;
margin: 0;
padding-top: 0 !important;
padding-left: 0;
padding-right: 0;
}
.page-wrap.page-wrap-feature-page .evan-shell {
max-width: none;
}
.page-wrap.page-wrap-tools .kwh-page-bg {
padding: 0 !important;
background: transparent !important;
border-radius: 0 !important;
}
.page-wrap.page-wrap-tools .kwh-calculator,
.page-wrap.page-wrap-tools .efh-container,
.page-wrap.page-wrap-tools .converter-container {
width: 100% !important;
max-width: 1320px !important;
margin: 0 auto !important;
padding: 0 !important;
}
.page-wrap.page-wrap-index > .max-w-7xl {
width: 100%;
max-width: 1320px !important;
margin: 0 auto !important;
padding-left: 0 !important;
padding-right: 0 !important;
padding-top: 0 !important;
}
.page-wrap.page-wrap-info .about-wrap,
.page-wrap.page-wrap-info .faq-wrap,
.page-wrap.page-wrap-info .guide-wrap,
.page-wrap.page-wrap-info .legal-wrap,
.page-wrap.page-wrap-info .terms-wrap,
.page-wrap.page-wrap-info .site-map-wrap {
width: 100%;
margin: 0 auto;
}
.page-wrap.page-wrap-resource .doc-hub,
.page-wrap.page-wrap-resource .pv-wrap,
.page-wrap.page-wrap-map .smap-page,
.page-wrap.page-wrap-contact .contact-page {
width: 100%;
max-width: 1320px;
margin-left: auto;
margin-right: auto;
padding-left: 0;
padding-right: 0;
}
.page-wrap.page-wrap-resource .doc-hub,
.page-wrap.page-wrap-resource .pv-wrap {
margin-top: 0;
}
.page-wrap.page-wrap-map .smap-page {
padding-top: 0;
}
/* Shared compact hero used by data/map pages */
.evc-page-hero {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 16px;
width: 100%;
margin: 0 0 20px;
padding: 20px 22px;
background:
radial-gradient(circle at top left, rgba(37, 99, 235, .11), transparent 34%),
linear-gradient(135deg, var(--surf2), var(--surf));
border: 1px solid var(--brd);
border-radius: 18px;
box-shadow: var(--sh-sm);
}
.page-wrap-index .evc-page-hero,
.smap-page > .evc-page-hero,
.evc-page-hero.td-header,
.evc-page-hero.td-hero,
.doc-hub > .evc-page-hero,
.pv-wrap > .evc-page-hero {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 16px;
width: 100%;
margin: 0 0 20px;
padding: 20px 22px;
background:
radial-gradient(circle at top left, rgba(37, 99, 235, .11), transparent 34%),
linear-gradient(135deg, var(--surf2), var(--surf));
border: 1px solid var(--brd);
border-radius: 18px;
box-shadow: var(--sh-sm);
}
.evc-page-hero-main {
display: flex;
align-items: center;
gap: 14px;
min-width: 0;
flex: 1 1 360px;
}
.page-wrap-index .evc-page-hero-main,
.smap-page > .evc-page-hero .evc-page-hero-main,
.evc-page-hero.td-header .evc-page-hero-main,
.evc-page-hero.td-hero .evc-page-hero-main,
.doc-hub > .evc-page-hero .evc-page-hero-main,
.pv-wrap > .evc-page-hero .evc-page-hero-main {
display: flex;
align-items: center;
gap: 14px;
min-width: 0;
flex: 1 1 360px;
}
.evc-page-hero-icon {
width: 48px;
height: 48px;
border-radius: 15px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
background: linear-gradient(135deg, #2563eb, #0ea5e9);
color: #fff;
box-shadow: 0 10px 22px rgba(37, 99, 235, .24);
}
.page-wrap-index .evc-page-hero-icon {
background: linear-gradient(135deg, #f8fbff 0%, #e0f2fe 45%, #bae6fd 100%);
box-shadow: 0 10px 22px rgba(14, 165, 233, .18);
}
.evc-page-hero-icon i {
font-size: 1.2rem;
}
.evc-page-hero-icon img {
width: 28px;
height: 28px;
object-fit: contain;
display: block;
}
.evc-page-hero-copy {
min-width: 0;
}
.evc-page-hero-title {
margin: 0;
color: var(--txt);
font-size: clamp(1.35rem, 2.6vw, 1.95rem);
font-weight: 800;
line-height: 1.15;
letter-spacing: 0;
}
.evc-page-hero-sub {
margin: 7px 0 0;
color: var(--txt-2);
font-size: .92rem;
line-height: 1.55;
max-width: 720px;
}
.evc-page-hero-stats {
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
gap: 9px;
flex: 0 1 auto;
}
.evc-page-hero-stat {
min-width: 88px;
padding: 9px 13px;
text-align: center;
background: var(--surf);
border: 1px solid var(--brd);
border-radius: 12px;
box-shadow: 0 1px 0 rgba(15, 23, 42, .02);
}
.evc-page-hero-stat strong {
display: block;
color: var(--c-primary);
font-size: 1.28rem;
line-height: 1;
font-weight: 800;
}
.evc-page-hero-stat span {
display: block;
margin-top: 4px;
color: var(--txt-3);
font-size: .7rem;
line-height: 1.25;
}
.evc-page-hero-stat.is-live strong {
color: var(--nav-green);
}
.evc-page-hero-note {
width: 100%;
margin: 0;
padding: 11px 13px;
border-radius: 12px;
background: rgba(245, 158, 11, .12);
border: 1px solid rgba(245, 158, 11, .28);
color: var(--txt-2);
font-size: .86rem;
line-height: 1.5;
}
.page-wrap.page-wrap-ev-data {
max-width: 1320px;
width: min(1320px, calc(100% - 32px));
margin: 18px auto 10px;
}
.page-wrap.page-wrap-ev-data .td-header,
.page-wrap.page-wrap-ev-data .td-hero {
margin-top: 0;
}
/* ── SHARED COMPONENTS ── */
/* Card */
.card {
background:var(--surf);border:1px solid var(--brd);
border-radius:var(--r);box-shadow:var(--sh-xs);
transition:background var(--tr),box-shadow var(--tr);
}
.card:hover { box-shadow:var(--sh-sm); }
/* Badges */
.badge { display:inline-flex;align-items:center;padding:2px 9px;border-radius:20px;font-size:.75rem;font-weight:700; }
.badge-ac { background:#dbeafe;color:#1e40af; }
.badge-dc { background:#ffe4e6;color:#9f1239; }
html[data-theme="dark"] .badge-ac { background:#1e3a5f;color:#93c5fd; }
html[data-theme="dark"] .badge-dc { background:#4c1520;color:#fca5a5; }
/* Table */
.tbl-wrap { width:100%;overflow-x:auto;border-radius:12px;border:1px solid var(--brd);background:var(--surf); }
table { width:100%;border-collapse:collapse;min-width:460px; }
th {
background:linear-gradient(180deg,#1e40af,#1d4ed8);color:#fff;
font-weight:600;position:sticky;top:0;z-index:5;
padding:10px 10px;font-size:.8rem;text-align:left;
}
html[data-theme="dark"] th { background:linear-gradient(180deg,#1e3a5f,#162d4a)!important;color:#c8daf0!important; }
td { padding:9px 10px;border-bottom:1px solid var(--brd2);font-size:.86rem;color:var(--txt); }
tbody tr:nth-child(even) td { background:var(--surf2); }
tbody tr:hover td { background:var(--c-glow)!important; }
td a { color:var(--c-primary);text-decoration:none; }
td a:hover { text-decoration:underline; }
/* Buttons */
.btn {
display:inline-flex;align-items:center;gap:6px;padding:8px 16px;
border-radius:9px;border:none;cursor:pointer;font-family:var(--font);
font-size:.875rem;font-weight:600;text-decoration:none;transition:var(--tr);
}
.btn-primary { background:var(--c-primary);color:#fff; }
.btn-primary:hover { background:var(--c-primary-h);transform:translateY(-1px); }
.btn-ghost { background:var(--surf2);color:var(--txt-2);border:1px solid var(--brd); }
.btn-ghost:hover { background:var(--c-glow);color:var(--c-primary);border-color:var(--c-primary); }
.btn-danger { background:#ef4444;color:#fff; }
.btn-danger:hover { background:#dc2626; }
/* Inputs */
input,select,textarea {
background:var(--surf2);color:var(--txt);border:1.5px solid var(--brd);
border-radius:9px;padding:8px 12px;font-family:var(--font);font-size:.9rem;
outline:none;width:100%;transition:border-color var(--tr),background var(--tr);
}
input:focus,select:focus,textarea:focus { border-color:var(--c-primary); }
label { font-size:.83rem;font-weight:600;color:var(--txt-2);display:block;margin-bottom:3px; }
/* Alert */
.alert { padding:12px 16px;border-radius:9px;font-size:.88rem;margin-bottom:14px; }
.alert-ok { background:#d1fae5;color:#065f46;border:1px solid #a7f3d0; }
.alert-err { background:#fee2e2;color:#991b1b;border:1px solid #fca5a5; }
.alert-inf { background:#dbeafe;color:#1e40af;border:1px solid #93c5fd; }
html[data-theme="dark"] .alert-ok { background:#064e3b;color:#6ee7b7;border-color:#065f46; }
html[data-theme="dark"] .alert-err { background:#450a0a;color:#fca5a5;border-color:#991b1b; }
html[data-theme="dark"] .alert-inf { background:#0c1e3e;color:#93c5fd;border-color:#1e40af; }
/* Section heading */
.sec-head {
font-size:1.05rem;font-weight:700;color:var(--txt);
margin-bottom:14px;display:flex;align-items:center;gap:8px;
}
.sec-head i { color:var(--c-primary); }
/* Number mono */
.mono { font-family:var(--mono);font-size:.88rem; }
/* Animated gradient title */
.grad-title {
font-size:clamp(1.5rem,3vw,2.1rem);font-weight:800;
background:linear-gradient(120deg,var(--c-primary),var(--c-accent),var(--c-primary));
background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;
background-clip:text;animation:gMove 4s linear infinite;
}
@keyframes gMove { to{background-position:200% center;} }
/* Stat chip */
.stat-chip {
background:var(--surf2);border:1px solid var(--brd);border-radius:11px;
padding:10px 16px;text-align:center;
}
.stat-val { font-size:1.5rem;font-weight:800;color:var(--c-primary);line-height:1; }
.stat-lbl { font-size:.7rem;color:var(--txt-3);margin-top:2px; }
/* Responsive */
@media(max-width:768px) {
body { padding-top: 80px; } /* DEĞİŞTİ: mobil header yüksekliği */
.page-wrap { padding:12px 10px; border-radius:0; }
}
/* ── İçerik Koruma — Site Geneli ── */
img.protected, .protected-content img {
-webkit-user-select: none;
user-select: none;
-webkit-user-drag: none;
-webkit-touch-callout: none;
pointer-events: none;
}
canvas {
-webkit-user-select: none;
user-select: none;
}
/* ── Sayfa Geçiş Efekti ── */
.page-main {
animation: pageIn .3s ease both;
}
@keyframes pageIn {
from { opacity: 0; transform: translateY(8px); }
to { opacity: 1; transform: translateY(0); }
}
/* ═══════════════════════════════════════════════════════
Professional Header + Footer Refresh
Demo yapısı EVCcost PHP/dil/tema sistemine uyarlanmıştır.
════════════════════════════════════════════════════════ */
:root {
--nav-max: 1320px;
--nav-line: #e4e7ec;
--nav-line-soft: #eef2f6;
--nav-muted: #667085;
--nav-ink: #101828;
--nav-soft: #f8fafc;
--nav-panel: #ffffff;
--nav-green: #039855;
--nav-green-soft: #ecfdf3;
--nav-blue: #1570ef;
--nav-blue-soft: #eff8ff;
--nav-shadow: 0 24px 70px rgba(16,24,40,.12);
}
html[data-theme="dark"] {
--nav-line: rgba(255,255,255,.1);
--nav-line-soft: rgba(255,255,255,.06);
--nav-muted: #94a3b8;
--nav-ink: #f8fafc;
--nav-soft: #16243b;
--nav-panel: #0f1d33;
--nav-green-soft: rgba(16,185,129,.14);
--nav-blue-soft: rgba(56,189,248,.14);
--nav-shadow: 0 24px 70px rgba(0,0,0,.4);
}
body {
padding-top: 0;
background:
radial-gradient(circle at 82% 0%, rgba(191,219,254,.28), transparent 30%),
linear-gradient(180deg, #f6faff 0%, #f2f6fb 48%, #eef2f7 100%);
}
html[data-theme="dark"] body,
html[data-theme="dark"] .main-content,
html[data-theme="dark"] .page-main,
html[data-theme="dark"] .monopoly-page,
html[data-theme="dark"] .solo-page,
html[data-theme="dark"] .koridor-page,
html[data-theme="dark"] .tavla-page,
html[data-theme="dark"] .tetris-page,
html[data-theme="dark"] .racing-page,
html[data-theme="dark"] .hero-page,
html[data-theme="dark"] .chess-page {
background:
radial-gradient(circle at 80% 0%, rgba(37,99,235,.16), transparent 32%),
radial-gradient(circle at 8% 10%, rgba(14,165,233,.10), transparent 28%),
linear-gradient(180deg, #07111f 0%, #0a1424 48%, #070d18 100%) !important;
}
html:not([data-theme="dark"]) body,
html:not([data-theme="dark"]) .main-content,
html:not([data-theme="dark"]) .page-main,
html:not([data-theme="dark"]) .monopoly-page,
html:not([data-theme="dark"]) .solo-page,
html:not([data-theme="dark"]) .koridor-page,
html:not([data-theme="dark"]) .tavla-page,
html:not([data-theme="dark"]) .tetris-page,
html:not([data-theme="dark"]) .racing-page,
html:not([data-theme="dark"]) .hero-page,
html:not([data-theme="dark"]) .chess-page {
background:
radial-gradient(circle at 86% 0%, rgba(191,219,254,.30), transparent 32%),
radial-gradient(circle at 8% 10%, rgba(224,242,254,.34), transparent 28%),
linear-gradient(180deg, #f7fbff 0%, #f3f7fb 48%, #eef2f7 100%) !important;
}
html:not([data-theme="dark"]) #tavla-app,
html:not([data-theme="dark"]) #tetris-app,
html:not([data-theme="dark"]) #koridor-app,
html:not([data-theme="dark"]) #solo-app,
html:not([data-theme="dark"]) #monopoly-app,
html:not([data-theme="dark"]) #racing-app,
html:not([data-theme="dark"]) #hero-app,
html:not([data-theme="dark"]) #chess-app {
background: transparent !important;
}
.top-strip {
background: #0b1220;
color: #d0d5dd;
font-size: 11.25px;
line-height: 1.35;
}
.top-strip-inner {
max-width: var(--nav-max);
margin: 0 auto;
padding: 5px 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.top-strip-inner > div {
display: flex;
align-items: center;
min-height: 15px;
transform: translateY(1px);
}
.top-strip a {
display: inline-flex;
align-items: center;
margin-left: 4px;
color: #f2f4f7;
font-weight: 700;
line-height: 1.35;
text-decoration: none;
}
.top-links {
display: flex;
align-items: center;
gap: 12px;
white-space: nowrap;
}
.site-header {
position: sticky;
top: 0;
z-index: 900;
width: 100%;
padding: 0;
border-bottom: 1px solid rgba(59,130,246,.62);
background: linear-gradient(135deg, #e1f5fe 0%, #f0faff 100%);
box-shadow: 0 8px 24px rgba(37,99,235,.12);
backdrop-filter: none;
-webkit-backdrop-filter: none;
}
html[data-theme="dark"] .site-header {
background: linear-gradient(180deg, #071326 0%, #0a1b34 100%);
border-bottom-color: rgba(96,165,250,.14);
box-shadow: 0 10px 28px rgba(0,0,0,.36);
}
.header-inner {
max-width: var(--nav-max);
height: 74px;
margin: 0 auto;
padding: 0 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.brand {
display: flex;
align-items: center;
gap: 9px;
min-width: max-content;
color: inherit;
text-decoration: none;
}
.brand-stack {
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 4px;
}
.brand-logo {
height: 27px;
width: auto;
display: block;
flex: none;
}
.brand-caption {
display: block;
color: var(--nav-muted);
font-size: 10.4px;
font-weight: 800;
line-height: 1.08;
letter-spacing: 0;
width: 131px;
max-width: 131px;
white-space: nowrap;
}
.brand-mark {
width: 42px;
height: 42px;
display: grid;
place-items: center;
border-radius: 14px;
background: linear-gradient(135deg,var(--c-green),var(--nav-blue));
color: #fff;
font-weight: 900;
letter-spacing: 0;
box-shadow: 0 12px 28px rgba(18,183,106,.22);
}
.brand-text strong {
display: block;
line-height: 1;
font-size: 21px;
color: var(--nav-ink);
letter-spacing: 0;
}
.brand-text span {
display: block;
margin-top: 3px;
color: var(--nav-muted);
font-size: 12px;
font-weight: 700;
letter-spacing: 0;
}
.brand-tagline span {
margin-top: 0;
font-size: 11.5px;
max-width: 128px;
line-height: 1.2;
}
.desktop-nav {
display: flex;
align-items: center;
justify-content: center;
gap: 0;
flex: 1;
min-width: 0;
flex-wrap: nowrap;
}
.nav-item {
position: static;
flex: 0 0 auto;
}
.desktop-nav > .nav-item {
padding: 0 !important;
font-size: inherit !important;
line-height: 1 !important;
}
.nav-trigger,
.nav-direct {
border: 0;
background: transparent;
padding: 25px 9px;
color: var(--txt-2);
font-weight: 800;
font-size: 14px;
line-height: 1;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 6px;
border-radius: 12px;
text-decoration: none;
white-space: nowrap;
font-family: var(--font);
letter-spacing: 0;
transition: color .15s ease, background .15s ease;
}
.nav-trigger svg {
transition: transform .18s ease;
}
.nav-item:hover .nav-trigger svg,
.nav-item:focus-within .nav-trigger svg {
transform: rotate(180deg);
}
.nav-trigger:hover,
.nav-direct:hover,
.nav-active {
color: var(--nav-ink);
}
.nav-active {
background: var(--nav-blue-soft);
color: var(--nav-blue);
}
.mega {
position: absolute;
top: 100%;
left: 50%;
width: min(980px, calc(100vw - 44px));
background: var(--nav-panel);
border: 1px solid var(--nav-line);
border-radius: 24px;
box-shadow: var(--nav-shadow);
overflow: hidden;
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateX(-50%) translateY(10px);
transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.desktop-nav .nav-item:nth-last-child(-n+2) .mega {
left: 50%;
right: auto;
transform: translateX(-50%) translateY(10px);
}
.mega-compact {
width: min(760px, calc(100vw - 44px));
}
.mega-guide {
width: min(700px, calc(100vw - 44px));
}
.mega-simple {
width: min(380px, calc(100vw - 32px));
border-radius: 18px;
}
.nav-item:hover .mega,
.nav-item:focus-within .mega {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateX(-50%) translateY(0);
}
.desktop-nav .nav-item:nth-last-child(-n+2):hover .mega,
.desktop-nav .nav-item:nth-last-child(-n+2):focus-within .mega {
transform: translateX(-50%) translateY(0);
}
.mega-content {
display: grid;
grid-template-columns: 300px 1fr;
min-height: min(330px, var(--evc-mega-max-height, 330px));
max-height: var(--evc-mega-max-height, min(70dvh, 540px));
overflow: hidden;
overscroll-behavior: contain;
}
.mega-feature::-webkit-scrollbar,
.mega-groups::-webkit-scrollbar {
width: 8px;
}
.mega-feature::-webkit-scrollbar-track,
.mega-groups::-webkit-scrollbar-track {
background: transparent;
}
.mega-feature::-webkit-scrollbar-thumb,
.mega-groups::-webkit-scrollbar-thumb {
background: rgba(100,116,139,.35);
border-radius: 999px;
}
.mega-compact .mega-content,
.mega-guide .mega-content {
grid-template-columns: 260px 1fr;
min-height: min(260px, var(--evc-mega-max-height, 260px));
}
.mega-feature {
background:
radial-gradient(circle at 18% 12%, rgba(125,211,252,.22), transparent 34%),
linear-gradient(160deg,#08213f,#164e88 58%,#0e7490);
color: #fff;
padding: 22px 24px;
display: flex;
flex-direction: column;
justify-content: flex-start;
gap: 18px;
min-height: 0;
max-height: var(--evc-mega-max-height, min(70dvh, 540px));
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
}
.mega-feature .pill {
display: inline-flex;
width: max-content;
padding: 7px 11px;
border-radius: 999px;
background: rgba(255,255,255,.12);
border: 1px solid rgba(255,255,255,.16);
font-size: 12px;
font-weight: 800;
}
.mega-feature h3 {
margin: 16px 0 8px;
font-size: 24px;
line-height: 1.08;
letter-spacing: 0;
color: #fff;
}
.mega-feature p {
margin: 0;
color: #d0d5dd;
font-size: 15px;
line-height: 1.55;
}
.feature-link {
display: inline-flex;
align-items: center;
gap: 8px;
width: max-content;
margin-top: 2px;
padding: 11px 14px;
background: #fff;
color: #0b1220;
border-radius: 999px;
font-weight: 900;
font-size: 14px;
text-decoration: none;
}
.mega-groups {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
align-content: start;
gap: 8px 14px;
padding: 24px;
max-height: var(--evc-mega-max-height, min(70dvh, 540px));
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
}
.mega-groups-two {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.mega-col h4 {
margin: 0 0 12px;
color: var(--nav-ink);
font-size: 14px;
font-weight: 500;
letter-spacing: 0;
}
.mega-col h4.mega-subhead {
margin: 0 0 12px;
}
.mega-col > h4:first-of-type {
margin-top: 0 !important;
}
.mega-col .mega-link + h4.mega-subhead {
margin-top: 16px;
}
.mega-link {
display: grid;
grid-template-columns: 42px 1fr;
gap: 11px;
align-items: center;
padding: 9px 10px;
border: 1px solid transparent;
border-radius: 12px;
color: inherit;
text-decoration: none;
transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.mega-link.no-icon {
grid-template-columns: 1fr;
gap: 0;
}
.mega-link.no-icon > span {
min-width: 0;
}
.mega-simple-head {
padding: 16px 18px 10px;
border-bottom: 1px solid var(--nav-line);
}
.mega-simple-head strong {
display: block;
color: var(--nav-ink);
font-size: 15px;
}
.mega-simple-head span {
display: block;
color: var(--nav-muted);
font-size: 12.5px;
margin-top: 3px;
}
.mega-simple-list {
padding: 8px;
max-height: min(62vh, 520px);
overflow-y: auto;
}
.mega-simple .mega-link {
grid-template-columns: 1fr;
gap: 0;
padding: 10px 11px;
border-radius: 10px;
}
.mega-simple .mega-link span {
min-width: 0;
}
.mega-link:hover {
background: var(--nav-soft);
border-color: rgba(37,99,235,.14);
}
.mega-link-primary {
background: linear-gradient(135deg, rgba(37,99,235,.11), rgba(14,165,233,.08));
border: 1px solid rgba(37,99,235,.20);
box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
min-height: 62px;
}
.mega-link-primary:hover {
background: linear-gradient(135deg, rgba(37,99,235,.15), rgba(14,165,233,.11));
border-color: rgba(37,99,235,.32);
box-shadow: inset 0 0 0 1px rgba(255,255,255,.65);
}
.mega-link-primary:hover b {
color: #0f3ea8;
}
.mega-link-primary:hover span span {
color: #1d4ed8;
}
html[data-theme="dark"] .mega-link-primary:hover {
background: rgba(59,130,246,.22);
border-color: rgba(147,197,253,.38);
}
.mega-link-primary b,
.m-link-card-primary b {
color: #1d4ed8;
}
.mega-link-primary span span,
.m-link-card-primary span span {
color: #2563eb;
}
html[data-theme="dark"] .mega-link-primary,
html[data-theme="dark"] .m-link-card-primary {
background: rgba(37,99,235,.16);
border-color: rgba(96,165,250,.28);
}
html[data-theme="dark"] .mega-link-primary b,
html[data-theme="dark"] .m-link-card-primary b {
color: #bfdbfe;
}
html[data-theme="dark"] .mega-link-primary span span,
html[data-theme="dark"] .m-link-card-primary span span {
color: #93c5fd;
}
.mini-icon {
width: 42px;
height: 42px;
border-radius: 14px;
display: grid;
place-items: center;
background: var(--nav-green-soft);
color: #027a48;
font-weight: 900;
flex: none;
font-size: 12px;
}
.mini-icon.blue {
background: var(--nav-blue-soft);
color: #175cd3;
}
.mini-icon.gray {
background: var(--nav-soft);
color: var(--txt-2);
}
.mini-icon i {
font-size: 16px;
}
.mega-link b,
.m-link-card b {
display: block;
color: var(--nav-ink);
font-size: 14px;
margin-bottom: 2px;
letter-spacing: 0;
}
.mega-link span,
.m-link-card span {
display: block;
color: var(--nav-muted);
font-size: 12.5px;
line-height: 1.35;
}
.header-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 4px;
min-width: max-content;
}
.icon-button,
.lang-button,
.mobile-open,
.close,
.m-back {
border: 1px solid var(--nav-line);
background: var(--nav-panel);
color: var(--txt-2);
cursor: pointer;
font-family: var(--font);
}
.icon-button {
width: 32px;
height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 9px;
font-size: 13px;
line-height: 1;
padding: 0;
}
.icon-button i {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1em;
height: 1em;
line-height: 1;
text-align: center;
}
.icon-button .fa-up-right-from-square {
transform: translate(.25px, -.25px);
}
.lang-button {
height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0 9px;
border-radius: 9px;
font-weight: 900;
font-size: 11.5px;
text-decoration: none;
}
.icon-button:hover,
.lang-button:hover,
.mobile-open:hover,
.close:hover,
.m-back:hover {
background: var(--nav-soft);
color: var(--nav-blue);
}
.pwa-only {
display: none !important;
}
html.is-pwa .pwa-only,
html.is-pwa-shell .pwa-only {
display: inline-flex !important;
}
html.is-pwa .browser-only,
html.is-pwa-shell .browser-only,
[data-pwa-install][data-pwa-state="hidden"] {
display: none !important;
}
.pwa-control {
color: var(--nav-blue);
}
.evc-notify-trigger,
.mobile-notify-action {
position: relative;
}
.evc-notify-trigger {
color: var(--nav-blue);
}
.evc-notify-badge {
position: absolute;
top: -6px;
right: -6px;
min-width: 17px;
height: 17px;
padding: 0 4px;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
background: #ef4444;
color: #fff;
border: 2px solid var(--nav-panel);
font-size: 9.5px;
font-weight: 900;
line-height: 1;
box-shadow: 0 7px 14px rgba(239,68,68,.24);
pointer-events: none;
}
.evc-notify-badge[hidden] {
display: none;
}
.evc-notify-panel {
position: fixed;
top: 82px;
right: max(14px, calc((100vw - var(--nav-max)) / 2 + 20px));
z-index: 1210;
width: min(370px, calc(100vw - 24px));
max-height: min(560px, calc(100dvh - 96px));
overflow: hidden;
background: var(--nav-panel);
border: 1px solid var(--nav-line);
border-radius: 16px;
box-shadow: 0 24px 70px rgba(15,23,42,.24), 0 4px 14px rgba(15,23,42,.10);
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateY(-8px) scale(.98);
transform-origin: top right;
transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}
.evc-notify-panel.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0) scale(1);
}
.evc-notify-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 14px 14px 12px;
border-bottom: 1px solid var(--nav-line);
background: linear-gradient(180deg, rgba(37,99,235,.07), transparent);
}
.evc-notify-head strong,
.evc-notify-head span {
display: block;
}
.evc-notify-head strong {
color: var(--nav-ink);
font-size: 14px;
line-height: 1.1;
font-weight: 900;
}
.evc-notify-head span {
margin-top: 3px;
color: var(--nav-muted);
font-size: 11.5px;
line-height: 1.25;
font-weight: 700;
}
.evc-notify-head button {
border: 1px solid var(--nav-line);
background: var(--nav-soft);
color: var(--nav-blue);
border-radius: 9px;
min-height: 30px;
padding: 0 10px;
font-family: var(--font);
font-size: 11px;
font-weight: 900;
cursor: pointer;
}
.evc-notify-head button:hover {
border-color: rgba(37,99,235,.32);
background: #dceeff;
}
.evc-notify-list {
max-height: min(456px, calc(100dvh - 178px));
overflow-y: auto;
padding: 6px;
}
.evc-notify-list::-webkit-scrollbar {
width: 6px;
}
.evc-notify-list::-webkit-scrollbar-track {
background: transparent;
}
.evc-notify-list::-webkit-scrollbar-thumb {
background: rgba(100,116,139,.32);
border-radius: 999px;
}
.evc-notify-item {
position: relative;
display: grid;
grid-template-columns: 36px 1fr;
gap: 10px;
padding: 10px;
border: 1px solid transparent;
border-radius: 12px;
color: inherit;
text-decoration: none;
transition: background .15s ease, border-color .15s ease;
}
.evc-notify-item:hover {
background: var(--nav-soft);
border-color: rgba(37,99,235,.14);
}
.evc-notify-item.is-unread::after {
content: "";
position: absolute;
top: 13px;
right: 12px;
width: 7px;
height: 7px;
border-radius: 999px;
background: #ef4444;
box-shadow: 0 0 0 3px rgba(239,68,68,.10);
}
.evc-notify-icon {
width: 36px;
height: 36px;
border-radius: 11px;
display: grid;
place-items: center;
background: var(--nav-blue-soft);
color: var(--nav-blue);
font-size: 14px;
}
.evc-notify-icon.success {
background: var(--nav-green-soft);
color: #027a48;
}
.evc-notify-icon.warning {
background: #fff7ed;
color: #b45309;
}
.evc-notify-icon.danger {
background: #fef2f2;
color: #b91c1c;
}
.evc-notify-content {
min-width: 0;
padding-right: 14px;
}
.evc-notify-title-row {
display: flex;
align-items: center;
gap: 6px;
min-width: 0;
}
.evc-notify-title {
color: var(--nav-ink);
font-size: 13px;
font-weight: 900;
line-height: 1.25;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.evc-notify-new {
flex: none;
border-radius: 999px;
background: rgba(239,68,68,.10);
color: #dc2626;
padding: 2px 6px;
font-size: 9.5px;
line-height: 1;
font-weight: 900;
}
.evc-notify-text {
margin-top: 3px;
color: var(--nav-muted);
font-size: 12px;
line-height: 1.35;
}
.evc-notify-time {
margin-top: 6px;
color: var(--txt-3);
font-size: 10.5px;
font-weight: 800;
}
.evc-notify-empty {
padding: 28px 14px;
text-align: center;
color: var(--nav-muted);
font-size: 12.5px;
font-weight: 800;
}
.evc-notify-empty i {
display: block;
margin-bottom: 8px;
color: var(--nav-blue);
font-size: 18px;
}
html[data-theme="dark"] .evc-notify-panel {
box-shadow: 0 24px 70px rgba(0,0,0,.46);
}
html[data-theme="dark"] .evc-notify-head button:hover,
html[data-theme="dark"] .evc-notify-item:hover {
background: rgba(37,99,235,.18);
border-color: rgba(147,197,253,.30);
}
html[data-theme="dark"] .evc-notify-icon.warning {
background: rgba(245,158,11,.14);
color: #fbbf24;
}
html[data-theme="dark"] .evc-notify-icon.danger {
background: rgba(239,68,68,.14);
color: #fca5a5;
}
.pwa-toast {
position: fixed;
left: 12px;
right: auto;
bottom: 12px;
z-index: 12000;
width: auto;
max-width: calc(100vw - 24px);
display: flex;
align-items: center;
gap: 8px;
padding: 8px 10px;
border: 1px solid var(--nav-line);
border-radius: 8px;
background: var(--nav-panel);
color: var(--nav-ink);
box-shadow: 0 12px 34px rgba(15,23,42,.16);
opacity: 0;
transform: translateY(12px);
pointer-events: none;
transition: opacity .18s ease, transform .18s ease;
}
.pwa-toast.is-visible {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.pwa-toast i {
flex: 0 0 auto;
color: var(--nav-green);
font-size: 12px;
}
.pwa-toast-body {
min-width: 0;
flex: 1 1 auto;
}
.pwa-toast-text {
min-width: 0;
max-width: calc(100vw - 74px);
display: block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 13px;
line-height: 1.25;
}
.pwa-toast-actions {
display: flex;
gap: 8px;
margin-top: 9px;
}
.pwa-toast-actions button {
min-height: 30px;
padding: 0 10px;
border-radius: 8px;
border: 1px solid var(--nav-line);
background: var(--nav-soft);
color: var(--nav-ink);
cursor: pointer;
font: inherit;
font-size: 12px;
font-weight: 850;
}
.pwa-toast-actions button:first-child {
background: var(--nav-green);
border-color: var(--nav-green);
color: #fff;
}
@media (max-width: 640px) {
.pwa-toast {
left: 8px;
right: 8px;
bottom: 8px;
max-width: none;
padding: 7px 9px;
}
.pwa-toast-text {
max-width: calc(100vw - 64px);
font-size: 12px;
}
}
.cta {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 42px;
padding: 0 16px;
border-radius: 999px;
background: var(--nav-green);
color: #fff;
font-weight: 900;
box-shadow: 0 12px 25px rgba(3,152,85,.22);
border: 0;
cursor: pointer;
text-decoration: none;
}
.mobile-header-actions {
display: none;
align-items: center;
gap: 7px;
}
.mobile-open {
display: none;
align-items: center;
gap: 8px;
height: 36px;
padding: 0 12px;
border-radius: 11px;
font-weight: 900;
}
.dots {
width: 17px;
height: 17px;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 3px;
}
.dots i {
display: block;
width: 7px;
height: 7px;
border-radius: 3px;
background: currentColor;
}
.mobile-panel {
position: fixed;
inset: 0;
z-index: 1100;
opacity: 0;
pointer-events: none;
transition: opacity .2s ease;
}
.mobile-panel.is-open {
opacity: 1;
pointer-events: auto;
}
.mobile-backdrop {
position: absolute;
inset: 0;
background: rgba(11,18,32,.46);
}
.mobile-sheet {
position: absolute;
top: 0;
right: 0;
width: min(430px, 92vw);
height: 100%;
background: var(--nav-panel);
transform: translateX(100%);
transition: transform .24s ease;
box-shadow: -20px 0 60px rgba(16,24,40,.22);
display: flex;
flex-direction: column;
}
.mobile-panel.is-open .mobile-sheet {
transform: translateX(0);
}
.mobile-head {
min-height: 68px;
padding: 0 16px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid var(--nav-line);
flex-shrink: 0;
gap: 8px;
}
.close,
.m-back {
width: 42px;
height: 42px;
border-radius: 14px;
font-size: 24px;
line-height: 1;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
background: var(--nav-soft, rgba(15,23,42,.06));
border: 1px solid var(--nav-line, rgba(15,23,42,.09));
color: var(--txt-2);
cursor: pointer;
transition: background .15s ease, color .15s ease, transform .12s ease;
}
.close:hover {
background: rgba(239,68,68,.10);
border-color: rgba(239,68,68,.25);
color: #ef4444;
transform: scale(1.06);
}
.m-back:hover {
background: rgba(37,99,235,.10);
border-color: rgba(37,99,235,.25);
color: var(--c-primary);
transform: translateX(-2px);
}
html[data-theme="dark"] .close:hover {
background: rgba(239,68,68,.18);
border-color: rgba(239,68,68,.30);
}
html[data-theme="dark"] .m-back:hover {
background: rgba(37,99,235,.20);
border-color: rgba(147,197,253,.30);
}
.mobile-body {
flex: 1;
position: relative;
padding: 12px;
overflow: auto;
background:
linear-gradient(180deg, rgba(37,99,235,.07), transparent 180px),
var(--nav-panel);
}
.m-view {
display: block;
}
.m-view.is-hidden {
display: none;
}
.mobile-top-actions {
display: grid;
grid-template-columns: 1fr 48px 48px;
gap: 8px;
margin-bottom: 14px;
}
/* Header aksiyonlarını mobil/tablet panelde iki dengeli kolonda tut. */
.mobile-top-actions.mobile-top-actions-ai {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
align-items: stretch;
}
.mobile-top-actions-ai #mobileSearchTop,
.mobile-top-actions-ai #mobileAiSummaryTop,
.mobile-top-actions-ai .mobile-notify-action,
.mobile-top-actions-ai [data-pwa-install],
.mobile-top-actions-ai [data-pwa-open-browser] {
font-size: 13px;
font-weight: 700;
padding: 0 10px !important;
}
.mobile-top-actions-ai a,
.mobile-top-actions-ai > button:last-child {
/* lang + theme küçük butonlar */
min-height: 40px;
}
.mobile-top-actions a,
.mobile-top-actions button {
min-width: 0;
min-height: 40px;
border: 1px solid var(--nav-line);
background: var(--nav-soft);
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
gap: 7px;
color: var(--txt-2);
font-weight: 900;
cursor: pointer;
text-decoration: none;
}
.mobile-top-actions a,
.mobile-top-actions button:not(#mobileSearchTop) {
padding: 0;
}
.mobile-top-actions.mobile-top-actions-ai .mobile-notify-action span:not(.evc-notify-badge),
.mobile-top-actions.mobile-top-actions-ai #mobileSearchTop span,
.mobile-top-actions.mobile-top-actions-ai #mobileAiSummaryTop span,
.mobile-top-actions.mobile-top-actions-ai [data-pwa-install] span,
.mobile-top-actions.mobile-top-actions-ai [data-pwa-open-browser] span {
min-width: 0;
overflow: visible;
text-overflow: clip;
white-space: nowrap;
}
@media (max-width: 380px) {
.mobile-top-actions.mobile-top-actions-ai {
gap: 6px;
}
.mobile-top-actions-ai #mobileSearchTop,
.mobile-top-actions-ai #mobileAiSummaryTop,
.mobile-top-actions-ai .mobile-notify-action,
.mobile-top-actions-ai [data-pwa-install],
.mobile-top-actions-ai [data-pwa-open-browser] {
font-size: 12.5px;
padding: 0 8px !important;
}
}
.mobile-top-actions i {
font-size: 14px;
}
.mobile-top-actions a:hover,
.mobile-top-actions button:hover,
.m-direct:hover,
.m-link-card:hover,
.m-small-row a:hover {
border-color: rgba(37,99,235,.32);
background: #dceeff;
color: #1e40af;
}
html[data-theme="dark"] .mobile-top-actions a:hover,
html[data-theme="dark"] .mobile-top-actions button:hover,
html[data-theme="dark"] .m-direct:hover,
html[data-theme="dark"] .m-link-card:hover,
html[data-theme="dark"] .m-small-row a:hover {
background: rgba(37,99,235,.18);
color: #bfdbfe;
border-color: rgba(147,197,253,.30);
}
.m-direct {
width: 100%;
min-height: 66px;
padding: 10px 12px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
border: 1px solid rgba(37,99,235,.16);
border-left: 5px solid var(--nav-blue);
background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(255,255,255,.82));
border-radius: 16px;
margin-bottom: 9px;
font-weight: 900;
color: var(--nav-ink);
cursor: pointer;
text-decoration: none;
box-shadow: 0 10px 24px rgba(16,24,40,.06);
transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.m-direct-main {
display: flex;
align-items: center;
gap: 11px;
min-width: 0;
}
.m-direct-icon {
width: 38px;
height: 38px;
flex: 0 0 38px;
display: grid;
place-items: center;
border-radius: 12px;
background: var(--nav-blue-soft);
color: var(--nav-blue);
font-size: 15px;
}
.m-direct-copy {
display: block;
min-width: 0;
}
.m-direct-copy b,
.m-direct-copy small {
display: block;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.m-direct-copy b {
color: var(--nav-ink);
font-size: 15px;
line-height: 1.2;
}
.m-direct-copy small {
margin-top: 3px;
color: var(--nav-muted);
font-size: 11.5px;
line-height: 1.25;
font-weight: 800;
}
.m-direct-arrow {
flex: 0 0 auto;
color: var(--nav-blue);
font-size: 17px;
font-weight: 900;
}
.m-direct:hover {
transform: translateY(-1px);
border-color: rgba(37,99,235,.34);
}
html[data-theme="dark"] .m-direct {
background: linear-gradient(135deg, rgba(37,99,235,.18), rgba(14,116,144,.10));
border-color: rgba(147,197,253,.24);
border-left-color: #60a5fa;
box-shadow: none;
}
html[data-theme="dark"] .m-direct-icon {
background: rgba(96,165,250,.16);
color: #bfdbfe;
}
html[data-theme="dark"] .m-direct-copy b {
color: #e5eefb;
}
html[data-theme="dark"] .m-direct-copy small {
color: #9fb6d1;
}
.m-category {
width: 100%;
min-height: 74px;
border: 1px solid var(--nav-line);
background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(255,255,255,.78));
border-left: 5px solid var(--nav-blue);
border-radius: 18px;
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
padding: 11px 12px 11px 10px;
margin-bottom: 10px;
cursor: pointer;
text-align: left;
font-family: var(--font);
box-shadow: 0 10px 24px rgba(16,24,40,.05);
transition: transform .15s ease, border-color .15s ease, background .15s ease;
}
.m-category:hover {
transform: translateY(-1px);
border-color: rgba(37,99,235,.34);
}
.m-category b {
display: block;
color: var(--nav-ink);
font-size: 17px;
letter-spacing: 0;
}
.m-category span {
display: block;
color: var(--nav-muted);
font-size: 13px;
margin-top: 2px;
font-weight: 600;
}
.m-category-tools {
border-left-color: #2563eb;
background: linear-gradient(135deg, rgba(37,99,235,.10), rgba(255,255,255,.78));
}
/* EV Verileri koyu yeşil */
.m-category-ev {
border-left-color: #0f766e; /* koyu yeşil şerit */
background: linear-gradient(135deg, rgba(15,118,110,.12), rgba(255,255,255,.78));
}
html[data-theme="dark"] .m-category-ev {
border-left-color: #34d399; /* açık yeşil (karanlık modda okunurluk) */
background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
.m-category-ev:hover {
border-color: rgba(15,118,110,.34) !important;
}
html[data-theme="dark"] .m-category-ev:hover {
border-color: rgba(52,211,153,.42) !important;
}
/* Mobil menü tema butonu yazısı */
.mobile-top-actions .theme-btn-mob {
padding: 0 8px; /* içeriğin nefes alması için */
font-size: 13px; /* okunaklı boyut */
font-weight: 700;
min-width: 0; /* gereksiz genişliği kırp */
white-space: nowrap;
}
.m-category-docs {
border-left-color: #d97706;
background: linear-gradient(135deg, rgba(217,119,6,.12), rgba(255,255,255,.78));
}
.m-category-play {
border-left-color: #7c3aed;
background: linear-gradient(135deg, rgba(124,58,237,.11), rgba(255,255,255,.78));
}
html[data-theme="dark"] .m-category,
html[data-theme="dark"] .m-category-tools,
html[data-theme="dark"] .m-category-docs,
html[data-theme="dark"] .m-category-play {
background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}
.m-arrow {
color: var(--txt-3);
font-size: 24px;
padding-right: 6px;
}
.m-sub-head {
display: flex;
align-items: center;
gap: 12px;
padding: 6px 0 16px;
border-bottom: 1px solid var(--nav-line);
margin-bottom: 14px;
min-height: 58px;
}
.m-sub-title b {
display: block;
font-size: 20px;
color: var(--nav-ink);
letter-spacing: 0;
}
.m-sub-title span {
display: block;
color: var(--nav-muted);
font-size: 13px;
margin-top: 2px;
}
.m-feature-card {
background:
radial-gradient(circle at 18% 10%, rgba(125,211,252,.22), transparent 34%),
linear-gradient(135deg,#08213f,#164e88 62%,#0e7490);
color: #fff;
border-radius: 22px;
padding: 18px;
margin: 0 0 14px;
}
.m-sub-tools .m-feature-card {
background:
radial-gradient(circle at 18% 10%, rgba(56,189,248,.20), transparent 34%),
linear-gradient(135deg,#071525,#17376d 62%,#1d4ed8);
}
.m-sub-docs .m-feature-card {
background:
radial-gradient(circle at 18% 10%, rgba(56,189,248,.18), transparent 34%),
linear-gradient(135deg,#071525,#12345f 60%,#0e7490);
}
.m-sub-play .m-feature-card {
background:
radial-gradient(circle at 18% 10%, rgba(56,189,248,.18), transparent 34%),
linear-gradient(135deg,#071525,#172554 62%,#2563eb);
}
.m-feature-card small {
display: inline-flex;
padding: 6px 10px;
border-radius: 999px;
background: rgba(255,255,255,.12);
border: 1px solid rgba(255,255,255,.14);
font-weight: 900;
margin-bottom: 12px;
}
.m-feature-card h3 {
margin: 0 0 8px;
font-size: 22px;
letter-spacing: 0;
line-height: 1.12;
color: #fff;
}
.m-feature-card p {
margin: 0 0 14px;
color: #d0d5dd;
font-size: 14px;
line-height: 1.5;
}
.m-feature-card a {
display: inline-flex;
background: #fff;
color: #0b1220;
padding: 10px 12px;
border-radius: 999px;
font-weight: 900;
font-size: 13px;
text-decoration: none;
}
.m-section-label {
margin: 16px 0 8px;
color: var(--nav-ink);
font-weight: 900;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0;
display: inline-flex;
align-items: center;
padding: 5px 9px;
border-radius: 999px;
background: var(--nav-soft);
border: 1px solid var(--nav-line);
}
.m-link-card {
display: grid;
grid-template-columns: 42px 1fr;
gap: 11px;
align-items: center;
padding: 12px 13px;
border: 1px solid var(--nav-line-soft);
border-left: 4px solid var(--nav-green);
border-radius: 14px;
background: var(--nav-panel);
margin-bottom: 8px;
text-decoration: none;
box-shadow: 0 8px 20px rgba(16,24,40,.035);
}
.m-menu-section .m-link-card,
.m-sub-links .m-link-card {
grid-template-columns: 1fr;
gap: 0;
}
.m-sub-tools .m-link-card { border-left-color: #2563eb; }
.m-sub-docs .m-link-card { border-left-color: #d97706; }
.m-sub-play .m-link-card { border-left-color: #7c3aed; }
.m-link-card-primary {
border-left-color: #2563eb;
background: linear-gradient(135deg, rgba(37,99,235,.11), rgba(14,165,233,.07));
border-top-color: rgba(37,99,235,.20);
border-right-color: rgba(37,99,235,.20);
border-bottom-color: rgba(37,99,235,.20);
min-height: 64px;
}
.m-link-card-primary:hover {
background: linear-gradient(135deg, rgba(37,99,235,.16), rgba(14,165,233,.11));
border-color: rgba(37,99,235,.34);
}
html[data-theme="dark"] .m-link-card-primary:hover {
background: linear-gradient(135deg, rgba(59,130,246,.24), rgba(14,165,233,.14)) !important;
border-color: rgba(147,197,253,.42) !important;
}
.m-small-row {
display: flex;
flex-wrap: wrap;
gap: 8px;
padding-top: 16px;
}
.m-small-row a {
padding: 9px 11px;
border: 1px solid var(--nav-line);
border-radius: 999px;
background: var(--nav-soft);
color: var(--txt-2);
font-weight: 800;
font-size: 13px;
text-decoration: none;
}
.mobile-footer {
margin-top: auto;
padding: 14px;
border-top: 1px solid var(--nav-line);
display: grid;
gap: 10px;
}
.mobile-footer .cta {
width: 100%;
}
.page-wrap {
margin-top: 18px;
}
.footer {
background: #dce3ed;
color: var(--txt-2);
border-top: 1px solid var(--brd);
margin-top: 40px;
}
html[data-theme="dark"] .footer {
background: #080f1d;
color: #d0d5dd;
border-top-color: rgba(255,255,255,.08);
}
.footer-inner {
max-width: var(--nav-max);
margin: 0 auto;
padding: 54px 22px 26px;
}
.footer-top {
display: grid;
grid-template-columns: 1.1fr 1.9fr;
gap: 44px;
padding-bottom: 36px;
border-bottom: 1px solid var(--brd);
}
html[data-theme="dark"] .footer-top {
border-bottom-color: rgba(255,255,255,.12);
}
.footer-brand-text strong {
display: block;
color: var(--txt);
font-size: 24px;
letter-spacing: 0;
}
html[data-theme="dark"] .footer-brand-text strong {
color: #fff;
}
.footer-brand-text span {
display: block;
color: var(--txt-2);
margin-top: 0;
font-size: 13px;
font-weight: 700;
}
html[data-theme="dark"] .footer-brand-text span {
color: #98a2b3;
}
.footer-brand {
align-items: flex-start;
gap: 5px;
}
.footer-brand .brand-logo {
height: 34px;
}
.footer-brand-caption {
color: var(--txt-2);
font-size: 13px;
font-weight: 800;
max-width: 240px;
}
html[data-theme="dark"] .footer-brand-caption {
color: #98a2b3;
}
.footer-desc {
margin: 18px 0 22px;
color: var(--txt-2);
line-height: 1.65;
max-width: 420px;
}
html[data-theme="dark"] .footer-desc {
color: #98a2b3;
}
.footer-badges {
display: flex;
flex-wrap: wrap;
gap: 9px;
}
.footer-badges span {
padding: 5px 9px;
border-radius: 999px;
background: var(--surf2);
border: 1px solid var(--brd);
color: var(--txt-2);
font-size: 10.5px;
font-weight: 800;
}
html[data-theme="dark"] .footer-badges span {
background: rgba(255,255,255,.08);
border-color: rgba(255,255,255,.10);
color: #f2f4f7;
}
.footer-links {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 26px;
}
.footer-col h4 {
display: inline-flex;
align-items: center;
margin: 0 0 13px;
padding-bottom: 7px;
border-bottom: 2px solid rgba(7,21,37,.18);
color: #071525;
font-size: 12px;
font-weight: 900;
letter-spacing: .04em;
text-transform: uppercase;
}
html[data-theme="dark"] .footer-col h4 {
color: #dbeafe;
border-bottom-color: rgba(219,234,254,.24);
}
.footer-col a {
display: block;
width: fit-content;
color: var(--txt-2);
padding: 6px 0;
font-size: 14px;
text-decoration: none;
}
.footer-col a:hover {
color: var(--c-primary);
}
html[data-theme="dark"] .footer-col a {
color: #98a2b3;
}
html[data-theme="dark"] .footer-col a:hover {
color: #fff;
}
.footer-bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
padding-top: 22px;
color: var(--txt-2);
font-size: 13px;
}
.footer-copy {
color: inherit;
}
html[data-theme="dark"] .footer-bottom {
color: #98a2b3;
}
.footer-bottom-links {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 8px;
flex-wrap: nowrap;
min-width: 0;
white-space: nowrap;
}
.footer-bottom-links .footer-ai {
margin-left: 0;
}
.footer-lang-switch {
display: inline-flex;
align-items: center;
height: 28px;
padding: 2px;
gap: 0;
border: 1px solid var(--brd);
border-radius: 8px;
background: var(--surf2);
overflow: hidden;
flex: 0 0 auto;
}
.footer-lang-btn {
box-sizing: border-box;
width: 36px;
min-width: 36px;
height: 22px;
min-height: 22px;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid transparent;
border-radius: 6px;
color: var(--txt-2);
font-size: 11.5px;
font-weight: 900;
line-height: 1;
text-decoration: none;
flex: 0 0 36px;
}
.footer-lang-btn:hover {
color: var(--c-primary);
background: rgba(37,99,235,.08);
}
.footer-lang-btn.is-active {
background: rgba(37,99,235,.10);
color: var(--c-primary);
box-shadow: none;
}
.footer-tool,
.footer-theme {
border: 1px solid var(--brd);
background: var(--surf2);
color: var(--txt-2);
width: 28px;
min-width: 28px;
height: 28px;
min-height: 28px;
padding: 0 9px;
border-radius: 8px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 5px;
cursor: pointer;
font: inherit;
font-weight: 800;
font-size: 11px;
flex: 0 0 auto;
text-decoration: none;
line-height: 1;
white-space: nowrap;
overflow: hidden;
box-sizing: border-box;
}
.footer-ai {
width: auto;
min-width: 96px;
}
.footer-tool.browser-only,
.footer-tool.pwa-only {
width: auto;
min-width: 66px;
}
.footer-tool i,
.footer-theme-seg i {
display: block;
width: 1em;
height: 1em;
line-height: 1;
text-align: center;
}
.footer-tool .footer-tool-label {
display: inline-block;
min-width: 0;
max-width: 78px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.footer-theme span {
display: none;
}
.footer-tool:hover,
.footer-theme:hover {
border-color: var(--c-primary);
color: var(--c-primary);
}
html[data-theme="dark"] .footer-lang-switch {
background: rgba(255,255,255,.08);
border-color: rgba(255,255,255,.12);
}
html[data-theme="dark"] .footer-lang-btn {
color: #d0d5dd;
}
html[data-theme="dark"] .footer-lang-btn:hover {
background: rgba(255,255,255,.08);
color: #fff;
}
html[data-theme="dark"] .footer-lang-btn.is-active {
background: rgba(37,99,235,.18);
color: #bfdbfe;
}
html[data-theme="dark"] .footer-tool,
html[data-theme="dark"] .footer-theme {
background: rgba(255,255,255,.08);
border-color: rgba(255,255,255,.12);
color: #d0d5dd;
}
.footer-theme-switch {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 2px;
height: 28px;
padding: 2px;
border: 1px solid var(--brd);
border-radius: 8px;
background: var(--surf2);
flex: 0 0 auto;
}
.footer-theme-seg {
box-sizing: border-box;
width: 22px;
height: 22px;
min-width: 22px;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid transparent;
border-radius: 6px;
background: transparent;
color: var(--txt-2);
cursor: pointer;
font-size: 11px;
line-height: 1;
}
.footer-theme-seg:hover,
.footer-theme-seg.is-active {
background: rgba(37,99,235,.10);
color: var(--c-primary);
}
html[data-theme="dark"] .footer-theme-switch {
background: rgba(255,255,255,.08);
border-color: rgba(255,255,255,.12);
}
html[data-theme="dark"] .footer-theme-seg {
color: #d0d5dd;
}
html[data-theme="dark"] .footer-theme-seg:hover,
html[data-theme="dark"] .footer-theme-seg.is-active {
background: rgba(37,99,235,.18);
color: #bfdbfe;
}
@media (max-width: 1050px) {
.desktop-nav,
.header-actions {
display: none;
}
.mobile-header-actions {
display: flex;
}
.mobile-open {
display: inline-flex;
}
.top-strip-inner {
justify-content: center;
}
.top-links {
display: none;
}
.footer-top {
grid-template-columns: 1fr;
}
.footer-links {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.footer-bottom {
flex-direction: column-reverse;
align-items: center;
text-align: center;
}
.footer-bottom-links {
justify-content: center;
}
.footer-bottom-links .footer-ai {
margin-left: 0;
}
}
/* Final header menu refinements */
.mega-col {
display: grid;
align-content: start;
gap: 6px;
}
.mega-col h4 {
margin: 0 0 6px;
}
.mega-col .mega-link {
min-height: 58px;
}
.mega-col .mega-link-primary {
margin: 2px 0;
min-height: 64px;
}
html[data-theme="dark"] .mobile-top-actions a:hover,
html[data-theme="dark"] .mobile-top-actions button:hover,
html[data-theme="dark"] .m-direct:hover,
html[data-theme="dark"] .m-category:hover,
html[data-theme="dark"] .m-link-card:hover,
html[data-theme="dark"] .m-small-row a:hover,
html[data-theme="dark"] .m-feature-card a:hover {
background: linear-gradient(135deg, rgba(30,64,175,.52), rgba(14,116,144,.30)) !important;
border-color: rgba(147,197,253,.42) !important;
color: #dbeafe !important;
box-shadow: none !important;
}
html[data-theme="dark"] .m-direct:hover b,
html[data-theme="dark"] .m-direct:hover span,
html[data-theme="dark"] .m-category:hover b,
html[data-theme="dark"] .m-category:hover span,
html[data-theme="dark"] .m-link-card:hover b,
html[data-theme="dark"] .m-link-card:hover span,
html[data-theme="dark"] .m-small-row a:hover {
color: #dbeafe !important;
}
html[data-theme="dark"] .m-link-card-primary:hover,
html[data-theme="dark"] .mega-link-primary:hover {
background: linear-gradient(135deg, rgba(37,99,235,.30), rgba(14,165,233,.18)) !important;
border-color: rgba(147,197,253,.48) !important;
box-shadow: inset 0 0 0 1px rgba(147,197,253,.18) !important;
}
html[data-theme="dark"] .m-link-card-primary:hover b,
html[data-theme="dark"] .m-link-card-primary:hover span,
html[data-theme="dark"] .mega-link-primary:hover b,
html[data-theme="dark"] .mega-link-primary:hover span {
color: #dbeafe !important;
}
@media (max-width: 768px) {
body {
padding-top: 0;
}
.page-wrap {
width: min(100%, calc(100% - 20px));
margin-top: 12px;
}
.evc-page-hero {
padding: 16px;
gap: 13px;
}
.page-wrap-index .evc-page-hero,
.smap-page > .evc-page-hero,
.evc-page-hero.td-header,
.evc-page-hero.td-hero,
.doc-hub > .evc-page-hero,
.pv-wrap > .evc-page-hero {
padding: 16px;
gap: 13px;
}
.evc-page-hero-main {
align-items: flex-start;
flex-basis: 100%;
}
.page-wrap-index .evc-page-hero-main,
.smap-page > .evc-page-hero .evc-page-hero-main,
.evc-page-hero.td-header .evc-page-hero-main,
.evc-page-hero.td-hero .evc-page-hero-main,
.doc-hub > .evc-page-hero .evc-page-hero-main,
.pv-wrap > .evc-page-hero .evc-page-hero-main {
align-items: flex-start;
flex-basis: 100%;
}
.evc-page-hero-icon {
width: 42px;
height: 42px;
border-radius: 13px;
}
.evc-page-hero-stats {
width: 100%;
justify-content: flex-start;
}
.page-wrap-index .evc-page-hero-stats,
.smap-page > .evc-page-hero .evc-page-hero-stats,
.evc-page-hero.td-header .evc-page-hero-stats,
.evc-page-hero.td-hero .evc-page-hero-stats,
.doc-hub > .evc-page-hero .evc-page-hero-stats,
.pv-wrap > .evc-page-hero .evc-page-hero-stats {
width: 100%;
justify-content: flex-start;
}
.evc-page-hero-stat {
flex: 1 1 120px;
min-width: 0;
}
.page-wrap.page-wrap-play {
width: min(100%, calc(100% - 20px));
margin-top: 12px;
}
.page-wrap.page-wrap-tfile,
.page-wrap.page-wrap-feature-page,
.page-wrap.page-wrap-tools {
width: min(100%, calc(100% - 20px));
margin-top: 12px;
}
.page-wrap.page-wrap-tfile .container,
.page-wrap.page-wrap-tfile .evbm-content {
border-radius: 18px;
}
}
@media (max-width: 640px) {
.evc-notify-panel {
top: 74px;
left: 12px;
right: 12px;
width: auto;
max-height: calc(100dvh - 88px);
transform-origin: top center;
}
.evc-notify-list {
max-height: calc(100dvh - 180px);
}
.header-inner {
height: 66px;
padding: 0 15px;
}
.brand-text span {
display: none;
}
.site-header .brand-logo {
height: 26px;
}
.site-header .brand-caption {
display: none;
}
.mobile-head .brand-caption {
display: block;
max-width: 160px;
font-size: 10px;
line-height: 1.3;
white-space: normal;
}
.mobile-head .brand-logo {
height: 28px;
}
.top-strip-inner {
padding: 5px 14px;
text-align: center;
}
.footer-inner {
padding: 40px 15px 24px;
}
.footer-links {
grid-template-columns: 1fr;
}
.footer-bottom {
align-items: center;
flex-direction: column-reverse;
gap: 12px;
text-align: center;
}
.footer-bottom-links {
width: 100%;
justify-content: center;
gap: 6px;
overflow-x: auto;
padding-bottom: 2px;
scrollbar-width: none;
}
.footer-bottom-links::-webkit-scrollbar {
display: none;
}
.footer-tool {
width: 28px;
min-width: 28px;
padding: 0;
}
.footer-ai,
.footer-tool.browser-only,
.footer-tool.pwa-only {
width: 28px;
min-width: 28px;
}
.footer-tool .footer-tool-label {
display: none;
}
.footer-copy {
width: 100%;
font-size: 12px;
}
}
/* ── Mobile top strip final override ──────────────────────────
Üst bilgi şeridindeki sağ linkleri mobil/tablet genişlikte gizler.
Dosyanın en sonunda tutulur ki önceki display:flex kurallarını kesin ezsin.
*/
@media (max-width: 1050px) {
.top-strip .top-links {
display: none !important;
}
.top-strip .top-strip-inner {
justify-content: center !important;
}
.top-strip .top-strip-inner > div:first-child {
justify-content: center;
text-align: center;
white-space: nowrap;
overflow: hidden;
min-width: 0;
font-size: 10.5px;
}
.top-strip .top-strip-inner > div:first-child a {
white-space: nowrap;
flex-shrink: 0;
}
}
/* Header dropdown controls */
.evc-dropdown{position:relative;display:inline-flex}.evc-dropdown-panel{position:absolute;right:0;top:calc(100% + 8px);min-width:170px;padding:8px;background:var(--surf,#fff);border:1px solid var(--brd,#e5e7eb);border-radius:14px;box-shadow:0 18px 48px rgba(15,23,42,.18);display:none;z-index:1000}.evc-dropdown.is-open .evc-dropdown-panel{display:grid;gap:4px}.evc-dropdown-panel a,.evc-dropdown-panel button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border:0;border-radius:10px;background:transparent;color:var(--txt,#0f172a);text-decoration:none;font-weight:650;font-size:.84rem;cursor:pointer}.evc-dropdown-panel a:hover,.evc-dropdown-panel button:hover,.evc-dropdown-panel .is-active{background:var(--surf2,#f1f5f9)}.evc-dropdown-panel small{color:var(--txt-3,#94a3b8);font-weight:800}.evc-theme-menu .evc-dropdown-panel button{justify-content:flex-start}.evc-theme-menu .evc-dropdown-panel i{width:18px;color:var(--c-primary,#2563eb)}
/* Header language/theme dropdowns */
.evc-dropdown{position:relative;display:inline-flex}.evc-dropdown-panel{position:absolute;right:0;top:calc(100% + 10px);min-width:190px;padding:8px;border:1px solid var(--brd,#e5e7eb);border-radius:16px;background:var(--surf,#fff);box-shadow:0 22px 55px rgba(15,23,42,.16);z-index:1000;display:none}.evc-dropdown.is-open .evc-dropdown-panel{display:grid;gap:4px}.evc-dropdown-panel a,.evc-dropdown-panel button{display:flex;align-items:center;gap:9px;width:100%;padding:10px 11px;border:0;border-radius:12px;background:transparent;color:var(--txt,#0f172a);font:inherit;font-weight:750;text-decoration:none;text-align:left;cursor:pointer}.evc-dropdown-panel a:hover,.evc-dropdown-panel button:hover,.evc-dropdown-panel .is-active{background:var(--surf2,#f8fafc)}.evc-dropdown-panel small{margin-left:auto;color:var(--txt-3,#94a3b8);font-size:.72rem}.evc-dropdown-panel button.is-active::after{content:'✓';margin-left:auto;color:var(--c-primary,#2563eb);font-weight:900}.sitemap-file-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-top:14px}.sitemap-file-card{display:flex;align-items:center;gap:10px;border:1px solid var(--brd,#e5e7eb);border-radius:16px;background:var(--surf,#fff);padding:14px;text-decoration:none;color:var(--txt,#0f172a);font-weight:800}.sitemap-file-card i{color:var(--c-primary,#2563eb)}
/* EVCcost cleanup: mobile language/theme dropdown panels */
.mobile-dropdown-panels{position:relative;z-index:30;}
.mobile-hidden-toggle{display:none!important;}
.mobile-dropdown-panels .evc-dropdown{position:static;}
.mobile-dropdown-panels .evc-dropdown-panel{left:12px!important;right:12px!important;top:auto!important;margin-top:6px;width:auto!important;max-width:none!important;z-index:9999;}
.mobile-dropdown-panels .evc-dropdown.is-open .evc-dropdown-panel{display:block!important;opacity:1!important;visibility:visible!important;transform:translateY(0)!important;}
/* Robust dropdown visibility */
.evc-dropdown{position:relative}
.evc-dropdown-panel{display:none;position:absolute;z-index:9999}
.evc-dropdown-panel.is-open{display:block!important}
.mobile-dropdown-panels .evc-dropdown-panel{position:static;margin:8px 0 12px}
/* final requested: EV data featured links and mobile dropdown overlays */
.mega-col .mega-link-primary,
.mega-link-primary{
background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(20,184,166,.08))!important;
border:1px solid rgba(37,99,235,.18)!important;
border-radius:14px!important;
padding:13px 14px!important;
box-shadow:0 8px 22px rgba(15,23,42,.06)!important;
}
.mega-col .mega-link-primary:hover,
.mega-link-primary:hover{
background:linear-gradient(135deg,rgba(37,99,235,.13),rgba(20,184,166,.12))!important;
border-color:rgba(37,99,235,.35)!important;
transform:translateY(-1px);
}
.mega-link-primary b,.m-link-card-primary b{color:#0f172a!important;}
.mega-link-primary span span,.m-link-card-primary span span{color:#475569!important;}
html[data-theme="dark"] .mega-link-primary,
html[data-theme="dark"] .m-link-card-primary{background:linear-gradient(135deg,rgba(59,130,246,.16),rgba(45,212,191,.12))!important;border-color:rgba(96,165,250,.28)!important;}
html[data-theme="dark"] .mega-link-primary b,
html[data-theme="dark"] .m-link-card-primary b{color:#f8fafc!important;}
html[data-theme="dark"] .mega-link-primary span span,
html[data-theme="dark"] .m-link-card-primary span span{color:#cbd5e1!important;}
.mobile-dropdown-panels{position:relative!important;height:0!important;overflow:visible!important;margin:0!important;padding:0!important;}
.mobile-dropdown-panels .evc-dropdown{position:static!important;display:block!important;}
.mobile-dropdown-panels .mobile-hidden-toggle{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;}
.mobile-dropdown-panels .evc-dropdown-panel,
.mobile-dropdown-panels .evc-dropdown-panel.is-open{
position:fixed!important;
left:18px!important;
right:18px!important;
top:84px!important;
width:auto!important;
max-width:none!important;
z-index:10050!important;
margin:0!important;
padding:10px!important;
border-radius:18px!important;
box-shadow:0 24px 70px rgba(15,23,42,.24)!important;
}
.mobile-dropdown-panels .evc-dropdown-panel:not(.is-open){display:none!important;}
.mobile-dropdown-panels .evc-dropdown-panel.is-open{display:grid!important;gap:6px!important;}
@media(min-width:901px){.mobile-dropdown-panels .evc-dropdown-panel{position:absolute!important;}}
/* final: mobile language/theme must overlay, not push layout */
.mobile-dropdown-panels{position:relative!important;height:0!important;overflow:visible!important;margin:0!important;padding:0!important;z-index:5000!important;}
.mobile-dropdown-panels .evc-dropdown{position:static!important;display:block!important;}
.mobile-dropdown-panels .mobile-hidden-toggle{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;}
.mobile-dropdown-panels .evc-dropdown-panel{position:absolute!important;left:12px!important;right:12px!important;top:8px!important;margin:0!important;width:auto!important;max-width:none!important;z-index:10000!important;padding:10px!important;border:1px solid var(--line,#e5e7eb)!important;border-radius:16px!important;background:var(--surf,#fff)!important;box-shadow:0 18px 42px rgba(15,23,42,.22)!important;}
.mobile-dropdown-panels .evc-dropdown-panel:not(.is-open){display:none!important;}
.mobile-dropdown-panels .evc-dropdown-panel.is-open{display:grid!important;gap:6px!important;}
html[data-theme="dark"] .mobile-dropdown-panels .evc-dropdown-panel{background:#111827!important;border-color:#334155!important;}
/* Final cleanup: mobile language/theme menus must open as overlays, not push the menu down */
.mobile-dropdown-panels{position:relative!important;z-index:10020!important;}
.mobile-dropdown-panels .evc-dropdown{position:static!important;}
.mobile-dropdown-panels .evc-dropdown-panel{display:none;position:absolute!important;right:12px!important;left:auto!important;top:8px!important;min-width:210px!important;max-width:calc(100vw - 28px)!important;padding:8px!important;border:1px solid var(--line,#e5e7eb)!important;border-radius:16px!important;background:var(--surf,#fff)!important;box-shadow:0 18px 45px rgba(15,23,42,.18)!important;z-index:10030!important;}
.mobile-dropdown-panels .evc-dropdown-panel.is-open{display:block!important;}
.mobile-dropdown-panels .evc-dropdown-panel a,.mobile-dropdown-panels .evc-dropdown-panel button{display:flex!important;width:100%!important;align-items:center!important;gap:10px!important;padding:10px 12px!important;border:0!important;border-radius:12px!important;background:transparent!important;color:var(--txt,#0f172a)!important;text-decoration:none!important;text-align:left!important;}
.mobile-dropdown-panels .evc-dropdown-panel a:hover,.mobile-dropdown-panels .evc-dropdown-panel button:hover,.mobile-dropdown-panels .evc-dropdown-panel .is-active{background:rgba(37,99,235,.10)!important;}
/* Final cleanup: make EV Data dropdown key links more visible without looking noisy */
.mega-menu a[href*="/ev-data/specifications"],
.mega-menu a[href*="/ev-data/diagrams"],
.dropdown-menu a[href*="/ev-data/specifications"],
.dropdown-menu a[href*="/ev-data/diagrams"]{background:linear-gradient(135deg,rgba(37,99,235,.075),rgba(14,165,233,.055))!important;border:1px solid rgba(37,99,235,.13)!important;border-radius:14px!important;padding:12px 14px!important;}
.mega-menu a[href*="/ev-data/specifications"]:hover,
.mega-menu a[href*="/ev-data/diagrams"]:hover,
.dropdown-menu a[href*="/ev-data/specifications"]:hover,
.dropdown-menu a[href*="/ev-data/diagrams"]:hover{background:linear-gradient(135deg,rgba(37,99,235,.13),rgba(14,165,233,.09))!important;border-color:rgba(37,99,235,.24)!important;}
/* Final shared site rhythm: 2026-05-15 */
:root {
--evc-page-max: 1320px;
--evc-page-gutter: 32px;
--evc-page-gutter-mobile: 18px;
}
body { min-height: 100vh; display: flex; flex-direction: column; }
.page-main { width: 100%; flex: 1 0 auto; display: flex; flex-direction: column; }
.page-wrap { flex: 1 0 auto; }
.page-wrap,
.page-wrap.page-wrap-home,
.page-wrap.page-wrap-analysis,
.page-wrap.page-wrap-info,
.page-wrap.page-wrap-map,
.page-wrap.page-wrap-resource,
.page-wrap.page-wrap-tools,
.page-wrap.page-wrap-tfile,
.page-wrap.page-wrap-feature-page,
.page-wrap.page-wrap-ev-data,
.page-wrap.page-wrap-contact {
max-width: min(var(--evc-page-max), calc(100% - var(--evc-page-gutter))) !important;
width: min(var(--evc-page-max), calc(100% - var(--evc-page-gutter))) !important;
margin: 18px auto 10px !important;
padding: 0 !important;
background: transparent !important;
border-radius: 0 !important;
box-shadow: none !important;
overflow: visible !important;
}
.page-wrap.page-wrap-info .about-wrap,
.page-wrap.page-wrap-info .faq-wrap,
.page-wrap.page-wrap-info .guide-wrap,
.page-wrap.page-wrap-info .legal-wrap,
.page-wrap.page-wrap-info .terms-wrap,
.page-wrap.page-wrap-info .site-map-wrap,
.page-wrap.page-wrap-map .smap-page,
.page-wrap.page-wrap-resource .doc-hub,
.page-wrap.page-wrap-resource .pv-wrap,
.page-wrap.page-wrap-contact .contact-page {
width: 100% !important;
max-width: var(--evc-page-max) !important;
margin-left: auto !important;
margin-right: auto !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
.page-wrap.page-wrap-info .about-wrap,
.page-wrap.page-wrap-info .faq-wrap,
.page-wrap.page-wrap-info .guide-wrap,
.page-wrap.page-wrap-info .legal-wrap,
.page-wrap.page-wrap-info .terms-wrap,
.page-wrap.page-wrap-info .site-map-wrap {
padding-bottom: 56px !important;
}
.page-wrap.page-wrap-info .about-hero,
.page-wrap.page-wrap-info .faq-hero,
.page-wrap.page-wrap-info .guide-hero,
.page-wrap.page-wrap-info .lhero,
.page-wrap.page-wrap-info .thero,
.page-wrap.page-wrap-info .site-map-hero {
margin-bottom: 24px !important;
}
.page-wrap.page-wrap-info .faq-toc,
.page-wrap.page-wrap-info .guide-toc,
.page-wrap.page-wrap-info .ltoc,
.page-wrap.page-wrap-info .ttoc {
width: 100%;
}
@media (max-width: 760px) {
.page-wrap,
.page-wrap.page-wrap-home,
.page-wrap.page-wrap-analysis,
.page-wrap.page-wrap-info,
.page-wrap.page-wrap-map,
.page-wrap.page-wrap-resource,
.page-wrap.page-wrap-tools,
.page-wrap.page-wrap-tfile,
.page-wrap.page-wrap-feature-page,
.page-wrap.page-wrap-ev-data,
.page-wrap.page-wrap-contact {
max-width: min(var(--evc-page-max), calc(100% - var(--evc-page-gutter-mobile))) !important;
width: min(var(--evc-page-max), calc(100% - var(--evc-page-gutter-mobile))) !important;
margin-top: 12px !important;
}
.evc-page-hero,
.page-wrap-index .evc-page-hero,
.smap-page > .evc-page-hero,
.evc-page-hero.td-header,
.evc-page-hero.td-hero,
.doc-hub > .evc-page-hero,
.pv-wrap > .evc-page-hero {
padding: 14px !important;
gap: 12px !important;
}
.evc-page-hero-main,
.page-wrap-index .evc-page-hero-main,
.smap-page > .evc-page-hero .evc-page-hero-main {
flex: 1 1 100% !important;
align-items: flex-start;
}
.evc-page-hero-stats,
.page-wrap-index .evc-page-hero-stats,
.smap-page > .evc-page-hero .evc-page-hero-stats {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr));
width: 100%;
gap: 6px !important;
}
.evc-page-hero-stat,
.page-wrap-index .evc-page-hero-stat,
.smap-page > .evc-page-hero .evc-page-hero-stat {
min-width: 0 !important;
padding: 7px 5px !important;
overflow: hidden;
}
.evc-page-hero-stat strong,
.evc-page-hero-stat span {
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
@media (max-width: 420px) {
.evc-page-hero-stats,
.page-wrap-index .evc-page-hero-stats,
.smap-page > .evc-page-hero .evc-page-hero-stats {
gap: 5px !important;
}
.evc-page-hero-stat strong { font-size: 1rem; }
.evc-page-hero-stat span { font-size: .58rem; }
}
/* Shared announcement bars: 2026-05-15 */
.evc-site-banner{padding:8px 20px;text-align:center;font-size:.82rem;font-weight:600;z-index:200;position:relative;display:flex;align-items:center;justify-content:center;gap:8px;}
.evc-site-banner--info{background:#1e40af;color:#bfdbfe;border-bottom:1px solid #1d4ed8;}
.evc-site-banner--warning{background:#92400e;color:#fcd34d;border-bottom:1px solid #b45309;}
.evc-site-banner--success{background:#065f46;color:#6ee7b7;border-bottom:1px solid #047857;}
.evc-site-banner--danger{background:#7f1d1d;color:#fca5a5;border-bottom:1px solid #991b1b;}
.evc-price-note{background:#fef9ec;border-bottom:1px solid #fde68a;padding:6px 20px;text-align:center;font-size:.78rem;color:#92400e;display:flex;align-items:center;justify-content:center;gap:6px;}
@media(max-width:640px){.evc-site-banner,.evc-price-note{padding-left:14px;padding-right:14px;line-height:1.45;}}
/* Final 2026-05-15 mobile menu color system */
.m-category-ev,
.m-sub-ev { --m-group-color: #0f766e; --m-group-soft: rgba(15, 118, 110, .13); --m-group-hero: linear-gradient(135deg, #063c35, #0f766e 62%, #22c55e); }
.m-category-tools,
.m-sub-tools { --m-group-color: #7f1d1d; --m-group-soft: rgba(127, 29, 29, .14); --m-group-hero: linear-gradient(135deg, #2b0b12, #7f1d1d 62%, #be123c); }
.m-category-docs,
.m-sub-docs { --m-group-color: #d97706; --m-group-soft: rgba(217, 119, 6, .14); --m-group-hero: linear-gradient(135deg, #3f2604, #92400e 62%, #f59e0b); }
.m-category-activity,
.m-sub-activity,
.m-category-play,
.m-sub-play { --m-group-color: #7c3aed; --m-group-soft: rgba(124, 58, 237, .13); --m-group-hero: linear-gradient(135deg, #1e1b4b, #4c1d95 62%, #7c3aed); }
.m-category {
border-left-color: var(--m-group-color, var(--nav-blue)) !important;
background: linear-gradient(135deg, var(--m-group-soft, rgba(37,99,235,.10)), rgba(255,255,255,.80)) !important;
}
.m-category-main {
display: flex !important;
align-items: center !important;
min-width: 0 !important;
gap: 12px !important;
}
.m-category-icon {
display: inline-grid !important;
place-items: center !important;
flex: 0 0 42px !important;
width: 42px !important;
height: 42px !important;
margin: 0 !important;
border-radius: 14px !important;
background: var(--m-group-color, #2563eb) !important;
color: #fff !important;
}
.m-category-icon i {
color: #fff !important;
font-size: 17px !important;
}
.m-category-copy {
min-width: 0 !important;
display: block !important;
}
.m-category-copy b,
.m-category-copy span {
overflow-wrap: anywhere;
}
.m-sub-view .m-feature-card {
background: var(--m-group-hero, linear-gradient(135deg,#08213f,#164e88 62%,#0e7490)) !important;
}
.m-sub-view .m-link-card {
border-left-color: var(--m-group-color, #2563eb) !important;
}
.m-link-card-primary {
grid-template-columns: 42px minmax(0, 1fr) !important;
border-left-color: var(--m-group-color, #2563eb) !important;
}
.m-link-icon {
display: inline-grid !important;
place-items: center !important;
width: 38px !important;
height: 38px !important;
border-radius: 12px !important;
background: var(--m-group-color, #2563eb) !important;
color: #fff !important;
}
.m-link-icon i {
color: #fff !important;
}
.m-link-copy {
min-width: 0 !important;
}
.m-link-copy b,
.m-link-copy span {
overflow-wrap: anywhere;
}
html[data-theme="dark"] .m-category {
background: linear-gradient(135deg, color-mix(in srgb, var(--m-group-color, #2563eb) 24%, transparent), rgba(255,255,255,.03)) !important;
}
/* Final 2026-05-15 header icon dropdown pwa tightening */
.evc-theme-icon-light,
[data-evc-theme-choice="light"] .fa-sun,
[data-theme-choice="light"] .fa-sun {
color: #f59e0b !important;
}
.evc-theme-icon-dark,
[data-evc-theme-choice="dark"] .fa-moon,
[data-theme-choice="dark"] .fa-moon {
color: #1e3a8a !important;
}
.evc-theme-icon-system-light,
[data-evc-theme-choice="system"] .fa-desktop,
[data-theme-choice="system"] .fa-desktop {
color: #f59e0b !important;
}
.evc-theme-icon-system-dark {
color: #1e3a8a !important;
}
html[data-theme="dark"] .evc-theme-icon-dark,
html[data-theme="dark"] .evc-theme-icon-system-dark,
html[data-theme="dark"] [data-evc-theme-choice="dark"] .fa-moon,
html[data-theme="dark"] [data-theme-choice="dark"] .fa-moon {
color: #1e3a8a !important;
}
.evc-dropdown-panel,
.mobile-dropdown-panels .evc-dropdown-panel {
overflow: hidden !important;
padding: 6px !important;
gap: 4px !important;
box-sizing: border-box !important;
isolation: isolate !important;
}
.evc-dropdown.is-open .evc-dropdown-panel,
.evc-dropdown-panel.is-open,
.mobile-dropdown-panels .evc-dropdown-panel.is-open {
display: grid !important;
}
.evc-dropdown-panel a,
.evc-dropdown-panel button,
.mobile-dropdown-panels .evc-dropdown-panel a,
.mobile-dropdown-panels .evc-dropdown-panel button {
position: relative !important;
min-height: 36px !important;
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
padding: 8px 10px !important;
border-radius: 9px !important;
overflow: hidden !important;
background: transparent !important;
background-clip: padding-box !important;
box-sizing: border-box !important;
line-height: 1.2 !important;
}
.evc-dropdown-panel a:hover,
.evc-dropdown-panel button:hover,
.evc-dropdown-panel .is-active,
.mobile-dropdown-panels .evc-dropdown-panel a:hover,
.mobile-dropdown-panels .evc-dropdown-panel button:hover,
.mobile-dropdown-panels .evc-dropdown-panel .is-active {
background: rgba(37, 99, 235, .10) !important;
box-shadow: inset 0 0 0 1px rgba(37, 99, 235, .10) !important;
}
.m-category-tools,
.m-sub-tools {
--m-group-color: #7f1d1d !important;
--m-group-soft: rgba(127, 29, 29, .14) !important;
--m-group-hero: linear-gradient(135deg, #2b0b12, #7f1d1d 62%, #be123c) !important;
}
.m-category-tools .m-category-icon,
.m-sub-tools .m-link-icon {
background: #7f1d1d !important;
}
.m-category-tools,
.m-sub-tools .m-link-card,
.m-sub-tools .m-link-card-primary {
border-left-color: #7f1d1d !important;
}
.pwa-only,
.mobile-top-actions .pwa-only,
.pwa-control.pwa-only {
display: none !important;
}
html.is-pwa .pwa-only,
html.is-pwa-shell .pwa-only,
html.is-pwa .mobile-top-actions .pwa-only,
html.is-pwa-shell .mobile-top-actions .pwa-only,
html.is-pwa .pwa-control.pwa-only,
html.is-pwa-shell .pwa-control.pwa-only {
display: inline-flex !important;
}
html.is-pwa .browser-only,
html.is-pwa-shell .browser-only,
html.is-pwa .mobile-top-actions .browser-only,
html.is-pwa-shell .mobile-top-actions .browser-only,
html.is-pwa .pwa-control.browser-only,
html.is-pwa-shell .pwa-control.browser-only,
[data-pwa-install][data-pwa-state="hidden"] {
display: none !important;
}
html.is-browser .browser-only,
html.is-browser .mobile-top-actions .browser-only,
html.is-browser .pwa-control.browser-only,
html:not(.is-pwa):not(.is-pwa-shell) .browser-only {
display: inline-flex !important;
}
@media (display-mode: standalone) {
.browser-only,
.mobile-top-actions .browser-only,
.pwa-control.browser-only {
display: none !important;
}
.pwa-only,
.mobile-top-actions .pwa-only,
.pwa-control.pwa-only {
display: inline-flex !important;
}
}
/* Final 2026-05-15 theme system menu dark polish */
html[data-theme="dark"] [data-evc-theme-choice="system"] .fa-desktop,
html[data-theme="dark"] [data-theme-choice="system"] .fa-desktop {
color: #1e3a8a !important;
}
[data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-theme-icon].fa-desktop.evc-theme-icon-system-light {
color: #f59e0b !important;
}
html[data-theme="dark"] [data-evc-theme-icon].evc-theme-icon-system-dark,
html[data-theme="dark"] [data-evc-theme-icon].fa-desktop.evc-theme-icon-system-dark {
color: #1e3a8a !important;
}
/* Final 2026-05-15 theme icon id override */
#themeIcon.evc-theme-icon-light,
#themeIconMob.evc-theme-icon-light,
[data-evc-theme-icon].evc-theme-icon-light {
color: #f59e0b !important;
}
#themeIcon.evc-theme-icon-dark,
#themeIconMob.evc-theme-icon-dark,
[data-evc-theme-icon].evc-theme-icon-dark {
color: #1e3a8a !important;
}
#themeIcon.evc-theme-icon-system-light,
#themeIconMob.evc-theme-icon-system-light,
[data-evc-theme-icon].evc-theme-icon-system-light {
color: #f59e0b !important;
}
#themeIcon.evc-theme-icon-system-dark,
#themeIconMob.evc-theme-icon-system-dark,
[data-evc-theme-icon].evc-theme-icon-system-dark {
color: #1e3a8a !important;
}
html[data-theme="dark"] #themeIcon.evc-theme-icon-dark,
html[data-theme="dark"] #themeIconMob.evc-theme-icon-dark,
html[data-theme="dark"] [data-evc-theme-icon].evc-theme-icon-dark,
html[data-theme="dark"] #themeIcon.evc-theme-icon-system-dark,
html[data-theme="dark"] #themeIconMob.evc-theme-icon-system-dark,
html[data-theme="dark"] [data-evc-theme-icon].evc-theme-icon-system-dark {
color: #1e3a8a !important;
}
/* Final 2026-05-15 theme trigger blue and footer slimmer */
#themeIcon[data-evc-theme-icon],
#themeIconMob[data-evc-theme-icon],
[data-evc-menu-toggle="theme"] [data-evc-theme-icon],
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon],
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon] {
color: #2563eb !important;
}
html[data-theme="dark"] #themeIcon[data-evc-theme-icon],
html[data-theme="dark"] #themeIconMob[data-evc-theme-icon],
html[data-theme="dark"] [data-evc-menu-toggle="theme"] [data-evc-theme-icon],
html[data-theme="dark"] [data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon],
html[data-theme="dark"] [data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon] {
color: #3b82f6 !important;
}
.footer-tool {
height: 28px !important;
min-height: 28px !important;
padding: 3px 8px !important;
border-radius: 9px !important;
gap: 5px !important;
font-size: .74rem !important;
}
.footer-tool i {
font-size: 11px !important;
}
@media (max-width: 720px) {
.footer-tool {
width: 32px !important;
min-width: 32px !important;
height: 28px !important;
min-height: 28px !important;
padding: 0 !important;
}
}
/* Final 2026-05-15 theme mode color and footer alignment */
#themeIcon.evc-theme-icon-light,
#themeIconMob.evc-theme-icon-light,
[data-evc-menu-toggle="theme"] [data-evc-theme-icon].evc-theme-icon-light,
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon].evc-theme-icon-light,
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon].evc-theme-icon-light,
[data-evc-theme-icon].evc-theme-icon-light {
color: #f59e0b !important;
}
#themeIcon.evc-theme-icon-dark,
#themeIconMob.evc-theme-icon-dark,
#themeIcon.evc-theme-icon-system-light,
#themeIconMob.evc-theme-icon-system-light,
#themeIcon.evc-theme-icon-system-dark,
#themeIconMob.evc-theme-icon-system-dark,
[data-evc-menu-toggle="theme"] [data-evc-theme-icon].evc-theme-icon-dark,
[data-evc-menu-toggle="theme"] [data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-menu-toggle="theme"] [data-evc-theme-icon].evc-theme-icon-system-dark,
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon].evc-theme-icon-dark,
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon].evc-theme-icon-system-dark,
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon].evc-theme-icon-dark,
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon].evc-theme-icon-system-dark,
[data-evc-theme-icon].evc-theme-icon-dark,
[data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-theme-icon].evc-theme-icon-system-dark {
color: #2563eb !important;
}
html[data-theme="dark"] #themeIcon.evc-theme-icon-dark,
html[data-theme="dark"] #themeIconMob.evc-theme-icon-dark,
html[data-theme="dark"] #themeIcon.evc-theme-icon-system-dark,
html[data-theme="dark"] #themeIconMob.evc-theme-icon-system-dark,
html[data-theme="dark"] [data-evc-theme-icon].evc-theme-icon-dark,
html[data-theme="dark"] [data-evc-theme-icon].evc-theme-icon-system-dark {
color: #3b82f6 !important;
}
.footer-tool {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 6px !important;
line-height: 1 !important;
vertical-align: middle !important;
}
.footer-tool i {
display: inline-grid !important;
place-items: center !important;
flex: 0 0 14px !important;
width: 14px !important;
height: 14px !important;
line-height: 1 !important;
margin: 0 !important;
}
.footer-tool-label {
display: inline-flex !important;
align-items: center !important;
line-height: 1 !important;
}
/* Final 2026-05-15 system monitor follows resolved theme */
#themeIcon.evc-theme-icon-system-light,
#themeIconMob.evc-theme-icon-system-light,
[data-evc-menu-toggle="theme"] [data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon].evc-theme-icon-system-light,
[data-evc-theme-icon].evc-theme-icon-system-light {
color: #f59e0b !important;
}
#themeIcon.evc-theme-icon-system-dark,
#themeIconMob.evc-theme-icon-system-dark,
[data-evc-menu-toggle="theme"] [data-evc-theme-icon].evc-theme-icon-system-dark,
[data-evc-menu-toggle="mobile-theme"] [data-evc-theme-icon].evc-theme-icon-system-dark,
[data-evc-menu-toggle="footer-theme"] [data-evc-theme-icon].evc-theme-icon-system-dark,
[data-evc-theme-icon].evc-theme-icon-system-dark {
color: #2563eb !important;
}
html[data-theme="dark"] #themeIcon.evc-theme-icon-system-dark,
html[data-theme="dark"] #themeIconMob.evc-theme-icon-system-dark,
html[data-theme="dark"] [data-evc-theme-icon].evc-theme-icon-system-dark {
color: #3b82f6 !important;
}
/* Final 2026-05-15 compact language/theme panels */
[data-evc-menu-panel="lang"],
[data-evc-menu-panel="mobile-lang"],
[data-evc-menu-panel="footer-lang"] {
width: min(248px, calc(100vw - 28px)) !important;
min-width: 0 !important;
max-width: min(248px, calc(100vw - 28px)) !important;
max-height: 262px !important;
overflow-y: auto !important;
overflow-x: hidden !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 6px !important;
padding: 8px !important;
scrollbar-width: thin;
}
.evc-dropdown.is-open [data-evc-menu-panel="lang"],
[data-evc-menu-panel="lang"].is-open,
[data-evc-menu-panel="mobile-lang"].is-open,
[data-evc-menu-panel="footer-lang"].is-open {
display: grid !important;
}
[data-evc-menu-panel="lang"] a,
[data-evc-menu-panel="mobile-lang"] a,
[data-evc-menu-panel="footer-lang"] a {
min-height: 34px !important;
padding: 7px 8px !important;
border-radius: 10px !important;
gap: 6px !important;
justify-content: space-between !important;
line-height: 1.05 !important;
white-space: nowrap !important;
}
[data-evc-menu-panel="lang"] a small,
[data-evc-menu-panel="mobile-lang"] a small,
[data-evc-menu-panel="footer-lang"] a small {
margin-left: 4px !important;
font-size: 10px !important;
line-height: 1 !important;
}
[data-evc-menu-panel="theme"],
[data-evc-menu-panel="mobile-theme"],
[data-evc-menu-panel="footer-theme"] {
width: max-content !important;
min-width: 144px !important;
max-width: min(184px, calc(100vw - 28px)) !important;
max-height: none !important;
padding: 7px !important;
overflow: visible !important;
}
[data-evc-menu-panel="theme"] button,
[data-evc-menu-panel="mobile-theme"] button,
[data-evc-menu-panel="footer-theme"] button {
min-height: 34px !important;
padding: 7px 9px !important;
border-radius: 10px !important;
line-height: 1.05 !important;
white-space: nowrap !important;
}
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"] {
right: 10px !important;
left: auto !important;
top: 8px !important;
}
@media (max-width: 480px) {
[data-evc-menu-panel="lang"],
[data-evc-menu-panel="mobile-lang"],
[data-evc-menu-panel="footer-lang"] {
width: min(236px, calc(100vw - 24px)) !important;
max-width: min(236px, calc(100vw - 24px)) !important;
max-height: 224px !important;
}
}
/* Final 2026-05-15 mobile dropdown quick action clearance */
@media (max-width: 640px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel] {
position: fixed !important;
top: 166px !important;
right: 12px !important;
left: auto !important;
}
}
/* Final 2026-05-15 mobile notification quick action clearance */
@media (max-width: 640px) {
body.evc-mobile-menu-open .evc-notify-panel {
top: 146px !important;
max-height: calc(100dvh - 166px) !important;
}
}
/* Final 2026-05-15 mobile dropdown compact fixed sizing */
@media (max-width: 640px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open {
width: min(248px, calc(100vw - 24px)) !important;
min-width: 0 !important;
max-width: min(248px, calc(100vw - 24px)) !important;
box-sizing: border-box !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open a {
min-width: 0 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"].is-open {
width: max-content !important;
min-width: 144px !important;
max-width: min(184px, calc(100vw - 24px)) !important;
}
}
/* Final 2026-05-15 language code alignment and footer optical baseline */
[data-evc-menu-panel="lang"] a,
[data-evc-menu-panel="mobile-lang"] a,
[data-evc-menu-panel="footer-lang"] a {
display: grid !important;
grid-template-columns: minmax(0, 1fr) auto !important;
align-items: center !important;
justify-content: initial !important;
direction: ltr !important;
text-align: left !important;
column-gap: 8px !important;
}
[data-evc-menu-panel="lang"] a .evc-lang-name,
[data-evc-menu-panel="mobile-lang"] a .evc-lang-name,
[data-evc-menu-panel="footer-lang"] a .evc-lang-name {
min-width: 0 !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
[data-evc-menu-panel="lang"] a .evc-lang-name[dir="rtl"],
[data-evc-menu-panel="mobile-lang"] a .evc-lang-name[dir="rtl"],
[data-evc-menu-panel="footer-lang"] a .evc-lang-name[dir="rtl"] {
direction: rtl !important;
text-align: right !important;
}
[data-evc-menu-panel="lang"] a small,
[data-evc-menu-panel="mobile-lang"] a small,
[data-evc-menu-panel="footer-lang"] a small {
justify-self: end !important;
margin-left: 0 !important;
min-width: 20px !important;
text-align: right !important;
}
.footer-tool {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 7px !important;
height: 32px !important;
min-height: 32px !important;
padding: 0 11px !important;
line-height: 1 !important;
}
.footer-tool i {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 14px !important;
height: 14px !important;
flex: 0 0 14px !important;
line-height: 14px !important;
margin: 0 !important;
position: relative !important;
top: 0 !important;
}
.footer-tool-label {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
height: 14px !important;
line-height: 14px !important;
margin: 0 !important;
padding: 0 !important;
position: relative !important;
top: 0 !important;
transform: none !important;
}
@media (max-width: 720px) {
.footer-tool {
width: auto !important;
min-width: 58px !important;
height: 32px !important;
min-height: 32px !important;
padding: 0 10px !important;
}
}
/* Final 2026-05-15 mobile dropdown viewport fit */
@media (max-width: 720px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel].is-open {
position: fixed !important;
left: 50% !important;
right: auto !important;
top: clamp(126px, 24dvh, 176px) !important;
transform: translateX(-50%) !important;
z-index: 10050 !important;
max-height: min(58dvh, calc(100dvh - 142px)) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
overscroll-behavior: contain !important;
-webkit-overflow-scrolling: touch !important;
box-sizing: border-box !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open {
width: min(360px, calc(100vw - 18px)) !important;
max-width: min(360px, calc(100vw - 18px)) !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 7px !important;
padding: 10px !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open a {
min-width: 0 !important;
min-height: 36px !important;
padding: 8px 9px !important;
font-size: .9rem !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"].is-open {
width: min(184px, calc(100vw - 18px)) !important;
max-width: min(184px, calc(100vw - 18px)) !important;
min-width: 152px !important;
}
}
@media (max-width: 360px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open {
width: calc(100vw - 14px) !important;
max-width: calc(100vw - 14px) !important;
gap: 5px !important;
padding: 8px !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open a {
padding: 7px 7px !important;
font-size: .84rem !important;
}
}
@media (max-height: 560px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel].is-open {
top: 104px !important;
max-height: calc(100dvh - 116px) !important;
}
}
/* Final 2026-05-15 mobile dropdown stable placement */
@media (max-width: 720px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel].is-open {
top: 178px !important;
left: 50% !important;
right: auto !important;
transform: translateX(-50%) !important;
max-height: calc(100dvh - 190px) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open a,
[data-evc-menu-panel="lang"] a,
[data-evc-menu-panel="mobile-lang"] a,
[data-evc-menu-panel="footer-lang"] a {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
direction: ltr !important;
text-align: left !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open a .evc-lang-name,
[data-evc-menu-panel="lang"] a .evc-lang-name,
[data-evc-menu-panel="mobile-lang"] a .evc-lang-name,
[data-evc-menu-panel="footer-lang"] a .evc-lang-name {
flex: 1 1 auto !important;
min-width: 0 !important;
}
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open a small,
[data-evc-menu-panel="lang"] a small,
[data-evc-menu-panel="mobile-lang"] a small,
[data-evc-menu-panel="footer-lang"] a small {
margin-left: auto !important;
flex: 0 0 22px !important;
width: 22px !important;
min-width: 22px !important;
text-align: right !important;
justify-self: auto !important;
}
}
@media (max-width: 720px) and (max-height: 430px) {
body.evc-mobile-menu-open .mobile-dropdown-panels [data-evc-menu-panel].is-open {
top: 94px !important;
max-height: calc(100dvh - 106px) !important;
}
}
/* EVCFIX: language/theme dropdown scroll safety for small browser heights */
.evc-lang-menu .evc-dropdown-panel,
.evc-theme-menu .evc-dropdown-panel,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"]{
max-height:min(420px,calc(100vh - 120px))!important;
overflow-y:auto!important;
overflow-x:hidden!important;
-webkit-overflow-scrolling:touch!important;
overscroll-behavior:contain!important;
}
.evc-lang-menu .evc-dropdown-panel a,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"] a{
min-width:0!important;
}
.evc-lang-menu .evc-lang-name,
.mobile-dropdown-panels .evc-lang-name{
min-width:0!important;
overflow:hidden!important;
text-overflow:ellipsis!important;
white-space:nowrap!important;
}
@media(max-height:560px){
.evc-lang-menu .evc-dropdown-panel,
.evc-theme-menu .evc-dropdown-panel,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"]{
max-height:calc(100vh - 86px)!important;
}
}
/* EVC i18n fix: language panels scroll safely on small browser heights */
.evc-lang-menu .evc-dropdown-panel,
.evc-mobile-lang-menu .evc-dropdown-panel,
.footer-lang-menu .evc-dropdown-panel{
max-height:min(72vh, 420px) !important;
overflow-y:auto !important;
overscroll-behavior:contain;
scrollbar-width:thin;
}
.evc-lang-menu .evc-dropdown-panel{width:min(92vw, 320px) !important;}
.evc-mobile-lang-menu .evc-dropdown-panel{width:min(92vw, 360px) !important;}
.footer-lang-menu .evc-dropdown-panel{width:min(92vw, 320px) !important;}
@media (max-height:560px){
.evc-lang-menu .evc-dropdown-panel,
.evc-mobile-lang-menu .evc-dropdown-panel,
.footer-lang-menu .evc-dropdown-panel{max-height:calc(100vh - 92px) !important;}
}
/* EVC final i18n dropdown fix: 12+ languages must never be clipped */
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"]{
max-height: min(70dvh, 440px) !important;
overflow-y: auto !important;
overflow-x: hidden !important;
-webkit-overflow-scrolling: touch !important;
overscroll-behavior: contain !important;
scrollbar-width: thin !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"]{
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 4px 10px !important;
width: min(94vw, 360px) !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"] a,
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"] a,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"] a{
min-width: 0 !important;
}
@media (max-height: 560px){
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"]{
max-height: calc(100dvh - 76px) !important;
}
}
/* EVC DEEPFIX 2026-05-15: language/theme panels must stay closed until JS adds .is-open */
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"]{
display:none !important;
max-height:min(70dvh, 440px) !important;
overflow-y:auto !important;
overflow-x:hidden !important;
-webkit-overflow-scrolling:touch !important;
overscroll-behavior:contain !important;
scrollbar-width:thin !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"].is-open,
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"].is-open,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open{
display:grid !important;
grid-template-columns:repeat(2, minmax(0,1fr)) !important;
gap:4px 10px !important;
width:min(94vw, 360px) !important;
}
@media (max-height:560px){
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"]{max-height:calc(100dvh - 76px) !important;}
}
/* EVC COMPACT UI 2026-05-15: smaller language/theme dropdowns */
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"]{
display:none !important;
width:min(88vw, 278px) !important;
min-width:220px !important;
max-height:min(58dvh, 320px) !important;
padding:7px !important;
border-radius:13px !important;
overflow-y:auto !important;
overflow-x:hidden !important;
scrollbar-width:thin !important;
box-shadow:0 14px 34px rgba(15,23,42,.16) !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"].is-open,
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"].is-open,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:3px 5px !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"] a,
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"] a,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"] a{
min-height:30px !important;
padding:6px 7px !important;
border-radius:9px !important;
gap:5px !important;
font-size:12px !important;
line-height:1.15 !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"] .evc-lang-name,
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"] .evc-lang-name,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"] .evc-lang-name{
min-width:0 !important;
max-width:100% !important;
overflow:hidden !important;
text-overflow:ellipsis !important;
white-space:nowrap !important;
font-weight:700 !important;
}
.evc-dropdown-panel[data-evc-menu-panel="lang"] small,
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"] small,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"] small{
margin-left:auto !important;
flex:0 0 auto !important;
font-size:9.5px !important;
opacity:.62 !important;
letter-spacing:.02em !important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"],
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"]{
display:none !important;
width:168px !important;
min-width:168px !important;
max-height:min(54dvh, 220px) !important;
padding:6px !important;
border-radius:13px !important;
overflow-y:auto !important;
overflow-x:hidden !important;
box-shadow:0 14px 34px rgba(15,23,42,.16) !important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"].is-open,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"].is-open,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"].is-open{
display:block !important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] button,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button{
min-height:30px !important;
padding:6px 8px !important;
border-radius:9px !important;
gap:7px !important;
font-size:12px !important;
line-height:1.15 !important;
font-weight:700 !important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] i,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] i,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] i{
width:14px !important;
font-size:12px !important;
text-align:center !important;
}
@media(max-width:720px){
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"].is-open{width:min(92vw, 300px) !important;right:8px !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"].is-open{width:178px !important;right:8px !important;}
}
@media(max-height:560px){
.evc-dropdown-panel[data-evc-menu-panel="lang"],
.evc-dropdown-panel[data-evc-menu-panel="footer-lang"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-lang"]{max-height:calc(100dvh - 92px) !important;}
.evc-dropdown-panel[data-evc-menu-panel="theme"],
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"]{max-height:calc(100dvh - 92px) !important;}
}
/* EVC FINAL COMPACT DROPDOWN FIX */
.evc-dropdown-panel[data-evc-menu-panel],.mobile-dropdown-panels [data-evc-menu-panel]{display:none!important;max-height:min(62dvh,360px)!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;scrollbar-width:thin!important;}
.evc-dropdown-panel[data-evc-menu-panel].is-open,.mobile-dropdown-panels [data-evc-menu-panel].is-open{display:grid!important;}
.evc-dropdown-panel[data-evc-menu-panel] a,.mobile-dropdown-panels [data-evc-menu-panel] a,.evc-dropdown-panel[data-evc-menu-panel] button,.mobile-dropdown-panels [data-evc-menu-panel] button{min-height:30px!important;padding:6px 8px!important;font-size:.78rem!important;line-height:1.15!important;}
.evc-dropdown-panel[data-evc-menu-panel] small,.mobile-dropdown-panels [data-evc-menu-panel] small{font-size:.62rem!important;}
@media (max-height:560px){.evc-dropdown-panel[data-evc-menu-panel],.mobile-dropdown-panels [data-evc-menu-panel]{max-height:calc(100dvh - 86px)!important;}}
/* EVC DROPDOWN ALIGNMENT: keep theme labels left and check marks right */
.evc-dropdown-panel[data-evc-menu-panel="theme"].is-open,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"].is-open,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"].is-open{
display:grid!important;
gap:3px!important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] button,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button{
display:flex!important;
align-items:center!important;
justify-content:flex-start!important;
gap:8px!important;
width:100%!important;
box-sizing:border-box!important;
text-align:left!important;
white-space:nowrap!important;
overflow:hidden!important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] button i,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button i,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button i{
flex:0 0 18px!important;
width:18px!important;
margin:0!important;
text-align:center!important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] button::after,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button::after,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button::after{
content:""!important;
flex:0 0 14px!important;
margin-left:auto!important;
color:var(--c-primary,#2563eb)!important;
font-size:13px!important;
font-weight:900!important;
line-height:1!important;
text-align:right!important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] button.is-active::after,
.evc-dropdown-panel[data-evc-menu-panel="theme"] button[aria-pressed="true"]::after,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button.is-active::after,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button[aria-pressed="true"]::after,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button.is-active::after,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button[aria-pressed="true"]::after{
content:"\2713"!important;
}
.evc-dropdown-panel[data-evc-menu-panel="theme"] button.is-active,
.evc-dropdown-panel[data-evc-menu-panel="theme"] button[aria-pressed="true"],
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button.is-active,
.evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button[aria-pressed="true"],
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button.is-active,
.mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button[aria-pressed="true"]{
background:rgba(37,99,235,.10)!important;
color:var(--txt,#0f172a)!important;
}
html[data-theme="dark"] .evc-dropdown-panel[data-evc-menu-panel="theme"] button.is-active,
html[data-theme="dark"] .evc-dropdown-panel[data-evc-menu-panel="theme"] button[aria-pressed="true"],
html[data-theme="dark"] .evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button.is-active,
html[data-theme="dark"] .evc-dropdown-panel[data-evc-menu-panel="footer-theme"] button[aria-pressed="true"],
html[data-theme="dark"] .mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button.is-active,
html[data-theme="dark"] .mobile-dropdown-panels [data-evc-menu-panel="mobile-theme"] button[aria-pressed="true"]{
background:rgba(96,165,250,.16)!important;
color:var(--txt,#e5eefb)!important;
}
[data-evc-menu-panel="lang"] a .evc-lang-name[dir="rtl"],
[data-evc-menu-panel="mobile-lang"] a .evc-lang-name[dir="rtl"],
[data-evc-menu-panel="footer-lang"] a .evc-lang-name[dir="rtl"]{
direction:rtl!important;
text-align:left!important;
justify-self:start!important;
unicode-bidi:isolate!important;
}
/* RTL header actions sit on the left side of the flex row. Open their panels inward. */
html[dir="rtl"] .site-header .header-actions .evc-lang-menu > [data-evc-menu-panel="lang"],
html[dir="rtl"] .site-header .header-actions .evc-theme-menu > [data-evc-menu-panel="theme"]{
left:0!important;
right:auto!important;
}