/* TP3D Listado — la grilla en celular: dos productos por fila.

   El corte de pantalla va ACÁ ADENTRO y no en el atributo `media` del <link>: así no
   depende de que el theme respete ese atributo al imprimir las hojas de estilo. En
   computadora la grilla la sigue armando el theme (o la opción del back-office).

   Medido en la tienda: la tarjeta medía 146px de 412 (35% de la pantalla). El resto se lo
   comían los rellenos acumulados de los contenedores y un min-width: 250px del theme. */

@media (max-width: 767px) {

    /* Contenedores del buscador: sin relleno lateral */
    .ybc_search_page_content .wrap_search,
    .ybc_search_page_content .content_tab,
    .ybc_search_page_content .wrap_content_product,
    .ybc_search_page_content .wrap_header_tap {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Dos por fila, casi pegadas */
    #js-product-list .products,
    .ybc_search_page_content .products {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        margin-left: -3px !important;
        margin-right: -3px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #js-product-list .products > .js-product.product,
    .ybc_search_page_content .products > .js-product.product {
        width: 50%;
        max-width: 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        padding-left: 3px !important;
        padding-right: 3px !important;
        margin-bottom: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    /* La tarjeta ocupa toda su columna: así todas las de la fila miden lo mismo */
    #js-product-list .product-miniature,
    .ybc_search_page_content .product-miniature {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    }

    #js-product-list .product-miniature .product-description,
    .ybc_search_page_content .product-miniature .product-description {
        padding: 6px 7px 8px;
    }

    /* Apenas más chicos que en la home (22 → 20 y 14 → 13): la tarjeta de celular mide
       unos 190px y con los tamaños de la home queda muy apretada. Es un punto, no un
       achique: se sigue leyendo igual de grande. */
    #js-product-list .product-miniature .price,
    .ybc_search_page_content .product-miniature .price {
        font-size: 20px !important;
    }

    #js-product-list .pc-listing-extra-prices .pc-installments,
    #js-product-list .pc-listing-extra-prices .pc-transfer-price,
    .ybc_search_page_content .pc-listing-extra-prices .pc-installments,
    .ybc_search_page_content .pc-listing-extra-prices .pc-transfer-price {
        font-size: 13px !important;
    }

    #js-product-list .product-miniature .regular-price,
    .ybc_search_page_content .product-miniature .regular-price {
        font-size: 13px !important;
    }

    #js-product-list .product-miniature .tp3dflashcba-card-hint,
    .ybc_search_page_content .product-miniature .tp3dflashcba-card-hint {
        margin-bottom: 6px;
        padding-left: 7px;
        padding-right: 7px;
    }
}
