MediaWiki:Vector.css: Difference between revisions

From CoraTO Wiki - Official Wiki
Jump to navigation Jump to search
← Older edit
No edit summary
Tag: Reverted
No edit summary
Tag: Manual revert
 
(13 intermediate revisions by the same user not shown)
Line 1: Line 1:
/*------------------------------------  VECTOR LEGACY (2010) — PURPLE DARK THEME  ------------------------------------*/
figcaption {
/* This file is intentionally standalone (no imports). */
/*------------------------------------------  THEME TOKENS  ------------------------------------------*/
  background: var(--bg) !important;
@purp-bg0: #11061c;
@purp-bg1: #1b0b2f;
@purp-bg2: #271145;
@purp-surface0: #321a57;
@purp-surface1: #3d2067;
@purp-border0: #7d52c7;
@purp-border1: #5a379c;
@purp-muted-border: #4a2b82;
@purp-text0: #f1eaff;
@purp-text1: #d4c7f0;
@purp-text2: #b7a6d9;
@purp-link0: #d7b9ff;
@purp-link1: #b892ff;
@purp-link2: #f0d9ff;
@purp-link-new: #ff9df2;
@purp-diff-bg: #2f1650;
@purp-diff-added: #c9a6ff;
@purp-diff-deleted: #ffb0e8;
@purp-notification-bg: #321a57;
@purp-notification-bg-rgba: rgba( 50, 26, 87, 0.93 );
@purp-grad-top: #4c2690;
@purp-grad-bottom: #2f1650;
@purp-grad-hover-top: #5a33a6;
@purp-grad-hover-bottom: #321a57;
 
/*------------------------------------------  GLOBAL BASE  ------------------------------------------*/
/* body.skin-vector, body.skin-vector-legacy, .skin-vector, .skin-vector-legacy: Base page background and default text. */
body.skin-vector,
body.skin-vector-legacy,
.skin-vector,
.skin-vector-legacy {
background-color: @purp-bg0;
color: @purp-text1;
}
}


/* body: Provides a safe default background for pages missing the skin class. */
body {
background-color: @purp-bg0;
color: @purp-text1;
}


/* a:hover: Global hover color for links outside the main content scope. */
a:hover {
color: @purp-link2;
}


/* a.stub: Highlights stub links while keeping them readable on dark backgrounds. */
a.stub {
color: @purp-link1;
}


/* code: Inline code default (fallback for code outside `.mw-body-content`). */
code {
background-color: @purp-surface0;
color: @purp-text1;
}


/* h2, h5, h6: Fallback heading colors outside the `.mw-body` container. */
.hero {
h2,
  background: var(--bg-1);
h5,
  border: 2px solid var(--border);
h6 {
  border-radius: 20px;
color: @purp-text1;
  max-width: 1200px;
  margin: 0 auto 16px auto;
  box-shadow: 0 6px 24px var(--shadow-soft);
 
}
}


/* h2: Selector alias for older tooling and rule audits. */
.hero-inner {
h2 {
  padding: clamp(18px, 3vw, 36px);
color: @purp-text1;
  text-align: center;
}
}


/* h5: Selector alias for older tooling and rule audits. */
.hero-title {
h5 {
  margin: 8px 0 4px 0;
color: @purp-text1;
  font-size: clamp(22px, 4vw, 36px);
  font-weight: 800;
  background: linear-gradient(135deg, var(--heading-gradient-start), var(--heading-gradient-end));
 
  background-clip: text;
 
}
}


/* hr: Fallback rule for horizontal separators outside the `.mw-body-content` scope. */
.hero-subtitle {
hr {
  color: var(--text-muted);
color: @purp-border1;
  font-size: clamp(14px, 2.2vw, 18px);
background-color: @purp-border1;
}
}


/* ul, table, th: Neutral defaults for lists and tables outside scoped content rules. */
.status-pill {
ul,
  display: inline-block;
table {
  margin-top: 10px;
color: @purp-text1;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 700;
  color: var(--text-strong);
  background: var(--primary);
  animation: fadeInOut 2s ease-in-out infinite;
}
}


/* ul: Selector alias for older tooling and rule audits. */
ul {
color: @purp-text1;
}


/* th: Table header cell text color fallback outside scoped content rules. */
/* ========================================
th {
  BackToTopButton.css
color: @purp-text1;
  Botão "Back to Top" (BtT)
}
  ======================================== */


/*------------------------------------------  HEADER & CHROME  ------------------------------------------*/
/* ==========================================================================
/* #mw-page-base, #mw-head-base: Header/toolbar background layers behind the page chrome. */
  Base
#mw-page-base,
  ========================================================================== */
#mw-head-base {
.btt-button {
background-color: @purp-bg1;
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 50px;
  height: 50px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px) scale(0.8);
  backdrop-filter: blur(10px);
}
}


/* #mw-page-base: Gradient header strip behind the site header. */
/* ==========================================================================
#mw-page-base {
  Estados
background-image: linear-gradient( @purp-bg1 50%, @purp-bg0 100% );
  ========================================================================== */
.btt-button.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
}


/* #mw-head-base: Base layer behind the top navigation and tabs. */
.btt-button:hover {
#mw-head-base {
  transform: translateY(-3px) scale(1.05);
background-image: none;
}
}


/* #mw-head: Top header container for Vector navigation/tabs. */
.btt-button:active {
#mw-head {
  transform: translateY(-1px) scale(0.98);
background-color: transparent;
color: @purp-text1;
}
}


/* #mw-head .mw-portlet: Portlet containers inside the header area. */
/* ==========================================================================
#mw-head .mw-portlet {
  Ícone (seta)
background-color: transparent;
  ========================================================================== */
color: @purp-text1;
.btt-button::before {
  content: '';
  width: 0;
  height: 0;
  border-left: 8px solid;
  border-right: 8px solid;
  border-bottom: 12px solid;
  transition: all 0.3s ease;
}
}


/* #mw-head h3: Header portlet headings. */
.btt-button:hover::before {
#mw-head h3 {
  transform: translateY(-2px);
color: @purp-text1;
}
}


/* #mw-head div.vectorMenu h5: Legacy Vector portlet heading variant in the head area. */
/* ==========================================================================
#mw-head div.vectorMenu h5 {
  Animação (pulse)
color: @purp-text1;
  ========================================================================== */
@keyframes btt-pulse {
  0% { opacity: 1; }
  50% { opacity: 1; }
  100% { opacity: 1; }
}
}


/* #mw-head a: Header links (tabs, user menu, and portlet links). */
.btt-button.pulse {
#mw-head a {
  animation: btt-pulse 2s ease-in-out 3;
color: @purp-link0;
text-decoration: none;
}
}


/* #mw-head .vector-menu: Vector menu wrapper inside the header. */
/* ==========================================================================
#mw-head .vector-menu {
  Responsividade
color: @purp-text1;
  ========================================================================== */
@media (max-width: 768px) {
  .btt-button {
    bottom: 20px;
    right: 20px;
    width: 45px;
    height: 45px;
  }
 
  .btt-button::before {
    border-left-width: 7px;
    border-right-width: 7px;
    border-bottom-width: 10px;
  }
}
}


/* #mw-head .vector-menu-heading: Vector menu heading text in the header. */
@media (max-width: 480px) {
#mw-head .vector-menu-heading {
  .btt-button {
color: @purp-text1;
    bottom: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
  }
 
  .btt-button::before {
    border-left-width: 6px;
    border-right-width: 6px;
    border-bottom-width: 9px;
  }
}
}


/* #mw-head .vector-menu-checkbox: Toggle checkbox for responsive/collapsible menus. */
/* ==========================================================================
#mw-head .vector-menu-checkbox {
  Acessibilidade
accent-color: @purp-link0;
  ========================================================================== */
@media (prefers-contrast: high) {
  .btt-button {
    border: 2px solid;
  }
}
}


/* #mw-head .vector-menu-content: Dropdown panel surface in the header. */
@media (prefers-reduced-motion: reduce) {
#mw-head .vector-menu-content {
  .btt-button {
background-color: @purp-surface0;
    transition: opacity 0.3s ease;
border: 1px solid @purp-border1;
  }
 
  .btt-button:hover {
    transform: none;
  }
 
  .btt-button::before {
    transition: none;
  }
 
  .btt-button:hover::before {
    transform: none;
  }
 
  .btt-button.pulse {
    animation: none;
  }
}
}


/* #mw-head .vector-menu-content-list: List surface inside the dropdown panel. */
/* ========================================
#mw-head .vector-menu-content-list {
  ContentContainer.css
background-color: @purp-surface0;
  Container principal de conteúdo (#content / .mw-body)
}
  ======================================== */


/* #mw-head .vector-menu-tabs: Tab strip container. */
body.skin-vector-legacy #content,
#mw-head .vector-menu-tabs {
body.skin-vector-legacy .mw-body {
background-color: transparent;
  border: 1px solid !important;
  border-radius: 12px !important;
  margin: 50px auto !important;
  max-width: 1500px;
}
}


/* #mw-head .vector-menu-tabs ul: Tab list container. */
#content::before,
#mw-head .vector-menu-tabs ul {
.mw-body::before {
background-color: transparent;
  content: '' !important;
  position: absolute !important;
  inset: -1px !important;
  border-radius: 12px !important;
  z-index: -1 !important;
  opacity: 0.1 !important;
}
}


/* #mw-head .vector-menu-tabs li: Individual tab items. */
/* ========================================
#mw-head .vector-menu-tabs li {
  Forms.css
background-color: transparent;
  Inputs e formulários (search, text, select, textarea)
background-image: none;
  ======================================== */
}


/* #mw-head .vector-menu-tabs li.selected/.new: Selected and red-link tab variants. */
input[type="text"],
#mw-head .vector-menu-tabs li.selected,
input[type="search"],
#mw-head .vector-menu-tabs li.new {
textarea,
background-color: transparent;
select {
  border: 2px solid !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-family: inherit !important;
  transition: 0.15s ease !important;
 
}
}


/* #mw-head .vector-menu-tabs li a/span: Tab label link and text. */
input[type="text"]:focus,
#mw-head .vector-menu-tabs li a,
input[type="search"]:focus,
#mw-head .vector-menu-tabs li span {
textarea:focus,
color: @purp-link0;
select:focus {
 
}
}


/* #mw-head .vector-menu-tabs li a.new: "Red link" tab label. */
/* ========================================
#mw-head .vector-menu-tabs li a.new {
  HamburguerMenu.css
color: @purp-link-new;
  Sidebar (Vector Legacy) + menu hambúrguer + overlay
}
  ======================================== */


/* #mw-head .vector-menu-dropdown: "More"/actions dropdown container. */
/* ==========================================================================
#mw-head .vector-menu-dropdown {
  Variáveis reutilizáveis (dimensões e cores)
color: @purp-text1;
  ========================================================================== */
}


/* #mw-head .vector-menu-dropdown .vector-menu-content: Dropdown panel surface. */
/* ==========================================================================
#mw-head .vector-menu-dropdown .vector-menu-content {
  Sidebar (container)
background-color: @purp-surface0;
  ========================================================================== */
border: 1px solid @purp-border1;
body.skin-vector-legacy #mw-panel {
  border-right: 2px solid;
  padding: 18px 0;
  border-radius: 14px;
  transform: translateX(-100%);
  transition: transform .3s ease;
  position: fixed;
  z-index: 1000;
  height: 100vh;
  width: 220px;
  overflow-y: auto;
  overflow-x: hidden;
}
}


/* #mw-head .vector-menu-dropdown .vector-menu-content-list: List surface inside the dropdown. */
/* Exibe sidebar somente quando mobile-open está presente */
#mw-head .vector-menu-dropdown .vector-menu-content-list {
body.skin-vector-legacy #mw-panel.mobile-open {
background-color: @purp-surface0;
  transform: translateX(0);
}
}


/* #mw-head .vector-menu-dropdown .vector-menu-heading: Dropdown heading label. */
/* Overlay ao abrir a sidebar */
#mw-head .vector-menu-dropdown .vector-menu-heading {
body.sidebar-open::before {
color: @purp-text1;
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  opacity: 1;
  transition: opacity .3s ease;
  background: rgba(0, 0, 0, 0.5);
}
}


/* #mw-head ... checkbox/hover: Keeps dropdown background consistent when opened. */
/* ==========================================================================
#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked ~ .vector-menu-content,
  Sidebar (portais e itens)
#mw-head .vector-menu-dropdown:hover .vector-menu-content {
  ========================================================================== */
background-color: @purp-surface0;
body.skin-vector-legacy #mw-panel .vector-menu-portal,
body.skin-vector-legacy #mw-panel .portal {
  padding: 10px;
  border: 3px solid;
  border-radius: 14px;
  overflow: hidden;
}
}


/* #mw-head .vector-menu-dropdown .mw-portlet-body: Ensures body background stays transparent. */
body.skin-vector-legacy #mw-panel .vector-menu-portal .vector-menu-heading,
#mw-head .vector-menu-dropdown .mw-portlet-body {
body.skin-vector-legacy #mw-panel .portal h3 {
background-color: transparent;
  margin: 0;
  padding: 10px 12px;
  font-size: 0.92em;
  font-weight: 700;
  letter-spacing: .3px;
  text-decoration: underline;
  border-bottom: 1px;
  text-shadow: 0 1px 2px rgb(0, 0, 0) !important;
  cursor: pointer;
  user-select: none;
  position: relative;
  transition: background 0.3s ease, transform 0.2s ease;
  border-radius: 14px;
}
}


/* #left-navigation, #right-navigation: Left/right navigation regions for tabs and actions. */
body.skin-vector-legacy #mw-panel .vector-menu-portal .vector-menu-heading:hover,
#left-navigation,
body.skin-vector-legacy #mw-panel .portal h3:hover {
#right-navigation {
  transform: translateY(-1px);
background-color: transparent;
}
}


/* #left-navigation: Left-aligned navigation container. */
body.skin-vector-legacy #mw-panel .vector-menu-portal .vector-menu-heading::after,
#left-navigation {
body.skin-vector-legacy #mw-panel .portal h3::after {
background-color: transparent;
  content: '▼';
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.8em;
  transition: transform 0.3s ease;
  border-radius: 14px;
}
}


/* #right-navigation: Right-aligned navigation container. */
body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed .vector-menu-heading::after,
#right-navigation {
body.skin-vector-legacy #mw-panel .portal.collapsed h3::after {
background-color: transparent;
  transform: translateY(-50%) rotate(-90deg);
}
}


/* #p-namespaces, #p-views, #p-cactions, #p-variants: Tab/action portlets for namespaces and page actions. */
body.skin-vector-legacy #mw-panel .vector-menu-content ul,
#p-namespaces,
body.skin-vector-legacy #mw-panel .portal .body ul {
#p-views,
  list-style: none;
#p-cactions,
  margin: 0;
#p-variants {
  padding: 4px 0;
color: @purp-text1;
  border-radius: 14px;
}
}


/* #p-namespaces: Namespace tabs (Article, Talk, etc.). */
body.skin-vector-legacy #mw-panel .vector-menu-content,
#p-namespaces {
body.skin-vector-legacy #mw-panel .portal .body {
color: @purp-text1;
  max-height: none;
  overflow: hidden;
  transition: max-height 0.4s ease, opacity 0.3s ease;
  opacity: 1;
}
}


/* #p-views: View tabs (Read, Edit, View history). */
body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed .vector-menu-content,
#p-views {
body.skin-vector-legacy #mw-panel .portal.collapsed .body {
color: @purp-text1;
  max-height: 0 !important;
  opacity: 0;
  padding: 0;
}
}


