/* ================== 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;
}
/* ================== button color forgot password================== */
/* Paksa header tabel jadi orange (menimpa pink) */
body[data-color="pink"] table.table-list thead th,
body[data-color="pink"] table.table-list thead tr th {
background: #ff6600 !important;
background-image: none !important;
color: #fff !important;
border-color: #ff6600 !important;
}
/* ================== header product order form color================== */


/* Only adjust these two components as requested */
.input-group-btn > .btn + .btn {
  margin-left: 5px !important;
  margin-top: 60px !important;
}

.input-group-btn > .btn {
  margin-left: 5px !important;
  margin-top: 60px !important;
}
/* ==== reCAPTCHA: selalu di baris sendiri, tidak ketimpa ==== */
.rockbox .service-section .google-recaptcha-align,
.rockbox .service-section .recaptcha-container {
  display: block !important;
  width: 100% !important;    /* ambil 1 baris penuh */
  clear: both !important;    /* paksa turun dari elemen sebelumnya */
  margin-top: 30px !important;
  position: static !important;
  overflow: visible !important; /* jangan kepotong iframe */
  text-align: left;             /* ganti 'center' kalau mau ditengah */
}

/* Pastikan kotak recaptcha tampil utuh */
.rockbox .service-section .recaptcha-container .g-recaptcha {
  display: inline-block !important;
  vertical-align: top;
}

/* Sediakan ruang minimum untuk widget (tinggi normal ~78px) */
.rockbox .service-section .recaptcha-container {
  min-height: 86px;
}

/* Mobile sempit: kecilkan/sesuaikan agar tidak terpotong */
@media (max-width: 420px) {
  .rockbox .service-section .recaptcha-container {
    transform: scale(0.9);
    transform-origin: left top;
    min-height: 78px;  /* tetap cukup tinggi setelah scale */
  }
}
/* Override min-width tombol di blok service item */
.rockbox .service-section .div-service-item {
  min-width: 150px !important;
}