MediaWiki:Common.css: Difference between revisions

Revision as of 08:23, 5 September 2025

/* === OPTIMALIZOVANÉ CSS PRE MEDIAWIKI CYBERPUNK WIKI === */

/* === CSS PREMENNÉ === */
:root {
  /* Základné farby */
  --bg-primary: #0a0a0a;
  --bg-secondary: #111111;
  --bg-tertiary: #1a1a1a;
  --text-primary: #ffffff;
  --text-secondary: #e0e0e0;
  --text-muted: #cfcfcf;
  
  /* Cyberpunk farby */
  --accent-yellow: #FCEE0A;
  --accent-cyan: #29FFFF;
  --link-color: #39d1ff;
  --link-visited: #a0a0ff;
  --border-color: #2b2b2b;
  
  /* Grafické assets */
  --h2-bg-image: url("/mediawiki/images/d/df/CP2077_header_bottom.svg");
  --main-box: url("/mediawiki/images/0/0e/Cyberpunk_2077_yellow_box.svg");
  --main-box-alt: url("/mediawiki/images/0/00/Cyberpunk_2077_dark_gray_box.svg");
  --infobox-bg: url("/mediawiki/images/e/e6/Cyberpunk_2077_vertical_edge.svg");
}

/* === FONT FACES === */
@font-face {
  font-family: "Rajdhani";
  font-weight: 400;
  font-display: swap;
  src: url('wiki/Special:FilePath/Rajdhani-Regular.ttf') format("opentype");
}

@font-face {
  font-family: "Orbitron";
  font-weight: 400;
  font-display: swap;
  src: url('wiki/Special:FilePath/Orbitron.ttf') format("opentype");
}

@font-face {
  font-family: "BlenderProBook";
  font-weight: 400;
  font-display: swap;
  src: url('wiki/Special:FilePath/BlenderPro-Book.ttf') format("opentype");
}

@font-face {
  font-family: "BlenderProBold";
  font-weight: 700;
  font-display: swap;
  src: url('wiki/Special:FilePath/BlenderPro-Bold.ttf') format("opentype");
}

/* === IMPORTS === */
@import url("/mediawiki/index.php?title=MediaWiki:CustomNavigation.css&action=raw&ctype=text/css");
@import url("/mediawiki/index.php?title=MediaWiki:CustomTables.css&action=raw&ctype=text/css");
@import url("/mediawiki/index.php?title=MediaWiki:CustomTemplates.css&action=raw&ctype=text/css");
@import url("/mediawiki/index.php?title=MediaWiki:Netpages2077.css&action=raw&ctype=text/css");

/* === ZÁKLADNÉ ŠTÝLY === */
html, body {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

.mw-body, .mw-body-content, #content {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding-left: 15px !important;
  box-shadow: 0 0 0 1px #222, 0 10px 40px rgba(0,0,0,.4);
}

/* === NAVIGÁCIA A PANELY === */
#mw-head, #left-navigation, #right-navigation, 
#mw-page-base, #mw-head-base, #mw-navigation, 
.vector-sticky-header {
  background: var(--bg-primary) !important;
  border-color: #222 !important;
}

#mw-panel, #mw-panel .portal, #mw-panel .portal .body,
#p-logo, #p-logo a {
  background: var(--bg-secondary) !important;
  color: var(--text-muted) !important;
}

/* === ODKAZY === */
a {
  color: var(--link-color) !important;
  text-decoration: none;
  transition: color .16s ease;
}

a:visited { color: var(--link-visited) !important; }

.mw-body-content a:hover, .mw-body-content a:focus {
  color: var(--accent-yellow) !important;
}

/* === NADPISY === */
h1, h2, h3, h4, h5, h6 {
  color: var(--accent-yellow) !important;
  border-bottom: 1px solid #333 !important;
  font-family: BlenderProBold, sans-serif;
}