/* #p-cactions: Action dropdown (More/actions menu). */
body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed,
#p-cactions {
body.skin-vector-legacy #mw-panel .portal.collapsed { margin-bottom: 8px; }
color: @purp-text1;
}


/* #p-variants: Language variant dropdown (if enabled). */
body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed .vector-menu-heading,
#p-variants {
body.skin-vector-legacy #mw-panel .portal.collapsed h3 {
color: @purp-text1;
  border-bottom: none;
  border-radius: 14px;
}
}


/* #p-namespaces/.views .vector-menu-tabs: Tab strip surfaces for namespace/view menus. */
body.skin-vector-legacy #mw-panel .vector-menu-content li,
#p-namespaces .vector-menu-tabs,
body.skin-vector-legacy #mw-panel .portal .body li { border-bottom: 1px solid; }
#p-views .vector-menu-tabs {
background-color: transparent;
}


/* #p-cactions/#p-variants.vector-menu-dropdown: Dropdown container background. */
body.skin-vector-legacy #mw-panel .vector-menu-content li:last-child,
#p-cactions.vector-menu-dropdown,
body.skin-vector-legacy #mw-panel .portal .body li:last-child { border-bottom: 0; }
#p-variants.vector-menu-dropdown {
background-color: transparent;
}


/* #p-cactions/#p-variants .vector-menu-heading: Dropdown heading label text. */
body.skin-vector-legacy #mw-panel .vector-menu-content a,
#p-cactions .vector-menu-heading,
body.skin-vector-legacy #mw-panel .portal .body a {
#p-variants .vector-menu-heading {
  display: block;
color: @purp-text1;
  padding: 8px 14px;
  text-decoration: none;
  border-radius: 10px;
  border-left: 3px solid;
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, padding .2s ease;
}
}


/* #p-cactions/#p-variants .vector-menu-content: Dropdown content panel surface. */
body.skin-vector-legacy #mw-panel .vector-menu-content a:hover,
#p-cactions .vector-menu-content,
body.skin-vector-legacy #mw-panel .portal .body a:hover {
#p-variants .vector-menu-content {
  padding-left: 18px;
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
}


/* #p-cactions/#p-variants .vector-menu-content-list: List surface inside dropdown content. */
/* ==========================================================================
#p-cactions .vector-menu-content-list,
  Scrollbar (sidebar)
#p-variants .vector-menu-content-list {
  ========================================================================== */
background-color: @purp-surface0;
body.skin-vector-legacy #mw-panel::-webkit-scrollbar { width: 6px; }
}
body.skin-vector-legacy #mw-panel::-webkit-scrollbar-thumb { border-radius: 3px; }


/* #p-* ul: Tab/action lists. */
/* ==========================================================================
#p-namespaces ul,
  Menu hambúrguer (toggle)
#p-views ul,
  ========================================================================== */
#p-cactions ul,
.mobile-hamburger-menu {
#p-variants ul {
  display: flex;
background-color: transparent;
  position: fixed;
  top: 20px;
  left: 20px;
  z-index: 1002;
  width: 50px;
  height: 50px;
  border: none;
  border-radius: 14px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  transition: transform .3s ease, box-shadow .3s ease;
  padding: 0;
  background: linear-gradient(135deg, #ff6b9d, #ff8fb0);
}
}


/* #p-* li: Tab/action items. */
.mobile-hamburger-menu:hover {
#p-namespaces li,
  transform: translateY(-2px);
#p-views li,
#p-cactions li,
#p-variants li {
background-color: transparent;
}
}


/* #p-namespaces/#p-views li.selected: Selected tab background. */
.mobile-hamburger-menu span {
#p-namespaces li.selected,
  display: block;
#p-views li.selected {
  width: 25px;
background-color: @purp-bg1;
  height: 3px;
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease;
  transform-origin: center;
  background: #ffffff;
}
}


/* #p-namespaces/#p-views li.new: "Red link" tab item background. */
.mobile-hamburger-menu.active span:nth-child(1) { transform: rotate(45deg) translate(6px, 6px); }
#p-namespaces li.new,
.mobile-hamburger-menu.active span:nth-child(2) { opacity: 0; }
#p-views li.new {
.mobile-hamburger-menu.active span:nth-child(3) { transform: rotate(-45deg) translate(6px, -6px); }
background-color: transparent;
}


/* #p-* a: Tab/action links. */
/* ==========================================================================
#p-namespaces a,
  Logo “peek” (quando sidebar está recolhida/aberta)
#p-views a,
  ========================================================================== */
#p-cactions a,
body.skin-vector-legacy #p-logo { margin: 0 12px 18px; }
#p-variants a {
color: @purp-link0;
text-decoration: none;
}


/* #p-namespaces/#p-views a.new: "Red link" tab labels. */
body.skin-vector-legacy #p-logo a {
#p-namespaces a.new,
  display: block;
#p-views a.new {
  border: 1px solid;
color: @purp-link-new;
  border-radius: 14px;
  padding: 12px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
}


/* #p-namespaces/#p-views span: Tab label text spans. */
body.skin-vector-legacy #p-logo a:hover {
#p-namespaces span,
  transform: translateY(-2px);
#p-views span {
color: @purp-link0;
}
}


/* #p-cactions/#p-variants .selected: Selected dropdown entry background. */
body.skin-vector-legacy #p-logo {
#p-cactions .selected,
  position: absolute;
#p-variants .selected {
  top: 12px;
background-color: @purp-bg1;
  left: calc(100% + 12px);
  margin: 0;
  z-index: 1001;  
}
}


/* #p-cactions/#p-variants .new: "Red link" entries inside dropdown menus. */
body.skin-vector-legacy #p-logo a {
#p-cactions .new,
  width: 56px;
#p-variants .new {
  height: 56px;
color: @purp-link-new;
  padding: 0;
  display: block;
  border-radius: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border: 1px solid;
}
}


/* #p-cactions-label/#p-variants-label: Labels for action/variant menus. */
body.skin-vector-legacy #mw-panel.mobile-open #p-logo {
#p-cactions-label,
  position: relative;
#p-variants-label {
  left: auto;
color: @purp-text1;
  top: auto;
  margin: 0 12px 18px;
}
}


/* #p-cactions-label span, #p-variants-label span: Text spans inside the menu labels. */
body.skin-vector-legacy #mw-panel.mobile-open #p-logo a {
#p-cactions-label span,
  width: auto;
#p-variants-label span {
  height: auto;
color: @purp-text1;
  padding: 12px;
  background-size: contain;
}
}


/*------------------------------------------  LEGACY VECTOR TABS & MENUS  ------------------------------------------*/
/* ==========================================================================
/* .vectorTabs: Legacy tab strip container used by older Vector markup. */
  Acessibilidade
.vectorTabs {
  ========================================================================== */
color: @purp-text1;
@media (prefers-contrast: more) {
  body.skin-vector-legacy #mw-panel .vector-menu-content a:hover { text-decoration: underline; }
}
}


/* .vectorTabs ul: List container for legacy tabs. */
/* ========================================
.vectorTabs ul {
  Header.css
background-color: transparent;
  Cabeçalho (#mw-head) do Vector Legacy
}
  ======================================== */


/* .vectorTabs li: Individual legacy tab items. */
#mw-head {
.vectorTabs li {
  padding: 10px ;
background-color: transparent;
  border-bottom: 2px solid;
  border: 1px solid;
  border-radius: 8px;
 
}
}


/* .vectorTabs li.selected/.new: Selected and "red link" legacy tab items. */
/* ========================================
.vectorTabs li.selected,
  HeaderTabs.css
.vectorTabs li.new {
  Abas e ações do cabeçalho (views/actions/watch)
background-color: transparent;
  ======================================== */
}


/* .vectorTabs li a/span: Tab label links and text spans. */
/* ==========================================================================
.vectorTabs li a,
  Botões base
.vectorTabs li span {
  ========================================================================== */
color: @purp-link0;
#ca-view a,
#ca-viewsource a,
#ca-ve-edit a,
#ca-edit a,
#ca-history a,
#p-cactions .vector-menu-heading ,
#ca-delete a,
#ca-move a,
#ca-protect a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 12px !important;
  margin: 4px 6px 0 0 !important;
  border-radius: 10px !important;
  border: 2px solid !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease !important;
}
}


/* .vectorTabs li a.new: "Red link" tab label. */
/* ==========================================================================
.vectorTabs li a.new {
  Watch / Unwatch (ícones)
color: @purp-link-new;
  ========================================================================== */
#ca-watch a,
#ca-unwatch a {
  font-size: 0;
  width: 24px;
  height: 24px;
  padding: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
}


/* .vectorTabs li.selected a(+ visited): Selected tab link styling. */
#ca-watch a {
.vectorTabs li.selected a,
  content: "";
.vectorTabs li.selected a:visited {
  display: block;
color: @purp-text1;
  width: 16px;
text-decoration: none;
  height: 16px;
background-color: @purp-bg1;
  background-image: url("https://mewsie.world/CoraTOWiki/images/2/28/EmptyPinkStar.png");
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: 10px !important;
}
}


/* div.vectorTabs span: Legacy tab span element styling (older Vector markup). */
#ca-unwatch a {
div.vectorTabs span {
  content: "";
color: @purp-link0;
  display: block;
background-image: none;
  width: 16px;
  height: 16px;
  background-image: url("https://mewsie.world/CoraTOWiki/images/c/cc/FullPinkStar.png");
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: 10px !important;
}
}


/* .vectorMenu: Legacy dropdown menu container used by older Vector markup. */
/* ==========================================================================
.vectorMenu {
  Hover / active
color: @purp-text1;
  ========================================================================== */
#ca-view a:hover,
#ca-viewsource a:hover,
#ca-edit a:hover,
#ca-history a:hover,
#ca-watch a:hover,
#ca-unwatch a:hover,
#p-cactions .vector-menu-heading:hover,
#ca-delete a:hover,
#ca-move a:hover,
#ca-protect a:hover {
  transform: translateY(-2px) !important;
}
}


/* .vectorMenu > h3: Legacy menu heading element. */
/* ==========================================================================
.vectorMenu > h3 {
  Remoções e resets do cabeçalho
color: @purp-text1;
  ========================================================================== */
#pt-anontalk,
#p-namespaces,
#pt-anoncontribs,
#ca-talk,
#ca-nstab-main,
#ca-nstab-mediawiki {
  display: none !important;
}
}


/* .vectorMenu > h3 span: Heading text span inside legacy menu headings. */
#ca-talk,
.vectorMenu > h3 span {
#ca-nstab-main,
color: @purp-text1;
#ca-nstab-mediawiki,
#ca-view,
#ca-viewsource,
#ca-edit,
#ca-ve-edit,
#ca-history,
#ca-watch,
#ca-unwatch,
#ca-more,
#mw-page-base {
  border: none !important;
  padding: 0 !important;
  margin: 0 4px !important;
}
}


/* .vectorMenuCheckbox: Checkbox used to toggle legacy menus in some responsive layouts. */
// Variáveis LESS que recebem valores das variáveis CSS
.vectorMenuCheckbox {
@bg-1: var(--bg-1);
accent-color: @purp-link0;
@border: var(--border);
}
@shadow-soft: var(--shadow-soft);
@heading-gradient-start: var(--heading-gradient-start);
@heading-gradient-end: var(--heading-gradient-end);
@text-muted: var(--text-muted);
@text-strong: var(--text-strong);
@primary: var(--primary);


/* .vectorMenu .body: Legacy menu body container surface. */
// Estilos
.vectorMenu .body {
.hero {
background-color: @purp-surface0;
  background: @bg-1;
  border: 2px solid @border;
  border-radius: 20px;
  max-width: 1200px;
  margin: 0 auto 16px auto;
  box-shadow: 0 6px 24px @shadow-soft;
}
}


/* .vectorMenu .body ul / div.vectorMenu ul: Legacy menu list surfaces and borders. */
.hero-inner {
.vectorMenu .body ul,
  padding: clamp(18px, 3vw, 36px);
div.vectorMenu ul {
  text-align: center;
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
}


/* .vectorMenu .body li: Legacy menu list items. */
.hero-title {
.vectorMenu .body li {
  margin: 8px 0 4px 0;
background-color: transparent;
  font-size: clamp(22px, 4vw, 36px);
  font-weight: 800;
  background: linear-gradient(135deg, @heading-gradient-start, @heading-gradient-end);
  background-clip: text;
}
}


/* .vectorMenu .body li a / div.vectorMenu li a: Legacy menu links. */
.hero-subtitle {
.vectorMenu .body li a,
  color: @text-muted;
div.vectorMenu li a {
  font-size: clamp(14px, 2.2vw, 18px);
color: @purp-link0;
text-decoration: none;
}
}


/* div.vectorMenu li.selected a:visited: Selected legacy menu entry visited state. */
.status-pill {
div.vectorMenu li.selected a:visited {
  display: inline-block;
color: @purp-link1;
  margin-top: 10px;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 700;
  color: @text-strong;
  background: @primary;
  animation: fadeInOut 2s ease-in-out infinite;
}
}


/* div.vectorMenu h5 a: Legacy menu heading link variant. */
body.skin-vector-legacy.has-user-menu-collapsible #p-personal,
div.vectorMenu h5 a {
body.skin-vector-legacy.has-personal-menu-collapsible #p-personal {
color: @purp-link0;
display: none;
text-decoration: none;
}
}


/* .vectorMenu .menu: Legacy Vector menu dropdown panel surface. */
body.skin-vector-legacy .personal-menu-container {
.vectorMenu .menu {
position: fixed;
background-color: @purp-surface0;
top: 120px;
border: 1px solid @purp-border1;
right: 0;
z-index: 1000;
overflow: visible;
display: flex;
flex-direction: row;
}
}


/* .vectorMenu .menu li: Legacy Vector menu dropdown list items. */
body.skin-vector-legacy .personal-menu-header {
.vectorMenu .menu li {
display: flex;
background-color: transparent;
align-items: center;
padding: 6px 12px;
top: 2;
right: 0;
position: fixed;
cursor: pointer;
user-select: none;
transition: background 0.3s ease;
border-radius: 14px 0 0 14px;
white-space: nowrap;
font-weight: bold;
height: auto;
writing-mode: horizontal-tb;
border: 1px solid;
flex-direction: row;
}
}


/* .vectorMenu .menu li a: Legacy Vector menu dropdown links. */
body.skin-vector-legacy .personal-menu-header::after {
.vectorMenu .menu li a {
content: '';
color: @purp-link0;
display: inline-block;
text-decoration: none;
width: 25px;
}
height: 25px;
 
/* .menu: Generic menu class fallback used by legacy Vector markup. */
.menu {
background-color: transparent;
}
 
/* .body: Generic body class fallback used by legacy Vector markup. */
.body {
background-color: transparent;
}
 
/* #mw-panel: Legacy left sidebar panel container. */
#mw-panel {
padding: 0;
}
 
/* #mw-panel .portal: Legacy sidebar portlet container. */
#mw-panel .portal {
background: none;
border-bottom: 1px solid @purp-muted-border;
color: @purp-text0;
}
 
/* #mw-panel .portal h3: Legacy sidebar portlet heading. */
#mw-panel .portal h3 {
color: @purp-link0;
}
 
/* #mw-panel .portal .body: Legacy sidebar portlet body container. */
#mw-panel .portal .body {
color: @purp-text0;
}
 
/* #mw-panel .portal .body ul: Legacy sidebar portlet list container. */
#mw-panel .portal .body ul {
background-color: transparent;
}
 
/* #mw-panel .portal .body li: Legacy sidebar portlet list item. */
#mw-panel .portal .body li {
background-color: transparent;
}
 
