/* ----------------------------------

Template Name: Agrica - Organic Farm Agriculture Template
Author: validtheme
Description:
Version: 1.0

Main Font    : Outfit
Main Color   : #4960a7

-------------------------------------

[Typography]

Body copy:    15px 'Outfit', sans-serif
Header:     36px 'Outfit', sans-serif
Input, textarea:  16px 'Outfit', sans-serif
Sidebar heading:  22px 'Outfit', sans-serif

>>> TABLE OF CONTENTS:
=======================
        
    01. Template default css
        - Animations
        - General
        - Section Title
        - Video Button
        - Typography
        - Tables
        - Forms
        - Buttons
        - Pagination
        - Colors
        - Accordion
        - Tabs
    02. Preloader
    03 Navbar
        - Navbar Default
        - Navbar Center Brand
        - Navbar Transparent
        - Navbar Sticky
    04. Banner
        - Banner Agriculture
        - Banner Farming
        - Banner Agrculture Shop
    05. About
        - Version One
        - Version Two
	06. Services
        - Version One
        - Version Two
        - Service Single
    07. Project
        - Project Carousel
        - Project Grid
        - Project Single
	08. Testimonails
        - Version One
        - Version Two
    09. Why Choose Us
    10. Farmer
        - Farmer Slider
        - Farmer Single
        - Farmer Single
    11. Our Speciality
    12. Product Type
    13. Story Timeline
    14. Faq
    15. Brand / Partner
    16. Feature
        - Version One
        - Version Two
    17. Our Story
    18. Product Benifits
	19. Shop
        - Shop Grid
        - Shop List
        - Shop Single With Gallery
        - Shop Single Regular
    20. Blog
        - Standard
        - Grid
        - Left Sidebar
        - Right Sidebar
        - Single
    21. Error 404
    22. Footer
    23. PHP Contact Form
    24. Others

*/



/*
** General Styles for HTML tags
*/

/* WhatsApp Button Hover Green - All WhatsApp buttons */
.attr-nav .button a:hover,
header .attr-nav ul li.button a:hover,
.btn-whatsapp:hover,
.whatsapp-order:hover,
a[href*="wa.me"]:hover,
.whatsapp-btn:hover {
    background-color: #25D366 !important;
    border-color: #25D366 !important;
    color: #fff !important;
}

/* Milk Splash Images - Fixed within header/footer, not screen */
.milk-splash-top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    pointer-events: none;
    line-height: 0;
}

.milk-splash-top img {
    width: 100%;
    height: auto;
    display: block;
}

.milk-splash-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1;
    pointer-events: none;
    line-height: 0;
}

.milk-splash-bottom img {
    width: 100%;
    height: auto;
    display: block;
}

/* Ensure footer has relative position for milk splash */
footer {
    position: relative;
    overflow: hidden;
}

/* Ensure body has relative position for top milk splash */
body {
    position: relative;
}

/* Fixed Mobile WhatsApp and Call Icons */
.mobile-fixed-buttons {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.15);
    padding: 0;
}

.mobile-fixed-buttons a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    padding: 12px 0;
    transition: all 0.3s ease;
    flex: 1;
    border-radius: 0;
}

.mobile-fixed-buttons a.whatsapp-btn {
    background-color: #25D366;
    color: #fff;
}

.mobile-fixed-buttons a.whatsapp-btn:hover {
    background-color: #128C7E;
}

.mobile-fixed-buttons a.call-btn {
    background-color: #007bff;
    color: #fff;
}

.mobile-fixed-buttons a.call-btn:hover {
    background-color: #0056b3;
}

.mobile-fixed-buttons a i {
    font-size: 22px;
    margin-bottom: 3px;
}

.mobile-fixed-buttons a span {
    font-size: 11px;
    font-weight: 600;
}

/* Show on mobile devices */
@media (max-width: 991px) {
    .mobile-fixed-buttons {
        display: flex;
    }
    
    body {
        padding-bottom: 70px;
    }
    
    footer {
        margin-bottom: 60px;
    }
}