.firstHeading {
  background: 
    var(--hero-image, url(/mediawiki/images/e/e6/Site-logo.png)) left center / 120px auto no-repeat,
    linear-gradient(90deg, var(--bg-primary) 0%, #171717 60%, var(--bg-tertiary) 100%);
  padding-left: 140px;
  margin: .25rem 0 1.0rem 0 !important;
  border-left: 4px solid var(--accent-yellow);
}

.page-content h2:not(.all-maps__empty-title), .pi-header {
  background-image: var(--h2-bg-image);
  background-repeat: no-repeat;
  background-position: 25% 105%;
  background-size: 100% 10px;
  line-height: 1.2;
  color: var(--accent-cyan);
  border-bottom: none;
  overflow: auto;
}

/* === TOC === */
#toc, .toc {
  background: var(--bg-secondary) !important;
  border: 1px solid var(--accent-yellow) !important;
  border-radius: 4px;
  padding: .6rem .8rem !important;
}

.tocnumber { color: var(--accent-yellow) !important; }

#toc ul li:hover, .toc ul li:hover {
  background: rgba(255,204,0,.06);
  border-left: 1px solid var(--accent-yellow);
  transition: all .12s ease;
}

/* === PORTABLE INFOBOXES === */
.portable-infobox {
  position: relative;
  margin-right: 5px;
  margin-left: 15px !important;
  border: 1px solid var(--accent-yellow);
  border-radius: 10px 0px 0px 10px;
  background-color: var(--bg-secondary);
  padding-bottom: 4px;
}

.portable-infobox::after {
  content: "";
  position: absolute;
  width: 6%;
  height: 100%;
  top: 0px;
  right: 0px;
  background-image: var(--infobox-bg);
  background-repeat: repeat-y;
  background-size: 32px 1080px;
}

.pi-title {
  background-color: transparent;
  border-radius: 10px 10px 0px 0px;
  color: var(--accent-cyan);
  border-bottom: none;
  margin-top: 5px;
  text-align: center;
  font-family: BlenderProBold, sans-serif;
  font-size: 1.4em;
}

.pi-header {
  background-color: transparent;
  color: var(--accent-cyan);
  margin: 5px 15px !important;
  text-align: center;
  font-family: BlenderProBold, sans-serif !important;
  font-size: 1.2em !important;
  background-position: 0% 135% !important;
  text-transform: none !important;
}

.pi-data-label {
  padding: 3px 5px 3px 1px;
  text-align: right;
  border-right: 1px var(--accent-yellow) solid;
  color: var(--accent-cyan);
  text-transform: none !important;
}