/* #mw-panel .portal .body li a (+ ul li): Sidebar portlet links in legacy markup variants. */
#mw-panel .portal .body li a,
#mw-panel .portal .body ul li a {
color: @purp-link0;
text-decoration: none;
}
 
/* #mw-panel .portal .body li a:visited (+ ul li): Visited state for sidebar portlet links. */
#mw-panel .portal .body li a:visited,
#mw-panel .portal .body ul li a:visited {
color: @purp-link1;
}
 
/* #mw-panel .portal .body li a:hover/:focus: Hover/focus state for sidebar portlet links. */
#mw-panel .portal .body li a:hover,
#mw-panel .portal .body li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* #mw-panel.collapsible-nav .portal: Collapsible sidebar portlets use the same border separation. */
#mw-panel.collapsible-nav .portal {
border-bottom: 1px solid @purp-muted-border;
}
 
/* #mw-panel.collapsible-nav .portal h5 a: Collapsible portlet heading links. */
#mw-panel.collapsible-nav .portal h5 a {
color: @purp-link0;
text-decoration: none;
}
 
/* #mw-panel .mw-portlet: Sidebar portlet container in newer markup. */
#mw-panel .mw-portlet {
background-color: transparent;
color: @purp-text0;
}
 
/* #mw-panel .mw-portlet h3: Sidebar portlet heading in newer markup. */
#mw-panel .mw-portlet h3 {
color: @purp-link0;
}
 
/* #mw-panel .mw-portlet .vector-menu-content: Sidebar portlet dropdown panel surface. */
#mw-panel .mw-portlet .vector-menu-content {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* #mw-panel .mw-portlet .vector-menu-content-list: Sidebar portlet dropdown list surface. */
#mw-panel .mw-portlet .vector-menu-content-list {
background-color: @purp-surface0;
}
 
/* #mw-panel .mw-portlet .vector-menu-content-list li: Sidebar portlet dropdown list items. */
#mw-panel .mw-portlet .vector-menu-content-list li {
background-color: transparent;
}
 
/* #mw-panel .mw-portlet .vector-menu-content-list li a: Sidebar portlet dropdown links. */
#mw-panel .mw-portlet .vector-menu-content-list li a {
color: @purp-link0;
text-decoration: none;
}
 
/* #p-logo: Sidebar logo portlet positioning. */
#p-logo {
left: 0;
top: -150px;
}
 
/* #p-logo a: Logo link background reset for dark theme. */
#p-logo a {
background-color: transparent;
}
 
/* #p-logo a.mw-wiki-logo: Logo image element filter reset. */
#p-logo a.mw-wiki-logo {
filter: none;
}
 
/* #p-search: Sidebar search portlet text color. */
#p-search {
color: @purp-text1;
}
 
/* #p-search h3: Sidebar search portlet heading. */
#p-search h3 {
color: @purp-text1;
}
 
/* #p-search form: Sidebar search form background reset. */
#p-search form {
background-color: transparent;
}
 
/* #simpleSearch: Search box container border and background. */
#simpleSearch {
border: 1px solid @purp-border1;
background-color: @purp-bg1;
background-image: none;
}
 
/* #simpleSearch form: Search form background reset. */
#simpleSearch form {
background-color: transparent;
}
 
/* #simpleSearch #searchInput: Search input wrapper background reset. */
#simpleSearch #searchInput {
background-color: transparent;
}
 
/* #simpleSearch input#searchInput: Search input text color and background. */
#simpleSearch input#searchInput {
background-color: transparent;
color: @purp-text0;
}
 
/* #simpleSearch input#searchInput::placeholder: Placeholder text color for search input. */
#simpleSearch input#searchInput::placeholder {
color: @purp-text2;
}
 
/* #simpleSearch :input-placeholder#searchInput: Legacy placeholder selector variant. */
#simpleSearch :input-placeholder#searchInput {
color: @purp-text2;
}
 
/* #simpleSearch :placeholder#searchInput: Legacy placeholder selector variant. */
#simpleSearch :placeholder#searchInput {
color: @purp-text2;
}
 
/* #simpleSearch #searchButton: Search button icon contrast for dark theme. */
#simpleSearch #searchButton {
filter: invert( 100% );
}
 
/* #simpleSearch #mw-searchButton: Search submit button icon contrast for dark theme. */
#simpleSearch #mw-searchButton {
filter: invert( 100% );
}
 
/* #simpleSearch input[type='search'], #simpleSearch input[type='text']: Search input control colors. */
#simpleSearch input[type='search'],
#simpleSearch input[type='text'] {
background-color: transparent;
color: @purp-text0;
}
 
/* #searchInput: Search input text color fallback. */
#searchInput {
color: @purp-text0;
}
 
/* #searchButton, #mw-searchButton, input#searchButton: Search button background/border reset. */
#searchButton,
#mw-searchButton,
input#searchButton {
background-color: transparent;
border: 0;
}
 
/* #searchButton:hover/:focus, #mw-searchButton:hover/:focus: Search button hover/focus icon contrast. */
#searchButton:hover,
#searchButton:focus,
#mw-searchButton:hover,
#mw-searchButton:focus {
filter: invert( 100% );
}
 
/* .suggestions: Search suggestions dropdown container. */
.suggestions {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .suggestions-results: Suggestions results list surface. */
.suggestions-results {
background-color: @purp-surface0;
}
 
/* .suggestions-results a: Suggestions result links. */
.suggestions-results a {
color: @purp-link0;
}
 
/* .suggestions-results a:hover/:focus: Hover/focus state for suggestion links. */
.suggestions-results a:hover,
.suggestions-results a:focus {
color: @purp-link2;
}
 
/* .suggestions-special: Suggestions "special" block surface. */
.suggestions-special {
background-color: @purp-surface0;
}
 
/* .suggestions-special a: Suggestions "special" block links. */
.suggestions-special a {
color: @purp-link0;
}
 
/* .suggestions-special a:hover/:focus: Hover/focus state for "special" suggestion links. */
.suggestions-special a:hover,
.suggestions-special a:focus {
color: @purp-link2;
}
 
/*------------------------------------------  PERSONAL TOOLS  ------------------------------------------*/
/* #p-personal: Personal tools container (login, user page, watchlist, etc.). */
#p-personal {
color: @purp-text1;
}
 
/* #p-personal h3: Portlet heading text. */
#p-personal h3 {
color: @purp-text1;
}
 
/* #p-personal ul: Personal tools list container. */
#p-personal ul {
background-color: transparent;
}
 
/* #p-personal li: Personal tools list items. */
#p-personal li {
background-color: transparent;
}
 
/* #p-personal li a: Personal tools links. */
#p-personal li a {
color: @purp-link0;
text-decoration: none;
}
 
/* #p-personal li a:hover, #p-personal li a:focus: Hover/focus state for personal tools. */
#p-personal li a:hover,
#p-personal li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* #p-personal a.new (+ visited): "Red links" for missing pages inside the personal tools area. */
#p-personal a.new,
#p-personal a.new:visited {
color: @purp-link-new;
}
 
/* #p-personal a.new: Selector alias for older tooling and rule audits. */
#p-personal a.new {
color: @purp-link-new;
}
 
/* #pt-* items: Individual personal tool entries. */
#pt-userpage,
#pt-anonuserpage,
#pt-login,
#pt-anonlogin,
#pt-logout,
#pt-createaccount,
#pt-preferences,
#pt-watchlist,
#pt-mycontris,
#pt-mytalk,
#pt-notifications-alert,
#pt-notifications-notice,
#pt-betafeatures {
color: @purp-text1;
}
 
/* #pt-* a: Links inside personal tools entries. */
#pt-userpage a,
#pt-anonuserpage a,
#pt-login a,
#pt-anonlogin a,
#pt-logout a,
#pt-createaccount a,
#pt-preferences a,
#pt-watchlist a,
#pt-mycontris a,
#pt-mytalk a,
#pt-notifications-alert a,
#pt-notifications-notice a,
#pt-betafeatures a {
color: @purp-link0;
text-decoration: none;
}
 
/* li#pt-anonuserpage span: Anonymous user label text. */
li#pt-anonuserpage span {
color: @purp-text1;
}
 
/* #mw-navigation: Legacy navigation container wrapper. */
#mw-navigation {
color: @purp-text1;
}
 
/* #mw-navigation h2: Navigation container heading. */
#mw-navigation h2 {
color: @purp-text1;
}
 
/* #mw-navigation ul: Navigation list container. */
#mw-navigation ul {
background-color: transparent;
}
 
/* #mw-navigation li: Navigation list items. */
#mw-navigation li {
background-color: transparent;
}
 
/* #mw-navigation a: Navigation links. */
#mw-navigation a {
color: @purp-link0;
text-decoration: none;
}
 
/*------------------------------------------  CONTENT SHELL  ------------------------------------------*/
/* #content: Main content wrapper used as the primary page container. */
#content {
border: 1px solid @purp-border0;
border-right-width: 0;
background-color: @purp-bg2;
color: @purp-text1;
}
 
/* div#content: Forces the right border color when external CSS overrides it. */
div#content {
border-right-color: @purp-border1 !important;
}
 
/* #content.mw-body: Content wrapper when MediaWiki applies `mw-body` on `#content`. */
#content.mw-body {
border: 1px solid @purp-border0;
border-right-width: 0;
background-color: @purp-bg2;
color: @purp-text1;
padding: 1em;
margin-top: 50px;
}
 
/* .mw-body: Standard content container for article pages. */
.mw-body {
border: 1px solid @purp-border0;
border-right-width: 0;
background-color: @purp-bg2;
color: @purp-text1;
padding: 1em;
margin-top: 50px;
}
 
/* .mw-body-content: Inner wrapper that holds rendered page HTML. */
.mw-body-content {
color: @purp-text1;
}
 
/* #bodyContent: Classic content root for legacy page structure. */
#bodyContent {
color: @purp-text1;
}
 
/* #bodyContent .mw-parser-output: Parser output wrapper inside legacy content root. */
#bodyContent .mw-parser-output {
color: @purp-text1;
}
 
/* #bodyContent h2: Legacy heading level used by some content outputs. */
#bodyContent h2 {
color: @purp-text1;
}
 
/*------------------------------------------  PAGE HISTORY  ------------------------------------------*/
/* #bodyContent ul#pagehistory: Page history tabs/list and related metadata. */
#bodyContent ul#pagehistory li {
background-color: transparent;
}
 
/* #bodyContent ul#pagehistory li.selected: Selected page history entry background. */
#bodyContent ul#pagehistory li.selected {
background-color: @purp-bg1;
}
 
/* #bodyContent ul#pagehistory .history-user: Usernames in page history entries. */
#bodyContent ul#pagehistory .history-user {
color: @purp-text1;
}
 
/* #bodyContent ul#pagehistory span.minor: Minor edit markers in page history entries. */
#bodyContent ul#pagehistory span.minor {
color: @purp-text2;
}
 
/* #siteSub: Site subtitle text. */
#siteSub {
color: @purp-text2;
}
 
/* #contentSub: Content subtitle text. */
#contentSub {
color: @purp-text2;
}
 
/* #contentSub2: Additional content subtitle text. */
#contentSub2 {
color: @purp-text2;
}
 
/*------------------------------------------  RSS MODULES  ------------------------------------------*/
/* #content div.rss: RSS box containers used by some extensions. */
#content div.rss {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* #content div.rss h3: RSS box heading. */
#content div.rss h3 {
color: @purp-text1;
border-bottom: 1px solid @purp-border1;
}
 
/* #content div.rss h3 a: RSS heading link. */
#content div.rss h3 a {
color: @purp-link0;
text-decoration: none;
}
 
/* #jump-to-nav: Skip link container text. */
#jump-to-nav {
color: @purp-text2;
}
 
/* #jump-to-nav a: Skip link styling. */
#jump-to-nav a {
color: @purp-link0;
text-decoration: none;
}
 
/* #jump-to-nav a:hover/:focus: Hover/focus state for skip links. */
#jump-to-nav a:hover,
#jump-to-nav a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .firstHeading: Page title heading color. */
.firstHeading {
color: @purp-text1;
}
 
/* .mw-indicators: Container for page indicator elements. */
.mw-indicators {
color: @purp-text2;
}
 
/* .mw-indicator: Individual page indicator elements. */
.mw-indicator {
color: @purp-text2;
}
 
/* .mw-indicator a: Indicator links. */
.mw-indicator a {
color: @purp-link0;
text-decoration: none;
}
 
/* .mw-indicator a:hover/:focus: Hover/focus state for indicator links. */
.mw-indicator a:hover,
.mw-indicator a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* #siteNotice: Site notice container text. */
#siteNotice {
color: @purp-text1;
}
 
/* #siteNotice .mw-body-content: Notice content wrapper text. */
#siteNotice .mw-body-content {
color: @purp-text1;
}
 
/* #siteNotice p: Ensures notice paragraphs inherit readable text color. */
#siteNotice p {
color: @purp-text1;
}
 
/* .mw-site-notice: Alternate site notice container text. */
.mw-site-notice {
color: @purp-text1;
}
 
/* .mw-body h1–h6: Base heading styles inside content. */
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
color: @purp-text1;
padding-top: 0;
border-bottom: 1px solid @purp-border1;
width: auto;
}
 
/* .mw-body h3–h6: Secondary heading adjustments inside content. */
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
border-bottom: none;
font-weight: bold;
font-weight: bold;
background-image: url( https://mewsie.world/CoraTOWiki/images/9/97/LeftArrow.png );
background-size: contain;
background-repeat: no-repeat;
background-position: center;
position: relative;
margin-left: 6px;
transition: transform 0.3s ease;
}
}


/* .mw-body h1–h6 .mw-headline: Heading headline span styling. */
body.skin-vector-legacy .personal-menu-container.expanded .personal-menu-header::after {
.mw-body h1 .mw-headline,
transform: rotate( 180deg );
.mw-body h2 .mw-headline,
.mw-body h3 .mw-headline,
.mw-body h4 .mw-headline,
.mw-body h5 .mw-headline,
.mw-body h6 .mw-headline {
color: @purp-text1;
}
}


/* .mw-body h1–h6 .mw-editsection: Edit section link area inside headings. */
body.skin-vector-legacy .personal-menu-content {
.mw-body h1 .mw-editsection,
position: absolute;
.mw-body h2 .mw-editsection,
top: 0;
.mw-body h3 .mw-editsection,
right: 100%;
.mw-body h4 .mw-editsection,
border: 1px solid;
.mw-body h5 .mw-editsection,
border-radius: 14px;
.mw-body h6 .mw-editsection {
padding: 10px;
color: @purp-link0;
width: 0;
overflow: hidden;
opacity: 0;
transition: width 0.4s ease, opacity 0.3s ease;
display: flex;
flex-direction: column;
}
}


/* .mw-editsection: Edit section container color. */
body.skin-vector-legacy .personal-menu-container.expanded .personal-menu-content {
.mw-editsection {
width: 180px;
color: @purp-link0;
opacity: 1;
}
}


/* .mw-editsection a: Edit section links. */
body.skin-vector-legacy .personal-menu-list {
.mw-editsection a {
list-style: none;
color: @purp-link0;
margin: 0;
padding: 0;
}
}


/* .mw-editsection a:hover/:focus: Hover/focus state for edit section links. */
body.skin-vector-legacy .personal-menu-list li {
.mw-editsection a:hover,
margin: 5px 0;
.mw-editsection a:focus {
white-space: nowrap;
color: @purp-link2;
border-bottom: 1px solid;
}
}


/* .mw-editsection-bracket: Bracket text around edit links. */
body.skin-vector-legacy .personal-menu-list li:last-child {
.mw-editsection-bracket {
border-bottom: 0;
color: @purp-text2;
}
}


