abola.pt by jah

/* ==UserStyle==
@name         abola.pt
@version      20250319.21.10
@namespace    https://userstyles.world/user/jah
@description  site d'a bola em dark mode, para monitores 1440p, com algumas alterações em termos de tipografia p se ler melhor e estar mais parecido ao jornal impresso. eu n leio todas as secções portanto é capaz de haver alguns módulos incompletos.M
@author       jah
@license      MIT
==/UserStyle== */

@-moz-document domain("abola.pt"), domain("platform.twitter.com") {
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@400;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Martel:wght@200;300;400;600;700;800;900&display=swap');

:root {
    /* grey scale */
    --w: #fff;
    --wAlpha: 0, 0%, 100%;
    --grey10: hsl(0, 0%, 86%);
    --grey15: hsl(0, 0%, 78%);
    --grey20: hsl(0, 0%, 69%);
    --grey25: hsl(0, 0%, 61%);
    --grey30: hsl(0, 0%, 53%);
    --grey40: hsl(0, 0%, 39%);
    --grey50: hsl(0, 0%, 28%);
    --grey60: hsl(0, 0%, 20%);
    --grey70: hsl(0, 0%, 13%);
    --grey80: hsl(0, 0%, 9%);
    --grey90: hsl(0, 0%, 7%);
    --grey100: hsl(0, 0%, 5%);
    
    /* colours */
    --brand: hsl(356, 95%, 45%);
    --brandAlpha: 356, 95%, 45%;
    --verdeAlpha: 161, 100%, 25%;
    --gold: #fc0;
    --modalidades: #ff8a5e;
    --internacional: #9b73e1;
    --clubesSportingLisbon: #008057;
    --clubesFCPorto: #2452b5;
    --clubesSLBenfica: #e20613;
    
    /* spacers */
    --spacer0: .5rem;
    --spacer10: 1rem;
    --spacer20: 1.5rem;
    --spacer30: 2rem;
    --spacer40: 2.5rem;
    --spacer50: 3.5rem;
    
    --maxW: 60vw;
    --centre: calc(0px - ((100vw - var(--maxW)) / 2) - 1.8rem);
    --colW: 20vw;
    --colGap: 2.4rem;
    --cardMinH: 35.2rem;
    --borderRadius: .4rem;
    
    /* fonts */
    --fontSans: 'Roboto', sans-serif;
    --fontRusso: Russo One, sans-serif;
    --fontSlab: 'Roboto Slab', sans-serif;
    --fontSerif: 'Martel', serif;
    
    /* misc */
    --trans: all .25s ease; /* rights are human rights */
    
    /**/
    --brand10: hsl(356deg, 67%, 94%);
    --brand15: hsl(356deg, 69%, 68%);
    --brand20: hsl(356deg, 69%, 54%);
    --brand25: hsl(356deg, 100%, 39%);
    --brand30: hsl(356deg, 100%, 33%);
    --brand40: hsl(356deg, 100%, 28%);
    --brand50: hsl(356deg, 100%, 25%);
    --brand60: hsl(356deg, 100%, 21%);
    --brand70: hsl(356deg, 100%, 18%);
    --brand80: hsl(356deg, 100%, 15%);
    --brand90: hsl(356deg, 100%, 11%);
    --brand100: hsl(356deg, 100%, 7%);
    
    --colors-tabRowBackgroundColor: var(--grey80);
    --colors-highLighted: var(--brand90);
    --colors-oddsContainerPrimaryBgColor: var(--grey80);
    --colors-orange500: var(--brand20);
    --colors-multiSportBgColor: var(--grey90);
    --colors-multiSportTextColor: var(--grey10);
    --colors-borderMultiSportColor: var(--grey60);
    --colors-countryLogoBorderColor: var(--grey60);
    --fonts-primaryFontFamily: var(--fontSans);
    --colors-multiSportCommonColor: var(--grey25);
    
    --colors-matchCenterPrimaryBackgroundColor: var(--grey100);
    --colors-lineupsPrimaryBackgroundColor: var(--grey100);
    --colors-collapsibleBgColor: var(--grey80);
    --colors-lineupsRowEvenBgColor: var(--grey100);
    --colors-lineupsRowOddBgColor: var(--grey90);
    --colors-lineupsHeaderContainerBgColor: var(--grey90);
    --colors-timelineTabBackgroundColor: var(--grey80);
    --colors-tabTextColor: var(--grey10);
    --colors-tabBackgroundColor: var(--grey80);
    --colors-tabMenuBorderColor: var(--grey60);
    --colors-timelineBackgroundColor: var(--grey80);
    --colors-subHeaderBgColor: var(--grey90);
    --colors-mobileTabsSelectedBgColor: var(--brand80);
    --colors-gray6: var(--grey25);
    --colors-surfaceBackgroundColor: var(--grey100);
    --colors-gray0: var(--grey100);
    --colors-gray1: var(--grey90);
    --colors-gray2: var(--grey80);
    --colors-gray3: var(--grey70);
    --colors-gray4: var(--grey60);
    --colors-gray12: var(--grey10);
    --colors-progressHighlightedColor: var(--grey10);
    --colors-loContrast: var(--grey60);
    --colors-tabActiveBackgroundColor: var(--brand60);

    --colors-sportEntityContainerPrimaryBgColor: var(--grey100);
    --colors-hiContrast: var(--grey10);
    --colors-primaryGray: var(--grey25);
    --colors-rowBackgroundColor: var(--grey100);
    --colors-pillTextColor: var(--grey25);
}

*, html * {
    box-sizing: border-box;
}

html, body {
    background: var(--grey90);
    color: var(--grey10);
    font-size: 16px;
    line-height: 1.618;
    line-height: calc(1ex / 0.32);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.scrollbar, html {
    /*font-size: 62.5%;*/
    scrollbar-color: var(--grey50) var(--grey70);
}

body {
    font-family: var(--fontSerif);
    -webkit-touch-callout: unset;
    -webkit-user-select: unset;
    -moz-user-select: unset;
    -ms-user-select: unset;
    user-select: unset;
}

/*
    defs
*/
.container {
    max-width: var(--maxW);
}

.container-opiniao, #trending-entities .team-item span, .btn, .red-bg.active, a {
    transition: var(--trans);
}

.destaque-ultimas24horas .col-md-12:last-child, .destaque-ultimas24horas .media-body, a.btn-default {
    border: unset;
}

.border-gray {
    border: unset !important;
}

/*
    cores
*/
.container-opiniao .opinion-slide-img, .topo-seccoes, .cabeca, .navbar-default {
    background-color: transparent;
}
.single-news-content .highlight-inner, .menu-principal, #trending-entities, #header {
    background-color: var(--grey100);
}
.pagination-container nav .nx-pagination>li a, #corpo {
    background-color: var(--grey90);
}
.pagination-container nav .nx-pagination>li a:hover {
    background-color: var(--grey80);
}
.single-comment-wrapper .single-comment-reactions .single-comment-reaction.report, .single-comment-wrapper .single-comment-reactions .single-comment-reaction, .menu-icon .menu-icon-wrapper, .bg-cinza {
    background-color: var(--grey70);
}
.border-bottom:after, .border-top:before {
    background-color: var(--grey60);
}

