/* =========================================================
   LA BELLA — SHIPPING POLICY V5
   PREMIUM EDITORIAL / LIGHTWEIGHT
========================================================= */

body.lb-shipping-v5 {
  --lb5-bg: #fbf8fb;
  --lb5-bg-soft: #f3ecf5;

  --lb5-plum: #2a0a31;
  --lb5-purple: #6d0482;
  --lb5-purple-hover: #80109a;

  --lb5-gold: #c7a159;
  --lb5-gold-soft: #eadcb2;

  --lb5-text: #382b3b;
  --lb5-muted: #766b79;

  --lb5-border: rgba(55, 19, 62, 0.11);
  --lb5-card: rgba(255, 255, 255, 0.72);

  background: var(--lb5-bg) !important;
  overflow-x: hidden;
}

/* =========================================================
   EASY ORDERS RESET
========================================================= */

body.lb-shipping-v5 .relative.py-16.bg-white.flex-1 {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

body.lb-shipping-v5
.relative.py-16.bg-white.flex-1
> .relative {
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: visible !important;
}

/* إخفاء عنوان Easy Orders الأصلي */
body.lb-shipping-v5
.relative.py-16.bg-white.flex-1
> .relative
> .text-lg.max-w-prose {
  display: none !important;
}

body.lb-shipping-v5 .content_container.page_content {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  color: inherit !important;
  font-size: inherit !important;
  line-height: normal !important;

  overflow: visible !important;
}

body.lb-shipping-v5
.content_container.page_content
.ql-editor {
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  line-height: normal !important;
  overflow: visible !important;
}

/* =========================================================
   MAIN SECTION
========================================================= */

#lbShippingV5 {
  position: relative;
  isolation: isolate;

  width: 100%;
  min-height: 1200px;

  box-sizing: border-box;

  padding:
    clamp(45px, 6vh, 75px)
    clamp(42px, 7vw, 115px)
    clamp(85px, 10vh, 130px);

  background:
    radial-gradient(
      circle at 4% 5%,
      rgba(199, 161, 89, 0.13),
      transparent 23%
    ),
    radial-gradient(
      circle at 96% 90%,
      rgba(109, 4, 130, 0.075),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #fdfbfd 0%,
      #faf7fb 48%,
      #f2eaf4 100%
    );
}

/* كلمة SHIPPING خلف العمودين */
#lbShippingV5::before {
  content: "SHIPPING";

  position: absolute;
  z-index: -2;

  top: 18px;
  left: -25px;

  color: rgba(42, 10, 49, 0.042);

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size: clamp(125px, 19vw, 305px);
  font-weight: 700;
  line-height: 0.8;
  letter-spacing: -0.06em;

  white-space: nowrap;

  pointer-events: none;
  user-select: none;
}

/* دائرة زخرفية */
#lbShippingV5::after {
  content: "";

  position: absolute;
  z-index: -2;

  right: -280px;
  bottom: -300px;

  width: 640px;
  height: 640px;

  border: 1px solid rgba(199, 161, 89, 0.17);
  border-radius: 50%;

  box-shadow:
    inset 0 0 0 58px rgba(255, 255, 255, 0.21),
    inset 0 0 0 59px rgba(199, 161, 89, 0.065),
    inset 0 0 0 136px rgba(255, 255, 255, 0.13);

  pointer-events: none;
}

#lbShippingV5 .lb5-top-line {
  position: absolute;

  top: 0;
  right: 8%;
  left: 8%;

  height: 1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(199, 161, 89, 0.55),
      transparent
    );
}

/* =========================================================
   LAYOUT
========================================================= */

#lbShippingV5 .lb5-layout {
  position: relative;
  z-index: 2;

  width: min(100%, 1440px);
  margin: 0 auto;

  display: grid;

  grid-template-columns:
    minmax(560px, 1.25fr)
    minmax(360px, 0.75fr);

  gap: clamp(60px, 8vw, 135px);

  align-items: start;

  direction: ltr;
}

/* =========================================================
   LEFT — POLICY CARDS
========================================================= */

#lbShippingV5 .lb5-policies {
  display: flex;
  flex-direction: column;

  gap: 9px;

  padding: 0;
  margin: 0;

  direction: rtl;
}