/* .mw-body a: Default link styling in article content. */
body.skin-vector-legacy .personal-menu-list a {
.mw-body a {
display: block;
text-decoration: none;
text-decoration: none;
color: @purp-link0;
padding: 8px 10px;
border-radius: 10px;
border-left: 3px solid;
transition: background 0.3s ease, padding-left 0.3s ease, color 0.3s ease;
}
}


/* .mw-body a:visited: Visited link styling in article content. */
body.skin-vector-legacy .personal-menu-list a:hover {
.mw-body a:visited {
padding-left: 18px;
color: @purp-link1;
}
}


/* .mw-body a:hover/:focus: Hover/focus state for article content links. */
body.skin-vector-legacy .personal-menu-list #pt-anonuserpage {
.mw-body a:hover,
display: block;
.mw-body a:focus {
padding: 8px 10px;
text-decoration: underline;
border-radius: 10px;
color: @purp-link2;
border-left: 3px solid;
background: none;
color: inherit;
}
}


/* .mw-body a.new, #bodyContent a.new: "Red links" for missing pages in content. */
body.skin-vector-legacy .personal-menu-list #pt-anonuserpage:hover {
.mw-body a.new,
padding-left: 18px;
#bodyContent a.new {
color: @purp-link-new;
}
}


/* .mw-body a.new:visited, #bodyContent a.new:visited: Visited state for "red links". */
body.skin-vector-legacy .personal-menu-list a.mw-ui-button {
.mw-body a.new:visited,
background: none;
#bodyContent a.new:visited {
color: @purp-link-new;
}
 
/* .mw-body a.external, #content a.external: External link styling in content. */
.mw-body a.external,
#content a.external {
color: @purp-link0;
}
 
/* .mw-body a.external: Selector alias for older tooling and rule audits. */
.mw-body a.external {
color: @purp-link0;
}
 
/* .mw-body a.external:visited, #content a.external:visited: Visited state for external links. */
.mw-body a.external:visited,
#content a.external:visited {
color: @purp-link1;
}
 
/* .mw-body a.external:visited: Selector alias for older tooling and rule audits. */
.mw-body a.external:visited {
color: @purp-link1;
}
 
/* .mw-body a.external:hover/:focus: Hover/focus state for external links. */
.mw-body a.external:hover,
.mw-body a.external:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .mw-body a.external:active: Active state for external links. */
.mw-body a.external:active {
color: @purp-link2;
}
 
/* #content a.extiw:active: Active state for interwiki links inside the content container. */
#content a.extiw:active {
color: @purp-link2;
}
 
/* .mw-body img: Image background reset inside content. */
.mw-body img {
background-color: transparent;
}
 
/* .mw-body-content p: Paragraph text color inside content. */
.mw-body-content p {
color: @purp-text1;
}
 
/* .mw-body-content ul, .mw-body-content ol: List text color inside content. */
.mw-body-content ul,
.mw-body-content ol {
color: @purp-text1;
}
 
/* .mw-body-content li: List item text color inside content. */
.mw-body-content li {
color: @purp-text1;
}
 
/* .mw-body-content dl: Definition list text color inside content. */
.mw-body-content dl {
color: @purp-text1;
}
 
/* .mw-body-content dt: Definition term text color inside content. */
.mw-body-content dt {
color: @purp-text1;
}
 
/* .mw-body-content dd: Definition description text color inside content. */
.mw-body-content dd {
color: @purp-text1;
}
 
/* .mw-parser-output: Parser output root inside content. */
.mw-parser-output {
color: @purp-text1;
}
 
/* .mw-parser-output .toc, .mw-parser-output #toc: TOC container styling inside parser output. */
.mw-parser-output .toc,
.mw-parser-output #toc {
border: 1px solid @purp-border1;
background-color: @purp-surface0;
}
 
/* .mw-parser-output .toc .toctitle, .mw-parser-output #toc .toctitle: TOC title styling inside parser output. */
.mw-parser-output .toc .toctitle,
.mw-parser-output #toc .toctitle {
color: @purp-text1;
}
 
/* .mw-parser-output .toc ul, .mw-parser-output #toc ul: TOC list styling inside parser output. */
.mw-parser-output .toc ul,
.mw-parser-output #toc ul {
color: @purp-text1;
}
 
/* .mw-parser-output .toc li, .mw-parser-output #toc li: TOC list item styling inside parser output. */
.mw-parser-output .toc li,
.mw-parser-output #toc li {
color: @purp-text1;
}
 
/* .mw-parser-output .tocnumber: TOC number styling inside parser output. */
.mw-parser-output .tocnumber {
color: @purp-link0;
}
 
/* .mw-parser-output .toctext: TOC link text styling inside parser output. */
.mw-parser-output .toctext {
color: @purp-text1;
}
 
/* .mw-body-content table: Table surface and text colors inside content. */
.mw-body-content table {
color: @purp-text1;
background-color: @purp-bg1;
}
 
/* .mw-body-content caption: Table caption text inside content. */
.mw-body-content caption {
color: @purp-text1;
}
 
/* .mw-body-content th, .mw-body-content td: Table cell borders and text inside content. */
.mw-body-content th,
.mw-body-content td {
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .mw-body-content hr: Horizontal rule styling inside content. */
.mw-body-content hr {
color: @purp-border1;
background-color: @purp-border1;
}
 
/* .mw-body-content blockquote: Blockquote text and border inside content. */
.mw-body-content blockquote {
color: @purp-text1;
border-left: 3px solid @purp-border1;
}
 
/* .mw-body-content pre/code/kbd/samp/.mw-code: Code element surface and text colors. */
.mw-body-content pre,
.mw-body-content code,
.mw-body-content kbd,
.mw-body-content samp,
.mw-code {
background-color: @purp-surface0;
color: @purp-text1;
}
 
/* .mw-body-content pre: Preformatted block border and sizing. */
.mw-body-content pre {
border: 1px dashed @purp-border1;
font-size: 100% !important;
}
 
/* .mw-body-content code: Inline code border reset. */
.mw-body-content code {
border: 0;
border: 0;
box-shadow: none;
font-weight: inherit;
text-shadow: none;
}
}


/* .mw-body-content form: Form container text color inside content. */
.mw-body-content form {
color: @purp-text1;
}
/* .mw-body-content fieldset: Fieldset border inside content. */
.mw-body-content fieldset {
border: 1px solid @purp-border1;
}
/* .mw-body-content legend: Legend text color inside content. */
.mw-body-content legend {
color: @purp-text1;
}
/* .mw-body-content label: Label text color inside content. */
.mw-body-content label {
color: @purp-text1;
}
/* .mw-body-content input/textarea/select/button: Form control styling inside content. */
.mw-body-content input,
.mw-body-content textarea,
.mw-body-content select,
.mw-body-content button {
background-color: @purp-bg1;
border: 1px solid @purp-border1;
color: @purp-text0;
}
/* .mw-body-content input[type='text'/...], textarea: Textual form controls inside content. */
.mw-body-content input[type='text'],
.mw-body-content input[type='search'],
.mw-body-content input[type='email'],
.mw-body-content input[type='password'],
.mw-body-content input[type='number'],
.mw-body-content textarea {
background-color: @purp-bg1;
border: 1px solid @purp-border1;
color: @purp-text0;
}
/* .mw-body-content input[type='checkbox'/'radio']: Accent color for choice controls. */
.mw-body-content input[type='checkbox'],
.mw-body-content input[type='radio'] {
accent-color: @purp-link0;
}
/* .mw-body-content *:focus: Focus border color for form controls. */
.mw-body-content input:focus,
.mw-body-content textarea:focus,
.mw-body-content select:focus,
.mw-body-content button:focus {
border-color: @purp-link0;
}
/* #mw-content-text: Main content text container. */
#mw-content-text {
color: @purp-text1;
}
/* #mw-content-text .mw-parser-output: Parser output root inside main content text container. */
#mw-content-text .mw-parser-output {
color: @purp-text1;
}
/* .mw-content-ltr: LTR content container text color. */
.mw-content-ltr {
color: @purp-text1;
}
/* .mw-content-rtl: RTL content container text color. */
.mw-content-rtl {
color: @purp-text1;
}
/* #catlinks: Category links box container. */
#catlinks {
border: 1px solid @purp-border1;
background-color: @purp-surface0;
}
/* #catlinks ul: Category links list container. */
#catlinks ul {
background-color: transparent;
}
/* #catlinks li: Category links list items. */
#catlinks li {
background-color: transparent;
}
/* #catlinks li a: Category link styling. */
#catlinks li a {
color: @purp-link0;
text-decoration: none;
}
/* #catlinks li a:hover/:focus: Hover/focus state for category links. */
#catlinks li a:hover,
#catlinks li a:focus {
color: @purp-link2;
text-decoration: underline;
}
/* .catlinks: Alternate category links box container. */
.catlinks {
border: 1px solid @purp-border1;
background-color: @purp-surface0;
color: @purp-text1;
}
/* .catlinks ul: Alternate category links list container. */
.catlinks ul {
background-color: transparent;
}
/* .catlinks li: Alternate category links list items. */
.catlinks li {
background-color: transparent;
}
/* .catlinks a: Alternate category link styling. */
.catlinks a {
color: @purp-link0;
text-decoration: none;
}
/* .catlinks a:hover/:focus: Hover/focus state for alternate category links. */
.catlinks a:hover,
.catlinks a:focus {
color: @purp-link2;
text-decoration: underline;
}
/* #mw-normal-catlinks: Default category links container text. */
#mw-normal-catlinks {
color: @purp-text1;
}
/* #mw-hidden-catlinks: Hidden category links container text. */
#mw-hidden-catlinks {
color: @purp-text1;
}
/* #mw-hidden-catlinks.hidden-catlinks: Hidden category links state container text. */
#mw-hidden-catlinks.hidden-catlinks {
color: @purp-text1;
}
/* #mw-hidden-catlinks ul: Hidden category links list container. */
#mw-hidden-catlinks ul {
background-color: transparent;
}
/* #mw-hidden-catlinks li: Hidden category links list items. */
#mw-hidden-catlinks li {
background-color: transparent;
}
/* #mw-hidden-catlinks li a: Hidden category link styling. */
#mw-hidden-catlinks li a {
color: @purp-link0;
text-decoration: none;
}
/* #mw-hidden-catlinks li a:hover/:focus: Hover/focus state for hidden category links. */
#mw-hidden-catlinks li a:hover,
#mw-hidden-catlinks li a:focus {
color: @purp-link2;
text-decoration: underline;
}
/*------------------------------------------  TABLE OF CONTENTS  ------------------------------------------*/
/* #toc, .toc: TOC container styling (legacy `#toc` and class-based variants). */
#toc {
border: 1px solid @purp-border1;
background-color: @purp-surface0;
}
/* .toc: Table of contents container (class-based variant). */
.toc {
border: 1px solid @purp-border1;
background-color: @purp-surface0;
}
/* .toc .toctitle: TOC title text. */
.toc .toctitle {
color: @purp-text1;
}
/* .toc .tocnumber: TOC section number text. */
.toc .tocnumber {
color: @purp-link0;
}
/* .toc .toctext: TOC section link text. */
.toc .toctext {
color: @purp-text1;
}
/*------------------------------------------  FOOTER  ------------------------------------------*/
/* #footer and related lists: Footer links and metadata. */
#footer {
background-color: transparent;
color: @purp-text2;
}
/* #footer ul: Footer list containers. */
#footer ul {
background-color: transparent;
}
/* #footer li: Footer list item text. */
#footer li {
color: @purp-text2;
}
/* #footer ul li: Selector alias for legacy footer markup variants. */
#footer ul li {
color: @purp-text2;
}
/* #footer a: Footer link styling. */
#footer a {
color: @purp-link0;
text-decoration: none;
}
/* #footer a:hover/:focus: Hover/focus state for footer links. */
#footer a:hover,
#footer a:focus {
color: @purp-link2;
text-decoration: underline;
}
/* #footer-info: Footer info block container. */
#footer-info {
color: @purp-text2;
}
/* #footer-info li: Footer info list item text. */
#footer-info li {
color: @purp-text2;
}


/* #footer-places: Footer places block container. */
#pt-theme-menu {
#footer-places {
position: relative;
color: @purp-text2;
}
}


/* #footer-places li: Footer places list item text. */
#pt-theme-menu .themeMenu {
#footer-places li {
position: relative;
color: @purp-text2;
}
 
/* #footer-icons: Footer icons block container. */
#footer-icons {
color: @purp-text2;
}
 
/* #footer-icons li: Footer icons list item text. */
#footer-icons li {
color: @purp-text2;
}
 
/* #footer-icons: Icon list. Keep icons transparent while allowing MW to render special button-like entries. */
#footer-icons li:not( #footer-poweredbyico ) a {
background: transparent;
}
 
/* #footer-poweredbyico a: Ensures the background spans the whole "button" on newer MediaWiki versions. */
#footer-poweredbyico a {
display: inline-block;
display: inline-block;
}
}


/* #footer-icons li a img: Footer icon image background reset. */
#pt-theme-menu .themeMenu-toggle {
#footer-icons li a img {
appearance: none;
background: transparent;
background: transparent;
border: 1px solid transparent;
border-radius: 4px;
color: inherit;
cursor: pointer;
font: inherit;
line-height: 1.2;
padding: 0.25em 0.55em;
}
}


/* .mw-footer: Footer container in newer MediaWiki markup. */
#pt-theme-menu .themeMenu-toggle:hover,
.mw-footer {
#pt-theme-menu .themeMenu.is-open .themeMenu-toggle {
background-color: transparent;
background: var( --surface );
color: @purp-text2;
border-color: var( --border );
}
}


/* .mw-footer ul: Footer lists in newer markup. */
#pt-theme-menu .themeMenu-dropdown {
.mw-footer ul {
display: none;
background-color: transparent;
position: absolute;
right: 0;
top: calc( 100% + 0.35em );
min-width: 180px;
margin: 0;
padding: 0.25em 0;
list-style: none;
background: var( --surface );
border: 1px solid var( --border );
border-radius: 6px;
box-shadow: 0 6px 18px var( --shadow-medium );
z-index: 9999;
}
}


/* .mw-footer li: Footer list item text in newer markup. */
#pt-theme-menu .themeMenu.is-open .themeMenu-dropdown {
.mw-footer li {
display: block;
color: @purp-text2;
}
}


/* .mw-footer a: Footer links in newer markup. */
#pt-theme-menu .themeMenu-itemWrap {
.mw-footer a {
margin: 0;
color: @purp-link0;
padding: 0;
text-decoration: none;
}
 
/* .mw-footer a:hover/:focus: Hover/focus state for footer links in newer markup. */
.mw-footer a:hover,
.mw-footer a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .mw-portlet: Generic portlet container. */
.mw-portlet {
color: @purp-text1;
}
 
/* .mw-portlet h3: Generic portlet heading text. */
.mw-portlet h3 {
color: @purp-text1;
}
 
/* .mw-portlet .mw-portlet-body: Generic portlet body container. */
.mw-portlet .mw-portlet-body {
background-color: transparent;
}
 
/* .mw-portlet ul: Generic portlet list container. */
.mw-portlet ul {
background-color: transparent;
}
 
/* .mw-portlet li: Generic portlet list items. */
.mw-portlet li {
background-color: transparent;
}
}


/* .mw-portlet li a: Generic portlet links. */
#pt-theme-menu .themeMenu-item {
.mw-portlet li a {
display: block;
color: @purp-link0;
padding: 0.45em 0.8em;
color: var( --text );
text-decoration: none;
text-decoration: none;
white-space: nowrap;
}
}