.red-bg.active, .btn-default {
    background-color: var(--brand);
}

.btn-default:hover, .red-bg.active:has(a.cinza):hover, a.btn-default.btn-prime, a.btn-default:hover {
    background-color: var(--brand50);
}

.container-opiniao:hover {
    background-color: var(--brand80);
}

.container-opiniao {
    background-color: var(--brand90);
}

.single-comment-wrapper .single-comment-reactions .single-comment-reaction.report, .single-comment-wrapper .single-comment-reactions .single-comment-reaction, .single-news-content .intext-news .news-item .news-item-data .news-item-title a, .opiniao-titulo, #trending-entities .team-item span, .pagination-container nav .nx-pagination>li a, .sidebar-menu-section .sidebar-all-menu .sidebar-main-navigation .sidebar-main-menu .sidebar-submenu .sub-item .icon-link-menu, .menu-icon .menu-icon-wrapper, section#Noticia .corpo-noticia:active, section#Noticia .corpo-noticia:focus, section#Noticia .corpo-noticia:hover, .info .titulo, .home-side-widget-new .ultimas-flexed .text-left .ctl00_body_geral_cxAgenda_rptAgendaGeral_ctl00_lblDescricaoAgendaItem, a {
    color: var(--grey10);
}
.single-news-content .intext-news .news-item .news-item-data .news-item-title a:hover, #trending-entities .team-item:hover span, .btn-default, .sidebar-menu-section .sidebar-all-menu .sidebar-main-navigation .sidebar-main-menu .sidebar-submenu .sub-item .icon-link-menu:hover, .red-bg.active a, .load-more-replies, a.btn-default, .info .titulo:hover, .home-side-widget-new .ultimas-flexed .text-left .ctl00_body_geral_cxAgenda_rptAgendaGeral_ctl00_lblDescricaoAgendaItem:hover, a:hover {
    color: var(--w);
}

.post-container .image-credits, .post-container .image-description, .opiniao-autor, .info .data-hora {
    color: var(--grey25);
}

.sidebar-menu-section .sidebar-all-menu .sidebar-main-navigation .sidebar-main-menu .sidebar-submenu .sidebar-subsubmenu .subsub-item a {
    color: var(--brand);
}

.single-news-content a, .single-news-content a:focus, .single-news-content a:hover, .single-news-content a:visited {
    color: var(--brand20);
    text-decoration: unset;
}

.single-news-content a:hover {
    color: var(--brand15);
}


.single-comment-wrapper .single-comment-reactions .single-comment-reaction.report, .single-comment-wrapper .single-comment-reactions .single-comment-reaction, .single-news-content .highlight-inner .highlight-head, .pagination-container nav .nx-pagination>li a, .topo-seccoes, .sidebar-menu-section .sidebar-all-menu .sidebar-main-navigation .sidebar-main-menu .sidebar-submenu .sub-item, .ls-info, .ls-status, .rodape-site, .row-spacer, .home-side-widget-new .ls-jogo, #top-section .main-article-wrap {
    border-color: var(--grey60);
}

.container-opiniao img {
    border-color: var(--grey90) !important;
}

.sportal365, .fans-united, .widget-dropdown:after, .menu-bars:before, .btn-all-comments:before {
    filter: invert(1) brightness(100);
}

.sportal365, .fans-united {
    opacity: 0.5;
}

.sidebar-menu-section .sidebar-all-menu .sidebar-main-navigation .sidebar-main-menu .sidebar-submenu .sub-item .toggle-submenu svg {
    fill: var(--grey10);
}

.sidebar-menu-section .sidebar-all-menu .sidebar-main-navigation .sidebar-main-menu .sidebar-submenu .sub-item .toggle-submenu svg:hover {
    fill: var(--w);
}

#edicao-digital-3d .owl-carousel .owl-stage {
    width: 100% !important;
    display: flex;
    justify-content: space-between;
    gap: var(--colGap);
}

#edicao-digital-3d .owl-carousel .owl-item {
    flex: 1;
    margin: 0 !important;
    width: auto !important;
}

#edicao-digital-3d .owl-carousel .owl-stage:after {
    content: unset;
}
}