/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.10.1757687365
Updated: 2025-09-12 14:29:25

*/
/* Styling for the bottom navigation menu */
.bottom-nav-bar {
    position: fixed; /* Fixes the menu to the bottom of the viewport */
    bottom: 0; /* Positions it at the very bottom */
    left: 0;
    width: 100%;
    background-color: #fff; /* White background */
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow on top */
    display: flex; /* Use Flexbox for alignment */
    justify-content: space-around; /* Distributes items evenly */
    align-items: center;
    padding: 10px 0;
    z-index: 1000; /* Ensures the menu stays on top of other content */
    font-family: 'Vazirmatn', sans-serif;
    direction: rtl;
    text-align: center;
}

/* Styling for each menu item link */
.bottom-nav-bar a {
    flex: 1; /* Each item takes up equal space */
    color: #888; /* Default color for icons and text */
    text-decoration: none;
    font-size: 14px;
    display: flex;
    flex-direction: column; /* Stacks icon and text vertically */
    align-items: center;
    transition: color 0.3s ease; /* Smooth color transition */
    padding: 5px 0; /* Vertical padding */
}

/* Styling for the active menu item */
.bottom-nav-bar a.active {
    color: #3c5871; /* Active color */
    font-weight: bold;
}

/* Hover effect for desktop, but primarily for touch feedback on mobile */
.bottom-nav-bar a:hover {
    color: #3c5871;
}

/* Styling for the central, highlighted button */
.bottom-nav-bar .main-action-btn {
    position: relative;
    top: -20px; /* Lifts the button up */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #3c5871; /* Dark blue background */
    color: #fff;
    width: 70px; /* Circular button size */
    height: 70px;
    border-radius: 50%; /* Makes it a circle */
    box-shadow: 0 -4px 15px rgba(0, 0, 0, 0.2); /* Stronger shadow */
    transition: all 0.3s ease;
}

.bottom-nav-bar .main-action-btn:hover {
    background-color: #fdb82e; /* Yellow on hover */
    transform: scale(1.05);
}

/* Styling for the icon inside the links and buttons */
.bottom-nav-bar i {
    font-size: 24px; /* Icon size */
    margin-bottom: 5px; /* Space between icon and text */
}

/* Hides the bottom navigation bar on desktop */
@media (min-width: 769px) {
    .bottom-nav-bar {
        display: none;
    }
}