:root{
  --pink:#ff4d93;
  --pink-dark:#e91e73;
  --pink-soft:#f7a1c3;
  --pink-border:#ffc1d9;
  --text:#333;
}

/* BODY */
html,body{
  overflow-x:hidden !important;
}

body{
  background:linear-gradient(
      180deg,
      #fff8fb 0%,
      #fff1f7 50%,
      #ffeaf3 100%
  ) !important;

  font-family:Arial,sans-serif !important;
  color:var(--text) !important;
}

/* HEADER */
.container-header{
  min-height:230px !important;
  padding:25px 45px 45px !important;
  background:#ffeaf3 !important;
  position:relative !important;
  box-shadow:0 5px 20px rgba(255,77,147,.10) !important;
}

/* LOGO + NAMA TOKO */
.container-header .navbar-brand{
  position:absolute !important;
  left:45px !important;
  top:20px !important;
  width:330px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  text-decoration:none !important;
}

.container-header .navbar-brand img{
  width:95px !important;
  max-width:95px !important;
  height:auto !important;
}

.container-header .navbar-brand::before{
  content:"Aul's Skincare" !important;
  color:#ff5fa2 !important;
  font-size:28px !important;
  font-weight:900 !important;
  margin-top:8px !important;
}

.container-header .site-description{
  color:var(--pink-soft) !important;
  font-size:14px !important;
  font-weight:600 !important;
  margin-top:3px !important;
  white-space:nowrap !important;
}

/* MENU */
.container-header .container-nav{
  position:absolute !important;
  top:70px !important;
  left:200px !important;
  right:40px !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
}

.container-header .mod-menu{
  display:flex !important;
  gap:55px !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:nowrap !important;
}

.container-header .mod-menu a{
  color:var(--pink) !important;
  font-size:15px !important;
  font-weight:700 !important;
  text-decoration:none !important;
}

.container-header .mod-menu a:hover{
  color:var(--pink-dark) !important;
}

/* SEARCH CUSTOM */
.auls-custom-search{
  position:absolute !important;
  top:105px !important;
  left:520px !important;
  z-index:9999 !important;
}

.auls-custom-search form{
  display:flex !important;
  align-items:center !important;
}

.auls-custom-search input{
  width:520px !important;
  height:42px !important;
  border:2px solid var(--pink-border) !important;
  border-radius:25px 0 0 25px !important;
  padding:0 18px !important;
  font-size:15px !important;
  background:#fff !important;
  outline:none !important;
}

.auls-custom-search button{
  width:50px !important;
  height:42px !important;
  border:none !important;
  border-radius:0 25px 25px 0 !important;
  background:var(--pink) !important;
  color:#fff !important;
}

/* HILANGKAN SIDEBAR & BREADCRUMB */
.sidebar-right,
.container-sidebar-right,
.breadcrumb,
.mod-breadcrumbs,
.breadcrumbs,
.container-breadcrumbs{
  display:none !important;
}

.site-grid{
  max-width:1250px !important;
  margin:auto !important;
}

main{
  width:100% !important;
}

/* DESKRIPSI TOKO */
.auls-description{
  text-align:center !important;
  max-width:1000px !important;
  margin:35px auto !important;
}

.auls-description h2{
  color:#ff5fa2 !important;
  font-size:42px !important;
  font-weight:900 !important;
  margin-bottom:15px !important;
}

.auls-description p{
  font-size:20px !important;
  line-height:1.8 !important;
  color:#555 !important;
}

/* KATEGORI */
.category-view{
  max-width:1200px !important;
  margin:45px auto !important;
  text-align:center !important;
}

.category-view h1,
.category-view h2,
.category-view h3,
.category h2,
.category h3,
.category span,
.category-name,
.category-view .category-title{
  color:var(--pink) !important;
  font-size:40px !important;
  font-weight:900 !important;
}

.category-view p{
  max-width:1000px !important;
  margin:0 auto 35px !important;
  font-size:18px !important;
  line-height:1.7 !important;
  color:#555 !important;
}

