/* Bali Coco SPA - Color Scheme
   Primary: #B87A47 (Copper/Bronze)
   Secondary: #231711 (Dark Brown)
   NO ROUNDED CORNERS
*/

/* Primary Color */
.id-color,
.id-color-2 {
    color: #B87A47 !important;
}

.bg-color,
.bg-color-2,
.btn-main,
.btn-main:hover,
.de-rating-ext .d-stars i,
.subtitle {
    background: #B87A47 !important;
}

.btn-main {
    background: #B87A47 !important;
    color: #fff !important;
}

.btn-main:hover {
    background: #9a6339 !important;
}

.btn-line {
    border-color: #B87A47 !important;
    color: #B87A47 !important;
}

.btn-line:hover {
    background: #B87A47 !important;
    color: #fff !important;
}

/* Section Dark Background */
.section-dark,
.bg-dark,
footer {
    background: #231711 !important;
}

/* Links */
a {
    color: #B87A47;
}

a:hover {
    color: #9a6339;
}

/* Header */
header.smaller {
    background: #231711 !important;
}

#topbar {
    background: rgba(35, 23, 17, 0.9) !important;
}

/* Menu */
#mainmenu a:hover,
#mainmenu li.active > a {
    color: #B87A47 !important;
}

/* Overlay colors */
.overlay {
    background: linear-gradient(135deg, rgba(35, 23, 17, 0.8) 0%, rgba(35, 23, 17, 0.6) 100%);
}

/* De-loader */
#de-loader {
    background: #231711 !important;
}

#de-loader .lds-ring div {
    border-color: #B87A47 transparent transparent transparent !important;
}

/* Form elements */
input:focus,
textarea:focus,
select:focus {
    border-color: #B87A47 !important;
}

/* Selection */
::selection {
    background: #B87A47;
    color: #fff;
}

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background: #B87A47;
}

/* Stars rating */
.de-rating-ext .d-stars i {
    color: #B87A47 !important;
    background: transparent !important;
}

/* Counter */
.timer {
    color: #B87A47 !important;
}

/* NO ROUNDED CORNERS - CRITICAL */
*,
*::before,
*::after {
    border-radius: 0 !important;
}

.rounded-5px,
.rounded-10px,
.rounded-20px,
.rounded-up-100,
.rounded,
.rounded-circle,
.rounded-pill {
    border-radius: 0 !important;
}

/* Buttons no radius */
.btn,
.btn-main,
.btn-line,
button,
input[type="submit"],
input[type="button"] {
    border-radius: 0 !important;
}

/* Form elements no radius */
input,
textarea,
select,
.form-control {
    border-radius: 0 !important;
}

/* Cards and boxes no radius */
.card,
.card-body,
.card-header,
.card-footer,
.soft-shadow,
.overflow-hidden {
    border-radius: 0 !important;
}

/* Images no radius */
img {
    border-radius: 0 !important;
}

/* Shape masks - disable rounded */
.shape-mask-1,
.shape-mask-2 {
    border-radius: 0 !important;
}

/* Dropdown menus */
.dropdown-menu,
#mainmenu ul {
    border-radius: 0 !important;
}

/* Footer */
footer .subfooter {
    background: rgba(0, 0, 0, 0.2);
}

/* Social icons */
.social-icons a:hover {
    color: #B87A47 !important;
}

/* Gallery overlay */
.gallery-item:hover .gallery-overlay {
    background: rgba(184, 122, 71, 0.8);
}

/* CTA Section */
.cta-section {
    background: linear-gradient(135deg, #B87A47 0%, #9a6339 100%);
}

/* Feature boxes */
.feature-box .icon {
    color: #B87A47;
}

/* Swiper pagination */
.swiper-pagination-bullet-active {
    background: #B87A47 !important;
}

/* Back to top */
#back-to-top {
    background: #B87A47 !important;
}

#back-to-top:hover {
    background: #231711 !important;
}

/* ============================================
   MOBILE LOGO - FORCE SMALL SIZE
   ============================================ */
