/* EgyBest Lighthouse fixes — narrow accessibility and image-rendering overrides only. */

/* WCAG text contrast: keep the existing green/red visual language, with readable darker shades. */
#head .btn.g,
#head .btn.g_yam,
.btn.g,
.btn.g_yam,
.btn._g:hover {
  background: #006b26 !important;
  background-image: none !important;
  border-color: #006b26 !important;
  color: #fff !important;
  text-shadow: none !important;
}
#head .btn.g:hover,
#head .btn.g_yam:hover,
.btn.g:hover,
.btn.g:focus-visible,
.btn.g_yam:hover,
.btn.g_yam:focus-visible {
  background: #00551f !important;
  border-color: #00551f !important;
  color: #fff !important;
}

/* Sidebar category links: preserve the same red/white appearance while meeting
   WCAG AA contrast for normal-size text (darken the red only slightly). */
#left .ba a {
  color: #e00000 !important;
}
#left .ba a:hover,
#left .ba a:focus-visible {
  background: #fff0ee !important;
  color: #cc0d00 !important;
  text-decoration: underline;
}

/* Keep the red brand treatment readable when the site's dark mode is active. */
body.dark #left .ba a {
  color: #ff7777 !important;
}
body.dark #left .ba a:hover,
body.dark #left .ba a:focus-visible {
  background: #351919 !important;
  color: #ffaaaa !important;
  text-decoration: underline;
}

/* Quality ribbons: every white label uses a background that meets contrast. */
.ribbon span,
.ribbon.r0 span {
  background: #b91c1c !important;
  background-image: none !important;
}
.ribbon.r0 span:before { border-top-color: #b91c1c !important; border-left-color: #b91c1c !important; }
.ribbon.r0 span:after { border-top-color: #b91c1c !important; border-right-color: #b91c1c !important; }
.ribbon.r1 span {
  background: #9a3412 !important;
  background-image: none !important;
}
.ribbon.r1 span:before { border-top-color: #9a3412 !important; border-left-color: #9a3412 !important; }
.ribbon.r1 span:after { border-top-color: #9a3412 !important; border-right-color: #9a3412 !important; }
.ribbon.r2 span {
  background: #166534 !important;
  background-image: none !important;
}
.ribbon.r2 span:before { border-top-color: #166534 !important; border-left-color: #166534 !important; }
.ribbon.r2 span:after { border-top-color: #166534 !important; border-right-color: #166534 !important; }
.ribbon.r3 span {
  background: #00529b !important;
  background-image: none !important;
}
.ribbon.r3 span:before { border-top-color: #00529b !important; border-left-color: #00529b !important; }
.ribbon.r3 span:after { border-top-color: #00529b !important; border-right-color: #00529b !important; }

/* Poster frames keep the original vertical card sizes. The image itself keeps its
   natural ratio and is center-cropped by the frame, never stretched. */
.movie .eb-card-poster-frame {
  position: relative;
  display: block;
  width: 100%;
  height: 260px;
  margin: 0;
  overflow: hidden;
  background: #eee url(src-default-x175.jpg) center top / cover no-repeat;
}
.movies_small .movie .eb-card-poster-frame {
  height: 200px;
  background-image: url(src-default-x140.jpg);
}
.movie.tvep .eb-card-poster-frame {
  height: 150px;
  background-image: url(src-default-x250.jpg);
}
.movie .eb-card-poster-frame > img {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: block !important;
  width: auto !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: translateX(-50%);
}

/* Episode cards use the same intrinsic-ratio-preserving crop inside their fixed frames. */
.eb-episode-poster-frame {
  position: relative;
  display: block;
  width: 100%;
  height: 210px;
  overflow: hidden;
  background: #eee;
}
.eb-episode-poster-frame > img {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  display: block !important;
  width: auto !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: translateX(-50%);
}
@media (max-width: 1100px) {
  .eb-episode-poster-frame { height: 190px; }
}
@media (max-width: 700px) {
  .eb-episode-poster-frame { height: 156px; }
}
@media (max-width: 420px) {
  .eb-episode-poster-frame { height: 140px; }
}