/* .mw-portlet li a:hover/:focus: Hover/focus state for portlet links. */
#pt-theme-menu .themeMenu-item:hover,
.mw-portlet li a:hover,
#pt-theme-menu .themeMenu-item:focus {
.mw-portlet li a:focus {
background: var( --bg-1 );
color: @purp-link2;
color: var( --text-strong );
text-decoration: underline;
}
}


/* .mw-portlet-label: Generic portlet label container. */
#pt-theme-menu .themeMenu-item.is-current {
.mw-portlet-label {
font-weight: 700;
color: @purp-text1;
}
}


/* .mw-portlet-label span: Generic portlet label text span. */
#mw-theme-floating {
.mw-portlet-label span {
position: fixed;
color: @purp-text1;
top: 0.6em;
right: 0.8em;
z-index: 10000;
}
}


/* .vector-menu: Vector menu container base text color. */
#mw-theme-floating .themeMenu {
.vector-menu {
position: relative;
color: @purp-text1;
display: inline-block;
}
}


/* .vector-menu-heading: Vector menu heading text. */
#mw-theme-floating .themeMenu-toggle {
.vector-menu-heading {
appearance: none;
color: @purp-text1;
background: var( --surface );
}
border: 1px solid var( --border );
 
border-radius: 6px;
/* .vector-menu-heading-label: Vector menu heading label container. */
color: var( --text );
.vector-menu-heading-label {
cursor: pointer;
color: @purp-text1;
font: inherit;
}
line-height: 1.2;
 
padding: 0.35em 0.65em;
/* .vector-menu-heading-label span: Vector menu heading label text span. */
box-shadow: 0 6px 18px var( --shadow-soft );
.vector-menu-heading-label span {
color: @purp-text1;
}
 
/* .vector-menu-checkbox: Vector menu toggle checkbox accent color. */
.vector-menu-checkbox {
accent-color: @purp-link0;
}
 
/* .vector-menu-content: Vector menu panel surface. */
.vector-menu-content {
background-color: @purp-surface0;
}
 
/* .vector-menu-content-list: Vector menu list surface and border. */
.vector-menu-content-list {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* .vector-menu-content-list li: Vector menu list items. */
.vector-menu-content-list li {
background-color: transparent;
}
 
/* .vector-menu-content-list li a: Vector menu links. */
.vector-menu-content-list li a {
color: @purp-link0;
text-decoration: none;
}
 
/* .vector-menu-content-list li a:hover/:focus: Hover/focus state for Vector menu links. */
.vector-menu-content-list li a:hover,
.vector-menu-content-list li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-menu-tabs: Tab strip container in modern Vector markup. */
.vector-menu-tabs {
background-color: transparent;
}
 
/* .vector-menu-tabs ul: Tab list container. */
.vector-menu-tabs ul {
background-color: transparent;
}
 
/* .vector-menu-tabs li: Tab list items. */
.vector-menu-tabs li {
background-color: transparent;
background-image: none;
}
 
/* .vector-menu-tabs li.selected/.new: Selected and "red link" tab item variants. */
.vector-menu-tabs li.selected,
.vector-menu-tabs li.new {
background-color: transparent;
}
 
/* .vector-menu-tabs li a/span: Tab label links and text. */
.vector-menu-tabs li a,
.vector-menu-tabs li span,
.vector-menu-tabs li a span {
color: @purp-link0;
}
 
/* .vector-menu-tabs li a: Selector alias for older tooling and rule audits. */
.vector-menu-tabs li a {
color: @purp-link0;
}
 
/* .vector-menu-tabs li a.new (+ variants): "Red link" tab label variants. */
.vector-menu-tabs li a.new,
.vector-menu-tabs li.new a,
.vector-menu-tabs li.new a:visited,
.vector-menu-tabs .new a:visited {
color: @purp-link-new;
}
 
/* .vector-menu-tabs li.selected a (+ variants): Selected tab link styling. */
.vector-menu-tabs li.selected a,
.vector-menu-tabs li.selected a:visited,
.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited {
color: @purp-text1;
text-decoration: none;
background-color: @purp-bg1;
}
 
/* .vector-menu-tabs .selected: Fallback selector for selected tab entries (older markup variants). */
.vector-menu-tabs .selected {
background-color: transparent;
}
 
/* .vector-menu-tabs li a:hover/:focus: Hover/focus state for tab links. */
.vector-menu-tabs li a:hover,
.vector-menu-tabs li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-menu-dropdown: Dropdown menu container in modern Vector markup. */
.vector-menu-dropdown {
color: @purp-text1;
}
 
/* .vector-menu-dropdown heading: Dropdown menu heading text. */
.vector-menu-dropdown .vector-menu-heading,
.vector-menu-dropdown h3 {
color: @purp-text1;
}
 
/* .vector-menu-dropdown .vector-menu-heading: Selector alias for older tooling and rule audits. */
.vector-menu-dropdown .vector-menu-heading {
color: @purp-text1;
}
 
/* .vector-menu-dropdown heading ::after: Dropdown caret icon contrast. */
.vector-menu-dropdown .vector-menu-heading::after,
.vector-menu-dropdown h3::after {
filter: invert( 100% );
}
 
/* .vector-menu-dropdown .vector-menu-heading::after: Selector alias for older tooling and rule audits. */
.vector-menu-dropdown .vector-menu-heading::after {
filter: invert( 100% );
}
 
/* .vector-menu-dropdown .vector-menu-content: Dropdown menu panel surface and border. */
.vector-menu-dropdown .vector-menu-content {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* .vector-menu-dropdown .vector-menu-content-list: Dropdown menu list surface and border. */
.vector-menu-dropdown .vector-menu-content-list {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* .vector-menu-dropdown .vector-menu-content-list li: Dropdown menu list items. */
.vector-menu-dropdown .vector-menu-content-list li {
background-color: transparent;
}
 
/* .vector-menu-dropdown links: Dropdown menu link variants across MW versions. */
.vector-menu-dropdown .vector-menu-content-list li a,
.vector-menu-dropdown li.mw-list-item a,
.vector-menu-dropdown .mw-list-item a {
color: @purp-link0;
text-decoration: none;
}
 
/* .vector-menu-dropdown li.mw-list-item a (MW 1.39+): Selector alias matching original purp.less. */
.vector-menu-dropdown li.mw-list-item a /* 1.39+ */ {
color: @purp-link0;
text-decoration: none;
}
 
/* .vector-menu-dropdown .vector-menu-content-list li a:hover/:focus: Hover/focus state for dropdown links. */
.vector-menu-dropdown .vector-menu-content-list li a:hover,
.vector-menu-dropdown .vector-menu-content-list li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-menu-dropdown open state: Checked/hovered state shows the dropdown panel surface. */
.vector-menu-dropdown .vector-menu-checkbox:checked ~ .vector-menu-content,
.vector-menu-dropdown:hover .vector-menu-content {
background-color: @purp-surface0;
}
 
/* .vector-menu-empty: Empty menu indicator styling. */
.vector-menu-empty {
opacity: 0.7;
}
}


/* .vector-menu-empty .vector-menu-heading: Empty menu heading muted color. */
#mw-theme-floating .themeMenu-toggle:hover,
.vector-menu-empty .vector-menu-heading {
#mw-theme-floating .themeMenu.is-open .themeMenu-toggle {
color: @purp-text2;
background: var( --bg-1 );
}
}


/* .vector-menu-empty .vector-menu-content: Empty menu content hidden. */
#mw-theme-floating .themeMenu-dropdown {
.vector-menu-empty .vector-menu-content {
display: none;
display: none;
position: absolute;
right: 0;
top: calc( 100% + 0.35em );
min-width: 180px;
margin: 0;
padding: 0.25em 0;
list-style: none;
background: var( --surface );
border: 1px solid var( --border );
border-radius: 6px;
box-shadow: 0 6px 18px var( --shadow-medium );
z-index: 10001;
}
}


/* .vector-menu-portal: Portal menu container base text color. */
#mw-theme-floating .themeMenu.is-open .themeMenu-dropdown {
.vector-menu-portal {
display: block;
color: @purp-text0;
}
 
/* .vector-menu-portal .vector-menu-heading: Portal menu heading link color. */
.vector-menu-portal .vector-menu-heading {
color: @purp-link0;
}
 
/* .vector-menu-portal .vector-menu-content: Portal menu content surface reset. */
.vector-menu-portal .vector-menu-content {
background-color: transparent;
}
 
/* .vector-menu-portal .vector-menu-content-list: Portal menu list surface reset. */
.vector-menu-portal .vector-menu-content-list {
background-color: transparent;
}
 
/* .vector-menu-portal .vector-menu-content-list li: Portal menu list items. */
.vector-menu-portal .vector-menu-content-list li {
background-color: transparent;
}
}


/* .vector-menu-portal .vector-menu-content-list li a: Portal menu links. */
#mw-theme-floating .themeMenu-item {
.vector-menu-portal .vector-menu-content-list li a {
display: block;
color: @purp-link0;
padding: 0.45em 0.8em;
color: var( --text );
text-decoration: none;
text-decoration: none;
white-space: nowrap;
}
}


/* #mw-panel .vector-menu-portal: Sidebar portal container in modern markup. */
#mw-theme-floating .themeMenu-item:hover,
#mw-panel .vector-menu-portal {
#mw-theme-floating .themeMenu-item:focus {
background: none;
background: var( --bg-1 );
border-bottom: 1px solid @purp-muted-border;
color: var( --text-strong );
}
 
/* #mw-panel .vector-menu-portal .vector-menu-heading: Sidebar portal heading in modern markup. */
#mw-panel .vector-menu-portal .vector-menu-heading {
color: @purp-link0;
}
 
/* #mw-panel .vector-menu-portal .vector-menu-content: Sidebar portal content surface reset. */
#mw-panel .vector-menu-portal .vector-menu-content {
background-color: transparent;
}
 
/* #mw-panel .vector-menu-portal .vector-menu-content-list: Sidebar portal list surface reset. */
#mw-panel .vector-menu-portal .vector-menu-content-list {
background-color: transparent;
}
 
/* #mw-panel .vector-menu-portal .vector-menu-content-list li: Sidebar portal list items. */
#mw-panel .vector-menu-portal .vector-menu-content-list li {
background-color: transparent;
}
 
/* #mw-panel .vector-menu-portal .vector-menu-content-list li a: Sidebar portal links. */
#mw-panel .vector-menu-portal .vector-menu-content-list li a {
color: @purp-link0;
text-decoration: none;
}
 
/* #mw-panel .vector-menu-portal .vector-menu-content-list li a:hover/:focus: Hover/focus state for sidebar portal links. */
#mw-panel .vector-menu-portal .vector-menu-content-list li a:hover,
#mw-panel .vector-menu-portal .vector-menu-content-list li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-user-menu: User menu container in modern Vector markup. */
.vector-user-menu {
color: @purp-text1;
}
 