.category-view .row,
.category-view .categories{
  display:flex !important;
  justify-content:center !important;
  gap:28px !important;
  flex-wrap:wrap !important;
}

.category-view .category{
  width:250px !important;
  background:#fff !important;
  border:2px solid #ffd1e3 !important;
  border-radius:24px !important;
  padding:20px !important;
  box-shadow:0 8px 22px rgba(255,77,147,.12) !important;
}

.category-view .category img{
  width:190px !important;
  height:130px !important;
  object-fit:cover !important;
  border-radius:18px !important;
  margin-bottom:15px !important;
}

.category-view a{
  color:var(--pink) !important;
  font-size:22px !important;
  font-weight:800 !important;
  text-decoration:none !important;
}

/* HILANGKAN SORT */
.orderby-displaynumber,
.vm-order-list,
.orderlistcontainer,
.display-number{
  display:none !important;
}

/* HANYA HILANGKAN BAGIAN KATEGORI DI MENU PRODUK */
body.itemid-126 .category-view > h1,
body.itemid-126 .category-view > h2,
body.itemid-126 .category-view > h3,
body.itemid-126 .category-view > p,
body.itemid-126 .category-view > div:not(.browse-view):not(.products-view) {
  display:none !important;
}

/* PASTIKAN PRODUK TETAP MUNCUL */
body.itemid-126 .browse-view,
body.itemid-126 .products-view {
  display:block !important;
}

/* HILANGKAN PRODUK DI MENU HOME SAJA */
body.itemid-101 .browse-view,
body.itemid-101 .vm-product-container,
body.itemid-101 .product,
body.itemid-101 .vm-products,
body.itemid-101 .vmproduct {
  display:none !important;
}
/* MENU KATEGORI - HANYA TAMPILKAN KATEGORI */
body.itemid-125 .browse-view,
body.itemid-125 .product,
body.itemid-125 .productdetails,
body.itemid-125 .vm-product-container,
body.itemid-125 .vm-products,
body.itemid-125 .category-product {
    display:none !important;
}

/* HILANGKAN TOMBOL REGISTER AND CHECKOUT */
.vm-checkout-login a.btn-secondary {
    display: none !important;
}

/* ==========================================
   SEMUA BUTTON BIRU JADI PINK
========================================== */

/* Tombol Joomla */
.btn-primary,
.btn-success,
.btn-info,
.btn-warning,
.btn-danger,
.btn-secondary,
.btn {

    background: #ff4d93 !important;
    border-color: #ff4d93 !important;
    color: #fff !important;
}

/* Hover */
.btn:hover,
.btn-primary:hover,
.btn-success:hover,
.btn-info:hover,
.btn-warning:hover,
.btn-danger:hover,
.btn-secondary:hover {

    background: #e91e73 !important;
    border-color: #e91e73 !important;
    color: #fff !important;
}

/* Add To Cart */
.addtocart-button,
.addtocart-button input,
.vm-button-correct,
.vm-button {

    background: #ff4d93 !important;
    border: none !important;
    color: #fff !important;
    border-radius: 12px !important;
}

.addtocart-button:hover,
.vm-button:hover {

    background: #e91e73 !important;
}

/* Login Button */
.login button,
.login .btn-primary {

    background: #ff4d93 !important;
    border-color: #ff4d93 !important;
}

/* Checkout Button */
.checkout-button-top,
.checkout-button-bottom,
button.checkout_button,
button[name="checkout"] {

    background: #ff4d93 !important;
    border-color: #ff4d93 !important;
    color: #fff !important;
}

/* Quantity + dan - */
.quantity-controls button,
.quantity-box button {

    background: #fff1f7 !important;
    color: #ff4d93 !important;
    border: 2px solid #ff4d93 !important;
}

/* JUDUL CART, BILLING, SHOPPER JADI PINK */
.cart-view h1,
.cart-view h2,
.cart-view h3,
.cart-view legend,
.cart-view .checkout-title,
.cart-view .vm-fieldset-pricelist h3,
.cart-view .vm-fieldset-tos h3,
.cart-view .customer-comment h3,
.cart-view fieldset > h3,
.cart-view .billto-shipto h3,
.cart-view .userfields_info {
  color:#ff4d93 !important;
  font-weight:900 !important;
}

