/**
 * Estilos Frontend - Auro WooCommerce Fields
 * Estilos para exibição dos campos customizados na página do produto
 */

/* Container principal */
.auro-imovel-detalhes {
    margin: 30px 0;
    padding: 25px;
    background: #f9f9f9;
    border-radius: 8px;
    border: 1px solid #e5e5e5;
}

/* Títulos das seções */
.auro-imovel-detalhes h3 {
    color: #333;
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid #0073aa;
}

/* Seções individuais */
.auro-valores-aluguel,
.auro-custos-adicionais,
.auro-caracteristicas,
.auro-endereco,
.auro-mapa {
    margin-bottom: 25px;
}

.auro-imovel-detalhes > div:last-child {
    margin-bottom: 0;
}

/* Tabelas de valores */
.auro-tabela-valores {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.auro-tabela-valores tr {
    border-bottom: 1px solid #e5e5e5;
}

.auro-tabela-valores tr:last-child {
    border-bottom: none;
}

.auro-tabela-valores td {
    padding: 12px 15px;
}

.auro-tabela-valores td:first-child {
    width: 40%;
    color: #666;
}

.auro-tabela-valores td:last-child {
    font-weight: 600;
    color: #0073aa;
    text-align: right;
}

/* Lista de características */
.auro-lista-caracteristicas {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 15px;
}

.auro-lista-caracteristicas li {
    background: #fff;
    padding: 15px;
    border-radius: 5px;
    border-left: 3px solid #0073aa;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.auro-lista-caracteristicas li strong {
    display: block;
    color: #666;
    font-size: 14px;
    margin-bottom: 5px;
    font-weight: 500;
}

/* Endereço */
.auro-endereco p {
    background: #fff;
    padding: 15px;
    border-radius: 5px;
    border-left: 3px solid #0073aa;
    margin: 0;
    line-height: 1.6;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* Mapa */
.auro-mapa p {
    margin: 0;
}

.auro-mapa a {
    display: inline-block;
    padding: 12px 24px;
    background: #0073aa;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    transition: background 0.3s ease;
    font-weight: 500;
}

.auro-mapa a:hover {
    background: #005177;
}

/* Responsivo - Mobile */
@media (max-width: 768px) {
    .auro-imovel-detalhes {
        padding: 20px 15px;
        margin: 20px 0;
    }
    
    .auro-imovel-detalhes h3 {
        font-size: 18px;
    }
    
    .auro-tabela-valores td {
        padding: 10px;
        font-size: 14px;
    }
    
    .auro-tabela-valores td:first-child {
        width: 50%;
    }
    
    .auro-lista-caracteristicas {
        grid-template-columns: 1fr;
    }
}

/* Seção de Recorrência */
.auro-recorrencia {
    margin-bottom: 25px;
}

.auro-recorrencia-info {
    background: #e8f5e9;
    padding: 20px;
    border-radius: 5px;
    border-left: 4px solid #4caf50;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.auro-recorrencia-info p {
    margin: 8px 0;
    line-height: 1.6;
}

.auro-recorrencia-info p:first-child {
    font-size: 16px;
    color: #2e7d32;
}

.auro-recorrencia-info strong {
    color: #1b5e20;
}

/* Badge de pagamento recorrente no preço */
.price small {
    display: block;
    font-size: 0.85em;
    color: #666;
    margin-top: 5px;
}

/* Impressão */
@media print {
    .auro-imovel-detalhes {
        border: 1px solid #000;
        box-shadow: none;
    }
    
    .auro-mapa a {
        color: #000;
        background: transparent;
        border: 1px solid #000;
    }
    
    .auro-recorrencia-info {
        border: 1px solid #4caf50;
        background: #f0f0f0;
    }
}

/* Formulário de edição no frontend */
.auro-frontend-edit {
    margin: 30px 0;
    padding: 25px;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
}

.auro-frontend-edit h3 {
    margin: 0 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid #0073aa;
}

.auro-frontend-notice {
    margin: 0 0 15px 0;
    padding: 12px 15px;
    border-radius: 6px;
}

.auro-frontend-notice--success {
    background: #e8f5e9;
    border-left: 4px solid #4caf50;
}

.auro-frontend-fieldset {
    margin: 0 0 18px 0;
    padding: 15px;
    border: 1px solid #eee;
    border-radius: 6px;
}

.auro-frontend-fieldset legend {
    font-weight: 600;
    padding: 0 6px;
}

.auro-frontend-edit-form input[type="text"],
.auro-frontend-edit-form input[type="number"],
.auro-frontend-edit-form select,
.auro-frontend-edit-form textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.auro-frontend-edit-submit {
    margin-top: 10px;
}