/*
 Theme Name:   Guido Child
 Theme URI:    https://themeforest.net/item/guido-directory-listing-wordpress-theme/36719791
 Description:  Guido Child Theme
 Author:       ApusTheme
 Author URI:   http://apusthemes.com
 Template:     guido
 Version:      1.0.0
 Text Domain:  guido-child
*/


/* =========================================================
   DESTAKE ÁGUAS LINDAS
   CABEÇALHO DO ANÚNCIO - DESKTOP
   Nome em cima
   Informações e botões na mesma linha
   ========================================================= */

@media (min-width: 992px) {

    /*
     * O container principal passa a trabalhar em grade.
     *
     * Linha 1 = nome da loja
     * Linha 2 = telefone/localização + ações
     */
    .top-header-detail-listing > .container {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
        align-items: center;
        column-gap: 35px;
        row-gap: 8px;
    }


    /* -----------------------------------------------------
       BLOCO SUPERIOR
       ----------------------------------------------------- */

    .top-header-detail-listing .header-detail-top {
        display: contents;
    }


    /* Nome da loja ocupa toda a primeira linha */
    .top-header-detail-listing .title-wrapper {
        grid-column: 1 / -1;
        grid-row: 1;
        margin: 0;
        padding: 0;
    }


    .top-header-detail-listing .title-wrapper .listing-title {
        margin: 0;
        padding: 0;
    }


    /* Telefone + localização */
    .top-header-detail-listing .listing-metas {
        grid-column: 1;
        grid-row: 2;

        display: flex;
        align-items: center;
        flex-wrap: nowrap;

        margin: 0;
        padding: 0;

        white-space: nowrap;
    }


    /* -----------------------------------------------------
       BLOCO INFERIOR
       ----------------------------------------------------- */

    .top-header-detail-listing .header-detail-bottom {
        grid-column: 2;
        grid-row: 2;

        display: flex !important;
        align-items: center;
        justify-content: flex-end;

        width: 100%;

        margin: 0 !important;
        padding: 0;
    }


    /* Área de avaliação/preço */
    .top-header-detail-listing .header-detail-bottom > .col-md-5 {
        flex: 0 0 auto;

        width: auto;
        max-width: none;

        margin: 0;
        padding: 0 20px 0 0;
    }


    .top-header-detail-listing .left-infor {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;

        margin: 0;
        padding: 0;

        white-space: nowrap;
    }


    /* -----------------------------------------------------
       COMPARTILHAR / SALVAR / ENVIAR AVALIAÇÃO
       ----------------------------------------------------- */

    .top-header-detail-listing .header-detail-bottom .listing-action-detail {
        flex: 0 0 auto;

        width: auto;
        max-width: none;

        margin: 0;
        padding: 0;

        text-align: right;
    }


    .top-header-detail-listing .listing-action-detail .list-action {
        float: none !important;

        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;

        gap: 28px;

        width: auto;

        margin: 0;
        padding: 0;

        white-space: nowrap;
    }


    /*
     * Evita margens verticais do tema deixando
     * os itens fora de alinhamento.
     */
    .top-header-detail-listing .listing-action-detail,
    .top-header-detail-listing .listing-action-detail .list-action,
    .top-header-detail-listing .listing-metas,
    .top-header-detail-listing .left-infor {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (min-width: 768px) and (max-width: 991px) {

    .top-header-detail-listing .header-detail-bottom {
        display: flex;
        align-items: center;
        width: 100%;
        margin-top: 15px;
    }

    .top-header-detail-listing .listing-action-detail .list-action {
        float: none !important;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
    }

}


/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width: 767px) {

    .top-header-detail-listing > .container {
        display: block;
    }

    .top-header-detail-listing .header-detail-top {
        display: block;
    }

    .top-header-detail-listing .title-wrapper {
        margin-bottom: 10px;
    }

    .top-header-detail-listing .listing-metas {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .top-header-detail-listing .header-detail-bottom {
        display: block;
        margin-top: 15px;
    }

    .top-header-detail-listing .listing-action-detail .list-action {
        float: none !important;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 15px;
    }

}