/* Tulisan besar Shopper Information */
.cart-view strong,
.cart-view b {
  color:#ff4d93 !important;
}

/* Tombol pink */
.cart-view .btn,
.cart-view button,
.cart-view input[type="submit"],
.cart-view input[type="button"],
.vm-button-correct,
.addtocart-button,
button[name="checkout"] {
  background:#ff4d93 !important;
  border-color:#ff4d93 !important;
  color:#fff !important;
  border-radius:8px !important;
}

/* Hover tombol */
.cart-view .btn:hover,
.cart-view button:hover,
.cart-view input[type="submit"]:hover,
.cart-view input[type="button"]:hover,
.vm-button-correct:hover {
  background:#e91e73 !important;
  border-color:#e91e73 !important;
  color:#fff !important;
}

/* Link produk dan delete */
.cart-view a {
  color:#ff4d93 !important;
}

/* Border input saat fokus */
.cart-view input:focus,
.cart-view select:focus,
.cart-view textarea:focus {
  border-color:#ff4d93 !important;
  box-shadow:0 0 0 2px rgba(255,77,147,.15) !important;
}

/* CART TITLE JADI PINK */
h1.vm-page-title,
.vm-page-title,
.cart-view h1.vm-page-title {
  color: #ff4d93 !important;
  font-weight: 900 !important;
}

/* RAPATKAN MENU HEADER */
.container-header .mod-menu,
.container-header .navbar-nav{
  gap: 28px !important;
}

.container-header .mod-menu > li,
.container-header .navbar-nav > li{
  margin: 0 8px !important;
}

.container-header .mod-menu a,
.container-header .navbar-nav a{
  padding-left: 8px !important;
  padding-right: 8px !important;
}

/* KHUSUS ICON MENU BIAR TIDAK MAKAN TEMPAT */
.container-header .mod-menu .fa,
.container-header .mod-menu .fas,
.container-header .mod-menu .fa-solid{
  font-size: 20px !important;
  width: auto !important;
}

.home-product-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
    margin-top:20px;
}

.home-product-card{
    background:#fff;
    border:2px solid #ffc1d9;
    border-radius:20px;
    padding:15px;
    text-align:center;
    transition:.3s;
}

.home-product-card:hover{
    transform:translateY(-5px);
    box-shadow:0 8px 20px rgba(255,77,147,.15);
}

.home-product-card img{
    width:140px;
    height:180px;
    object-fit:contain;
}

.home-product-card h3{
    color:#ff4d93;
    font-size:20px;
    font-weight:800;
    margin-top:10px;
}

.home-product-card p{
    font-size:18px;
    font-weight:700;
    color:#333;
}
/* JUDUL FEATURED PRODUCTS */
.home-featured h3,
.moduletable h3,
.card-header{
    color:#ff4d93 !important;
    font-weight:900 !important;
}

/* NAMA PRODUK */
.home-product-card h3{
    color:#ff4d93 !important;
    font-size:20px !important;
    font-weight:900 !important;
    margin-top:10px !important;
}

/* HARGA */
.home-product-card p{
    color:#333 !important;
    font-weight:700 !important;
}

/* ===== FEATURED / BEST SELLER / LATEST PRODUCT ===== */

.vmgroup .productdetails,
.vmgroup .product,
.vmproduct .product {
    width: 23% !important;
    display: inline-block !important;
    vertical-align: top !important;
    margin: 1% !important;
    text-align: center !important;
    background: #fff !important;
    border: 2px solid #ffd6e7 !important;
    border-radius: 18px !important;
    padding: 15px !important;
    box-sizing: border-box !important;
}

/* GAMBAR */
.vmgroup img,
.vmproduct img {
    width: 180px !important;
    height: 180px !important;
    object-fit: contain !important;
    margin: auto !important;
    display: block !important;
}