#lbShippingV5 .lb5-list-label {
  display: flex;
  align-items: center;
  gap: 14px;

  margin: 0 0 10px;

  color: var(--lb5-gold);

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.27em;
  line-height: 1;

  direction: ltr;
  text-transform: uppercase;
}

#lbShippingV5 .lb5-list-label::before {
  content: "";

  width: 42px;
  height: 1px;

  background: var(--lb5-gold);
}

/* الكارت */
#lbShippingV5 .lb5-card {
  position: relative;

  width: 100%;
  min-height: 76px;

  display: grid;

  grid-template-columns:
    40px
    minmax(0, 1fr)
    20px;

  align-items: center;

  gap: 15px;

  box-sizing: border-box;

  margin: 0 !important;
  padding: 10px 16px !important;

  overflow: hidden;

  border: 1px solid var(--lb5-border);
  border-radius: 12px;

  background:
    linear-gradient(
      105deg,
      rgba(255, 255, 255, 0.84),
      rgba(255, 255, 255, 0.4)
    );

  box-shadow:
    0 9px 24px rgba(42, 10, 49, 0.03);

  transition:
    transform 0.35s ease,
    border-color 0.35s ease,
    background 0.35s ease,
    box-shadow 0.35s ease;
}

/* الخط الذهبي الجانبي */
#lbShippingV5 .lb5-card::before {
  content: "";

  position: absolute;

  top: 18%;
  right: 0;

  width: 2px;
  height: 64%;

  background:
    linear-gradient(
      to bottom,
      transparent,
      rgba(199, 161, 89, 0.86),
      transparent
    );

  opacity: 0;
  transform: scaleY(0.3);

  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}

/* الكلمة الإنجليزية بالخلفية */
#lbShippingV5 .lb5-card::after {
  content: attr(data-word);

  position: absolute;

  left: 14px;
  bottom: 3px;

  color: rgba(42, 10, 49, 0.065);

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size: 29px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.025em;

  direction: ltr;

  opacity: 0.7;
  transform: translateY(3px);

  pointer-events: none;

  transition:
    color 0.4s ease,
    opacity 0.4s ease,
    transform 0.4s ease,
    text-shadow 0.4s ease;
}

#lbShippingV5 .lb5-card:hover {
  transform: translateX(5px);

  border-color: rgba(109, 4, 130, 0.26);

  background:
    linear-gradient(
      105deg,
      rgba(255, 255, 255, 0.98),
      rgba(247, 239, 249, 0.76)
    );

  box-shadow:
    0 17px 38px rgba(42, 10, 49, 0.075),
    inset 3px 0 0 rgba(199, 161, 89, 0.58);
}

#lbShippingV5 .lb5-card:hover::before {
  opacity: 1;
  transform: scaleY(1);
}

#lbShippingV5 .lb5-card:hover::after {
  color: rgba(109, 4, 130, 0.42);

  opacity: 1;
  transform: translateY(-3px);

  text-shadow:
    0 0 12px rgba(109, 4, 130, 0.13),
    0 0 24px rgba(199, 161, 89, 0.12);
}

/* رقم الكارت */
#lbShippingV5 .lb5-number {
  position: relative;
  z-index: 3;

  width: 38px;
  height: 38px;

  display: grid;
  place-items: center;

  box-sizing: border-box;

  color: var(--lb5-gold);

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size: 19px;
  font-weight: 600;
  line-height: 1;

  border: 1px solid rgba(199, 161, 89, 0.3);
  border-radius: 50%;

  background: rgba(199, 161, 89, 0.045);

  transition:
    color 0.35s ease,
    border-color 0.35s ease,
    background 0.35s ease;
}

#lbShippingV5 .lb5-card:hover .lb5-number {
  color: var(--lb5-purple);

  border-color: rgba(109, 4, 130, 0.26);

  background: rgba(109, 4, 130, 0.045);
}

/* النص داخل الكارت */
#lbShippingV5 .lb5-card-copy {
  position: relative;
  z-index: 3;

  min-width: 0;

  display: flex;
  flex-direction: column;
  justify-content: center;

  margin: 0 !important;
  padding: 0 !important;

  direction: rtl;
  text-align: right;

  font-family: "Cairo", sans-serif !important;
}

