custom sepehrtv.ir by mimvahedi

/* ==UserStyle==
@name           Custom Sepehrtv.ir
@namespace      sepehrtv
@version        0.2
@description    style for sepehrtv.ir
@author         mimv
@license        Unlicense
@preprocessor   stylus
==/UserStyle== */
@-moz-document domain("sepehrtv.ir") {
  body {
    background: hsl(183.5, 100%, 1%);
    --COLW: 33.333%;
    --CARDH: 4rem;
  }

  @media (max-width: 400px) {
    body {
      --COLW: 100%;
      --CARDH: 10rem;
    }
  }

  #headerArea {
    position: static;
    background: transparent;
    border-bottom: 1px solid #8884;
  }

  img[alt="لوگو سپهر"] {
    display: none;
  }
  #headerArea:has([href="/app"]) {
    display: none;
  }
  .badge {
    border-radius: 55em;
    margin: 0;
    background-color: #ff5b8722 !important;
    color: #ff5b87 !important;
  }
  .page-content-wrapper {
    margin-top: 0;
  }

  .top-products-area > .row.g-3 > .col-6 {
    width: var(--COLW);
  }
  .card.single-product-card a div {
    display: flex;
  }
  .product-thumbnail.d-block {
    width: 1em;
    height: 1em;
    margin: 0;
    font-size: 2rem;
  }
  .single-product-card .product-thumbnail img {
    height: 100% !important;
  }
  .card-content-live * {
    font-family: system-ui;
    margin: 0;
    font-size: 1rem;
  }
  .liveOverlay {
    opacity: 1;
    z-index: -1 !important;
  }
  .liveOverlay img {
    object-fit: cover;
  }
  .card-content-live p {
    position: absolute;
    bottom: 0;
    background: linear-gradient(to top, #000, #000a, #0000);
    color: #fff;
    line-height: 2;
    padding: 1em;
    display: block;
    width: 100%;
    font-weight: bold;
    right: 0;
    padding-top: 5rem;
  }
  .single-product-card .product-title {
    margin: 0;
  }
  .card-body.card-content-live.p-3.liveOverlayContainer {
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 4px 10px -4px #000a;
    transition: cubic-bezier(0, 1, .45, 1.5) 150ms;
    height: var(--CARDH) !important;
  }

  .card.single-product-card > a:is(:hover, :focus) > .liveOverlayContainer {
    transform: scale(110%) translatey(-6rem);
    --CARDH: 10rem;
    margin-bottom: -6rem;

    .product-thumbnail.d-block {
      transform: scale(4);
      background: yellow;
    }
  }

  body .card.single-product-card {
    background: transparent;
  }
  #footerNav.footer-nav-area {
    position: static !important;
  }
  body .footer-nav,
  body .footer-nav-area {
    background: transparent;
  }

  .page-content-wrapper[style*=padding-bottom] {
    padding-bottom: 1px !important;
  }
}