/* NAMA PRODUK */
.vmgroup h2,
.vmgroup h3,
.vmgroup .product_name,
.vmproduct h2,
.vmproduct h3 {
    color: #ff4d93 !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    margin-top: 10px !important;
}

/* HARGA */
.vmgroup .PricesalesPrice,
.vmgroup .product-price,
.vmproduct .PricesalesPrice {
    color: #333 !important;
    font-size: 18px !important;
    font-weight: bold !important;
}

/* TOMBOL CART */
.vmgroup .addtocart-button,
.vmproduct .addtocart-button {
    background: #ff4d93 !important;
    border: none !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 8px 15px !important;
}

/* JUDUL MODUL */
.moduletable h3,
.card-header {
    color:#ff4d93 !important;
    font-size:36px !important;
    font-weight:900 !important;
    text-align:left !important;
    padding:0 0 20px 25px !important;
    margin:0 !important;
}

/* CUSTOM FEATURED PRODUCTS */
.home-product-grid{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:25px !important;
  padding:25px !important;
}

.home-product-card{
  text-align:center !important;
  border:2px solid #ffc1d9 !important;
  border-radius:20px !important;
  padding:18px !important;
  background:#fff !important;
}

.home-product-card img{
  width:140px !important;
  height:170px !important;
  object-fit:contain !important;
  display:block !important;
  margin:0 auto 12px !important;
}

.home-product-card h3{
  color:#ff4d93 !important;
  font-size:20px !important;
  font-weight:900 !important;
}

.home-product-card p{
  color:#333 !important;
  font-size:17px !important;
  font-weight:700 !important;
}
/* BIAR MODUL FEATURED / BEST SELLER / NEW ARRIVALS TURUN KE BAWAH, BUKAN SAMPING */
.auls-product-section{
  width:100% !important;
  max-width:100% !important;
  display:block !important;
  clear:both !important;
  grid-column:1 / -1 !important;
  margin:40px 0 !important;
}

/* ISI PRODUK 1 BARIS 4 */
.auls-product-section .home-product-grid{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  gap:25px !important;
  padding:25px !important;
  width:100% !important;
  overflow:hidden !important;
}

/* CARD PRODUK */
.auls-product-section .home-product-card{
  width:100% !important;
  min-width:0 !important;
}

/* GAMBAR BIAR TIDAK BESAR */
.auls-product-section .home-product-card img{
  width:130px !important;
  height:170px !important;
  object-fit:contain !important;
}

body,
.site-grid,
main,
.container-component,
.com-content-article,
.blog,
.item-page,
.category-view,
.vm-category,
#content {
  background:linear-gradient(180deg,#fff8fb 0%,#fff1f7 55%,#ffeaf3 100%) !important;
}

body,
.site-grid,
main,
.container-component,
.com-content-article,
.blog,
.item-page,
.category-view,
.vm-category,
#content,
.container-main,
.container-component,
main .container,
main > div {
  background:#ffe9f3!important;
}

.home-product-card,
.category-view .category {
  background:#fff !important;
}

.container-header {
  background:#ffeaf3 !important;
}

/* HILANGKAN TAB YOUR ORDERS DI HALAMAN SAYA */
#tabs > li:nth-child(2),
#tabs a[href*="layout=list"],
#tabs a[href*="view=orders"]{
  display:none !important;
}

