/*
Theme Name:   Rovina
Theme URI:    https://byrovina.com
Description:  Child theme cua Blocksy cho byrovina.com. Port design tokens tu
              Shopify theme Horizon (theme_export__byrovina-com-horizon).
Author:       Rovina
Template:     blocksy
Version:      1.1.0
Text Domain:  rovina
*/

/* ==========================================================================
   DESIGN TOKENS - trich tu Shopify Horizon (config/settings_data.json)
   ========================================================================== */
:root {
  /* Mau thuong hieu */
  --rovina-primary: #933333;
  --rovina-primary-dark: #7a2a2a;
  --rovina-dark: #2b0909;
  --rovina-foreground: #2b0909;
  --rovina-background: #ffffff;
  --rovina-border: #00000026;

  /* Bundle (port tu Kaching config cua tryrovina) */
  --rv-bundle-bg: #ffffff;
  --rv-bundle-sel: #fae5e5;
  --rv-bundle-border: #a44545;
  --rv-badge-bg: #9e3030;
  --rv-bundle-radius: 9px;

  /* Header */
  --rv-header-h: 60px;

  /* Typography - y het tryrovina: Plus Jakarta Sans + Poppins */
  --rovina-font-body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont,
                      "Segoe UI", Roboto, sans-serif;
  --rovina-font-head: "Poppins", "Plus Jakarta Sans", sans-serif;
  --rovina-h1: 48px;
  --rovina-h2: 36px;
  --rovina-h3: 24px;
  --rovina-body: 16px;

  /* Border radius */
  --rovina-radius-button: 10px;
  --rovina-radius-product: 8px;
  --rovina-radius-card: 12px;
  --rovina-radius-input: 8px;
  --rovina-radius-badge: 100px;

  /* Swatch */
  --rovina-swatch-size: 34px;
  --rovina-swatch-radius: 32px;
}

body {
  font-family: var(--rovina-font-body);
  font-size: var(--rovina-body);
  color: var(--rovina-foreground);
  overflow-x: hidden;
  -webkit-tap-highlight-color: rgba(147, 51, 51, .12);
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3,
.rovina-h2, .rv-header__wordmark {
  font-family: var(--rovina-font-head);
  font-weight: 600;
  letter-spacing: .02rem;
}

h1, .h1 { font-size: var(--rovina-h1); line-height: 1.1; }
h2, .h2 { font-size: var(--rovina-h2); line-height: 1.15; }
h3, .h3 { font-size: var(--rovina-h3); line-height: 1.25; }

@media (max-width: 768px) {
  h1, .h1 { font-size: 34px; }
  h2, .h2 { font-size: 27px; }
  h3, .h3 { font-size: 20px; }
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.wp-block-button__link,
.ct-button,
button.single_add_to_cart_button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background-color: var(--rovina-primary);
  border-radius: var(--rovina-radius-button);
  color: #fff;
  font-weight: 600;
  transition: background-color .25s ease-out;
}

.wp-block-button__link:hover,
.ct-button:hover,
button.single_add_to_cart_button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  background-color: var(--rovina-primary-dark);
  color: #fff;
}

/* --------------------------------------------------------------------------
   Products
   -------------------------------------------------------------------------- */
.woocommerce ul.products li.product img,
.woocommerce div.product div.images img {
  border-radius: var(--rovina-radius-product);
}

.woocommerce span.onsale,
.wc-block-grid__product-onsale {
  background-color: var(--rovina-primary);
  border-radius: var(--rovina-radius-badge);
  color: #fff;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--rovina-primary);
  font-weight: 700;
}

/* --------------------------------------------------------------------------
   Inputs
   -------------------------------------------------------------------------- */
input[type="text"], input[type="email"], input[type="search"],
input[type="tel"], input[type="number"], input[type="password"],
select, textarea {
  border-radius: var(--rovina-radius-input);
  border: 1px solid var(--rovina-border);
}

input[type="text"]:focus, input[type="email"]:focus,
input[type="search"]:focus, select:focus, textarea:focus {
  border-color: var(--rovina-primary);
  outline: none;
}

/* --------------------------------------------------------------------------
   Cards / variation swatches
   -------------------------------------------------------------------------- */
.ct-card, .wp-block-group.is-style-card {
  border-radius: var(--rovina-radius-card);
}

.ct-swatch, .variable-items-wrapper .variable-item {
  width: var(--rovina-swatch-size);
  height: var(--rovina-swatch-size);
  border-radius: var(--rovina-swatch-radius);
}

/* --------------------------------------------------------------------------
   Rovina blocks: FAQ, guarantee, comparison
   -------------------------------------------------------------------------- */
.rovina-faq__item {
  border-bottom: 1px solid var(--rovina-border);
  padding: 18px 0;
}

.rovina-faq__q {
  font-size: var(--rovina-h3);
  font-weight: 600;
  cursor: pointer;
  margin: 0;
  list-style: none;
}

.rovina-faq__q::-webkit-details-marker { display: none; }

.rovina-faq__q::after {
  content: "+";
  float: right;
  color: var(--rovina-primary);
  font-weight: 400;
}

details[open] > .rovina-faq__q::after { content: "\2212"; }

.rovina-faq__a {
  margin: 12px 0 0;
  color: #444;
  line-height: 1.6;
}

.rovina-guarantee {
  background: #faf5f5;
  border: 1px solid var(--rovina-border);
  border-radius: var(--rovina-radius-card);
  padding: 32px;
  text-align: center;
}

.rovina-guarantee__badge {
  display: inline-block;
  background: var(--rovina-primary);
  color: #fff;
  border-radius: var(--rovina-radius-badge);
  padding: 6px 18px;
  font-weight: 600;
  margin-bottom: 12px;
}

.rovina-compare {
  width: 100%;
  border-collapse: collapse;
  border-radius: var(--rovina-radius-card);
  overflow: hidden;
}

.rovina-compare th,
.rovina-compare td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--rovina-border);
  text-align: left;
}

.rovina-compare thead th {
  background: var(--rovina-dark);
  color: #fff;
}

.rovina-compare tbody td.is-us { color: var(--rovina-primary); font-weight: 600; }
