/*
Theme Name: J&C Cabeleireiros
Theme URI: https://jccabeleireiros.pt/
Description: Child theme personalizado para J&C Cabeleireiros, criado sobre Astra. Inclui base visual premium, cores da marca, menu, botões e loja em modo catálogo/montra.
Author: Patrícia Queirós
Author URI: https://patriciaqueiros.pt/
Template: astra
Version: 1.0.0
Text Domain: jc-cabeleireiros
*/

:root {
  --jc-primary: #c2a09e;
  --jc-primary-rgb: 194, 160, 158;
  --jc-hover: #000000;
  --jc-black: #000000;
  --jc-white: #ffffff;
  --jc-soft: #f8f3f2;
  --jc-text: #1d1d1d;
  --jc-muted: #6f6f6f;
  --jc-border: rgba(0, 0, 0, 0.10);
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--jc-text);
  background: var(--jc-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a {
  color: var(--jc-primary);
  transition: all .25s ease;
}

a:hover,
a:focus {
  color: var(--jc-hover);
}

/* ================================
   HEADER / MENU ASTRA
================================ */

.site-header,
.ast-primary-header-bar,
.ast-above-header-bar,
.ast-below-header-bar {
  background: var(--jc-white) !important;
}

.ast-primary-header-bar {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.site-logo-img img,
.custom-logo-link img {
  max-height: 72px;
  width: auto;
}

.main-header-menu .menu-link,
.ast-builder-menu-1 .menu-item > .menu-link,
.ast-builder-menu-mobile .main-navigation .menu-item .menu-link,
.ast-header-break-point .main-header-menu .menu-link {
  color: var(--jc-primary) !important;
  font-weight: 600;
  letter-spacing: .02em;
  transition: color .25s ease;
}

.main-header-menu .menu-link:hover,
.main-header-menu .menu-item:hover > .menu-link,
.main-header-menu .current-menu-item > .menu-link,
.main-header-menu .current_page_item > .menu-link,
.ast-builder-menu-1 .menu-item:hover > .menu-link,
.ast-builder-menu-1 .current-menu-item > .menu-link,
.ast-builder-menu-1 .current_page_item > .menu-link,
.ast-builder-menu-mobile .main-navigation .menu-item:hover > .menu-link,
.ast-header-break-point .main-header-menu .current-menu-item > .menu-link {
  color: var(--jc-hover) !important;
}

.ast-header-social-wrap .ast-builder-social-element,
.ast-header-social-wrap .ast-builder-social-element svg,
.ast-header-social-wrap .ast-builder-social-element .ahfb-svg-iconset svg {
  color: var(--jc-primary) !important;
  fill: var(--jc-primary) !important;
  transition: all .25s ease;
}

.ast-header-social-wrap .ast-builder-social-element:hover,
.ast-header-social-wrap .ast-builder-social-element:hover svg,
.ast-header-social-wrap .ast-builder-social-element:hover .ahfb-svg-iconset svg {
  color: var(--jc-hover) !important;
  fill: var(--jc-hover) !important;
}

/* Botão Marcação para usar no Header Builder > HTML
   Código: <a href="/#marcacao" class="jc-header-booking">Marcação</a>
*/
.jc-header-booking {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  margin-left: 16px;
  padding: 12px 24px;
  border-radius: 999px;
  background: var(--jc-primary);
  border: 1px solid var(--jc-primary);
  color: var(--jc-white) !important;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .11em;
  line-height: 1;
  text-transform: uppercase;
  text-decoration: none !important;
  box-shadow: 0 12px 28px rgba(var(--jc-primary-rgb), .24);
  transition: all .25s ease;
}

.jc-header-booking:hover,
.jc-header-booking:focus {
  background: var(--jc-hover);
  border-color: var(--jc-hover);
  color: var(--jc-white) !important;
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .18);
}

/* ================================
   BOTÕES GERAIS / ASTRA / ELEMENTOR
================================ */

button,
.button,
.ast-button,
.ast-custom-button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.wp-block-button__link,
.elementor-button,
.elementor-widget-button .elementor-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--jc-primary) !important;
  border: 1px solid var(--jc-primary) !important;
  color: var(--jc-white) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  text-decoration: none !important;
  box-shadow: 0 14px 32px rgba(var(--jc-primary-rgb), .22);
  transition: all .25s ease;
}

