/* ================== Logo ================== */
/* Jaga rasio: kunci tinggi, biarkan lebar mengikuti */
img.logo-menu {
  height: 40px;                /* default 36–48px biasanya pas */
  width: auto !important;
  display: block;
  image-rendering: auto;
}

/* Kalau theme memberi ukuran ke .svg, pastikan tidak ikut ke logo */
img.logo-menu.svg {
  width: auto !important;
  height: 40px !important;     /* guard jika ada cache */
}

/* Desktop (≥992px) perbesar logo */
@media (min-width: 992px) {
  img.logo-menu {
    height: 48px;
  }
}

/* ================== Layering / Z-index ================== */
/* Supaya header & menu tidak ketutup banner */
.header,
.menu-wrap.desktop {
  position: relative;
  z-index: 1030;                /* di atas .top-header overlay */
}

.top-header {
  position: relative;
  z-index: 1;
}

/* ================== Switch Desktop ↔ Mobile ================== */
/* Desktop tampil >=1200px (XL ke atas), Mobile di bawah itu */
@media (min-width: 1200px) {
  .menu-wrap.desktop {
    display: block !important;
  }
  #menu-mobile {
    display: none !important;
  }
}
/* ================== header menu wrap linear color ================== */
body[data-background="light"] .box-container .menu-wrap,
body[data-background="light"] .box-container .menu-wrap.fixed {
background: #ff6600 !important; /* fallback */
background: linear-gradient(89deg, #fdd700 3%, #ff6600 98%) !important;
}
/* ================== footer background ================== */
#footer.footer { background-color: #15212a !important; }
/* ================== footer icon color and hover ================== */
.footer .soc-icons i { color: #ff6600 !important; }
.footer .soc-icons i:hover { color: #fdd700 !important; }
/* ================== footer head menu ================== */
#footer.footer .heading { color: #fff !important; }
/* ================== footer menu item color================== */
#footer.footer .footer-menu .menu-item  a { color: #fff !important; }
#footer.footer .footer-menu .menu-item a:hover { color: #fdd700 !important; }
/* ================== footer data color================== */
#footer.footer .copyright { color: #fff !important; }
#footer.footer .subcribe { color: #fff !important; }
#footer.footer .subcribe form p { color: #fff !important; }
#footer.footer .payment-list li p { color: #fff !important; }
#footer.footer .footer-menu .menu-item.by { color: #fff !important; }
/* ================== footer paymentlist color================== */
#footer.footer .payment-list li i { color: #fff !important; }
#footer.footer .payment-list li i:hover { color: #d1d5db !important; }

/* Override: pink button → orange */
body[data-color="pink"] .btn-default-pink-fill { background-color: #ff6600 !important; color: #fff !important; border: none !important; }
body[data-color="pink"] .btn-default-pink-fill:hover, body[data-color="pink"] .btn-default-pink-fill:focus { background-color: #e65c00 !important; color: #fff !important; }
body[data-color="pink"] .btn-default-pink-fill:active { background-color: #cc5200 !important; color: #fff !important; }
/* Override title color when data-color=pink */
body[data-color="pink"] .pricing .wrapper .title {
color: #ff6600 !important;
}
/* Override pink scheme to orange /
body[data-color="pink"] .bg-pink { background-color: #ff6600 !important; }
body[data-color="pink"] .pricing .list-info { background-color: #ff6600 !important; }
/ Darker orange for previous “pink dark” accent */
body[data-color="pink"] .bg-purple { background-color: #ff6600!important; }
body[data-color="pink"] .bg-pink { background-color: #ff6600!important; }
/* Override: pink scheme list-info → #fdd700 */
body[data-color="pink"] .pricing .list-info {
background-color: #ff6600 !important;
}
body[data-color="pink"] .c-pink {
color: #a5215e !important;
}
/* Override pink SVG accent to orange */
body[data-color="pink"] svg #svg-concept {
stroke: #ff6600 !important;
}

/* If the shape uses fill instead of stroke, use this: /
/ body[data-color="pink"] svg #svg-concept { fill: #ff6600 !important; } */

/* ================== menu background dan nav color mobile ================== */

/* ================== client login================== */
/* ================== button create account color================== */
body[data-color="pink"] .loginpage .login-page-header i {
background-color: #ff6600 !important;
}

body[data-color="pink"] .loginpage .login-page-header i:hover {
background-color: #e65c00 !important;
}

/* ================== button color forgot password================== */
body[data-color="pink"] .golink {
color: #ff6600 !important;
}

body[data-color="pink"] .golink:hover {
color: #e65c00 !important;
}