/* === TABY A SELEKTORY === */
.wds-tabs, .wds-tabs__wrapper, .wds-tabs__tab,
.wds-tabs__tab-label, .wds-tabs__tab a,
.pi-tab-link, .pi-media-collection-tabs .pi-tab-link {
  background: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Aktívne taby */
.wds-tabs__tab.wds-is-current .wds-tabs__tab-label,
.wds-tabs__tab[aria-selected="true"] .wds-tabs__tab-label,
.pi-tab-link.is-active, .pi-tab-link.current,
[role="tab"][aria-selected="true"] {
  background: var(--accent-yellow) !important;
  color: #111 !important;
  border: 1px solid #555 !important;
}

/* Hover efekt */
.wds-tabs__tab:hover .wds-tabs__tab-label,
.pi-tab-link:hover {
  background: var(--bg-tertiary) !important;
  color: var(--link-color) !important;
}

/* === TABUĽKY === */
.wikitable, table, .infobox {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
  margin-left: 15px !important;
}

.wikitable th, .infobox th {
  background: #222 !important;
  color: var(--accent-yellow) !important;
}

.wikitable tr:nth-child(even) td { background: #171717 !important; }
.wikitable tr:nth-child(odd) td { background: #1b1b1b !important; }

/* === NAVBOXY === */
.navbox {
  --navbox-bg-color: var(--bg-secondary) !important;
  background: var(--bg-secondary) !important;
  border: 1px solid var(--accent-cyan) !important;
  color: var(--text-secondary) !important;
}

.navbox-title {
  background: #222 !important;
  color: var(--accent-yellow) !important;
}

.navbox a { color: var(--link-color) !important; }
.navbox a:hover { color: var(--accent-yellow) !important; }

/* === INPUTY A FORMULÁRE === */
input, textarea, select,
.vector-search-box-input {
  background: #121212 !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
}

input::placeholder, textarea::placeholder {
  color: #8a8a8a !important;
}

/* === THUMBNAILY A GALÉRIE === */
.thumb, .thumbinner, .gallery, .gallerybox {
  background: var(--bg-secondary) !important;
  border: 1px solid #333 !important;
}

.thumbcaption {
  background: #0f0f0f !important;
  color: var(--text-muted) !important;
  border-top: 1px solid #333 !important;
}

/* === UTILITY CLASSES === */
.divYellowBox {
  border: 3px solid transparent;
  border-image: var(--main-box) round;
  border-image-slice: 10% fill;
  border-image-width: 20px;
  margin: 10px auto;
  overflow: hidden;
  text-align: center;
}

.divGrayBox {
  border: 3px solid transparent;
  border-image: var(--main-box-alt) round;
  border-image-slice: 10% fill;
  border-image-width: 20px;
  padding: 10px;
}

.BlockQuote {
  display: block;
  border: 2px solid var(--accent-yellow);
  border-radius: 10px;
  text-align: center;
  padding: 1em;
  overflow: hidden;
}

/* === ŠPECIALIZOVANÉ KOMPONENTY === */
.mainpage-header {
  font-size: 18pt;
  letter-spacing: 1px;
  text-align: center;
  margin-top: 5px;
  background-image: var(--h2-bg-image);
  background-repeat: no-repeat;
  background-position: 50% 100%;
  background-size: 70% 8px;
  color: var(--accent-cyan);
  padding-bottom: 6px;
}

.bannercurve {
  background-color: rgba(255, 255, 255, 0.10);
  margin: 10px auto;
  border: 1px solid var(--accent-yellow);
  border-left: 4px solid var(--accent-yellow);
  text-align: center;
  color: var(--text-primary);
  width: auto;
  overflow: auto;
  padding: 5px;
}

/* === OOUI A SPRÁVY === */
.oo-ui-panelLayout, .oo-ui-widget,
.oo-ui-textInputWidget input,
.oo-ui-dropdownWidget-handle {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: #333 !important;
}

.mw-message-box {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
  border-left: 4px solid var(--link-color) !important;
}

/* === RESPONZÍVNE ÚPRAVY === */
@media only screen and (max-width: 1024px) {
  .mainpage-header {
    background-size: 70% 6px;
  }
  
  #content h2 {
    background-position-y: 30px;
    padding-bottom: 6px;
    font-size: 15pt;
  }
}

/* === PÄTIČKA === */
#footer, .mw-footer {
  background: #0f0f0f !important;
  color: #9a9a9a !important;
  border-top: 1px solid #222 !important;
}

#footer a, .mw-footer a { color: #c8c8c8 !important; }
#footer a:hover, .mw-footer a:hover { color: var(--accent-yellow) !important; }

/* === BEZPEČNOSTNÉ OVERRIDES === */
* { border-color: currentColor; }
hr { border: 0; border-top: 1px solid #1f1f1f !important; }


/* === ANTI-WHITE PANELS - KOMPLETNÉ POKRYTIE === */

/* Vector skin základy */
.skin-vector body {
  color: var(--text-primary);
  background: var(--bg-primary);
}

.skin-vector .mw-body,
.skin-vector .mw-workspace-container {
  background: var(--bg-primary);
}

/* Page transparency */
.page__main { 
  background-color: rgba(10,10,10,0.9) !important; 
}

/* Všetky možné biele panely */
.page, .page-content, .mw-content-text,
.mw-parser-output, .content, article {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* Sidebar a navigačné elementy */
#mw-panel .portal h3,
#mw-panel .portal li a {
  color: var(--text-muted) !important;
}

#mw-panel .portal li a:hover {
  color: var(--accent-yellow) !important;
}

/* Záložky Vector skinu */
.vector-menu-tabs a {
  background: #0f0f0f !important;
  color: var(--text-muted) !important;
  border-color: #222 !important;
}

.vector-menu-tabs .selected a {
  background: #141414 !important;
  color: var(--accent-yellow) !important;
  border-bottom-color: #141414 !important;
}

/* Vyhľadávacie pole */
#simpleSearch, .vector-search-box {
  background: var(--bg-secondary) !important;
  border: 1px solid #222 !important;
}

