/* ========================================
   RESPONSIVE FIXES - AGROPECUÁRIA AH
   Compatibilidade: Desktop, Tablet, Mobile
   ======================================== */

/* Reset para garantir compatibilidade */
* {
    box-sizing: border-box;
}

/* Container principal responsivo */
.container, .container-fluid {
    max-width: 100%;
    overflow-x: hidden;
}

/* ========================================
   MOBILE FIRST (320px - 767px)
   ======================================== */
@media (max-width: 767px) {
    /* Ajustes gerais para mobile */
    body {
        font-size: 14px;
        line-height: 1.4;
    }
    
    /* Cards responsivos */
    .card {
        margin-bottom: 15px;
        border-radius: 8px;
    }
    
    .card-body {
        padding: 15px;
    }
    
    /* Títulos responsivos */
    h1 { font-size: 1.8rem; }
    h2 { font-size: 1.5rem; }
    h3 { font-size: 1.3rem; }
    h4 { font-size: 1.1rem; }
    
    /* Manifesto responsivo */
    #manifesto .card {
        margin: 10px 0;
    }
    
    #manifesto .col-lg-10,
    #manifesto .col-lg-2 {
        width: 100%;
        margin-bottom: 15px;
    }
    
    /* Imagens responsivas */
    img {
        max-width: 100%;
        height: auto;
    }
    
    /* Botões responsivos */
    .btn {
        width: 100%;
        margin-bottom: 10px;
        padding: 12px;
        font-size: 16px;
    }
    
    /* Menu responsivo */
    .navbar-nav {
        text-align: center;
    }
    
    .navbar-nav .nav-link {
        padding: 10px 15px;
        font-size: 16px;
    }
}

/* ========================================
   TABLET (768px - 1023px)
   ======================================== */
@media (min-width: 768px) and (max-width: 1023px) {
    /* Ajustes para tablet */
    .container {
        max-width: 750px;
    }
    
    .card-body {
        padding: 20px;
    }
    
    /* Manifesto em tablet */
    #manifesto .col-lg-10 {
        width: 70%;
    }
    
    #manifesto .col-lg-2 {
        width: 30%;
    }
    
    /* Botões em tablet */
    .btn {
        padding: 10px 20px;
        font-size: 15px;
    }
}

/* ========================================
   DESKTOP (1024px+)
   ======================================== */
@media (min-width: 1024px) {
    /* Ajustes para desktop */
    .container {
        max-width: 1200px;
    }
    
    /* Manifesto em desktop */
    #manifesto .col-lg-10 {
        width: 83.333333%;
    }
    
    #manifesto .col-lg-2 {
        width: 16.666667%;
    }
}

/* ========================================
   CORREÇÕES ESPECÍFICAS
   ======================================== */

/* Garantir que o manifesto seja responsivo */
#manifesto {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

#manifesto .row {
    margin: 0;
    width: 100%;
}

#manifesto .col-lg-10,
#manifesto .col-lg-2 {
    padding-left: 15px;
    padding-right: 15px;
}

/* Correção para iOS Safari */
@supports (-webkit-touch-callout: none) {
    .card {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* Correção para Android Chrome */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .container {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* Garantir que não haja scroll horizontal */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

/* Ajustes para telas muito pequenas */
@media (max-width: 320px) {
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .card-body {
        padding: 10px;
    }
    
    h1 { font-size: 1.5rem; }
    h2 { font-size: 1.3rem; }
}

/* ========================================
   CORREÇÃO DO MENU DROPDOWN
   ======================================== */

/* Garantir que o dropdown funcione em todos os dispositivos */
.navbar-nav .dropdown-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.navbar-nav .dropdown-item {
    display: block !important;
    visibility: visible !important;
}

/* Garantir que o link "Código de Conduta" seja visível */
.dropdown-item[onclick*="openFlipbookModal"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Correção para mobile */
@media (max-width: 767px) {
    .navbar-nav .dropdown-menu {
        display: block !important;
        position: static !important;
        float: none !important;
        width: 100% !important;
        margin-top: 0 !important;
        background-color: #1b3d2f !important;
        border: 0 !important;
        box-shadow: none !important;
    }
    
    .navbar-nav .dropdown-item {
        color: #fff !important;
        padding: 10px 15px !important;
        display: block !important;
    }
    
    .navbar-nav .dropdown-item:hover {
        background-color: #2d5a3d !important;
        color: #fff !important;
    }
}

/* ========================================
   CORREÇÃO ESPECÍFICA DO DROPDOWN
   ======================================== */

/* Garantir que o dropdown Institucional funcione */
.navbar-nav .dropdown-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    z-index: 1000 !important;
}

.navbar-nav .dropdown-item {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Garantir que o link "Código de Conduta" seja visível */
.dropdown-item[onclick*="openFlipbookModal"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #fff !important;
    padding: 10px 15px !important;
}

.dropdown-item[onclick*="openFlipbookModal"]:hover {
    background-color: rgba(255,255,255,0.1) !important;
    color: #ffd600 !important;
}

/* Correção para mobile */
@media (max-width: 767px) {
    .navbar-nav .dropdown-menu {
        display: block !important;
        position: static !important;
        float: none !important;
        width: 100% !important;
        margin-top: 0 !important;
        background-color: #1b3d2f !important;
        border: 0 !important;
        box-shadow: none !important;
    }
    
    .navbar-nav .dropdown-item {
        color: #fff !important;
        padding: 10px 15px !important;
        display: block !important;
    }
    
    .navbar-nav .dropdown-item:hover {
        background-color: #2d5a3d !important;
        color: #fff !important;
    }
}