/* css/logo-style.css */
/* version: 1.1.6 - Direct iPhone 14 notch fix without safe-area-inset */

/* Base logo styles */
.navbar-brand img {
    max-height: 76px;
    height: auto;
    width: auto;
    margin-bottom: 0;
    margin-top: -16px;
    padding: 2px 0;
}

/* Dark mode logo styling */
body.dark-mode .navbar-brand img[src*="headacheMD"] {
    content: url("../images/dark_mode_HMDlogo.png") !important;
    filter: none !important;
    background: transparent !important;
}

/* Light mode logo styling */
.navbar-brand img[src*="headacheMD"] {
    content: url("../images/light_mode_HMDlogo.png") !important;
    filter: none !important;
}

/* Ensure the navbar-brand container has a transparent background in dark mode */
body.dark-mode .navbar-brand {
    background: transparent !important;
}

/* Tablet adjustments */
@media (max-width: 768px) {
    .navbar-brand img {
        max-height: 60px;
        margin-top: 0;
        padding: 5px 0;
    }
}

/* iPhone 14 Pro/Pro Max specific - using device pixel ratio and height */
@media only screen 
    and (max-width: 430px) 
    and (min-height: 932px) 
    and (-webkit-device-pixel-ratio: 3) {
    .navbar-default {
        padding-top: 54px !important;
    }
    
    .navbar-brand img {
        max-height: 42px !important;
        margin-top: 0 !important;
        padding: 0 !important;
    }
}

/* iPhone 14/13/12/11/X - general notched devices */
@media only screen 
    and (max-width: 430px) 
    and (min-height: 844px) 
    and (-webkit-device-pixel-ratio: 3) {
    .navbar-default {
        padding-top: 44px !important;
    }
    
    .navbar-brand img {
        max-height: 45px !important;
        margin-top: 0 !important;
        padding: 0 !important;
    }
}

/* iPhone 8 and older - non-notched devices */
@media only screen 
    and (max-width: 430px) 
    and (max-height: 667px) 
    and (-webkit-device-pixel-ratio: 2) {
    .navbar-brand img {
        max-height: 50px;
        margin-top: 2px;
        padding: 3px 0;
    }
}

/* General mobile fallback */
@media (max-width: 480px) {
    .navbar-brand img {
        max-height: 48px;
        margin-top: 0;
        padding: 2px 0;
    }
}