/* --- General Mobile-First Styles (Default) --- */

/* Navbar Logo: Ensure it's responsive by default */
.nav_block .navbar-brand .logo_dark {
    max-height: 80px; /* Reduced for better fit on small screens */
    max-width: 200px; /* Reduced for better fit on small screens */
    width: auto;
}

/* Footer Common Styles */
.footer_payment img {
    border-radius: 7px;
    /* Ensure images scale correctly */
    width: 100%;
    height: auto;
}

footer .widget_links .menu-icon-image {
    /* Use a relative width that works on all screen sizes */
    width: 20%;
}

footer .widget_links .menu-title {
    margin-left: 5px;
    margin-top: 10px;
}
 
/* Footer Contact Info: Corrected alignment for icon and text */
footer .contact_info {
    display: flex;
    flex-direction: column;
}

/* Ensure each contact detail line uses flexbox for alignment */
footer .contact_info li {
    display: flex;
    align-items: center;
}

/* Make the icon and its container a fixed size */
footer .contact_info .contact-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px; /* A consistent, fixed size */
    height: 24px;
    margin-right: 10px; /* Add some space between the icon and text */
}

/* Ensure the icon image scales within its container */
footer .contact_info .contact-icon .menu-icon-image {
    width: 100%;
    height: 100%;
}

/* 👇 CRITICAL FIX: Stops contact text from wrapping onto a new line 👇 */
.contact-footer-text a {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 👆 CRITICAL FIX 👆 */

.footer_logo_css {
    /* Aligning content to the center */
    display: flex;
    justify-content: center;
}

.banner_content_inner {
    text-align: center;
}

footer .widget {
    /* Use a full-width approach that works on all screen sizes */
    width: 100%;
}

footer .contact_widget {
    /* Remove negative margin to prevent overflow on mobile */
    margin-left: 0;
}

/* IG3D - unique/responsive styles */
.ig3d-root {
    width: 100%;
    max-width: 1000px;
    margin: 30px auto;
    position: relative;
    box-sizing: border-box;
    --ig-height-ratio: 0.45;
    height: calc(var(--ig-height-ratio) * 100vw);
    height: min(calc(var(--ig-height-ratio) * 100vw), 520px);
    min-height: 220px;
    display: block;
    pointer-events: none;
}

.ig3d-center-btn {
    pointer-events: auto;
    position: absolute;
    z-index: 120;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: linear-gradient(90deg, #ec4899, #ef4444, #facc15);
    color: #fff;
    padding: 10px 12px;
    border-radius: 14px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.28);
    font-size: clamp(12px, 1.6vw, 25px);
}
@media only screen and (max-width: 575px) {
    .ig3d-center-btn {
    width: 200px;
    padding: 8px 9px;
}
}

.ig3d-stage {
    position: absolute;
    inset: 0;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    perspective: 1200px;
    -webkit-perspective: 1200px;
    pointer-events: none;
}

.ig3d-item {
    position: absolute;
    left: 50%;
    top: 50%;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    will-change: transform, opacity;
    pointer-events: auto;
}

.ig3d-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
    user-select: none;
    -webkit-user-drag: none;
}

/* --- Desktop-First Styles (For Larger Screens) --- */
@media (min-width: 768px) {
    /* Navbar Logo: Larger size on desktop */
    .nav_block .navbar-brand .logo_dark {
        max-height: 100px;
        max-width: 270px;
    }
}
footer .contact_info img{
  width: 12%;
  margin-bottom: 20px;
}
.contact_info>li {
    margin-bottom: 0px !important;
}
footer .contact_info p{
  margin-left: 15px;
  }
.widget_links .icon {
    margin-bottom: 0px !important;
}
.widget_links li{
    margin-top: 10px !important;
}
@media only screen and (max-width: 575px) {
    footer .widget {
        margin-bottom: 50px;
    }
}
footer .widget_links .menu-icon-image {
    width: 12%;
}
@media only screen and (max-width: 575px) {
    .banner_section:not(.full_screen), .banner_section:not(.full_screen) .carousel-item {
        height: 575px !important;
    }
}
.banner_section{
    margin-top: -25px !important;
}
@media only screen and (max-width: 991px) {
    .banner_section:not(.full_screen), .banner_section:not(.full_screen) .carousel-item {
        height: 1150px;
    }
}
.pagination .page-item a {
    color: var(--color-1st);
    
}
.page-item.active .page-link {
    background-color: var(--color-1st);
    border-color: var(--color-1st);
}
.shop__pagination .pagination li{
  border-color: var(--color-1st) !important;
  border-radius: 20px !important;
}