/* FOOTER AUL'S SKINCARE */
.auls-footer{
  width:100% !important;
  margin-top:60px !important;
  padding:45px 25px 25px !important;
  background:linear-gradient(135deg,#ffe1ee,#fff1f7,#ffd6e8) !important;
  border-top:4px solid #ff9bc2 !important;
  text-align:center !important;
  color:#e91e73 !important;
  box-shadow:0 -8px 25px rgba(255,77,147,.12) !important;
}

.auls-footer h2{
  color:#ff4d93 !important;
  font-size:34px !important;
  font-weight:900 !important;
  margin-bottom:8px !important;
}

.auls-footer-brand p{
  color:#f48bb6 !important;
  font-size:17px !important;
  font-weight:700 !important;
  margin-bottom:25px !important;
}

.auls-footer-info{
  display:flex !important;
  justify-content:center !important;
  gap:18px !important;
  flex-wrap:wrap !important;
  margin-bottom:25px !important;
}

.auls-footer-info div{
  background:#fff !important;
  border:2px solid #ffc1d9 !important;
  border-radius:18px !important;
  padding:12px 18px !important;
  color:#e91e73 !important;
  font-weight:700 !important;
  box-shadow:0 5px 15px rgba(255,77,147,.10) !important;
}

.auls-footer-bottom{
  border-top:1px dashed #ff9bc2 !important;
  padding-top:18px !important;
  color:#d81b60 !important;
  font-size:14px !important;
  font-weight:700 !important;
}

/* FOOTER RESPONSIVE */
@media(max-width:768px){
  .auls-footer h2{
    font-size:28px !important;
  }

  .auls-footer-info{
    flex-direction:column !important;
    align-items:center !important;
  }

  .auls-footer-info div{
    width:90% !important;
  }
}

/* HILANGKAN BIRU FOOTER CASSIOPEIA */
.footer,
.container-footer,
.site-footer{
    background:#ffe4ef !important;
    background-image:none !important;
    border:none !important;
}

/* AREA FOOTER FULL PINK */
.container-footer{
    padding:0 !important;
}

/* MODUL FOOTER */
.auls-footer{
    margin:0 !important;
}
/* TAB AKUN PINK AESTHETIC */
#tabs > li,
#tabs > li.current,
#tabs > li.active{
    background:linear-gradient(135deg,#ff6aa8,#ff4d93) !important;
    border:none !important;
    border-radius:12px 12px 0 0 !important;
    margin-right:5px !important;
}

#tabs > li a{
    color:#fff !important;
    font-weight:700 !important;
    padding:8px 15px !important;
    display:block !important;
}

#tabs > li:hover{
    background:linear-gradient(135deg,#ff4d93,#e91e73) !important;
}

/* =========================
   ALERT PINK AUL'S SKINCARE
   ========================= */

/* Container */
.joomla-alert,
.alert,
.alert-wrapper {
    border-radius: 15px !important;
    overflow: hidden !important;
    border: 2px solid #ffb6d5 !important;
    box-shadow: 0 3px 10px rgba(255,77,147,.12) !important;
}

/* Bagian icon kiri */
.joomla-alert--success .alert-heading,
.alert-success .alert-heading,
.joomla-alert.success .alert-heading {
    background: #ff4d93 !important;
}

.joomla-alert--danger .alert-heading,
.alert-danger .alert-heading,
.joomla-alert.danger .alert-heading {
    background: #ff7bac !important;
}

.joomla-alert--info .alert-heading,
.alert-info .alert-heading,
.joomla-alert.info .alert-heading {
    background: #ff9bc3 !important;
}

/* Isi alert */
.joomla-alert .alert-wrapper,
.joomla-alert div.alert-message,
.alert-success,
.alert-danger,
.alert-info {
    background: #fff0f6 !important;
    color: #444 !important;
    border: none !important;
}

/* Icon */
.joomla-alert svg,
.alert svg {
    color: white !important;
}

/* Tombol close */
.joomla-alert-button--close,
.joomla-alert .joomla-alert-button--close {
    color: #ff4d93 !important;
    opacity: 1 !important;
}

.joomla-alert-button--close:hover {
    color: #e91e73 !important;
}

/* Success */
.alert-success {
    border-left: 5px solid #ff4d93 !important;
}

/* Error */
.alert-danger {
    border-left: 5px solid #ff7bac !important;
}

/* Info */
.alert-info {
    border-left: 5px solid #ff9bc3 !important;
}

/* =========================
   RATING BINTANG PINK
   ========================= */

/* Bintang yang SUDAH dirating */
.vm-ratingbox-rated svg,
.vm-ratingbox-rated i,
.vm-ratingbox-rated .bi-star-fill {
    color: #ff4d93 !important;
    fill: #ff4d93 !important;
}

