/*
Theme Name: Trekings Website
Description: A WordPress theme converted from React for Trekking Travels website. This theme preserves the original design and functionality while integrating with WordPress.
Version: 1.0.0
Author: Trekking Travels
Text Domain: trekings-website
*/

/* This file serves as the WordPress theme header. The actual styles are loaded from the React build CSS file. */

/* Victoria Falls background for hero section - minimal approach */
.hero-section {
    background-image: url('./static/media/victoria-falls-national.a6e2e56c275af9455106.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Logo styling - appropriate sizes and transparent backgrounds */
img[src*="IATALogo"],
img[src*="TravelportLogo"],
img[src*="ZambiatravelagencyLogo"],
img[src*="Logo green horizontal"] {
    display: inline-block !important;
    max-width: 150px !important;
    max-height: 60px !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    border: none !important;
    margin: 5px 10px !important;
    vertical-align: middle !important;
    object-fit: contain !important;
}

/* General image styling */
img {
    display: inline-block !important;
    max-width: 100%;
    height: auto;
    visibility: visible !important;
    opacity: 1 !important;
    background: transparent !important;
}

/* Responsive logo sizing for mobile devices */
@media (max-width: 768px) {
    img[src*="IATALogo"],
    img[src*="TravelportLogo"],
    img[src*="ZambiatravelagencyLogo"],
    img[src*="Logo green horizontal"] {
        max-width: 120px !important;
        max-height: 50px !important;
        margin: 3px 5px !important;
    }
}

/* Responsive logo sizing for very small screens */
@media (max-width: 480px) {
    img[src*="IATALogo"],
    img[src*="TravelportLogo"],
    img[src*="ZambiatravelagencyLogo"],
    img[src*="Logo green horizontal"] {
        max-width: 100px !important;
        max-height: 40px !important;
        margin: 2px 3px !important;
    }
}