/* .vector-user-menu .vector-menu-content: User menu dropdown panel surface. */
.vector-user-menu .vector-menu-content {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* .vector-user-menu .vector-menu-content-list: User menu dropdown list surface. */
.vector-user-menu .vector-menu-content-list {
background-color: @purp-surface0;
}
 
/* .vector-user-menu .vector-menu-content-list li: User menu dropdown list items. */
.vector-user-menu .vector-menu-content-list li {
background-color: transparent;
}
 
/* .vector-user-menu .vector-menu-content-list li a: User menu dropdown links. */
.vector-user-menu .vector-menu-content-list li a {
color: @purp-link0;
text-decoration: none;
}
 
/* .vector-user-menu .vector-menu-content-list li a:hover/:focus: Hover/focus state for user menu links. */
.vector-user-menu .vector-menu-content-list li a:hover,
.vector-user-menu .vector-menu-content-list li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-user-menu .mw-portlet-body: User menu portlet body background reset. */
.vector-user-menu .mw-portlet-body {
background-color: transparent;
}
 
/* .vector-legacy-sidebar: Legacy sidebar container base text color. */
.vector-legacy-sidebar {
color: @purp-text0;
}
 
/* .vector-legacy-sidebar .vector-menu-portal ...: Legacy sidebar portlet link colors (older DOM structure). */
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a {
color: @purp-link0;
text-decoration: none;
}
 
/* .vector-legacy-sidebar ... a:visited: Visited state for legacy sidebar portal links. */
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:visited {
color: @purp-link1;
}
 
/* .vector-legacy-sidebar ... a:active: Active state for legacy sidebar portal links. */
.vector-legacy-sidebar .vector-menu-portal .vector-menu-content li a:active {
color: @purp-link2;
}
 
/* .vector-legacy-header: Legacy Vector header container base text. */
.vector-legacy-header {
color: @purp-text1;
}
 
/* .vector-legacy-footer: Legacy Vector footer container base text. */
.vector-legacy-footer {
color: @purp-text2;
}
 
/* .vector-legacy-navigation: Legacy Vector navigation container base text. */
.vector-legacy-navigation {
color: @purp-text1;
}
 
/* .vector-legacy-content: Legacy Vector content container base text. */
.vector-legacy-content {
color: @purp-text1;
}
 
/* .vector-clear: Clearfix helper used in legacy layouts. */
.vector-clear {
clear: both;
}
 
/* .vector-body: Base Vector body wrapper background reset. */
.vector-body {
background-color: transparent;
}
 
/* .vector-body-before-content: Pre-content Vector wrapper background reset. */
.vector-body-before-content {
background-color: transparent;
}
 
/* .vector-body-after-content: Post-content Vector wrapper background reset. */
.vector-body-after-content {
background-color: transparent;
}
 
/* .vector-content: Vector content wrapper background reset. */
.vector-content {
background-color: transparent;
}
 
/* .vector-content-heading: Content heading area wrapper in modern Vector. */
.vector-content-heading {
color: @purp-text1;
}
 
/* .vector-content-heading .mw-indicators: Indicator container inside modern content heading. */
.vector-content-heading .mw-indicators {
color: @purp-text2;
}
 
/* .vector-content-heading .firstHeading: Page title inside modern content heading. */
.vector-content-heading .firstHeading {
color: @purp-text1;
}
 
/* .vector-content-heading .mw-body: Content body surface inside modern content layout. */
.vector-content-heading .mw-body {
background-color: @purp-bg2;
}
 
/* .vector-page-toolbar: Modern Vector page toolbar wrapper. */
.vector-page-toolbar {
background-color: transparent;
}
 
/* .vector-page-toolbar-container: Inner toolbar container background reset. */
.vector-page-toolbar-container {
background-color: transparent;
}
 
/* .vector-page-tools: Modern Vector page tools container. */
.vector-page-tools {
color: @purp-text1;
}
 
/* .vector-page-tools .vector-menu-content: Page tools dropdown panel surface. */
.vector-page-tools .vector-menu-content {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* .vector-page-tools .vector-menu-content-list: Page tools dropdown list surface. */
.vector-page-tools .vector-menu-content-list {
background-color: @purp-surface0;
}
 
/* .vector-page-tools .vector-menu-content-list li: Page tools dropdown list items. */
.vector-page-tools .vector-menu-content-list li {
background-color: transparent;
}
 
/* .vector-page-tools .vector-menu-content-list li a: Page tools dropdown links. */
.vector-page-tools .vector-menu-content-list li a {
color: @purp-link0;
text-decoration: none;
}
 
/* .vector-page-tools .vector-menu-content-list li a:hover/:focus: Hover/focus state for page tools links. */
.vector-page-tools .vector-menu-content-list li a:hover,
.vector-page-tools .vector-menu-content-list li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-page-tools .vector-menu-heading: Page tools menu heading text. */
.vector-page-tools .vector-menu-heading {
color: @purp-text1;
}
 
/* .vector-page-tools .vector-menu-tabs: Page tools tab strip container. */
.vector-page-tools .vector-menu-tabs {
background-color: transparent;
}
 
/* .vector-page-tools .vector-menu-tabs li: Page tools tab list items. */
.vector-page-tools .vector-menu-tabs li {
background-color: transparent;
}
 
/* .vector-page-tools .vector-menu-tabs li.selected: Selected tab background for page tools. */
.vector-page-tools .vector-menu-tabs li.selected {
background-color: @purp-bg1;
}
 
/* .vector-page-tools .vector-menu-tabs li a: Page tools tab links. */
.vector-page-tools .vector-menu-tabs li a {
color: @purp-link0;
}
 
/* .vector-page-tools .vector-menu-tabs li a:hover/:focus: Hover/focus state for page tools tab links. */
.vector-page-tools .vector-menu-tabs li a:hover,
.vector-page-tools .vector-menu-tabs li a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .vector-page-tools .vector-menu-dropdown: Page tools dropdown container. */
.vector-page-tools .vector-menu-dropdown {
color: @purp-text1;
}
 
/* .vector-page-tools .vector-menu-dropdown .vector-menu-content: Page tools dropdown panel surface. */
.vector-page-tools .vector-menu-dropdown .vector-menu-content {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* .vector-page-tools dropdown open state: Checked/hovered state shows dropdown panel surface. */
.vector-page-tools .vector-menu-dropdown .vector-menu-checkbox:checked ~ .vector-menu-content,
.vector-page-tools .vector-menu-dropdown:hover .vector-menu-content {
background-color: @purp-surface0;
}
 
/* .vector-search-box: Modern Vector search box container. */
.vector-search-box {
border: 1px solid @purp-border1;
background-color: @purp-bg1;
}
 
/* .vector-search-box form: Search form background reset. */
.vector-search-box form {
background-color: transparent;
}
 
/* .vector-search-box input: Search input colors. */
.vector-search-box input {
background-color: transparent;
color: @purp-text0;
}
 
/* .vector-search-box button: Search submit button icon contrast for dark theme. */
.vector-search-box button {
background-color: transparent;
border: 0;
filter: invert( 100% );
}
 
/* .vector-search-box .suggestions: Suggestions dropdown inside modern search box. */
.vector-search-box .suggestions {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .vector-sticky-header: Sticky header surface and separation border. */
.vector-sticky-header {
background-color: @purp-bg1;
border-bottom: 1px solid @purp-border1;
}
 
/* .mw-jump-link: Jump link container text (skip-to-content links). */
.mw-jump-link {
color: @purp-text2;
}
 
/* .mw-jump-link a: Jump link styling. */
.mw-jump-link a {
color: @purp-link0;
text-decoration: none;
}
 
/* .mw-jump-link a:hover/:focus: Hover/focus state for jump links. */
.mw-jump-link a:hover,
.mw-jump-link a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/*------------------------------------------  MEDIAWIKI UI (OOUI / MW-UI)  ------------------------------------------*/
/* .mw-ui-button: Generic button styling used across Special pages. */
.mw-ui-button {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .mw-ui-button:hover/:focus: Hover/focus state for MW-UI buttons. */
.mw-ui-button:hover,
.mw-ui-button:focus {
background-color: @purp-surface1;
border-color: @purp-link0;
}
 
/* .mw-ui-button:active: Active/pressed state for MW-UI buttons. */
.mw-ui-button:active {
background-color: @purp-bg1;
border-color: @purp-link1;
}
 
/* .oo-ui-icon-expand, .oo-ui-icon-collapse (and MW equivalents): Makes monochrome icons readable on dark surfaces. */
.oo-ui-icon-expand,
.mw-ui-icon-expand::before,
.oo-ui-icon-collapse,
.mw-ui-icon-collapse::before {
filter: invert( 100% );
}
 
/* a#mw-createaccount-join: Removes default highlight styling that clashes with the dark theme. */
a#mw-createaccount-join {
box-shadow: none;
}
 
/* .mw-ui-vform labels and number widgets: Improves contrast for form text on account-related Special pages. */
.mw-ui-vform > div label,
div.mw-number-text {
color: @purp-text1;
}
 
/* div.mw-number-text h3: Emphasized headings inside form helper widgets. */
div.mw-number-text h3 {
color: @purp-text0;
}
 
/* .mw-createacct-benefits-container h3: Forces readable headings in the account benefits panel. */
.mw-createacct-benefits-container h3 {
color: @purp-text1 !important;
}
 
/*------------------------------------------  THEME UTILITIES  ------------------------------------------*/
/* .gradient: Reusable button-like gradient background. */
.gradient {
background-image: -webkit-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
background-image: -moz-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
background-image: -ms-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
background-image: -o-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
background-image: linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
}
}


/* .gradient:hover: Hover gradient for interactive elements. */
#mw-theme-floating .themeMenu-item.is-current {
.gradient:hover {
font-weight: 700;
background-image: -webkit-linear-gradient( top, @purp-grad-hover-top, @purp-grad-bottom );
background-image: -moz-linear-gradient( top, @purp-grad-hover-top, @purp-grad-bottom );
background-image: -ms-linear-gradient( top, @purp-grad-hover-top, @purp-grad-bottom );
background-image: -o-linear-gradient( top, @purp-grad-hover-top, @purp-grad-bottom );
background-image: linear-gradient( top, @purp-grad-hover-top, @purp-grad-bottom );
}
}


/* .rgradient: Reusable reverse gradient for "pressed" or alternate direction styles. */
/* ========================================
.rgradient {
  UserMenu.css
background-image: -webkit-linear-gradient( bottom, @purp-grad-top, @purp-grad-bottom );
  Menu de usuário lateral (custom)
background-image: -moz-linear-gradient( bottom, @purp-grad-top, @purp-grad-bottom );
  ======================================== */
background-image: -ms-linear-gradient( bottom, @purp-grad-top, @purp-grad-bottom );
background-image: -o-linear-gradient( bottom, @purp-grad-top, @purp-grad-bottom );
background-image: linear-gradient( bottom, @purp-grad-top, @purp-grad-bottom );
}


/* .rgradient:hover: Hover state for reverse gradients. */
/* ==========================================================================
.rgradient:hover {
  Container (posição e layout)
background-image: -webkit-linear-gradient( bottom, @purp-grad-hover-top, @purp-grad-bottom );
  ========================================================================== */
background-image: -moz-linear-gradient( bottom, @purp-grad-hover-top, @purp-grad-bottom );
body.skin-vector-legacy .user-menu-container {
background-image: -ms-linear-gradient( bottom, @purp-grad-hover-top, @purp-grad-bottom );
position: fixed;
background-image: -o-linear-gradient( bottom, @purp-grad-hover-top, @purp-grad-bottom );
top: 120px;
background-image: linear-gradient( bottom, @purp-grad-hover-top, @purp-grad-bottom );
right: 0;
z-index: 1000;
overflow: visible;
display: flex;
flex-direction: row;
}
}


/* .tabcontainer .tab: Optional custom tab styling that matches the purple theme. */
/* ==========================================================================
.tabcontainer .tab {
  Header (toggle)
background-color: @purp-surface0;
  ========================================================================== */
background-image: -webkit-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
body.skin-vector-legacy .user-menu-header {
background-image: -moz-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
display: flex;
background-image: -ms-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
align-items: center;
background-image: -o-linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
padding: 6px 12px;
background-image: linear-gradient( top, @purp-grad-top, @purp-grad-bottom );
top: 2;
border: 2px solid @purp-border1;
right: 0;
position: fixed;
cursor: pointer;
cursor: pointer;
float: left;
user-select: none;
margin: 0 1px -2px;
transition: background 0.3s ease;
padding: 3px;
border-radius: 14px 0 0 14px;
text-align: center;
white-space: nowrap;
white-space: nowrap;
font-weight: bold;
height: auto;
writing-mode: horizontal-tb;
border: 1px solid;
flex-direction: row;
}
}


/* .tabcontainer .tab:hover: Hover styling for custom tabs. */
body.skin-vector-legacy .user-menu-header::after {
.tabcontainer .tab:hover {
content: '';
background-color: @purp-surface1;
display: inline-block;
background-image: -webkit-linear-gradient( top, @purp-grad-hover-top, @purp-grad-hover-bottom );
width: 25px;
background-image: -moz-linear-gradient( top, @purp-grad-hover-top, @purp-grad-hover-bottom );
height: 25px;
background-image: -ms-linear-gradient( top, @purp-grad-hover-top, @purp-grad-hover-bottom );
font-weight: bold;
background-image: -o-linear-gradient( top, @purp-grad-hover-top, @purp-grad-hover-bottom );
background-image: url( https://mewsie.world/CoraTOWiki/images/9/97/LeftArrow.png );
background-image: linear-gradient( top, @purp-grad-hover-top, @purp-grad-hover-bottom );
background-size: contain;
color: @purp-link2;
background-repeat: no-repeat;
background-position: center;
position: relative;
margin-left: 6px;
transition: transform 0.3s ease;
}
}


/* .tabcontainer .tab.active: Active tab styling for custom tab widgets. */
body.skin-vector-legacy .user-menu-container.expanded .user-menu-header::after {
.tabcontainer .tab.active {
transform: rotate( 180deg );
background-color: @purp-bg1 !important;
background-image: -webkit-linear-gradient( top, @purp-surface0, @purp-bg1 );
background-image: -moz-linear-gradient( top, @purp-surface0, @purp-bg1 );
background-image: -ms-linear-gradient( top, @purp-surface0, @purp-bg1 );
background-image: -o-linear-gradient( top, @purp-surface0, @purp-bg1 );
background-image: linear-gradient( top, @purp-surface0, @purp-bg1 );
border-bottom: 2px solid @purp-bg1;
color: @purp-link2;
}
}


/* .mw-ui-button:disabled/[disabled]: Disabled state for MW-UI buttons. */
/* ==========================================================================
.mw-ui-button:disabled,
  Conteúdo (área expansível)
.mw-ui-button[disabled] {
  ========================================================================== */
background-color: @purp-bg1;
body.skin-vector-legacy .user-menu-content {
border-color: @purp-muted-border;
position: absolute;
color: @purp-text2;
top: 0;
right: 100%;
border: 1px solid;
border-radius: 14px;
padding: 10px;
width: 0;
overflow: hidden;
opacity: 0;
transition: width 0.4s ease, opacity 0.3s ease;
display: flex;
flex-direction: column;
}
}


/* .mw-ui-input: MW-UI input field styling. */
body.skin-vector-legacy .user-menu-container.expanded .user-menu-content {
.mw-ui-input {
width: 180px;
background-color: @purp-bg1;
opacity: 1;
border: 1px solid @purp-border1;
color: @purp-text0;
}
}


/* .mw-ui-input:focus: Focus border for MW-UI inputs. */
/* ==========================================================================
.mw-ui-input:focus {
  Lista de links
border-color: @purp-link0;
  ========================================================================== */
body.skin-vector-legacy .user-menu-list {
list-style: none;
margin: 0;
padding: 0;
}
}


/* .mw-ui-icon: MW-UI icon contrast for dark theme. */
body.skin-vector-legacy .user-menu-list li {
.mw-ui-icon {
margin: 5px 0;
filter: invert( 100% );
white-space: nowrap;
}
border-bottom: 1px solid;
 
/* .mw-ui-icon-element: MW-UI icon element contrast. */
.mw-ui-icon-element {
filter: invert( 100% );
}
 
/* .mw-ui-icon-before:before: Pseudo-element icon contrast. */
.mw-ui-icon-before:before {
filter: invert( 100% );
}
 
/* .mw-ui-icon-after:after: Pseudo-element icon contrast. */
.mw-ui-icon-after:after {
filter: invert( 100% );
}
 
/* #mw-pt-login: Personal tools login entry in some skins/versions. */
#mw-pt-login {
color: @purp-text1;
}
 
/* #mw-pt-logout: Personal tools logout entry in some skins/versions. */
#mw-pt-logout {
color: @purp-text1;
}
 
/* .mw-specialpages-table: Table styling used on Special:SpecialPages. */
.mw-specialpages-table {
color: @purp-text1;
border: 1px solid @purp-border1;
}
 
/* .mw-specialpages-table th/td: Cell borders and surface inside Special pages table. */
.mw-specialpages-table th,
.mw-specialpages-table td {
border: 1px solid @purp-border1;
background-color: @purp-bg1;
}
 
/* .mw-content-text .mw-parser-output: Parser output root within `.mw-content-text`. */
.mw-content-text .mw-parser-output {
color: @purp-text1;
}
 
/* .mw-content-text .mw-parser-output > h2–h4: Heading colors inside parser output. */
.mw-content-text .mw-parser-output > h2,
.mw-content-text .mw-parser-output > h3,
.mw-content-text .mw-parser-output > h4 {
color: @purp-text1;
}
 
/* .mw-content-text .mw-parser-output > h2–h4 .mw-headline: Headline spans inside headings. */
.mw-content-text .mw-parser-output > h2 .mw-headline,
.mw-content-text .mw-parser-output > h3 .mw-headline,
.mw-content-text .mw-parser-output > h4 .mw-headline {
color: @purp-text1;
}
 
/* .mw-content-text .mw-parser-output > h2–h4 .mw-editsection: Edit section links inside headings. */
.mw-content-text .mw-parser-output > h2 .mw-editsection,
.mw-content-text .mw-parser-output > h3 .mw-editsection,
.mw-content-text .mw-parser-output > h4 .mw-editsection {
color: @purp-link0;
}
 
/* .skin-vector/.skin-vector-legacy .mw-notification: Notification background for Vector skins. */
.skin-vector .mw-notification,
.skin-vector-legacy .mw-notification {
background-color: @purp-notification-bg;
background-color: @purp-notification-bg-rgba;
}
 
/* .skin-vector .mw-notification: Selector alias for older tooling and rule audits. */
.skin-vector .mw-notification {
background-color: @purp-notification-bg;
background-color: @purp-notification-bg-rgba;
}
 
/* .mw-notification-content: Notification text color. */
.mw-notification-content {
color: @purp-text1;
}
 
/* .mw-warning: Warning message box styling. */
.mw-warning {
border: 1px solid @purp-border1;
background-color: @purp-surface0;
color: @purp-text1;
}
 
/* .toccolours: Legacy TOC color box used by some templates/extensions. */
.toccolours {
border: 1px solid @purp-surface0;
background-color: @purp-border1;
color: @purp-text1;
}
 
/* .toctogglelabel: TOC toggle label link color. */
.toctogglelabel {
color: @purp-link0;
}
 
/* .usermessage: User message banner styling. */
.usermessage {
background-color: @purp-surface0;
border: 1px solid @purp-border0;
color: @purp-text1;
}
 
/*------------------------------------------  SEARCH PAGES  ------------------------------------------*/
/* fieldset#mw-searchoptions: Advanced search options container. */
fieldset#mw-searchoptions {
border: 1px solid @purp-border1;
background-color: @purp-bg1;
color: @purp-text1;
}
 
/* fieldset#mw-searchoptions div.divider: Divider line inside search options. */
fieldset#mw-searchoptions div.divider {
border-color: @purp-border1;
}
 
/* .mw-search-formheader: Search page header container. */
.mw-search-formheader {
background-color: @purp-bg1;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .mw-search-formheader ... li.current a: Active search type/tab link. */
.mw-search-formheader div.search-types ul li.current a {
color: @purp-text1;
text-decoration: none;
background-color: @purp-bg2;
}
 
/* .mw-search-result-data: Result metadata text in search results. */
.mw-search-result-data {
color: @purp-text2;
}
 
/*------------------------------------------  EXTENSIONS & SPECIAL PAGES  ------------------------------------------*/
/* #filetoc: File page table-of-contents container for file history/details. */
#filetoc {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* #file img:hover: Highlights the current file preview on hover. */
#file img:hover {
outline: 2px solid @purp-border0;
}
 
