/*
Theme Name: Tipsy Child Theme
Theme URI: https://tipsy.themerex.net/
Description: Tipsy is a Premium WordPress theme that has built-in support for popular Page Builders, slider with swipe gestures, and is SEO- and Retina-ready. The unique system of inheritance and override options allows setting up individual parameters for different sections of your site and supported plugins.
Author: ThemeREX
Author URI: https://themerex.net/
Version: 1.9.0
Tested up to: 6.7
Requires at least: 5.0
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, e-commerce, portfolio, grid-layout, one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-logo, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, footer-widgets, full-width-template, microformats, post-formats, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks
Text Domain: tipsy
Template: tipsy
*/


/* =Child-Theme customization starts here
------------------------------------------------------------ */

/* BUG GRAVE E AMPLO: o CSS do proprio Elementor (nao algo que editamos)
   ficou sem a regra "flex-direction: column" para .elementor-widget-wrap.
   Isso faz TODOS os widgets dentro de uma coluna (titulo, texto, carrossel,
   espacadores etc) brigarem por espaco HORIZONTAL em vez de empilharem
   verticalmente - o titulo/texto fica espremido numa coluna estreitissima
   e o resto do espaco fica em branco. Acontece em varias paginas (Home,
   Sobre Nos, etc), nao e algo isolado de uma pagina so.
   Corrige isso globalmente, MAS o cabecalho (menu, icones de conta/carrinho/
   busca) depende do comportamento padrao "row" pra ficar tudo lado a lado -
   por isso a segunda regra restaura "row" so dentro do <header>. */
.elementor-widget-wrap {
	flex-direction: column !important;
}
header.top_panel .elementor-widget-wrap {
	flex-direction: row !important;
}

/* Alarga o campo de CEP do simulador de frete na pagina de produto,
   que estava cortando os digitos (era 100px, so cabiam ~6 caracteres) */
#shipping-simulator #zipcode {
	width: 140px !important;
}

/* Fundo do cabecalho (logo + menu + icones) preto ao inves de branco.
   Reaproveita as variaveis de cor "escuro" que o proprio tema ja usa
   no rodape, entao o texto/icones do menu ficam brancos automaticamente. */
header.top_panel {
	--theme-color-bg_color: #151514;
	--theme-color-text: #CDCDC6;
	--theme-color-text_dark: #FFFEFE;
}

/* Botao "Finalizacao de Compra" do mini-carrinho estava cortando o texto
   (largura fixa em 49.9% + texto sem quebra de linha). Deixa quebrar. */
.woocommerce .widget_shopping_cart .buttons a.checkout,
.woocommerce.widget_shopping_cart .buttons a.checkout {
	white-space: normal !important;
	line-height: 1.3 !important;
}

/* Titulo da pagina/categoria (ex: "Ouro", "Conserto de Joias e Relogios")
   estava colado na borda de baixo da faixa preta, com um vao enorme em
   cima - e em titulos de 2 linhas o texto era cortado embaixo, porque a
   faixa tinha altura fixa (calculada so pra 1 linha). Adiciona padding em
   vez de so centralizar, assim a faixa cresce com o conteudo.
   (o seletor certo eh o wrap que ENVOLVE o widget de titulo, nao um
   filho dele - por isso usamos :has() aqui) */
.elementor-widget-wrap:has(> .elementor-widget-trx_sc_layouts_title) {
	align-items: center !important;
	padding-top: 28px !important;
	padding-bottom: 28px !important;
}

/* Icone de busca do cabecalho quebrava pra uma segunda linha porque a
   fileira de icones (conta/carrinho/busca) ficava ~3px mais larga que o
   espaco disponivel. Forca todos a ficarem na mesma linha. */
.sc_layouts_column_icons_position_left > .elementor-widget-wrap {
	flex-wrap: nowrap !important;
}

/* O "mais itens" (tres pontinhos) do menu principal quebrava pra uma
   segunda linha sozinho, por poucos pixels de sobra insuficiente (o menu
   usa itens flutuantes "float", entao nowrap nao resolve aqui). Reduz um
   pouco o espacamento de cada item do menu pra sobrar espaco de verdade. */
.sc_layouts_menu_nav > li > a {
	padding-left: 9px !important;
	padding-right: 9px !important;
}