/* إلغاء تنسيق prose بالكامل */
#lbShippingV5 .lb5-card-copy h2,
#lbShippingV5 .lb5-card-copy p {
  display: block !important;

  width: auto !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: none !important;
  box-shadow: none !important;

  font-family: "Cairo", sans-serif !important;
  font-style: normal !important;

  letter-spacing: 0 !important;
  text-indent: 0 !important;
  text-transform: none !important;

  text-align: right !important;
  white-space: normal !important;
}

#lbShippingV5 .lb5-card-copy h2 {
  margin-bottom: 3px !important;

  color: var(--lb5-plum) !important;

  font-size: clamp(13px, 0.9vw, 15.5px) !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;

  transition: color 0.3s ease;
}

#lbShippingV5 .lb5-card-copy p {
  color: var(--lb5-muted) !important;

  font-size: clamp(10.3px, 0.72vw, 12px) !important;
  font-weight: 400 !important;
  line-height: 1.65 !important;

  transition: color 0.3s ease;
}

#lbShippingV5 .lb5-card:hover .lb5-card-copy h2 {
  color: var(--lb5-purple) !important;
}

#lbShippingV5 .lb5-card:hover .lb5-card-copy p {
  color: #55495a !important;
}

/* العلامة الصغيرة */
#lbShippingV5 .lb5-symbol {
  position: relative;
  z-index: 3;

  width: 18px;
  height: 18px;
}

#lbShippingV5 .lb5-symbol::before,
#lbShippingV5 .lb5-symbol::after {
  content: "";

  position: absolute;

  top: 50%;
  left: 50%;

  background: rgba(109, 4, 130, 0.21);

  transform: translate(-50%, -50%);

  transition:
    background 0.35s ease,
    transform 0.35s ease;
}

#lbShippingV5 .lb5-symbol::before {
  width: 18px;
  height: 1px;
}

#lbShippingV5 .lb5-symbol::after {
  width: 1px;
  height: 18px;
}

#lbShippingV5 .lb5-card:hover .lb5-symbol::before,
#lbShippingV5 .lb5-card:hover .lb5-symbol::after {
  background: var(--lb5-gold);
}

/* =========================================================
   RIGHT — STICKY EDITORIAL
========================================================= */

#lbShippingV5 .lb5-editorial {
  position: sticky;

  top: 125px;

  align-self: start;

  height: fit-content;
  min-height: 0;

  display: flex;
  flex-direction: column;
  justify-content: flex-start;

  margin: 0;
  padding: 0;

  direction: rtl;
  text-align: right;
}

#lbShippingV5 .lb5-index {
  position: absolute;

  top: -12px;
  left: 0;

  color: rgba(42, 10, 49, 0.06);

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size: 82px;
  font-weight: 600;
  line-height: 1;

  direction: ltr;

  pointer-events: none;
}

#lbShippingV5 .lb5-label {
  display: flex;
  align-items: center;
  gap: 14px;

  margin: 0 0 19px;

  color: var(--lb5-gold);

  font-family:
    "Cormorant Garamond",
    Georgia,
    serif;

  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.28em;
  line-height: 1;

  direction: ltr;
  text-transform: uppercase;
}

#lbShippingV5 .lb5-label::before {
  content: "";

  width: 44px;
  height: 1px;

  background: var(--lb5-gold);
}

#lbShippingV5 .lb5-title {
  max-width: 560px;

  margin: 0 !important;
  padding: 0 !important;

  color: var(--lb5-plum) !important;

  font-family: "Cairo", sans-serif !important;

  font-size: clamp(47px, 5vw, 82px) !important;
  font-weight: 800 !important;
  line-height: 1.13 !important;
  letter-spacing: -0.06em !important;

  text-align: right !important;
}

#lbShippingV5 .lb5-title span {
  display: block;

  color: var(--lb5-purple);
}