/* Všetky možné white containery */
.mw-body-content,
.mw-content-container,
#bodyContent,
#mw-content-text,
.parsoid-body {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* Kategórie */
#catlinks {
  background: var(--bg-secondary) !important;
  border: 1px solid #333 !important;
  border-left: 3px solid var(--accent-yellow) !important;
}

#catlinks a { color: var(--link-color) !important; }
#catlinks a:hover { color: var(--accent-yellow) !important; }

/* Referencie a citations */
.references, .mw-references-wrap {
  background: var(--bg-secondary) !important;
  border: 1px solid var(--accent-yellow) !important;
  padding: .6rem .8rem !important;
  border-radius: 4px;
}

ol.references li:target,
sup.reference:target {
  background-color: rgba(41,255,255,.2) !important;
}

/* Kód bloky */
pre, code, .mw-code {
  background: #101010 !important;
  color: #e8e8e8 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 4px;
}

pre {
  padding: .6rem .8rem !important;
  overflow: auto;
}

/* Blockquotes */
blockquote {
  border-left: 3px solid var(--accent-yellow);
  background: var(--bg-secondary);
  padding: .6rem .8rem;
  color: #dcdcdc;
}

/* Lists */
.mw-body-content ul,
.mw-body-content ol {
  margin: .4rem 0 .8rem 2rem !important;
}

.mw-body-content li {
  line-height: 1.5;
}

.page-content li::marker {
  color: var(--accent-cyan);
}

/* Všetky OOUI komponenty */
.oo-ui-widget,
.oo-ui-optionWidget,
.oo-ui-toolbar,
.mw-rcfilters-ui-filterMenuHeaderWidget,
.mw-rcfilters-ui-rcTopSectionWidget,
.oo-ui-tagMultiselectWidget-handle,
.oo-ui-tagItemWidget.oo-ui-widget,
.oo-ui-menuSelectWidget,
.oo-ui-menuSelectWidget .oo-ui-menuOptionWidget,
.oo-ui-popupWidget-popup,
.oo-ui-popupWidget-body {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: #333 !important;
}

/* Všetky možné message boxy */
.mw-message-box,
.mw-message-box-warning,
.mw-message-box-error,
.mw-message-box-success,
.warningbox,
.errorbox,
.successbox,
.mw-warning,
.mw-editnotice,
.mw-warning-with-logexcerpt {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
  padding: 0.75em 1em !important;
}

/* Farebné akcenty pre message boxy */
.mw-message-box-warning, .warningbox {
  border-left: 4px solid #d19a00 !important;
}

.mw-message-box-error, .errorbox {
  border-left: 4px solid #c0392b !important;
}

.mw-message-box-success, .successbox {
  border-left: 4px solid #27ae60 !important;
}

/* Editačné formuláre */
.editOptions,
.editCheckboxes,
#wpTextbox1,
#wpSummary {
  background: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
}

.editButtons input,
.editButtons button {
  background: #222 !important;
  color: var(--text-secondary) !important;
  border: 1px solid #555 !important;
}

/* CodeMirror */
.CodeMirror,
.CodeMirror-gutters {
  background: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border-color: #333 !important;
}

.CodeMirror-cursor {
  border-left: 1px solid var(--text-secondary) !important;
}

/* Changeslist a Recent Changes */
.mw-changeslist,
.mw-changeslist-line,
.mw-rcfilters-ui-watchlistTopSectionWidget,
.mw-changeslist-legend,
.mw-changeslist-legend dl,
.mw-changeslist-legend dd {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border-color: #333 !important;
}

/* Všetky možné DataTables a špeciálne stránky */
table.mw-datatable,
.TablePager,
table.filelist,
.mw-pager-navigation,
.TablePager_nav {
  background: var(--bg-tertiary) !important;
  color: var(--text-secondary) !important;
  border: 1px solid #333 !important;
}

