/* ========================================================
           ESTRUTURA PRINCIPAL (GRID)
           ======================================================== */
        .grid-two-columns-files {
            display: grid;
            grid-template-columns: 280px 1fr;
            gap: 30px;
            align-items: start;
            margin-top: 30px;
            margin-bottom: 50px;
        }
		.grid-two-columns-files2 {
            display: grid;
            gap: 30px;
            align-items: start;
            margin-top: 30px;
            margin-bottom: 50px;
        }

        .single_title {
            color: #085631;
            font-size: 32px;
            margin-bottom: 10px;
            font-weight: bold;
        }

        /* ========================================================
           MENU LATERAL (SIDEBAR)
           ======================================================== */
        .menu-links {
            background-color: #f4f7fb;
            padding: 30px 20px;
            border-radius: 4px;
        }
        .sogocdn-boxTitle {
            font-size: 16px;
            font-weight: 700;
            color: #2c3e50;
            margin-bottom: 25px;
            text-transform: none;
            border: none;
        }
        .menu-menu-principal-container ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        .menu-menu-principal-container li {
            margin-bottom: 18px;
        }
        .menu-menu-principal-container a {
            text-decoration: none;
            color: #2c3e50;
            font-size: 15px;
            display: inline-block;
            transition: color 0.2s;
        }
        .menu-menu-principal-container a:hover {
            color: #085631;
        }
        .menu-menu-principal-container li.current-menu-item a {
            color: #085631;
            font-weight: bold;
            border-bottom: 2px solid #085631;
            padding-bottom: 2px;
        }

        /* ========================================================
           ÁREA DE BUSCA E FILTROS
           ======================================================== */
        .arq-list-filters-forms form {
            display: flex;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
            width: 100%;
            margin-bottom: 20px;
            padding-bottom: 20px;
            border-bottom: 1px solid #e5e7eb;
        }
        .arq-list-filters-forms label {
            margin: 0;
            flex: 1;
        }
        .inputSearchTitle {
            width: 100%;
            padding: 10px 15px;
            border: 1px solid #d1d5db;
            border-radius: 4px;
            background-color: #fff;
            color: #333;
            font-size: 14px;
            height: 40px;
            box-sizing: border-box;
            outline: none;
        }
        .inputSearchTitle::placeholder {
            color: #085631; /* Placeholder esverdeado claro como na foto */
            opacity: 0.7;
        }
        .select-filtro-data {
            padding: 0 15px;
            border: 1px solid #d1d5db;
            border-radius: 4px;
            background-color: #fff;
            color: #333;
            font-size: 14px;
            height: 40px;
            min-width: 160px;
            outline: none;
        }
        .btn-buscar-medicamento {
            background-color: #fff;
            border: 1px solid #d1d5db;
            color: #085631;
            border-radius: 4px;
            height: 40px;
            width: 40px;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background 0.2s;
        }
        .btn-buscar-medicamento:hover {
            background-color: #f3f4f6;
        }

        /* Container de datas extras */
        .container-entre-datas {
            display: none;
            align-items: center;
            gap: 5px;
        }
        .container-entre-datas input[type="date"] {
            padding: 0 10px;
            border: 1px solid #d1d5db;
            border-radius: 4px;
            height: 40px;
            font-size: 14px;
            box-sizing: border-box;
        }

        /* Botão de Exportação */
        .export-container {
            position: relative;
            display: inline-block;
        }
        .btn-exportar-site {
            background-color: #085631 !important;
            color: #ffffff !important;
            padding: 0 16px;
            border-radius: 4px;
            font-size: 14px;
            cursor: pointer;
            border: none;
            height: 40px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            font-weight: 500;
        }
        .btn-exportar-site:hover {
            background-color: #085631 !important;
        }
        .export-dropdown {
            display: none;
            position: absolute;
            right: 0;
            top: 45px;
            z-index: 1000;
            min-width: 150px;
            background-color: #ffffff;
            border: 1px solid #e5e7eb;
            border-radius: 4px;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
            padding: 5px 0;
        }
        .export-dropdown a {
            display: block;
            padding: 10px 15px;
            color: #333 !important;
            text-decoration: none;
            font-size: 14px;
            text-align: left;
        }
        .export-dropdown a:hover {
            background-color: #f3f4f6;
        }

        /* ========================================================
           LISTA DE LEIS (RESULTADOS)
           ======================================================== */
        .arq-list-item {
            display: flex;
            align-items: center;
            padding: 20px;
            background-color: #ffffff;
            gap: 20px;
            margin-bottom: 5px;
            border-radius: 4px;
        }
        /* Zebra stripes - cores alternadas igual a foto */
        .arq-list-item:nth-child(even) {
            background-color: #ffffff;
        }

        /* Ícone de documento grande na esquerda */
        .arq-list-item-icon {
            flex-shrink: 0;
            width: 50px;
            height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #cbd5e1;
            font-size: 50px; /* Ajuste dependendo da sua fonte de ícones */
        }
        
        /* Caso a classe da fonte do ícone não renderize, usamos SVG puro como fallback visual */
        .arq-list-item-icon i {
            display: block;
            width: 40px;
            height: 50px;
            background-image: url('data:image/svg+xml;utf8,<svg fill="%23cbd5e1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M64 0C28.7 0 0 28.7 0 64V448c0 35.3 28.7 64 64 64H320c35.3 0 64-28.7 64-64V160H256c-17.7 0-32-14.3-32-32V0H64zM256 0V128H384L256 0zM112 256H272c8.8 0 16 7.2 16 16s-7.2 16-16 16H112c-8.8 0-16-7.2-16-16s7.2-16 16-16zm0 64H272c8.8 0 16 7.2 16 16s-7.2 16-16 16H112c-8.8 0-16-7.2-16-16s7.2-16 16-16zm0 64H272c8.8 0 16 7.2 16 16s-7.2 16-16 16H112c-8.8 0-16-7.2-16-16s7.2-16 16-16z"/></svg>');
            background-repeat: no-repeat;
            background-size: contain;
        }

        /* Conteúdo do meio */
        .arq-list-item-content {
            flex: 1;
        }
        .arq-list-item-content a {
            text-decoration: none;
            display: block;
        }
        .arq-list-item-content h1 {
            color: #085631;
            font-size: 16px;
            font-weight: bold;
            margin: 0 0 6px 0;
            text-transform: uppercase;
        }
        .arq-list-item-content .data {
            font-size: 11px;
            color: #64748b;
            margin: 0 0 8px 0;
            display: flex;
            align-items: center;
            gap: 4px;
            text-transform: uppercase;
            font-weight: bold;
        }
        /* Ícone pequeno de calendário */
        .arq-list-item-content .data::before {
            content: '';
            display: inline-block;
            width: 12px;
            height: 12px;
            background-image: url('data:image/svg+xml;utf8,<svg fill="%2364748b" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M152 24c0-13.3-10.7-24-24-24s-24 10.7-24 24V64H64C28.7 64 0 92.7 0 128v16 48V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V192 144 128c0-35.3-28.7-64-64-64H344V24c0-13.3-10.7-24-24-24s-24 10.7-24 24V64H152V24zM48 192H400V448c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16V192z"/></svg>');
            background-size: contain;
            background-repeat: no-repeat;
        }

        .arq-list-item-content p:not(.data) {
            font-size: 14px;
            color: #475569;
            margin: 0;
            line-height: 1.5;
        }

        /* Botão de download na direita */
        .arq-list-item-download {
            flex-shrink: 0;
            border-left: 1px solid #e2e8f0;
            padding-left: 20px;
        }
        .arq-list-item-download a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            background-color: #e2e8f0;
            border-radius: 50%;
            color: #475569;
            text-decoration: none;
            transition: all 0.2s ease;
        }
        .arq-list-item-download a:hover {
            background-color: #cbd5e1;
            color: #0f172a;
        }

        .arq-list-item-download a i {
            display: none; /* Escondemos a classe antiga se falhar, ou mostramos se funcionar. O ideal é usar apenas o pseudo-elemento ou apenas o <i> */
        }

        /* ========================================================
           PAGINAÇÃO
           ======================================================== */
        .search-pagination {
            margin-top: 30px;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 15px;
        }
        .search-pagination__list {
            display: flex;
            gap: 8px;
            align-items: center;
        }
        .page-numbers {
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 35px;
            height: 35px;
            padding: 0 5px;
            background-color: #f3f4f6;
            color: #333;
            text-decoration: none;
            border-radius: 4px;
            font-size: 14px;
            font-weight: 500;
            transition: background 0.2s;
        }
        .page-numbers:hover {
            background-color: #e5e7eb;
        }
        .page-numbers.current, .page-numbers[style*="background: #085631"] {
            background-color: #085631 !important;
            color: #fff !important;
        }

        /* Responsividade */
        @media (max-width: 768px) {
            .grid-two-columns-files {
                grid-template-columns: 1fr;
            }
            .arq-list-filters-forms form {
                flex-direction: column;
                align-items: stretch;
            }
            .btn-exportar-site, .select-filtro-data, .inputSearchTitle {
                width: 100%;
            }
            .arq-list-item {
                flex-direction: column;
                align-items: flex-start;
            }
            .arq-list-item-download {
                border-left: none;
                padding-left: 0;
                width: 100%;
                display: flex;
                justify-content: flex-end;
                border-top: 1px solid #e2e8f0;
                padding-top: 15px;
            }
        }

/* Garante que o formulário tenha comportamento flexível */
.arq-list-filters-forms form {
    display: flex;
    flex-wrap: wrap; /* Permite quebrar linha apenas se o espaço acabar */
    align-items: center;
    gap: 10px;
}

/* Ajuste específico para o wrapper de datas no mobile */
@media (max-width: 768px) {
    #wrapper_entre_datas {
        flex-direction: column;
        width: 100%;
    }
}