/* Bintang yang BELUM dirating */
.vm-ratingbox-unrated svg,
.vm-ratingbox-unrated i,
.vm-ratingbox-unrated .bi-star,
.vm-ratingbox-unrated .bi-star-fill {
    color: #ff9bc3 !important;
    fill: #ff9bc3 !important;
}

/* Hover bintang */
.vm-ratingbox svg:hover {
    color: #ff4d93 !important;
    fill: #ff4d93 !important;
}

/* =========================
   STOCK STATUS PINK
   ========================= */

/* Kotak-kotak stok hijau */
.vm-stock-status-normalstock,
.vm-stock-status-normalstock svg,
.vm-stock-status-normalstock i,
.bi-square-fill {
    color: #ff4d93 !important;
    fill: #ff4d93 !important;
}

/* Jika stok banyak */
.vm-stock-status-normalstock path {
    fill: #ff4d93 !important;
}

/* Hover */
.vm-stock-status-normalstock:hover {
    color: #e91e73 !important;
}

/* STOCK STATUS JADI PINK */
.bi-square,
.bi-square-fill,
.vm-stock-status svg,
.vm-stock-status i,
.vm-stock-status path {
    color: #ff4d93 !important;
    fill: #ff4d93 !important;
}

/* Kotak stok */
.vm-stock-status {
    color: #ff4d93 !important;
}

/* =========================
   INPUT LOGIN PINK
   ========================= */

.form-control,
input[type="text"],
input[type="password"],
input[type="email"]{
    border: 2px solid #ffc1d9 !important;
    background: #fff8fb !important;
    color: #333 !important;
}

/* SAAT INPUT VALID (HIJAU -> PINK) */
.valid,
.form-control.valid,
input.valid{
    border-color: #ff4d93 !important;
    box-shadow: 0 0 0 3px rgba(255,77,147,.15) !important;
}

/* SAAT DIKLIK */
.form-control:focus,
input:focus{
    border-color: #ff4d93 !important;
    box-shadow: 0 0 0 4px rgba(255,77,147,.20) !important;
    background: #ffffff !important;
}

/* ICON MATA PASSWORD */
.input-password-toggle,
.password-icon,
.btn-password{
    background: #ff4d93 !important;
    border-color: #ff4d93 !important;
    color: #fff !important;
}

/* CHECKBOX REMEMBER ME */
.form-check-input:checked{
    background-color: #ff4d93 !important;
    border-color: #ff4d93 !important;
}

/* LINK FORGOT PASSWORD / USERNAME / REGISTER */
.login .list-group-item,
.com-users-login .list-group-item,
ul.list-group li,
.list-group a,
.list-group-item a{
    background:#fff1f7 !important;
    color:#ff4d93 !important;
    border:2px solid #ffc1d9 !important;
    font-weight:700 !important;
}

/* hover */
.login .list-group-item:hover,
.com-users-login .list-group-item:hover,
.list-group-item:hover{
    background:#ffe1ef !important;
    color:#e91e73 !important;
}

/* garis pemisah */
.list-group-item{
    border-color:#ffc1d9 !important;
}

/* POPUP ADD TO CART */
.vm-added-product,
.alert-success,
.vm-added-message {
    background: #fff1f7 !important;
    border: 2px solid #ffc1d9 !important;
    border-radius: 15px !important;
    padding: 15px 20px !important;
    color: #333 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    text-align: center !important;
}

/* ICON CEKLIS */
.alert-success svg,
.alert-success i {
    color: #ff4d93 !important;
    fill: #ff4d93 !important;
}

/* TOMBOL POPUP */
.vm-added-product .btn,
.alert-success .btn {
    border-radius: 12px !important;
    font-weight: 700 !important;
}

/* ==========================
   ALERT JOOMLA JADI PINK
   ========================== */

.joomla-alert,
.alert,
.alert-info {
    background: #fff1f7 !important;
    border: 2px solid #ffc1d9 !important;
    color: #333 !important;
}