table.mw-datatable th,
table.mw-datatable td,
.TablePager th,
.TablePager td,
table.filelist th,
table.filelist td {
  background: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
  border-color: #333 !important;
}

/* Pruhovanie tabuliek */
table.mw-datatable tr:nth-child(even) > td,
table.filelist tr:nth-child(even) > td {
  background: #161616 !important;
}

/* Hatnotes a notice boxy */
.ambox, .tmbox, .ombox, .fmbox, .imbox, .cmbox,
.hatnote, .notice {
  background: var(--bg-secondary) !important;
  color: #e6e6e6 !important;
  border: 1px solid #333 !important;
  border-left: 4px solid var(--link-color) !important;
  padding: .65rem .8rem !important;
  margin: .8rem 0 !important;
  border-radius: 3px;
}

/* Bezpečnostné globálne pravidlá pre všetky elementy */
div, section, article, aside, main, header, footer,
nav, span, p, ul, ol, li, dl, dt, dd {
  background-color: inherit;
}

/* Force dark pre akékoľvek inline štýly */
[style*="background: white"],
[style*="background-color: white"],
[style*="background: #fff"],
[style*="background-color: #fff"] {
  background: var(--bg-primary) !important;
}

[style*="color: black"],
[style*="color: #000"] {
  color: var(--text-primary) !important;
}