#lbShippingV5 .lb5-description {
  max-width: 470px;

  margin: 22px 0 0 !important;
  padding: 0 !important;

  color: var(--lb5-muted) !important;

  font-family: "Cairo", sans-serif !important;

  font-size: clamp(13px, 0.92vw, 16px) !important;
  font-weight: 400 !important;
  line-height: 1.95 !important;

  text-align: right !important;
}

#lbShippingV5 .lb5-rule {
  width: min(100%, 230px);
  height: 1px;

  margin: 29px 0 21px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(199, 161, 89, 0.82)
    );
}

#lbShippingV5 .lb5-note {
  max-width: 425px;

  display: grid;
  grid-template-columns: 3px 1fr;

  gap: 16px;
  align-items: stretch;

  margin: 0;
  padding: 0;

  color: var(--lb5-text);

  font-family: "Cairo", sans-serif;

  font-size: 12px;
  font-weight: 600;
  line-height: 1.85;

  direction: rtl;
  text-align: right;
}

#lbShippingV5 .lb5-note::before {
  content: "";

  width: 2px;
  height: 100%;

  background:
    linear-gradient(
      to bottom,
      var(--lb5-gold),
      rgba(199, 161, 89, 0.1)
    );
}

/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {
  #lbShippingV5 {
    min-height: 0;

    padding:
      120px
      clamp(24px, 5vw, 55px)
      75px;
  }

  #lbShippingV5 .lb5-layout {
    grid-template-columns: 1fr;

    gap: 45px;

    direction: rtl;
  }

  #lbShippingV5 .lb5-editorial {
    position: relative;

    top: auto;

    order: -1;
  }
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 640px) {
  #lbShippingV5 {
    min-height: calc(100vw * 16 / 9);

    padding:
      110px
      13px
      50px;
  }

  #lbShippingV5::before {
    top: 70px;
    left: -9%;

    font-size: 29vw;
  }

  #lbShippingV5::after {
    right: -365px;
    bottom: -330px;
  }

  #lbShippingV5 .lb5-layout {
    gap: 32px;
  }

  #lbShippingV5 .lb5-index {
    top: -5px;

    font-size: 60px;
  }

  #lbShippingV5 .lb5-label {
    margin-bottom: 13px;

    font-size: 8px;
    letter-spacing: 0.18em;
  }

  #lbShippingV5 .lb5-label::before {
    width: 28px;
  }

  #lbShippingV5 .lb5-title {
    max-width: 350px;

    font-size: clamp(40px, 12.5vw, 57px) !important;
    line-height: 1.18 !important;
  }

  #lbShippingV5 .lb5-description {
    margin-top: 14px !important;

    font-size: 11.3px !important;
    line-height: 1.8 !important;
  }

  #lbShippingV5 .lb5-rule {
    margin: 21px 0 16px;
  }

  #lbShippingV5 .lb5-note {
    font-size: 10.3px;
    line-height: 1.7;
  }

  #lbShippingV5 .lb5-list-label {
    font-size: 8px;
    letter-spacing: 0.17em;
  }

  #lbShippingV5 .lb5-policies {
    gap: 7px;
  }

  #lbShippingV5 .lb5-card {
    min-height: 0;

    grid-template-columns:
      34px
      minmax(0, 1fr)
      16px;

    gap: 9px;

    padding: 10px !important;

    border-radius: 10px;
  }

  #lbShippingV5 .lb5-number {
    width: 32px;
    height: 32px;

    font-size: 17px;
  }

  #lbShippingV5 .lb5-card-copy h2 {
    margin-bottom: 2px !important;

    font-size: 11.8px !important;
    line-height: 1.4 !important;
  }

  #lbShippingV5 .lb5-card-copy p {
    font-size: 9.5px !important;
    line-height: 1.55 !important;
  }

  #lbShippingV5 .lb5-symbol {
    width: 15px;
    height: 15px;
  }

  #lbShippingV5 .lb5-symbol::before {
    width: 15px;
  }

  #lbShippingV5 .lb5-symbol::after {
    height: 15px;
  }

  #lbShippingV5 .lb5-card::after {
    left: 9px;
    bottom: 3px;

    font-size: 23px;
  }
}

@media (hover: none) {
  #lbShippingV5 .lb5-card:hover {
    transform: none;
  }
}