/* .fullMedia: Container that wraps the "full resolution" media link on file pages. */
.fullMedia {
color: @purp-text1;
}
 
/* .mw-changeslist-legend: Legend box used on changes lists and watchlists. */
.mw-changeslist-legend {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .oo-ui-labelWidget.oo-ui-inline-help: Inline help text in OOUI forms. */
.oo-ui-labelWidget.oo-ui-inline-help {
color: @purp-text2;
}
 
/* .TablePager: Generic paginated table wrapper used by many Special pages. */
.TablePager {
color: @purp-text1;
}
 
/* .TablePager th, .TablePager td: Cell borders and readable text in paginated tables. */
.TablePager th,
.TablePager td {
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .TablePager th: Selector alias for older tooling and rule audits. */
.TablePager th {
border: 1px solid @purp-border1;
color: @purp-text1;
}
}


/* .TablePager tr:hover td: Hover highlight for table rows. */
body.skin-vector-legacy .user-menu-list li:last-child {
.TablePager tr:hover td {
border-bottom: 0;
background-color: @purp-surface0;
}
}


/* .TablePager_nav a: Pagination navigation links. */
body.skin-vector-legacy .user-menu-list a {
.TablePager_nav a {
display: block;
color: @purp-link0;
text-decoration: none;
text-decoration: none;
padding: 8px 10px;
border-radius: 10px;
border-left: 3px solid;
transition: background 0.3s ease, padding-left 0.3s ease, color 0.3s ease;
}
}


/* .TablePager_nav a:hover/:focus: Hover/focus state for pagination navigation links. */
body.skin-vector-legacy .user-menu-list a:hover {
.TablePager_nav a:hover,
padding-left: 18px;
.TablePager_nav a:focus {
color: @purp-link2;
text-decoration: underline;
}
 
/* .imagelist ...: Special:Imagelist tweaks for sortable columns and link areas. */
.imagelist th.TablePager_sort {
background-color: @purp-surface0;
}
 
/* .imagelist .TablePager_col_links: Link column styling in Special:Imagelist tables. */
.imagelist .TablePager_col_links {
color: @purp-link0;
}
 
/* div.thumb, div.thumbinner: Thumbnail frame backgrounds for legacy thumbnail markup. */
div.thumb,
div.thumbinner {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* div.thumb: Selector alias for older tooling and rule audits. */
div.thumb {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* html .thumbimage: Thumbnail image border for legacy markup. */
html .thumbimage {
border: 1px solid @purp-border1;
}
 
/* li.gallerybox div.thumb: Gallery thumbnails for `<gallery>` output. */
li.gallerybox div.thumb {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
}
 
/* table.mw_metadata: Metadata tables on file pages. */
table.mw_metadata th,
table.mw_metadata td {
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* table.mw_metadata th: Selector alias for older tooling and rule audits. */
table.mw_metadata th {
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* table.prettytable: Common wiki table class used for structured data. */
table.prettytable {
color: @purp-text1;
background-color: @purp-bg1;
}
 
/* table.prettytable caption: Prettytable caption text. */
table.prettytable caption {
color: @purp-text1;
}
 
/* table.prettytable th/td: Cell borders and text in prettytable. */
table.prettytable th,
table.prettytable td {
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* table.prettytable th: Selector alias for older tooling and rule audits. */
table.prettytable th {
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* table.wikitable ...: Wikitable borders and inline code readability. */
table.wikitable > * > tr > th,
table.wikitable > * > tr > td {
border: 1px solid @purp-border1;
}
 
/* table.wikitable > * > tr > th: Selector alias for older tooling and rule audits. */
table.wikitable > * > tr > th {
border: 1px solid @purp-border1;
}
 
/* table.wikitable code: Inline code styling inside wikitables. */
table.wikitable code {
background-color: @purp-surface1;
color: @purp-text1;
}
 
/* fieldset table: Table borders inside fieldsets (common on Special pages). */
fieldset table {
border-color: @purp-border1;
}
 
/* .tocnumber: Fallback TOC number color for markup variants. */
.tocnumber {
color: @purp-link0;
}
 
/* .RSSReader-head: Header bar used by some RSS reader extensions. */
.RSSReader-head {
background-color: @purp-surface0;
border: 1px solid @purp-border1;
color: @purp-text1;
}
 
/* .profile-info: Profile header/info blocks used by social/profile extensions. */
.profile-info {
background-color: transparent !important;
color: @purp-text1;
}
 
/* div.c-form-title: Title text inside some comment form extensions. */
div.c-form-title {
color: @purp-text1;
}
 
/* div.fanbox-nav h2: Heading used by fanbox/userbox navigation. */
div.fanbox-nav h2 {
color: @purp-text1;
}
 
/* div.link-item-desc, .link-submit-title: Text blocks used by link submission/listing extensions. */
div.link-item-desc,
.link-submit-title {
color: @purp-text1;
}
 
/* div.link-item-desc: Selector alias for older tooling and rule audits. */
div.link-item-desc {
color: @purp-text1;
}
 
/* div.top-fan-nav h1: Heading used by some leaderboard/top-users extensions. */
div.top-fan-nav h1 {
color: @purp-text1;
}
 
/* div.user-board-message-from: Message header separator in user board extensions. */
div.user-board-message-from {
background-color: transparent;
border-bottom: 1px solid @purp-text1;
}
 
/* div.user-home-links-container h2: Heading used by user activity/home extensions. */
div.user-home-links-container h2 {
color: @purp-text1;
}
 
/* div.view-poll-* : Poll extension headings and user name text. */
div.view-poll-navigation h2 {
color: @purp-text1;
}
 
/* div.view-poll-user-name: Username text in poll views. */
div.view-poll-user-name {
color: @purp-link0;
}
 
/*------------------------------------------  DIFF RENDERING  ------------------------------------------*/
table.diff,
td.diff-otitle,
td.diff-ntitle {
background-color: transparent;
}
 
/* td.diff-addedline/deletedline/context: Diff body line sizing. */
td.diff-addedline,
td.diff-deletedline,
td.diff-context {
font-size: 90%;
}
 
/* td.diff-addedline: Added line background and border. */
td.diff-addedline {
background-color: @purp-diff-bg;
border-color: @purp-diff-added;
}
 
/* td.diff-deletedline: Deleted line background and border. */
td.diff-deletedline {
background-color: @purp-diff-bg;
border-color: @purp-diff-deleted;
}
 
/* td.diff-context: Context line background, border, and text color. */
td.diff-context {
background-color: transparent;
border-color: @purp-text2;
color: @purp-text1;
}
 
/* td.diff-addedline/.diff-deletedline .diffchange: Change marker pill styling in diff lines. */
td.diff-addedline .diffchange,
td.diff-deletedline .diffchange {
border-radius: 0.33em;
color: @purp-bg0;
padding: 0.25em;
}
 
/* td.diff-addedline .diffchange: Added change marker background. */
td.diff-addedline .diffchange {
background-color: @purp-diff-added;
}
 
/* td.diff-deletedline .diffchange: Deleted change marker background. */
td.diff-deletedline .diffchange {
background-color: @purp-diff-deleted;
}
 
/* .mw-plusminus-pos: Positive diff size indicator text. */
.mw-plusminus-pos {
color: @purp-diff-added;
}
 
/* .mw-plusminus-neg, .previewnote: Negative diff indicator and preview note text. */
.mw-plusminus-neg,
.previewnote {
color: @purp-diff-deleted;
}
}

Latest revision as of 18:18, 2 January 2026

figcaption {
	
  background: var(--bg) !important;
}





.hero {
  background: var(--bg-1);
  border: 2px solid var(--border);
  border-radius: 20px;
  max-width: 1200px;
  margin: 0 auto 16px auto;
  box-shadow: 0 6px 24px var(--shadow-soft);
  
}

.hero-inner {
  padding: clamp(18px, 3vw, 36px);
  text-align: center;
}

.hero-title {
  margin: 8px 0 4px 0;
  font-size: clamp(22px, 4vw, 36px);
  font-weight: 800;
  background: linear-gradient(135deg, var(--heading-gradient-start), var(--heading-gradient-end));
  
  background-clip: text;
  
}

.hero-subtitle {
  color: var(--text-muted);
  font-size: clamp(14px, 2.2vw, 18px);
}

.status-pill {
  display: inline-block;
  margin-top: 10px;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 700;
  color: var(--text-strong);
  background: var(--primary);
  animation: fadeInOut 2s ease-in-out infinite;
}


/* ========================================
   BackToTopButton.css
   Botão "Back to Top" (BtT)
   ======================================== */

/* ==========================================================================
   Base
   ========================================================================== */
.btt-button {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 50px;
  height: 50px;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px) scale(0.8);
  backdrop-filter: blur(10px);
}

/* ==========================================================================
   Estados
   ========================================================================== */
.btt-button.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}

.btt-button:hover {
  transform: translateY(-3px) scale(1.05);
}

.btt-button:active {
  transform: translateY(-1px) scale(0.98);
}

/* ==========================================================================
   Ícone (seta)
   ========================================================================== */
.btt-button::before {
  content: '';
  width: 0;
  height: 0;
  border-left: 8px solid;
  border-right: 8px solid;
  border-bottom: 12px solid;
  transition: all 0.3s ease;
}

.btt-button:hover::before {
  transform: translateY(-2px);
}

/* ==========================================================================
   Animação (pulse)
   ========================================================================== */
@keyframes btt-pulse {
  0% { opacity: 1; }
  50% { opacity: 1; }
  100% { opacity: 1; }
}

.btt-button.pulse {
  animation: btt-pulse 2s ease-in-out 3;
}

/* ==========================================================================
   Responsividade
   ========================================================================== */
@media (max-width: 768px) {
  .btt-button {
    bottom: 20px;
    right: 20px;
    width: 45px;
    height: 45px;
  }
  
  .btt-button::before {
    border-left-width: 7px;
    border-right-width: 7px;
    border-bottom-width: 10px;
  }
}

@media (max-width: 480px) {
  .btt-button {
    bottom: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
  }
  
  .btt-button::before {
    border-left-width: 6px;
    border-right-width: 6px;
    border-bottom-width: 9px;
  }
}

/* ==========================================================================
   Acessibilidade
   ========================================================================== */
@media (prefers-contrast: high) {
  .btt-button {
    border: 2px solid;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btt-button {
    transition: opacity 0.3s ease;
  }
  
  .btt-button:hover {
    transform: none;
  }
  
  .btt-button::before {
    transition: none;
  }
  
  .btt-button:hover::before {
    transform: none;
  }
  
  .btt-button.pulse {
    animation: none;
  }
}

/* ========================================
   ContentContainer.css
   Container principal de conteúdo (#content / .mw-body)
   ======================================== */

body.skin-vector-legacy #content,
body.skin-vector-legacy .mw-body {
  border: 1px solid !important;
  border-radius: 12px !important;
  margin: 50px auto !important;
  max-width: 1500px;
}

#content::before,
.mw-body::before {
  content: '' !important;
  position: absolute !important;
  inset: -1px !important;
  border-radius: 12px !important;
  z-index: -1 !important;
  opacity: 0.1 !important;
}

/* ========================================
   Forms.css
   Inputs e formulários (search, text, select, textarea)
   ======================================== */

input[type="text"],
input[type="search"],
textarea,
select {
  border: 2px solid !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-family: inherit !important;
  transition: 0.15s ease !important;
  
}

input[type="text"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
  
}

/* ========================================
   HamburguerMenu.css
   Sidebar (Vector Legacy) + menu hambúrguer + overlay
   ======================================== */

/* ==========================================================================
   Variáveis reutilizáveis (dimensões e cores)
   ========================================================================== */

/* ==========================================================================
   Sidebar (container)
   ========================================================================== */
body.skin-vector-legacy #mw-panel {
  border-right: 2px solid;
  padding: 18px 0;
  border-radius: 14px;
  transform: translateX(-100%);
  transition: transform .3s ease;
  position: fixed;
  z-index: 1000;
  height: 100vh;
  width: 220px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Exibe sidebar somente quando mobile-open está presente */
body.skin-vector-legacy #mw-panel.mobile-open {
  transform: translateX(0);
}

/* Overlay ao abrir a sidebar */
body.sidebar-open::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  opacity: 1;
  transition: opacity .3s ease;
  background: rgba(0, 0, 0, 0.5);
}

/* ==========================================================================
   Sidebar (portais e itens)
   ========================================================================== */
body.skin-vector-legacy #mw-panel .vector-menu-portal,
body.skin-vector-legacy #mw-panel .portal {
  padding: 10px;
  border: 3px solid;
  border-radius: 14px;
  overflow: hidden;
}

body.skin-vector-legacy #mw-panel .vector-menu-portal .vector-menu-heading,
body.skin-vector-legacy #mw-panel .portal h3 {
  margin: 0;
  padding: 10px 12px;
  font-size: 0.92em;
  font-weight: 700;
  letter-spacing: .3px;
  text-decoration: underline;
  border-bottom: 1px;
  text-shadow: 0 1px 2px rgb(0, 0, 0) !important;
  cursor: pointer;
  user-select: none;
  position: relative;
  transition: background 0.3s ease, transform 0.2s ease;
  border-radius: 14px;
}

body.skin-vector-legacy #mw-panel .vector-menu-portal .vector-menu-heading:hover,
body.skin-vector-legacy #mw-panel .portal h3:hover {
  transform: translateY(-1px);
}

body.skin-vector-legacy #mw-panel .vector-menu-portal .vector-menu-heading::after,
body.skin-vector-legacy #mw-panel .portal h3::after {
  content: '▼';
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.8em;
  transition: transform 0.3s ease;
  border-radius: 14px;
}

body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed .vector-menu-heading::after,
body.skin-vector-legacy #mw-panel .portal.collapsed h3::after {
  transform: translateY(-50%) rotate(-90deg);
}

body.skin-vector-legacy #mw-panel .vector-menu-content ul,
body.skin-vector-legacy #mw-panel .portal .body ul {
  list-style: none;
  margin: 0;
  padding: 4px 0;
  border-radius: 14px;
}

body.skin-vector-legacy #mw-panel .vector-menu-content,
body.skin-vector-legacy #mw-panel .portal .body {
  max-height: none;
  overflow: hidden;
  transition: max-height 0.4s ease, opacity 0.3s ease;
  opacity: 1;
}

body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed .vector-menu-content,
body.skin-vector-legacy #mw-panel .portal.collapsed .body {
  max-height: 0 !important;
  opacity: 0;
  padding: 0;
}

body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed,
body.skin-vector-legacy #mw-panel .portal.collapsed { margin-bottom: 8px; }

body.skin-vector-legacy #mw-panel .vector-menu-portal.collapsed .vector-menu-heading,
body.skin-vector-legacy #mw-panel .portal.collapsed h3 {
  border-bottom: none;
  border-radius: 14px;
}

body.skin-vector-legacy #mw-panel .vector-menu-content li,
body.skin-vector-legacy #mw-panel .portal .body li { border-bottom: 1px solid; }

body.skin-vector-legacy #mw-panel .vector-menu-content li:last-child,
body.skin-vector-legacy #mw-panel .portal .body li:last-child { border-bottom: 0; }

body.skin-vector-legacy #mw-panel .vector-menu-content a,
body.skin-vector-legacy #mw-panel .portal .body a {
  display: block;
  padding: 8px 14px;
  text-decoration: none;
  border-radius: 10px;
  border-left: 3px solid;
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, padding .2s ease;
}

