/* Mobile-Specific Optimizations */

/* === TOUCH OPTIMIZATIONS === */
@media (max-width: 991px) {
    /* Larger touch targets - exclude navbar toggler completely */
    .nav-link,
    a:not(.navbar-brand) {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }


    /* Better spacing for mobile */
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Optimize font sizes */
    body {
        font-size: 16px; /* Prevents zoom on input focus iOS */
    }

    h1, .h1 {
        font-size: 2rem;
    }

    h2, .h2 {
        font-size: 1.75rem;
    }

    h3, .h3 {
        font-size: 1.5rem;
    }

    /* Fix H1UserAgentFontSizeInSection warning on mobile */
    /* Override deprecated outline algorithm for h1 in sectioning elements */
    section h1,
    article h1,
    aside h1,
    nav h1 {
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.2;
    }

    /* Keep hero titles larger on mobile */
    .hero-title,
    section .hero-title,
    article .hero-title {
        font-size: 2rem !important;
        font-weight: 900;
        line-height: 1.2;
    }

    /* Remove hover effects on mobile */
    .service-card:hover,
    .interactive-card:hover,
    .hover-link:hover {
        transform: none;
    }

    /* Optimize navbar */
    .navbar {
        padding: 0.75rem 0;
    }

    .navbar-collapse {
        max-height: 70vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Override navbar-toggler styles from app.css - remove ALL backgrounds and effects */
    .navbar-toggler {
        background-color: transparent !important;
        border: none !important;
        padding: 0.25rem 0.5rem !important;
        box-shadow: none !important;
    }

    .navbar-toggler:hover,
    .navbar-toggler:focus,
    .navbar-toggler:active,
    .navbar-toggler[aria-expanded="true"],
    .navbar-toggler[aria-expanded="false"] {
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        outline: none !important;
    }

    /* Override filter from app.css line 1483 - prevent icon color change */
    .navbar-toggler:hover .navbar-toggler-icon,
    .navbar-toggler:focus .navbar-toggler-icon,
    .navbar-toggler:active .navbar-toggler-icon {
        filter: none !important;
    }

    /* Ensure the icon stays visible in all states */
    .navbar-toggler-icon {
        background-color: transparent !important;
    }

    /* Mobile menu - simple, no background changes */
    .navbar-collapse.collapsing {
        transition: height 0.35s ease;
    }

    .navbar-nav {
        gap: 0.5rem;
    }

    .nav-item {
        width: 100%;
    }

    .nav-link {
        padding: 0.75rem 1rem !important;
    }


    .nav-item-separator {
        display: none;
    }

    /* === BREADCRUMB MOBILE FIXES === */
    .breadcrumb {
        flex-wrap: wrap;
        padding: 0.5rem 0;
        margin-bottom: 1rem;
        font-size: 0.875rem;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .breadcrumb-item {
        display: inline-flex;
        align-items: center;
    }

    .breadcrumb-item + .breadcrumb-item {
        padding-left: 0.3rem;
    }

    .breadcrumb-item + .breadcrumb-item::before {
        padding-right: 0.3rem;
        font-size: 1rem;
    }

    .breadcrumb-item a {
        max-width: 120px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .breadcrumb-item.active {
        max-width: 150px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Optimize hero sections */
    .hero-section {
        min-height: 80vh;
        padding: 3rem 0 2rem;
    }

    /* Better form inputs on mobile */
    input,
    textarea,
    select {
        font-size: 16px; /* Prevents zoom on iOS */
        -webkit-appearance: none;
        appearance: none;
    }

    /* Optimize buttons - exclude navbar-toggler */
    .btn:not(.navbar-toggler) {
        padding: 0.875rem 1.5rem;
        font-size: 1rem;
    }

    /* Keep normal animation speed on mobile - don't reduce */
    /* Removed: animation-duration override */

    /* Optimize cards */
    .service-card,
    .card {
        margin-bottom: 1.5rem;
    }

    /* Better footer on mobile */
    .footer-main {
        padding: 2rem 0 !important;
    }

    .footer-main .col-md-4 {
        margin-bottom: 2rem;
    }

    /* Optimize sticky elements */
    .whatsapp-sticky-button {
        bottom: 80px;
        right: 15px;
        width: 50px;
        height: 50px;
    }

    .whatsapp-text {
        display: none;
    }
}

/* === EXTRA SMALL DEVICES === */
@media (max-width: 575px) {
    /* Even more compact on small phones */
    .container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    h1, .h1 {
        font-size: 1.75rem;
    }

    h2, .h2 {
        font-size: 1.5rem;
    }

    /* Stack buttons vertically */
    .error-actions,
    .hero-actions {
        flex-direction: column;
        width: 100%;
    }

    .btn {
        width: 100%;
    }

    /* Optimize modal dialogs */
    .modal-dialog {
        margin: 0.5rem;
    }

    /* Better spacing */
    section {
        padding: 2rem 0;
    }
}

/* === HIGH DPI DISPLAYS === */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* Sharper borders and shadows */
    .card,
    .btn,
    .service-card {
        border-width: 0.5px;
    }
}

/* === LANDSCAPE MODE === */
@media (max-width: 991px) and (orientation: landscape) {
    /* Reduce height-based spacing in landscape */
    .hero-section,
    .error-page-modern {
        min-height: 80vh;
        padding: 2rem 0;
    }

    .navbar-collapse {
        max-height: 50vh;
    }
}

/* === PERFORMANCE HINTS === */
@media (max-width: 991px) {
    /* Disable expensive effects on mobile */
    .hero-gradient-overlay,
    .error-gradient-overlay,
    .hero-particles,
    .error-particles {
        opacity: 0.5; /* Reduce opacity for better performance */
    }

    /* Simplify shadows on mobile */
    .card,
    .service-card,
    .btn {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    }

    /* Better contrast for badges on mobile */
    .hero-badge-modern,
    .hero-badge {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(21, 106, 47, 0.95) !important; /* Verde brand solid pentru vizibilitate */
        color: white !important;
        border: 2px solid rgba(240, 196, 25, 0.8) !important; /* Border galben pentru contrast */
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
    }

    .hero-badge-modern .badge-text,
    .hero-badge-modern i,
    .hero-badge .badge-text,
    .hero-badge i {
        color: white !important;
    }

    .hero-badge-modern i,
    .hero-badge i {
        color: var(--brand-yellow) !important;
    }

    .support-link,
    .info-card {
        backdrop-filter: none;
        background: rgba(0, 0, 0, 0.7) !important;
        color: white !important;
        border-color: rgba(255, 255, 255, 0.4) !important;
    }
}

