/* Force the logo container to 70x70px */
#_desktop_logo img {
    width: 60px !important;
    height: 60px !important;
    object-fit: contain; /* Ensures the logo isn't distorted */
}

@media (max-width: 767px) {
    .header-top .container > .row {
        display: flex;
        flex-direction: column; /* Menumpuk logo di atas menu/keranjang */
        align-items: center;
        justify-content: center;
    }

    #_mobile_logo {
        padding-left: 0;
        padding-right: 0;
    }
}

/* Pastikan link di nav atas berwarna putih */
.header-nav a,
.header-nav span,
.header-nav i {
    color: white !important;
}


/* Menghilangkan latar belakang putih pada area blok troli */
#_desktop_cart .blockcart {
    background-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Mengubah warna teks 'Troli' dan angka jumlah barang menjadi putih */
#_desktop_cart .blockcart a,
#_desktop_cart .blockcart .cart-products-count,
#_desktop_cart .blockcart i.shopping-cart {
    color: white !important;
}

/* Jika Anda ingin ikon keranjang tetap terlihat menonjol saat hover */
#_desktop_cart .blockcart:hover {
    background-color: rgba(255, 255, 255, 0.1) !important; /* Efek highlight tipis */
}



/* ============================================================
   CUSTOM STYLE PRESTASHOP: THEME CLASSIC
   ============================================================ */

/* 1. CAROUSEL (Rounded, No Shadow) */
#carousel, .carousel-inner, .carousel-item img {
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: none !important;
}

/* 2. DAFTAR PRODUK (Katalog) */
.product-miniature, .thumbnail-container img {
    border-radius: 15px !important;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* 3. DETAIL PRODUK - ZOOM & HOVER FIX (Tema Classic) */
/* Classic menggunakan EasyZoom atau internal zoom */
.images-container, .product-cover, .js-qv-product-cover {
    border-radius: 20px !important;
    overflow: hidden !important;
    position: relative;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
}
.product-cover img, .zoomImg, .easyzoom-flyout img {
    border-radius: 20px !important;
}

/* 4. DETAIL PRODUK - THUMBNAILS */
.product-images img {
    border-radius: 10px !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}


/* 5. FOOTER UTAMA (Abu-abu Muda #e9ecef) */
.footer-container {
    background-color: #e9ecef !important;
}

/* 6. BARIS COPYRIGHT PALING BAWAH (Hijau RGB 55, 109, 78) */
/* Kita buat area .footer-after menjadi baris hijau penuh */
.footer-container .footer-after {
    background-color: rgb(55, 109, 78) !important;
    padding: 20px 0 !important;
    margin-top: 20px; /* Memberi jarak dari footer abu-abu */
}

/* Memastikan teks copyright dan link di dalamnya berwarna putih */
.footer-after,
.footer-after p,
.footer-after a,
.footer-after span,
.footer-after ._blank {
    color: #ffffff !important;
    display: block; /* Memastikan background hijau terisi penuh */
    text-align: center;
}

/* Menghilangkan garis abu-abu bawaan tema classic */
.footer-container .footer-after {
    border-top: none !important;
}


/* Perbaikan khusus untuk tampilan Mobile (layar di bawah 767px) */
@media (max-width: 767px) {
    /* Memaksa latar belakang troli tetap transparan di mobile */
    #_mobile_cart .blockcart,
    #_desktop_cart .blockcart {
        background-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* Memastikan ikon dan teks troli tetap putih di mobile */
    #_mobile_cart .blockcart a,
    #_mobile_cart .blockcart i,
    #_mobile_cart .blockcart .cart-products-count {
        color: white !important;
    }

    /* Jika seluruh baris navigasi mobile (menu burger dll) ingin tetap hijau */
    .header-nav {
        background-color: rgb(55, 109, 78) !important;
    }
}


/* 1. Mengubah Warna Tombol Utama (Add to Cart, Checkout, dll) */
.btn-primary,
.btn-outline-primary {
    background-color: rgb(55, 109, 78) !important;
    border-color: rgb(55, 109, 78) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-outline-primary:hover {
    background-color: rgb(45, 89, 64) !important; /* Hijau sedikit lebih gelap saat di-hover */
    border-color: rgb(45, 89, 64) !important;
}

/* 2. Mengubah Warna Link dan Teks Highlight */
a,
.page-my-account #content .links a i,
.product-price,
.block-categories .category-sub-menu li > a:hover {
    color: rgb(55, 109, 78);
}

/* 3. Mengubah Warna Border Aktif (seperti Thumbnail atau Input) */
.product-images .thumb-container.active img,
.form-control:focus {
    border-color: rgb(55, 109, 78) !important;
}

/* 4. Mengubah Warna Background Elemen Kecil (Badge, Search Button) */
.tag-primary,
.label-primary,
#search_widget button[type="submit"] {
    background-color: rgb(55, 109, 78) !important;
}