body.skin-vector-legacy #mw-panel .vector-menu-content a:hover,
body.skin-vector-legacy #mw-panel .portal .body a:hover {
  padding-left: 18px;
}

/* ==========================================================================
   Scrollbar (sidebar)
   ========================================================================== */
body.skin-vector-legacy #mw-panel::-webkit-scrollbar { width: 6px; }
body.skin-vector-legacy #mw-panel::-webkit-scrollbar-thumb { border-radius: 3px; }

/* ==========================================================================
   Menu hambúrguer (toggle)
   ========================================================================== */
.mobile-hamburger-menu {
  display: flex;
  position: fixed;
  top: 20px;
  left: 20px;
  z-index: 1002;
  width: 50px;
  height: 50px;
  border: none;
  border-radius: 14px;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  transition: transform .3s ease, box-shadow .3s ease;
  padding: 0;
  background: linear-gradient(135deg, #ff6b9d, #ff8fb0);
}

.mobile-hamburger-menu:hover {
  transform: translateY(-2px);
}

.mobile-hamburger-menu span {
  display: block;
  width: 25px;
  height: 3px;
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease;
  transform-origin: center;
  background: #ffffff;
}

.mobile-hamburger-menu.active span:nth-child(1) { transform: rotate(45deg) translate(6px, 6px); }
.mobile-hamburger-menu.active span:nth-child(2) { opacity: 0; }
.mobile-hamburger-menu.active span:nth-child(3) { transform: rotate(-45deg) translate(6px, -6px); }

/* ==========================================================================
   Logo “peek” (quando sidebar está recolhida/aberta)
   ========================================================================== */
body.skin-vector-legacy #p-logo { margin: 0 12px 18px; }

body.skin-vector-legacy #p-logo a {
  display: block;
  border: 1px solid;
  border-radius: 14px;
  padding: 12px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

body.skin-vector-legacy #p-logo a:hover {
  transform: translateY(-2px);
}

body.skin-vector-legacy #p-logo { 
  position: absolute; 
  top: 12px; 
  left: calc(100% + 12px); 
  margin: 0; 
  z-index: 1001; 
}

body.skin-vector-legacy #p-logo a {
  width: 56px; 
  height: 56px; 
  padding: 0; 
  display: block;
  border-radius: 10px;
  background-repeat: no-repeat; 
  background-position: center; 
  background-size: contain;
  border: 1px solid;
}

body.skin-vector-legacy #mw-panel.mobile-open #p-logo {
  position: relative; 
  left: auto; 
  top: auto;
  margin: 0 12px 18px;
}

body.skin-vector-legacy #mw-panel.mobile-open #p-logo a {
  width: auto; 
  height: auto; 
  padding: 12px;
  background-size: contain;
}

/* ==========================================================================
   Acessibilidade
   ========================================================================== */
@media (prefers-contrast: more) {
  body.skin-vector-legacy #mw-panel .vector-menu-content a:hover { text-decoration: underline; }
}

/* ========================================
   Header.css
   Cabeçalho (#mw-head) do Vector Legacy
   ======================================== */

#mw-head { 
  padding: 10px ; 
  border-bottom: 2px solid; 
  border: 1px solid;
  border-radius: 8px;
  
}

/* ========================================
   HeaderTabs.css
   Abas e ações do cabeçalho (views/actions/watch)
   ======================================== */

/* ==========================================================================
   Botões base
   ========================================================================== */
#ca-view a,
#ca-viewsource a,
#ca-ve-edit a,
#ca-edit a,
#ca-history a,
#p-cactions .vector-menu-heading ,
#ca-delete a,
#ca-move a,
#ca-protect a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 12px !important;
  margin: 4px 6px 0 0 !important;
  border-radius: 10px !important;
  border: 2px solid !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, border-color .2s ease !important;
}

/* ==========================================================================
   Watch / Unwatch (ícones)
   ========================================================================== */
#ca-watch a,
#ca-unwatch a {
  font-size: 0;
  width: 24px;
  height: 24px;
  padding: 0;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

#ca-watch a {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-image: url("https://mewsie.world/CoraTOWiki/images/2/28/EmptyPinkStar.png");
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: 10px !important;
}

#ca-unwatch a {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-image: url("https://mewsie.world/CoraTOWiki/images/c/cc/FullPinkStar.png");
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: 10px !important;
}

/* ==========================================================================
   Hover / active
   ========================================================================== */
#ca-view a:hover,
#ca-viewsource a:hover,
#ca-edit a:hover,
#ca-history a:hover,
#ca-watch a:hover,
#ca-unwatch a:hover,
#p-cactions .vector-menu-heading:hover,
#ca-delete a:hover,
#ca-move a:hover,
#ca-protect a:hover {
  transform: translateY(-2px) !important;
}

/* ==========================================================================
   Remoções e resets do cabeçalho
   ========================================================================== */
#pt-anontalk,
#p-namespaces,
#pt-anoncontribs,
#ca-talk,
#ca-nstab-main,
#ca-nstab-mediawiki {
  display: none !important;
}

#ca-talk,
#ca-nstab-main,
#ca-nstab-mediawiki,
#ca-view,
#ca-viewsource,
#ca-edit,
#ca-ve-edit,
#ca-history,
#ca-watch,
#ca-unwatch,
#ca-more,
#mw-page-base {
  border: none !important;
  padding: 0 !important;
  margin: 0 4px !important;
}

// Variáveis LESS que recebem valores das variáveis CSS
@bg-1: var(--bg-1);
@border: var(--border);
@shadow-soft: var(--shadow-soft);
@heading-gradient-start: var(--heading-gradient-start);
@heading-gradient-end: var(--heading-gradient-end);
@text-muted: var(--text-muted);
@text-strong: var(--text-strong);
@primary: var(--primary);

// Estilos
.hero {
  background: @bg-1;
  border: 2px solid @border;
  border-radius: 20px;
  max-width: 1200px;
  margin: 0 auto 16px auto;
  box-shadow: 0 6px 24px @shadow-soft;
}

.hero-inner {
  padding: clamp(18px, 3vw, 36px);
  text-align: center;
}

.hero-title {
  margin: 8px 0 4px 0;
  font-size: clamp(22px, 4vw, 36px);
  font-weight: 800;
  background: linear-gradient(135deg, @heading-gradient-start, @heading-gradient-end);
  background-clip: text;
}

.hero-subtitle {
  color: @text-muted;
  font-size: clamp(14px, 2.2vw, 18px);
}

.status-pill {
  display: inline-block;
  margin-top: 10px;
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 700;
  color: @text-strong;
  background: @primary;
  animation: fadeInOut 2s ease-in-out infinite;
}

body.skin-vector-legacy.has-user-menu-collapsible #p-personal,
body.skin-vector-legacy.has-personal-menu-collapsible #p-personal {
	display: none;
}

body.skin-vector-legacy .personal-menu-container {
	position: fixed;
	top: 120px;
	right: 0;
	z-index: 1000;
	overflow: visible;
	display: flex;
	flex-direction: row;
}

body.skin-vector-legacy .personal-menu-header {
	display: flex;
	align-items: center;
	padding: 6px 12px;
	top: 2;
	right: 0;
	position: fixed;
	cursor: pointer;
	user-select: none;
	transition: background 0.3s ease;
	border-radius: 14px 0 0 14px;
	white-space: nowrap;
	font-weight: bold;
	height: auto;
	writing-mode: horizontal-tb;
	border: 1px solid;
	flex-direction: row;
}

body.skin-vector-legacy .personal-menu-header::after {
	content: '';
	display: inline-block;
	width: 25px;
	height: 25px;
	font-weight: bold;
	background-image: url( https://mewsie.world/CoraTOWiki/images/9/97/LeftArrow.png );
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
	margin-left: 6px;
	transition: transform 0.3s ease;
}

body.skin-vector-legacy .personal-menu-container.expanded .personal-menu-header::after {
	transform: rotate( 180deg );
}

body.skin-vector-legacy .personal-menu-content {
	position: absolute;
	top: 0;
	right: 100%;
	border: 1px solid;
	border-radius: 14px;
	padding: 10px;
	width: 0;
	overflow: hidden;
	opacity: 0;
	transition: width 0.4s ease, opacity 0.3s ease;
	display: flex;
	flex-direction: column;
}

body.skin-vector-legacy .personal-menu-container.expanded .personal-menu-content {
	width: 180px;
	opacity: 1;
}

body.skin-vector-legacy .personal-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

body.skin-vector-legacy .personal-menu-list li {
	margin: 5px 0;
	white-space: nowrap;
	border-bottom: 1px solid;
}

body.skin-vector-legacy .personal-menu-list li:last-child {
	border-bottom: 0;
}

body.skin-vector-legacy .personal-menu-list a {
	display: block;
	text-decoration: none;
	padding: 8px 10px;
	border-radius: 10px;
	border-left: 3px solid;
	transition: background 0.3s ease, padding-left 0.3s ease, color 0.3s ease;
}

body.skin-vector-legacy .personal-menu-list a:hover {
	padding-left: 18px;
}

body.skin-vector-legacy .personal-menu-list #pt-anonuserpage {
	display: block;
	padding: 8px 10px;
	border-radius: 10px;
	border-left: 3px solid;
	background: none;
	color: inherit;
}

body.skin-vector-legacy .personal-menu-list #pt-anonuserpage:hover {
	padding-left: 18px;
}

body.skin-vector-legacy .personal-menu-list a.mw-ui-button {
	background: none;
	border: 0;
	box-shadow: none;
	font-weight: inherit;
	text-shadow: none;
}


#pt-theme-menu {
	position: relative;
}

#pt-theme-menu .themeMenu {
	position: relative;
	display: inline-block;
}

#pt-theme-menu .themeMenu-toggle {
	appearance: none;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 4px;
	color: inherit;
	cursor: pointer;
	font: inherit;
	line-height: 1.2;
	padding: 0.25em 0.55em;
}

#pt-theme-menu .themeMenu-toggle:hover,
#pt-theme-menu .themeMenu.is-open .themeMenu-toggle {
	background: var( --surface );
	border-color: var( --border );
}

#pt-theme-menu .themeMenu-dropdown {
	display: none;
	position: absolute;
	right: 0;
	top: calc( 100% + 0.35em );
	min-width: 180px;
	margin: 0;
	padding: 0.25em 0;
	list-style: none;
	background: var( --surface );
	border: 1px solid var( --border );
	border-radius: 6px;
	box-shadow: 0 6px 18px var( --shadow-medium );
	z-index: 9999;
}

#pt-theme-menu .themeMenu.is-open .themeMenu-dropdown {
	display: block;
}

#pt-theme-menu .themeMenu-itemWrap {
	margin: 0;
	padding: 0;
}

#pt-theme-menu .themeMenu-item {
	display: block;
	padding: 0.45em 0.8em;
	color: var( --text );
	text-decoration: none;
	white-space: nowrap;
}

#pt-theme-menu .themeMenu-item:hover,
#pt-theme-menu .themeMenu-item:focus {
	background: var( --bg-1 );
	color: var( --text-strong );
}

#pt-theme-menu .themeMenu-item.is-current {
	font-weight: 700;
}

#mw-theme-floating {
	position: fixed;
	top: 0.6em;
	right: 0.8em;
	z-index: 10000;
}

#mw-theme-floating .themeMenu {
	position: relative;
	display: inline-block;
}

#mw-theme-floating .themeMenu-toggle {
	appearance: none;
	background: var( --surface );
	border: 1px solid var( --border );
	border-radius: 6px;
	color: var( --text );
	cursor: pointer;
	font: inherit;
	line-height: 1.2;
	padding: 0.35em 0.65em;
	box-shadow: 0 6px 18px var( --shadow-soft );
}

#mw-theme-floating .themeMenu-toggle:hover,
#mw-theme-floating .themeMenu.is-open .themeMenu-toggle {
	background: var( --bg-1 );
}

#mw-theme-floating .themeMenu-dropdown {
	display: none;
	position: absolute;
	right: 0;
	top: calc( 100% + 0.35em );
	min-width: 180px;
	margin: 0;
	padding: 0.25em 0;
	list-style: none;
	background: var( --surface );
	border: 1px solid var( --border );
	border-radius: 6px;
	box-shadow: 0 6px 18px var( --shadow-medium );
	z-index: 10001;
}

#mw-theme-floating .themeMenu.is-open .themeMenu-dropdown {
	display: block;
}

#mw-theme-floating .themeMenu-item {
	display: block;
	padding: 0.45em 0.8em;
	color: var( --text );
	text-decoration: none;
	white-space: nowrap;
}

#mw-theme-floating .themeMenu-item:hover,
#mw-theme-floating .themeMenu-item:focus {
	background: var( --bg-1 );
	color: var( --text-strong );
}

#mw-theme-floating .themeMenu-item.is-current {
	font-weight: 700;
}

/* ========================================
   UserMenu.css
   Menu de usuário lateral (custom)
   ======================================== */

/* ==========================================================================
   Container (posição e layout)
   ========================================================================== */
body.skin-vector-legacy .user-menu-container {
	position: fixed;
	top: 120px;
	right: 0;
	z-index: 1000;
	overflow: visible;
	display: flex;
	flex-direction: row;
}

/* ==========================================================================
   Header (toggle)
   ========================================================================== */
body.skin-vector-legacy .user-menu-header {
	display: flex;
	align-items: center;
	padding: 6px 12px;
	top: 2;
	right: 0;
	position: fixed;
	cursor: pointer;
	user-select: none;
	transition: background 0.3s ease;
	border-radius: 14px 0 0 14px;
	white-space: nowrap;
	font-weight: bold;
	height: auto;
	writing-mode: horizontal-tb;
	border: 1px solid;
	flex-direction: row;
}

body.skin-vector-legacy .user-menu-header::after {
	content: '';
	display: inline-block;
	width: 25px;
	height: 25px;
	font-weight: bold;
	background-image: url( https://mewsie.world/CoraTOWiki/images/9/97/LeftArrow.png );
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
	margin-left: 6px;
	transition: transform 0.3s ease;
}

body.skin-vector-legacy .user-menu-container.expanded .user-menu-header::after {
	transform: rotate( 180deg );
}

/* ==========================================================================
   Conteúdo (área expansível)
   ========================================================================== */
body.skin-vector-legacy .user-menu-content {
	position: absolute;
	top: 0;
	right: 100%;
	border: 1px solid;
	border-radius: 14px;
	padding: 10px;
	width: 0;
	overflow: hidden;
	opacity: 0;
	transition: width 0.4s ease, opacity 0.3s ease;
	display: flex;
	flex-direction: column;
}

body.skin-vector-legacy .user-menu-container.expanded .user-menu-content {
	width: 180px;
	opacity: 1;
}

/* ==========================================================================
   Lista de links
   ========================================================================== */
body.skin-vector-legacy .user-menu-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

body.skin-vector-legacy .user-menu-list li {
	margin: 5px 0;
	white-space: nowrap;
	border-bottom: 1px solid;
}

body.skin-vector-legacy .user-menu-list li:last-child {
	border-bottom: 0;
}

body.skin-vector-legacy .user-menu-list a {
	display: block;
	text-decoration: none;
	padding: 8px 10px;
	border-radius: 10px;
	border-left: 3px solid;
	transition: background 0.3s ease, padding-left 0.3s ease, color 0.3s ease;
}

body.skin-vector-legacy .user-menu-list a:hover {
	padding-left: 18px;
}
Retrieved from "https://mewsie.world/CoraTOWiki/index.php?title=MediaWiki:Vector.css&oldid=6689"