/* Bagian ikon kiri yang masih biru */
.joomla-alert--info .joomla-alert__icon,
.alert-info .alert-heading,
.alert-info::before,
.alert-info i,
.alert-info svg {
    background: #ff4d93 !important;
    color: #fff !important;
    fill: #fff !important;
}

/* Tombol close */
.joomla-alert button,
.joomla-alert .btn-close,
.alert .btn-close {
    color: #ff4d93 !important;
    opacity: 1 !important;
}

/* Border dalam */
.alert-message {
    border-color: #ffc1d9 !important;
}

/* Link dalam alert */
.alert a,
.joomla-alert a {
    color: #e91e73 !important;
    font-weight: 700 !important;
}

/* FORCE ALERT INFO BIRU JADI PINK */
#system-message-container .alert-heading,
#system-message-container joomla-alert .alert-heading {
  background:#ff4d93 !important;
  color:#fff !important;
  border-color:#ff4d93 !important;
}

#system-message-container .alert-heading span,
#system-message-container .alert-heading svg,
#system-message-container .alert-heading i {
  color:#fff !important;
  fill:#fff !important;
}

/* Kotak pesan */
#system-message-container joomla-alert,
#system-message-container .alert {
  border:2px solid #ff9bc5 !important;
  background:#fff1f7 !important;
  color:#333 !important;
  border-radius:14px !important;
  overflow:hidden !important;
}

/* Tombol X */
#system-message-container .joomla-alert--close,
#system-message-container .joomla-alert-button--close,
#system-message-container button {
  color:#ff4d93 !important;
}

/* =====================================
   MOBILE RESPONSIVE AUL'S SKINCARE
===================================== */
@media screen and (max-width:768px){

  /* HEADER */
  .container-header{
    min-height:auto !important;
    padding:15px !important;
    text-align:center !important;
  }

  /* LOGO */
  .container-header .navbar-brand{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    width:100% !important;
    align-items:center !important;
    justify-content:center !important;
    margin-bottom:15px !important;
  }

  .container-header .navbar-brand img{
    width:80px !important;
    max-width:80px !important;
  }

  .container-header .navbar-brand::before{
    font-size:24px !important;
    text-align:center !important;
  }

  .container-header .site-description{
    text-align:center !important;
    white-space:normal !important;
  }

  /* MENU */
  .container-header .container-nav{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    width:100% !important;
    margin-top:15px !important;
  }

  .container-header .mod-menu{
    flex-wrap:wrap !important;
    justify-content:center !important;
    gap:15px !important;
  }

  /* SEARCH */
  .auls-custom-search{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    width:100% !important;
    margin-top:15px !important;
  }

  .auls-custom-search form{
    width:100% !important;
  }

  .auls-custom-search input{
    width:calc(100% - 50px) !important;
  }

  /* DESKRIPSI */
  .auls-description h2{
    font-size:28px !important;
  }

  .auls-description p{
    font-size:16px !important;
    padding:0 10px !important;
  }

  /* KATEGORI */
  .category-view .category{
    width:100% !important;
    max-width:300px !important;
  }

  /* FEATURED / BEST SELLER */
  .home-product-grid,
  .auls-product-section .home-product-grid{
    grid-template-columns:repeat(2,1fr) !important;
    gap:15px !important;
    padding:10px !important;
  }

  .home-product-card img{
    width:100px !important;
    height:120px !important;
  }

  .home-product-card h3{
    font-size:15px !important;
  }

  .home-product-card p{
    font-size:14px !important;
  }

  /* PRODUK VIRTUEMART */
  .vmgroup .productdetails,
  .vmgroup .product,
  .vmproduct .product{
    width:48% !important;
    margin:1% !important;
  }

  .vmgroup img,
  .vmproduct img{
    width:100px !important;
    height:120px !important;
  }

  /* JUDUL */
  .moduletable h3,
  .card-header{
    font-size:24px !important;
    padding-left:10px !important;
  }

  /* FOOTER */
  .auls-footer{
    padding:30px 15px !important;
  }

  .auls-footer h2{
    font-size:24px !important;
  }
}