/* 5. Mengubah Warna Menu Aktif atau Hover di Main Menu */
.top-menu .sub-menu ul li a:hover,
.top-menu .dropdown-item:hover {
    color: rgb(55, 109, 78) !important;
}

/* 6. Perbaikan khusus untuk tombol 'Login' atau 'Sign In' di Header Nav */
#header .nav a:hover {
    color: #d1d1d1 !important; /* Tetap pakai abu-abu terang agar kontras dengan nav hijau */
}


/* 1. Mengubah tombol 'Pilih Berkas' untuk Chrome, Edge, dan Safari */
.contact-form input[type="file"]::-webkit-file-upload-button {
    background-color: rgb(55, 109, 78) !important;
    color: white !important;
    border: 1px solid rgb(55, 109, 78) !important;
    padding: 8px 15px !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    font-family: inherit;
}

/* 2. Mengubah tombol 'Pilih Berkas' untuk Firefox dan browser modern lainnya */
.contact-form input[type="file"]::file-selector-button {
    background-color: rgb(55, 109, 78) !important;
    color: white !important;
    border: 1px solid rgb(55, 109, 78) !important;
    padding: 8px 15px !important;
    border-radius: 5px !important;
    cursor: pointer !important;
}

/* 3. Efek Hover agar lebih interaktif */
.contact-form input[type="file"]::-webkit-file-upload-button:hover,
.contact-form input[type="file"]::file-selector-button:hover {
    background-color: rgb(45, 89, 64) !important;
    border-color: rgb(45, 89, 64) !important;
}


/* ============================================================
   MEMBUAT SEMUA TOMBOL MENJADI ROUNDED
   ============================================================ */

/* 1. Menargetkan semua class tombol dasar PrestaShop */
.btn,
.btn-primary,
.btn-secondary,
.btn-outline-primary,
.btn-tertiary {
    border-radius: 25px !important; /* Nilai 25px membuat ujung tombol membulat sempurna */
    padding-left: 20px !important;
    padding-right: 20px !important;
    text-transform: none; /* Opsional: agar teks tidak selalu huruf kapital semua */
}

/* 2. Tombol 'Pilih Berkas' di halaman kontak agar ikut rounded */
.contact-form input[type="file"]::-webkit-file-upload-button,
.contact-form input[type="file"]::file-selector-button {
    border-radius: 25px !important;
}

/* 3. Tombol pencarian (ikon kaca pembesar) */
#search_widget button[type="submit"] {
    border-top-right-radius: 25px !important;
    border-bottom-right-radius: 25px !important;
}

#search_widget input[type="text"] {
    border-top-left-radius: 25px !important;
    border-bottom-left-radius: 25px !important;
}

/* 4. Tombol pada proses Checkout */
.checkout-step .btn {
    border-radius: 25px !important;
}

/* 5. Tombol langganan Newsletter di footer */
.block_newsletter form input[type="submit"] {
    border-radius: 0 25px 25px 0 !important;
}
.block_newsletter form input[type="email"] {
    border-radius: 25px 0 0 25px !important;
}

/* -- */
/* sub menu nav */
/* Mengubah background dropdown mata uang dan bahasa di header */

/* Warna dropdown putih bersih */
.languages-selector .dropdown-menu,
.currency-selector .dropdown-menu,
.dropdown-menu {
    background-color: #ffffff !important;
    border: 1px solid #dddddd !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1); /* Tambah bayangan agar tidak "tenggelam" di body putih */
}

/* Warna teks gelap agar terbaca di latar putih */
.languages-selector .dropdown-item,
.currency-selector .dropdown-item,
.dropdown-item {
    color: #333333 !important;
}

/* Warna saat hover - Hijau Navigasi Utama */
.languages-selector .dropdown-item:hover,
.currency-selector .dropdown-item:hover,
.dropdown-item:hover {
    background-color: #ffffff !important;
    color: rgb(55,109,78) !important;
}

/* Menyesuaikan warna teks pemicu (trigger) sebelum diklik jika perlu */
/* Ubah ke warna yang sesuai dengan header Anda */
/* 
.currency-selector .expand-more, 
.languages-selector .expand-more {
    color: rgb(55, 109, 78);
}
*/
/* -- */


@media (max-width: 767px) {
  #carousel, .carousel-inner, .carousel-item img {
    border-radius: 5px !important;
    overflow: hidden !important;
    box-shadow: none !important;
  }
}