/*
Theme Name: RyV Industrial
Theme URI: https://ryvarticulos.cl
Author: RyV Artículos
Description: Full Site Editing block theme — dark industrial aesthetic for EPP y seguridad industrial. Inter typeface, Industrial Yellow primary, deep black surfaces.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: ryv-industrial
*/

/* ══════════════════════════════════════════════════════════
   TRUST BAR — barra superior centrada
   ══════════════════════════════════════════════════════════ */
.ryv-trust-bar {
    width: 100%;
    background: #1a1c1c;
    border-bottom: 1px solid #504533;
    padding: 6px 32px;
    box-sizing: border-box;
}

.ryv-trust-bar .ast-container,
.ryv-trust-bar > div {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0;
}

.ryv-trust-items {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 32px;
}

.ryv-trust-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #d5c4ac;
    white-space: nowrap;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.ryv-trust-item .icon {
    font-size: 14px;
    line-height: 1;
}

@media (max-width: 768px) {
    .ryv-trust-bar { display: none; }
}

/* ── Industrial effects ── */
.industrial-shadow { box-shadow: 4px 4px 0px 0px #ffdca0; }
.industrial-border { border: 1px solid #504533 !important; }
.text-shadow-hard  { text-shadow: 2px 2px 0px #121414; }

/* ── Site header ── */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #121414;
    border-bottom: 2px solid #504533;
}

/* Inner row */
.site-header .wp-block-group.header-row {
    display: flex !important;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
}

/* Logo */
.site-header .wp-block-site-title {
    flex-shrink: 0;
    margin-right: 32px;
}
.site-header .wp-block-site-title a {
    color: #ffdca0 !important;
    text-decoration: none;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Navigation */
.site-header .wp-block-navigation {
    flex: 1;
}
.site-header .wp-block-navigation__container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 24px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.site-header .wp-block-navigation-item {
    display: flex;
    align-items: center;
}
.site-header .wp-block-navigation-item__content,
.site-header .wp-block-navigation a {
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    color: #d5c4ac !important;
    text-decoration: none !important;
    transition: color .2s !important;
    white-space: nowrap;
    padding: 4px 0 !important;
    display: block;
}
.site-header .wp-block-navigation a:hover,
.site-header .wp-block-navigation .current-menu-item > a,
.site-header .wp-block-navigation-item.current-menu-item .wp-block-navigation-item__content {
    color: #ffdca0 !important;
    border-bottom: 2px solid #ffdca0;
    padding-bottom: 2px !important;
}

/* Header actions (shop link + cart) */
.header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-left: auto;
}

/* Shop link */
.header-shop-link {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #d5c4ac;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    transition: color .2s;
    padding: 6px 8px;
}
.header-shop-link:hover { color: #ffdca0; }
.header-shop-link .material-symbols-outlined { font-size: 20px; }

/* WooCommerce mini-cart block */
.site-header .wc-block-mini-cart__button,
.site-header .wc-block-mini-cart {
    color: #ffdca0 !important;
}
.site-header .wc-block-mini-cart__quantity-badge,
.site-header .wc-block-components-totals-item__value {
    background: #ffb4ab !important;
    color: #690005 !important;
}

/* Mobile nav overlay */
.site-header .wp-block-navigation__responsive-container.is-menu-open {
    background: #121414 !important;
}
.site-header .wp-block-navigation__responsive-container-close {
    color: #ffdca0 !important;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    color: #e2e2e2 !important;
    font-size: 18px !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #504533 !important;
}

/* Mobile hamburger */
.site-header .wp-block-navigation__responsive-container-open {
    color: #d5c4ac !important;
}
.site-header .wp-block-navigation__responsive-container-open:hover {
    color: #ffdca0 !important;
}

/* ── Category cards ── */
.ryv-cat-card {
    position: relative;
    overflow: hidden;
    aspect-ratio: 4/5;
    background: #1e2020;
    border: 1px solid #504533;
    cursor: pointer;
    display: block;
    text-decoration: none;
}
.ryv-cat-card img {
    width: 100%; height: 100%;
    object-fit: cover;
    filter: grayscale(100%);
    opacity: .4;
    transition: filter .7s, opacity .7s, transform .7s;
    display: block;
}
.ryv-cat-card:hover img { filter: grayscale(0%); opacity: .8; transform: scale(1.1); }
.ryv-cat-card .cat-gradient {
    position: absolute; inset: 0;
    background: linear-gradient(to top, #121414 0%, transparent 60%);
    z-index: 1;
}
.ryv-cat-card .cat-hover { position: absolute; inset: 0; background: rgba(255,220,160,0); transition: background .3s; z-index: 2; }
.ryv-cat-card:hover .cat-hover { background: rgba(255,220,160,.1); }
.ryv-cat-card .cat-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 24px; z-index: 3; }
.ryv-cat-card .cat-label { display: block; font-size: 12px; font-weight: 700; color: #ffdca0; text-transform: uppercase; letter-spacing: .2em; margin-bottom: 4px; }
.ryv-cat-card h3 { font-size: 24px; font-weight: 700; color: #e2e2e2; margin: 0 0 12px; line-height: 1.3; }
.ryv-cat-card .cat-line { height: 2px; width: 0; background: #ffdca0; transition: width .3s; }
.ryv-cat-card:hover .cat-line { width: 100%; }

/* ── Product cards ── */
.ryv-product-card { background: #121414; border: 1px solid #504533; display: flex; flex-direction: column; transition: border-color .3s; }
.ryv-product-card:hover { border-color: #ffdca0; }
.ryv-product-card .prod-img {
    position: relative; background: #333535; padding: 24px;
    aspect-ratio: 1; display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.ryv-product-card .prod-img img { width: 80%; height: 80%; object-fit: contain; transition: transform .5s; }
.ryv-product-card:hover .prod-img img { transform: scale(1.1); }
.ryv-product-card .prod-badge { position: absolute; top: 12px; right: 12px; background: #ffdca0; color: #412d00; font-size: 12px; font-weight: 700; padding: 2px 8px; }
.ryv-product-card .prod-badge.urgent { background: #ffb4ab; color: #690005; }
.ryv-product-card .prod-body { padding: 16px; display: flex; flex-direction: column; flex-grow: 1; }
.ryv-product-card .prod-cert { display: flex; align-items: center; gap: 4px; color: #d5c4ac; font-size: 12px; margin-bottom: 8px; }
.ryv-product-card .prod-cert .material-symbols-outlined { color: #ffdca0; font-size: 16px; font-variation-settings: 'FILL' 1; }
.ryv-product-card h4 { font-size: 14px; font-weight: 700; color: #e2e2e2; text-transform: uppercase; margin: 0 0 auto; padding-bottom: 8px; }
.ryv-product-card .prod-price { font-size: 24px; font-weight: 700; color: #ffdca0; margin: 12px 0 0; }
.ryv-product-card .btn-cart {
    display: block; width: 100%; padding: 8px; margin-top: 12px;
    border: 1px solid #ffdca0; color: #ffdca0; background: transparent;
    font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
    text-align: center; text-decoration: none; cursor: pointer;
    transition: background .2s, color .2s;
}
.ryv-product-card .btn-cart:hover { background: #ffdca0; color: #412d00; }

/* ── Spec boxes ── */
.ryv-spec-box { background: #1e2020; border: 1px solid #504533; padding: 16px; }
.ryv-spec-box .material-symbols-outlined { color: #ffdca0; font-size: 28px; display: block; margin-bottom: 8px; }
.ryv-spec-box h4 { font-size: 14px; font-weight: 700; color: #e2e2e2; margin: 0 0 4px; }
.ryv-spec-box p { font-size: 12px; color: #d5c4ac; margin: 0; line-height: 1.4; }

/* ── Stat items ── */
.ryv-stat { border-left: 2px solid #ffdca0; padding-left: 16px; }
.ryv-stat .stat-val { display: block; font-size: 24px; font-weight: 700; color: #ffdca0; }
.ryv-stat .stat-lbl { font-size: 12px; font-weight: 500; color: #d5c4ac; text-transform: uppercase; letter-spacing: .1em; }

/* ── Buttons (outside editor) ── */
.btn-primary {
    display: inline-block; background: #ffdca0; color: #412d00 !important;
    font-size: 14px; font-weight: 700; padding: 16px 32px;
    text-transform: uppercase; letter-spacing: .1em; text-decoration: none;
    box-shadow: 4px 4px 0px 0px rgba(255,220,160,.6);
    transition: transform .1s, box-shadow .1s; border: none; cursor: pointer;
}
.btn-primary:hover { transform: translate(2px,2px); box-shadow: 2px 2px 0px 0px rgba(255,220,160,.6); }
.btn-outline {
    display: inline-block; border: 2px solid #ffdca0; color: #ffdca0 !important;
    font-size: 14px; font-weight: 700; padding: 14px 32px;
    text-transform: uppercase; letter-spacing: .1em; text-decoration: none;
    background: transparent; transition: background .2s; cursor: pointer;
}
.btn-outline:hover { background: rgba(255,220,160,.1); }

/* ── Responsive grids ── */
.ryv-grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.ryv-grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 32px; }
.ryv-grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
@media (max-width: 1024px) { .ryv-grid-4 { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 768px) {
    .ryv-grid-4,.ryv-grid-3,.ryv-grid-2 { grid-template-columns: 1fr; }
    .hide-mobile { display: none !important; }
}

/* ── Newsletter form ── */
.ryv-newsletter { display: flex; }
.ryv-newsletter input[type="email"] {
    flex: 1; background: #1e2020; border: 1px solid #504533; border-right: none;
    color: #e2e2e2; padding: 8px 12px; font-size: 14px;
}
.ryv-newsletter input[type="email"]:focus { border-color: #ffdca0; outline: none; }
.ryv-newsletter button { background: #ffdca0; color: #412d00; border: none; padding: 8px 14px; cursor: pointer; display: flex; align-items: center; }
.ryv-newsletter button .material-symbols-outlined { font-size: 20px; }

/* ── FAB ── */
.ryv-fab {
    position: fixed; bottom: 32px; right: 32px;
    background: #ffdca0; color: #412d00; width: 56px; height: 56px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 4px 4px 0px 0px rgba(255,220,160,.4);
    z-index: 100; border: none; cursor: pointer; transition: transform .2s; text-decoration: none;
}
.ryv-fab:hover { transform: scale(1.1); color: #412d00; }
.ryv-fab .material-symbols-outlined { font-size: 28px; }

/* ── Material Symbols base ── */
.material-symbols-outlined { font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24; }

/* ── WooCommerce overrides ── */
.woocommerce div.product .product_title { color: #e2e2e2; font-weight: 800; letter-spacing: -.02em; }
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: #ffdca0 !important; font-size: 32px; font-weight: 700; }
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: #ffdca0 !important; color: #412d00 !important;
    font-weight: 700; text-transform: uppercase; letter-spacing: .1em;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0 0 rgba(255,220,160,.4);
    transition: transform .1s, box-shadow .1s;
}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: #ffbb16 !important; color: #271900 !important;
    transform: translate(2px,2px); box-shadow: 2px 2px 0 0 rgba(255,220,160,.4);
}
.woocommerce .star-rating span::before,
.woocommerce-page .star-rating span::before { color: #ffdca0; }
.woocommerce table.shop_table { background: #1e2020; border: 1px solid #504533; color: #e2e2e2; }
.woocommerce table.shop_table th { background: #282a2b; color: #ffdca0; text-transform: uppercase; letter-spacing: .05em; }
.woocommerce table.shop_table td { border-top: 1px solid #504533; }
.woocommerce-breadcrumb { color: #d5c4ac; font-size: 12px; }
.woocommerce-breadcrumb a { color: #ffdca0; text-decoration: none; }

/* ── Footer ── */
.site-footer { background: #0c0f0f; border-top: 4px solid #ffdca0; }
.site-footer h4 { font-size: 14px; font-weight: 700; color: #e2e2e2; text-transform: uppercase; letter-spacing: .15em; margin-bottom: 16px; }
.site-footer a { color: #d5c4ac; text-decoration: none; font-size: 16px; transition: color .2s; }
.site-footer a:hover { color: #ffdca0; }
.site-footer .wp-block-site-title a { color: #ffdca0 !important; font-size: 24px; font-weight: 800; }

/* ── Post/archive cards ── */
.ryv-post-card { background: #1e2020; border: 1px solid #504533; transition: border-color .3s; }
.ryv-post-card:hover { border-color: #ffdca0; }
.ryv-post-card .post-meta { font-size: 12px; color: #9d8f78; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 8px; }
.ryv-post-card .post-title { font-size: 18px; font-weight: 700; color: #e2e2e2; line-height: 1.3; margin-bottom: 8px; }
.ryv-post-card .post-title a { color: inherit; text-decoration: none; }
.ryv-post-card .post-title a:hover { color: #ffdca0; }
.ryv-post-card .post-excerpt { font-size: 14px; color: #d5c4ac; line-height: 1.5; }

/* ── Single post ── */
.ryv-single-content h1,
.ryv-single-content h2,
.ryv-single-content h3 { color: #e2e2e2; font-weight: 700; }
.ryv-single-content h2 { font-size: 24px; border-left: 3px solid #ffdca0; padding-left: 12px; margin-top: 32px; }
.ryv-single-content a { color: #ffdca0; }
.ryv-single-content blockquote { border-left: 3px solid #ffdca0; padding-left: 16px; color: #d5c4ac; font-style: italic; }