/* === BEZPEČNOSTNÉ OVERRIDES === */
* { border-color: currentColor; }
hr { border: 0; border-top: 1px solid #1f1f1f !important; }

/* ===== Global dark background & text ===== */
body, #content, .mw-body, .mw-body-content, .vector-body, .vector-page-content,
.mw-parser-output {
  background: #0a0a0a !important;
  color: #e6e6e6;
}

/* ===== Tables, TOC, navboxes, message boxes ===== */
.mw-parser-output table,
table, .wikitable, .toc, .navbox, .ambox {
  background: #111 !important;
  border-color: #333 !important;
}
.mw-parser-output table th,
.mw-parser-output table td {
  background: transparent !important;
  border-color: #333 !important;
}

/* ===== Infoboxes (white backgrounds -> dark) ===== */
table.infobox, .infobox,
.portable-infobox, .portable-infobox .pi-item, .portable-infobox .pi-data,
.portable-infobox .pi-header, .portable-infobox .pi-title,
.portable-infobox .pi-data-value, .portable-infobox .pi-image, .portable-infobox .pi-media {
  background: #111 !important;
  color: #eee !important;
  border-color: #333 !important;
}

/* ===== Code blocks ===== */
pre, code, .mw-code {
  background: #0f0f0f !important;
  color: #e6e6e6 !important;
  border: 1px solid #333 !important;
}

/* ===== Images: no overflow, responsive ===== */
.mw-parser-output img,
.thumb img, .thumbimage, .mw-file-element,
.gallerybox .thumb img, .fullImageLink img,
.mw-parser-output .infobox img {
  max-width: 100% !important;
  height: auto !important;
  display: block;
}

/* Containers shouldn’t overflow horizontally */
.mw-parser-output, .vector-body, .mw-body { overflow-x: hidden; }

/* Thumbs/galleries keep content clipped inside */
.thumb, .tleft, .tright, .gallerybox .thumb {
  overflow: hidden;
  max-width: 100%;
}

/* Gallery text color */
.gallerybox .gallerytext { color: #ddd; }

/* Links (optional tweak for readability on dark bg) */
a { color: #8ab4ff; }
a:visited { color: #b388ff; }


/* =======================
   Dark fix pack for Vector
   ======================= */

:root{
  --bg: #0b0c0d;
  --ui-border: #2a2d33;
  --text: #e5e8eb;
  --text-muted: #a9b0b8;
}

/* 1) Thumbnails & captions – odstránenie bieleho pozadia/okrajov */
.mw-parser-output .thumb,
.mw-parser-output .thumb .thumbinner{
  background: transparent !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px;
}
.mw-parser-output .thumb .thumbimage{
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
.mw-parser-output .thumbcaption{
  background: transparent !important;
  color: var(--text-muted) !important;
}
img.thumbborder, .thumbborder{ /* ak je použitý parameter |border */
  border: 0 !important;
}

/* 2) Galéria a file stránky */
.gallerybox .thumb{
  background: transparent !important;
  border-color: var(--ui-border) !important;
}
.gallerybox, .gallerytext{
  background: transparent !important;
  color: var(--text) !important;
}
#file img{ background: transparent !important; }

/* 3) Nadpisy a portlety – žiadne biele pásy */
.mw-body-content h1,
.mw-body-content h2,
.mw-body-content h3,
.mw-body-content h4,
.mw-headline,
.mw-editsection,
#firstHeading,
.portlet .pBody,
.vector-menu-content{
  background: transparent !important;
  color: var(--text);
}

/* 4) TOC (Obsah) – tmavé pozadie a orámovanie */
.toc{
  background: #0f1012 !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px;
}
.toc .toctitle, .tocnumber{ color: var(--text-muted) !important; }

/* 5) Wikitable – jednotný tmavý vzhľad, zebra + hover */
.mw-parser-output .wikitable{
  background: #0f1012 !important;
  color: var(--text) !important;
  border: 1px solid var(--ui-border) !important;
  border-collapse: collapse;
}
.wikitable > tr > th, .wikitable > * > tr > th{
  background: #14161a !important;
  border: 1px solid var(--ui-border) !important;
}
.wikitable td{
  border: 1px solid var(--ui-border) !important;
}
.wikitable tr:nth-child(even) td{ background: #101216 !important; }
.wikitable tr:hover td{ background: #15181c !important; }

/* 6) Infobox (PortableInfobox kompatibilita – ak ju používaš) */
.portable-infobox{
  background: #0f1012 !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--text) !important;
  border-radius: 8px;
}
.portable-infobox .pi-header,
.portable-infobox .pi-data,
.portable-infobox .pi-title{ background: transparent !important; }
.portable-infobox .pi-image .thumb{
  background: transparent !important;
  border: 0 !important;
}

/* 7) Linky a drobnosti pre tmavý motív */
.mw-body a:link, a{ color: #f2bd00; }
a:visited{ color: #c99a00; }
a.new{ color: #ff7070; }
.small, small, .thumbcaption{ color: var(--text-muted) !important; }

.thumb.tleft, .thumb.tright{ margin-top: .3em; margin-bottom: .8em; }

/* 8) Kódové bloky */
pre, code, .mw-code{
  background: #0c0d0f !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--text) !important;
  border-radius: 6px;
}

/* Zabij všetky rámy/pozadia okolo náhľadov a obrázkov */
.mw-parser-output .thumb,
.mw-parser-output .thumb .thumbinner,
.mw-parser-output .thumb .thumbimage,
.mw-parser-output img.mw-file-element,
.gallerybox .thumb,
.gallerybox .thumb img {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Ak používaš |thumb|right/left – skry aj rám a caption pozadie */
.mw-parser-output .thumb .thumbinner { border: 0 !important; }
.mw-parser-output .thumbcaption { background: transparent !important; border: 0 !important; }

/* Niektoré skiny dávajú biele pozadie všetkým img – prebitie */
.mw-body-content img,
.mw-parser-output img {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* TOC a pravé boxy – žiadne biele pásy */
.toc, .vector-menu-content, .portlet .pBody {
  background: transparent !important;
  border: 1px solid #2a2d33 !important; /* zmeň/odstráň podľa chuti */
}

/* Odstránenie bieleho pozadia a rámikov pri figure obrázkoch */
figure[typeof*="mw:File"],
figure[typeof*="mw:File/Thumb"],
figure[typeof*="mw:File/Frame"] {
  background: transparent !important;
  border: 0 !important;
  margin: .5em auto !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Samotný obrázok */
figure[typeof*="mw:File"] img.mw-file-element {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Popisok pod obrázkom */
figure[typeof*="mw:File"] figcaption {
  background: transparent !important;
  color: #aaa !important;  /* alebo #e5e8eb podľa tvojej témy */
  border: 0 !important;
  padding: 0.2em 0 !important;
}