button:hover,
.button:hover,
.ast-button:hover,
.ast-custom-button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.wp-block-button__link:hover,
.elementor-button:hover,
.elementor-widget-button .elementor-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
button:focus,
.button:focus,
.ast-button:focus,
.ast-custom-button:focus,
input[type="button"]:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
.wp-block-button__link:focus,
.elementor-button:focus,
.elementor-widget-button .elementor-button:focus {
  background: var(--jc-hover) !important;
  border-color: var(--jc-hover) !important;
  color: var(--jc-white) !important;
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .18);
}

/* Botão secundário opcional */
.jc-btn-outline .elementor-button,
.jc-btn-outline.elementor-button,
a.jc-btn-outline {
  background: transparent !important;
  border: 1px solid var(--jc-primary) !important;
  color: var(--jc-primary) !important;
  box-shadow: none !important;
}

.jc-btn-outline .elementor-button:hover,
.jc-btn-outline.elementor-button:hover,
a.jc-btn-outline:hover {
  background: var(--jc-hover) !important;
  border-color: var(--jc-hover) !important;
  color: var(--jc-white) !important;
}

/* ================================
   TIPOGRAFIA / DETALHES EDITORIAIS
================================ */

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
  color: var(--jc-black);
}

.jc-eyebrow,
.elementor-widget-heading.jc-eyebrow .elementor-heading-title {
  color: var(--jc-primary) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .18em !important;
  line-height: 1.4 !important;
  text-transform: uppercase !important;
}

.jc-soft-section {
  background: var(--jc-soft);
}

.jc-card {
  background: var(--jc-white);
  border: 1px solid var(--jc-border);
  border-radius: 28px;
  box-shadow: 0 18px 55px rgba(0, 0, 0, .06);
}

/* ================================
   FORMULÁRIOS / CONTACT FORM 7
================================ */

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="date"],
.wpcf7 input[type="url"],
.wpcf7 input[type="number"],
.wpcf7 select,
.wpcf7 textarea,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="date"],
input[type="url"],
input[type="number"],
select,
textarea {
  border: 1px solid rgba(0, 0, 0, .12) !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  color: var(--jc-text) !important;
  padding: 13px 15px !important;
  transition: all .25s ease;
}

.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--jc-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--jc-primary-rgb), .15) !important;
  outline: none !important;
}

/* ================================
   WOOCOMMERCE COMO CATÁLOGO / MONTRA
================================ */

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  text-align: center;
}

.woocommerce ul.products li.product .astra-shop-thumbnail-wrap,
.woocommerce-page ul.products li.product .astra-shop-thumbnail-wrap {
  border-radius: 24px;
  overflow: hidden;
  background: var(--jc-soft);
}

.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
  transition: transform .35s ease;
}

.woocommerce ul.products li.product:hover img,
.woocommerce-page ul.products li.product:hover img {
  transform: scale(1.04);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
  color: var(--jc-black);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .01em;
}

.woocommerce .price,
.woocommerce-page .price {
  color: var(--jc-primary) !important;
  font-weight: 800;
}

/* Esconde zonas de compra para manter apenas montra */
.woocommerce a.add_to_cart_button,
.woocommerce .single_add_to_cart_button,
.woocommerce .quantity,
.woocommerce .cart,
.ast-header-woo-cart,
.ast-site-header-cart,
.woocommerce-cart-form,
.woocommerce-checkout,
.woocommerce-mini-cart__buttons {
  display: none !important;
}

/* ================================
   FOOTER
================================ */

.site-footer,
.ast-footer-copyright,
.site-primary-footer-wrap,
.site-below-footer-wrap {
  background: var(--jc-white);
  color: var(--jc-muted);
}

.site-footer a {
  color: var(--jc-primary);
}

.site-footer a:hover {
  color: var(--jc-hover);
}

/* ================================
   RESPONSIVO
================================ */

@media (max-width: 921px) {
  .site-logo-img img,
  .custom-logo-link img {
    max-height: 58px;
  }

  .jc-header-booking {
    width: 100%;
    margin-left: 0;
    margin-top: 12px;
  }

  .ast-header-break-point .main-header-menu .menu-link {
    padding-top: 14px;
    padding-bottom: 14px;
  }
}

@media (max-width: 544px) {
  .elementor-button,
  .wp-block-button__link,
  .button,
  .ast-button {
    width: 100%;
    justify-content: center;
  }
}
