/*
====================================================================
  COMPONENTE CONTAINER - CSS DESKTOP MEDIA QUERIES
  
  Media queries específicas para desktop do sistema de containers
  Breakpoints: 1200px+ (Desktop), 1024px+ (Notebook), 768px+ (Tablet Grande)
  
  Autor: #@HD
  Data de criação: 14/08/2025
  Última atualização: 14/08/2025
====================================================================
*/

/* ====================================================================
   MEDIA QUERIES ESPECÍFICAS PARA DESKTOP
   ==================================================================== */

/* ------------------- Breakpoint: 1200px+ (Desktop - Telas grandes) ------------------- */
@media (min-width: 1200px) {
    .DESKTOP_CONTAINER_SESSAO {
        padding-top: var(--desktop-container-sessao-espacamento-topo-desktop-xl, 100px);
        padding-bottom: var(--desktop-container-sessao-espacamento-baixo-desktop-xl, 10px);
        padding-left: var(--desktop-container-sessao-espacamento-esquerda-desktop-xl, 80px);
        padding-right: var(--desktop-container-sessao-espacamento-direita-desktop-xl, 80px);
        min-height: calc(100vh - 250px);
    }
    
    .DESKTOP_CONTAINER {
        padding-top: var(--desktop-container-espacamento-topo-desktop-xl, 60px);
        padding-bottom: var(--desktop-container-espacamento-baixo-desktop-xl, 60px);
        padding-left: var(--desktop-container-espacamento-esquerda-desktop-xl, 60px);
        padding-right: var(--desktop-container-espacamento-direita-desktop-xl, 60px);
    }
    
    .SECTION_DESKTOP_CONTAINER {
        padding-top: var(--section-desktop-container-espacamento-topo-desktop-xl, 60px);
        padding-bottom: var(--section-desktop-container-espacamento-baixo-desktop-xl, 60px);
        padding-left: var(--section-desktop-container-espacamento-esquerda-desktop-xl, 60px);
        padding-right: var(--section-desktop-container-espacamento-direita-desktop-xl, 60px);
    }
    
    .SECTION_DESKTOP_CONTAINER_COLUMN {
        height: var(--section-desktop-container-column-altura-desktop-xl, 700px);
    }
}

/* ------------------- Breakpoint: 1024px+ (Notebook - Telas médias) ------------------- */
@media (min-width: 1024px) and (max-width: 1199px) {
    .DESKTOP_CONTAINER_SESSAO {
        padding-top: var(--desktop-container-sessao-espacamento-topo-desktop-lg, 90px);
        padding-bottom: var(--desktop-container-sessao-espacamento-baixo-desktop-lg, 8px);
        padding-left: var(--desktop-container-sessao-espacamento-esquerda-desktop-lg, 70px);
        padding-right: var(--desktop-container-sessao-espacamento-direita-desktop-lg, 70px);
        min-height: calc(100vh - 200px);
    }
    
    .DESKTOP_CONTAINER {
        padding-top: var(--desktop-container-espacamento-topo-desktop-lg, 50px);
        padding-bottom: var(--desktop-container-espacamento-baixo-desktop-lg, 50px);
        padding-left: var(--desktop-container-espacamento-esquerda-desktop-lg, 50px);
        padding-right: var(--desktop-container-espacamento-direita-desktop-lg, 50px);
    }
    
    .SECTION_DESKTOP_CONTAINER {
        padding-top: var(--section-desktop-container-espacamento-topo-desktop-lg, 50px);
        padding-bottom: var(--section-desktop-container-espacamento-baixo-desktop-lg, 50px);
        padding-left: var(--section-desktop-container-espacamento-esquerda-desktop-lg, 50px);
        padding-right: var(--section-desktop-container-espacamento-direita-desktop-lg, 50px);
    }
    
    .SECTION_DESKTOP_CONTAINER_COLUMN {
        height: var(--section-desktop-container-column-altura-desktop-lg, 600px);
    }
}

/* ------------------- Breakpoint: 768px+ (Tablet Grande - Telas pequenas) ------------------- */
@media (min-width: 768px) and (max-width: 1023px) {
    .DESKTOP_CONTAINER_SESSAO {
        padding-top: var(--desktop-container-sessao-espacamento-topo-desktop-md, 80px);
        padding-bottom: var(--desktop-container-sessao-espacamento-baixo-desktop-md, 6px);
        padding-left: var(--desktop-container-sessao-espacamento-esquerda-desktop-md, 60px);
        padding-right: var(--desktop-container-sessao-espacamento-direita-desktop-md, 60px);
        min-height: calc(100vh - 150px);
    }
    
    .DESKTOP_CONTAINER {
        padding-top: var(--desktop-container-espacamento-topo-desktop-md, 40px);
        padding-bottom: var(--desktop-container-espacamento-baixo-desktop-md, 40px);
        padding-left: var(--desktop-container-espacamento-esquerda-desktop-md, 40px);
        padding-right: var(--desktop-container-espacamento-direita-desktop-md, 40px);
    }
    
    .SECTION_DESKTOP_CONTAINER {
        padding-top: var(--section-desktop-container-espacamento-topo-desktop-md, 40px);
        padding-bottom: var(--section-desktop-container-espacamento-baixo-desktop-md, 40px);
        padding-left: var(--section-desktop-container-espacamento-esquerda-desktop-md, 40px);
        padding-right: var(--section-desktop-container-espacamento-direita-desktop-md, 40px);
    }
    
    .SECTION_DESKTOP_CONTAINER_COLUMN {
        height: var(--section-desktop-container-column-altura-desktop-md, 500px);
    }
}