@media (max-width: 992px) {
    header div#logo,
    header #logo,
    header.header-mobile div#logo,
    header.header-mobile #logo,
    .header-mobile div#logo {
        max-width: 90px !important;
        width: 90px !important;
    }

    header div#logo img,
    header #logo img,
    header.header-mobile div#logo img,
    header.header-mobile #logo img,
    #logo img,
    #logo img.logo-main,
    #logo img.logo-scroll,
    #logo img.logo-mobile,
    header img.logo-main,
    header img.logo-scroll,
    header img.logo-mobile {
        width: 90px !important;
        max-width: 90px !important;
        height: auto !important;
        max-height: 38px !important;
        object-fit: contain !important;
    }
}

@media (max-width: 767px) {
    header div#logo,
    header #logo,
    header.header-mobile div#logo,
    header.header-mobile #logo {
        max-width: 70px !important;
        width: 70px !important;
    }

    header div#logo img,
    header #logo img,
    header.header-mobile div#logo img,
    header.header-mobile #logo img,
    #logo img,
    #logo img.logo-main,
    #logo img.logo-scroll,
    #logo img.logo-mobile,
    header img.logo-main,
    header img.logo-scroll,
    header img.logo-mobile {
        width: 70px !important;
        max-width: 70px !important;
        max-height: 30px !important;
    }

    header .de-flex {
        padding: 8px 0 !important;
    }

    /* CTA button smaller on mobile */
    .menu_side_area .btn-main {
        display: inline-block !important;
        padding: 6px 12px !important;
        font-size: 11px !important;
    }
}

@media (max-width: 480px) {
    header div#logo,
    header #logo,
    header.header-mobile div#logo,
    header.header-mobile #logo {
        max-width: 60px !important;
        width: 60px !important;
    }

    header div#logo img,
    header #logo img,
    header.header-mobile div#logo img,
    header.header-mobile #logo img,
    #logo img,
    #logo img.logo-main,
    #logo img.logo-scroll,
    #logo img.logo-mobile,
    header img.logo-main,
    header img.logo-scroll,
    header img.logo-mobile {
        width: 60px !important;
        max-width: 60px !important;
        max-height: 26px !important;
    }

    header .de-flex {
        padding: 5px 0 !important;
    }

    .menu_side_area .btn-main {
        padding: 5px 8px !important;
        font-size: 10px !important;
    }
}

/* ============================================
   GALLERY LIGHTBOX STYLES
   ============================================ */

/* Gallery item hover effect */
.gallery-item {
    position: relative;
    display: block;
    overflow: hidden;
}

.gallery-item img {
    transition: transform 0.5s ease;
}

.gallery-item:hover img {
    transform: scale(1.1);
}

.gallery-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(184, 122, 71, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.gallery-item:hover .gallery-overlay {
    opacity: 1;
}

/* Magnific Popup - Navigation arrows */
.mfp-arrow {
    opacity: 0.8;
    transition: opacity 0.2s;
}

.mfp-arrow:hover {
    opacity: 1;
}

.mfp-arrow-left:before,
.mfp-arrow-right:before {
    border-color: #B87A47 !important;
}

.mfp-arrow-left:after {
    border-right-color: #B87A47 !important;
}

.mfp-arrow-right:after {
    border-left-color: #B87A47 !important;
}

/* Counter (1 of 6) */
.mfp-counter {
    color: #fff;
    font-size: 14px;
}

/* Close button */
.mfp-close {
    color: #fff !important;
    font-size: 36px;
    opacity: 0.8;
}

.mfp-close:hover {
    opacity: 1;
}

/* Background overlay */
.mfp-bg {
    background: #231711;
    opacity: 0.95;
}

/* Image container */
.mfp-figure::after {
    box-shadow: none !important;
    background: transparent !important;
}

/* Touch swipe hint on mobile */
@media (max-width: 767px) {
    .mfp-arrow {
        transform: scale(0.8);
    }
}
