/* =====================================================================
   Manarah — UI refresh (brand: teal #003A3F / gold #DF9D42)
   Loaded after style-rtl.css, so these overrides win. RTL-safe.
   ===================================================================== */
:root{
  --mnr-teal:#003A3F;
  --mnr-teal-2:#0A575E;
  --mnr-gold:#DF9D42;
  --mnr-gold-2:#F0B45E;
  --mnr-ease:.28s cubic-bezier(.2,.7,.3,1);
}

/* Smoother overall feel */
a,.btn,.sign-in,.see-more,.owl-carousel img,.movie-rating{
  transition:all var(--mnr-ease);
}

/* Brand text-selection colour */
::selection{ background:var(--mnr-gold); color:#fff; }
::-moz-selection{ background:var(--mnr-gold); color:#fff; }

/* ---- Buttons: pill shape, teal base, gold lift on hover ---- */
.btn,.btn-primary,.sign-in,.see-more,.agree_btn{
  border-radius:40px !important;
  letter-spacing:.2px;
  font-weight:600;
}
/* Main color is gold: gold buttons with dark teal text (readable),
   inverting to teal on hover. */
.btn-primary,.sign-in,.agree_btn{
  background:linear-gradient(135deg,var(--mnr-gold),var(--mnr-gold-2)) !important;
  border:none !important;
  color:var(--mnr-teal) !important;
  font-weight:700;
}
.btn-primary:hover,.sign-in:hover,.agree_btn:hover,.see-more:hover{
  background:linear-gradient(135deg,var(--mnr-teal),var(--mnr-teal-2)) !important;
  color:#fff !important;
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(0,58,63,.30);
}

/* "See more" as a gold outline pill that fills gold on hover */
.see-more{
  border:2px solid var(--mnr-gold) !important;
  color:var(--mnr-gold) !important;
  padding:6px 22px !important;
  background:transparent !important;
}
.see-more:hover{
  border-color:transparent !important;
  background:linear-gradient(135deg,var(--mnr-gold),var(--mnr-gold-2)) !important;
  color:var(--mnr-teal) !important;
}

/* ---- Poster / carousel cards: rounded + hover lift ---- */
.owl-carousel img,
.owl-carousel .owl-item img,
img.owl-lazy{
  border-radius:12px;
}
.owl-carousel .owl-item:hover img,
.owl-carousel .owl-item:hover img.owl-lazy{
  transform:translateY(-6px) scale(1.015);
  box-shadow:0 12px 28px rgba(223,157,66,.45);
}
/* keep the header/nav/footer logo untouched by the rules above */
.logo img,.nav-logo img,.footer-logo img{
  border-radius:0 !important; transform:none !important; box-shadow:none !important;
}

/* ---- Section headings: gold-to-teal underline accent (RTL-safe) ---- */
.section-heading,.wrapper-heading{
  position:relative;
  padding-bottom:12px;
}
.section-heading::after,.wrapper-heading::after{
  content:"";
  position:absolute;
  bottom:0;
  inset-inline-start:0;           /* right edge in RTL, left in LTR */
  width:56px; height:3px;
  border-radius:3px;
  background:linear-gradient(90deg,var(--mnr-gold),var(--mnr-gold-2));
}

/* ---- Small accents ---- */
.movie-rating{ color:var(--mnr-gold) !important; font-weight:600; }
.description-heading:hover{ color:var(--mnr-teal); }

/* ---- Home hero banner (full-width, responsive) ---- */
.manarah-hero-wrap{
  width:100%;
  max-width:1400px;
  margin:14px auto 26px;
  padding:0 12px;
  box-sizing:border-box;
}
.manarah-hero-img{
  display:block;
  width:100%;
  height:auto;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,58,63,.18);
}
@media (max-width:600px){
  .manarah-hero-wrap{ padding:0 8px; margin:8px auto 18px; }
  .manarah-hero-img{ border-radius:10px; }
}

/* =====================================================================
   Header layout: remove the scroll border, logo + menu button on the
   right, home navigation link on the left.
   ===================================================================== */

/* 1) Remove the border/shadow that appears below the top bar on scroll */
.navigation.scrolling{
  box-shadow:none !important;
  border-bottom:none !important;
}

/* Desktop header: one flex row, three zones that cannot overlap.
   RTL visual order:  [Logo] (right) ···· [Sign in / Register] (centre) ···· [الرئيسية] (left) */
@media (min-width:992px){
  .navigation .nav-container > .row{
    display:flex !important;
    flex-wrap:nowrap;
    align-items:center;
    justify-content:space-between;
    margin:0 !important;
    padding:0 60px 0 24px;   /* extra right padding clears the ☰ button */
    box-sizing:border-box;
  }
  .navigation .nav-container > .row > div{
    flex:0 0 auto;
    width:auto !important;
    max-width:none !important;
    position:static !important;
    padding:0;
  }
  .navigation .col-lg-2{ order:1; }   /* logo -> right     */
  .navigation .col-lg-4{ order:3; }   /* auth -> far left  */

  /* reset the earlier float / fixed-position rules on the inner blocks */
  .nav-logo{ margin:0 !important; }
  .login-panel-main-block,
  .login-panel-main-block.small-screen-block{
    position:static !important; float:none !important; left:auto !important; margin:0 !important;
  }
  .login-panel-main-block ul{ margin:0; padding:0; display:flex; align-items:center; gap:10px; }
  .login-panel-main-block ul li{ background:transparent !important; margin:0 !important; }

  /* menu (☰) button on the right corner, vertically centred with the logo */
  .side-bar{ left:auto !important; right:22px !important; top:22px !important; }
}

/* Home-page nav button removed — the logo links to the home page instead.
   Hide its (now empty) wrapper column too, so the logo takes the far-right slot. */
#cssmenu{ display:none !important; }
.navigation .col-lg-6{ display:none !important; }

/* =====================================================================
   Auth buttons: Login = teal outline (secondary), Subscribe = solid gold CTA
   ===================================================================== */
.login-panel-main-block .sign-in{
  display:inline-flex !important;
  align-items:center;
  gap:7px;
  height:auto !important;
  border-radius:40px !important;
  padding:9px 22px !important;
  font-size:15px !important;
  font-weight:700 !important;
  line-height:1 !important;
  letter-spacing:.2px;
  border:2px solid transparent !important;
  transition:all .22s ease !important;
}
.login-panel-main-block .sign-in i{ font-size:15px; line-height:1; }

/* Login (secondary) — teal outline that fills on hover */
.sign-in-block-two .sign-in{
  background:transparent !important;
  border-color:var(--mnr-teal) !important;
  color:var(--mnr-teal) !important;
}
.sign-in-block-two .sign-in:hover{
  background:var(--mnr-teal) !important;
  color:#fff !important;
  transform:translateY(-1px);
}

/* Subscribe (primary CTA) — solid gold, inverts to teal on hover */
.sign-in-block-one:not(.sign-in-block-two) .sign-in{
  background:linear-gradient(135deg,var(--mnr-gold),var(--mnr-gold-2)) !important;
  color:var(--mnr-teal) !important;
  box-shadow:0 4px 14px rgba(223,157,66,.35);
}
.sign-in-block-one:not(.sign-in-block-two) .sign-in:hover{
  background:linear-gradient(135deg,var(--mnr-teal),var(--mnr-teal-2)) !important;
  color:#fff !important;
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,58,63,.30);
}