/*
  Theme Name: Gunsight Antiques
  Theme URI: https://gunsight_antiques.codepixelz.tech/
  Author: Codepixelz
  Author URI: https://codepixelzmedia.com/
  Description: The custom startup block theme for WordPress, designed to provide a modern and visually appealing foundation for building websites. This theme is built with a focus on clean design, responsiveness, and ease of use, making it an ideal choice for businesses, startups, and individuals looking to create a professional online presence.
  This theme includes the basic CSS resets, typography styles, and a set of custom properties (CSS variables) for colors, font sizes, and spacing, allowing for easy customization and consistent styling across the website.
  Version: 1.0
  Requires at least: 6.0
  Tested up to: 6.7
  Requires PHP: 8.0
  License: GNU General Public License v2 or later
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
  Text Domain: gunsight_antiques
  Tags: custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations
  */

/* ========================================================
   DESIGN TOKENS (Global Variables)
   Used by ACF blocks + Custom Components
======================================================== */
/* ========================================================
   FONT LOADING
======================================================== */
@import url("https://fonts.googleapis.com/css2?family=Rye&family=Cinzel:wght@500;600;700&family=IM+Fell+English:ital@0;1&family=Special+Elite&display=swap");
:root {
  --paper: #e9dcbf;
  --paper-light: #f4ecd8;
  --paper-shadow: #d3c19a;
  --ink: #2a1d14;
  --ink-soft: #4a382a;
  --rust: #a6461f;
  --rust-dark: #7e3216;
  --brass: #a9782f;
  --brass-light: #c99b4a;
  --indigo: #3e4a5c;
  --charcoal: #1c140f;
  --charcoal-2: #241a12;
  --color-primary: #e9dcbf;
  --color-accent: #7e3216;
  --color-white: #ffffff;
  --color-light-grey: #f3f3f3;
  --color-grey: #666666;
  --color-black: #000;
  /* --------------------------------------------------
     FONT FAMILIES
  -------------------------------------------------- */
  --font-family-heading: "Urbanist", sans-serif;
  --font-family-body: "Helvetica", Arial, sans-serif;

  /* --------------------------------------------------
     FONT SIZES (Fluid-ready scale)
  -------------------------------------------------- */
  --fs-xs: 0.75rem;
  /* 12px */
  --fs-sm: 0.875rem;
  /* 14px */
  --fs-md: 1rem;
  /* 16px */
  --fs-md-plus: 1.125rem;
  /* 18px */
  --fs-lg: 1.25rem;
  /* 20px */
  --fs-xl: 1.75rem;
  /* 28px */
  --fs-2xl: 2.25rem;
  /* 36px */
  --fs-3xl: 3rem;
  /* 48px */
  --fs-hero: 4rem;
  /* 64px */

  /* --------------------------------------------------
     SPACING SCALE
  -------------------------------------------------- */
  --space-xs: 0.5rem;
  /* 8px */
  --space-sm: 1rem;
  /* 16px */
  --space-md: 1.5rem;
  /* 24px */
  --space-lg: 2.5rem;
  /* 40px */
  --space-xl: 5rem;
  /* 80px */

  /* --------------------------------------------------
     BORDER RADIUS
  -------------------------------------------------- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-full: 999px;

  /* --------------------------------------------------
     LAYOUT
  -------------------------------------------------- */

  --container-full-width: 1920px;
  --container-wide: 1440px;
  --conatiner-medium: 1280px;
  --container-narrow: 768px;
  --container-extra-narrow: 520px;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "IM Fell English", serif;
  font-size: 18px;
  line-height: 1.6;
  position: relative;
  overflow-x: hidden;
}

p {
  font-size: var(--fs-md-plus);
}
:root :where(.is-layout-constrained) > * {
  margin-top: 0;
}
/* paper grain overlay */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.05;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
h1,
h2,
h3,
.display {
  font-family: "Rye", serif;
  font-weight: 400;
  letter-spacing: 0.5px;
}
.eyebrow {
  font-family: "Cinzel", serif;
  font-weight: 600;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  font-size: 13px;
  color: var(--rust-dark);
}
.tag {
  font-family: "Special Elite", monospace;
  letter-spacing: 0.03em;
}

img,
svg {
  display: block;
  max-width: 100%;
}
.wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 32px;
}
.wrap-lg,
.woocommerce-notices-wrapper {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 32px;
}
section {
  position: relative;
}
::selection {
  background: var(--rust);
  color: var(--paper-light);
}
:focus-visible {
  outline: 3px solid var(--rust);
  outline-offset: 3px;
}

@font-face {
  font-family: "Urbanist";
  src:
    url("assets/fonts/Urbanist-Light.woff2") format("woff2"),
    url("assets/fonts/Urbanist-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Urbanist";
  src:
    url("assets/fonts/Urbanist-Medium.woff2") format("woff2"),
    url("assets/fonts/Urbanist-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Urbanist";
  src:
    url("assets/fonts/Urbanist-Bold.woff2") format("woff2"),
    url("assets/fonts/Urbanist-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Urbanist";
  src:
    url("assets/fonts/Urbanist-SemiBold.woff2") format("woff2"),
    url("assets/fonts/Urbanist-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Urbanist";
  src:
    url("assets/fonts/Urbanist-Regular.woff2") format("woff2"),
    url("assets/fonts/Urbanist-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Helvetica";
  src:
    url("assets/fonts/Helvetica-Light.woff2") format("woff2"),
    url("assets/fonts/Helvetica-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Helvetica";
  src:
    url("assets/fonts/Helvetica.woff2") format("woff2"),
    url("assets/fonts/Helvetica.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Helvetica";
  src:
    url("assets/fonts/Helvetica-Bold.woff2") format("woff2"),
    url("assets/fonts/Helvetica-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

/* ========================================================
   BASE RESET (Safe for Block Themes)
======================================================== */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  -webkit-font-smoothing: antialiased;
}
*:focus {
  outline: none !important;
  border: none !important;
  box-shadow: none !important;
  outline-offset: 0 !important;
}

.header-right {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end;
  gap: 20px !important;
}
.header-right > div:last-child {
  margin-top: 0;
}
.header-right button.wc-block-mini-cart__button span.wc-block-mini-cart__badge {
  background: var(--color-accent) !important;
  color: var(--color-primary) !important;
}
.menu-item-account {
  display: none;
}

.menu-item-login {
  display: block;
}

body.logged-in .menu-item-account {
  display: block;
}

body.logged-in .menu-item-login {
  display: none;
}
/* ========================================================
   TYPOGRAPHY
======================================================== */

:is(h1, h2, h3, h4, h5, h6) {
  line-height: 1.2;
  margin: 0 0 var(--space-sm);
}

h1 {
  font-size: var(--fs-hero);
}

h2 {
  font-size: var(--fs-3xl);
}

h3 {
  font-size: var(--fs-2xl);
}

h4 {
  font-size: var(--fs-xl);
}

h5 {
  font-size: var(--fs-lg);
}

h6 {
  font-size: var(--fs-md);
}

p {
  margin: 0 0 var(--space-sm);
}
body.wp-singular p {
  margin-bottom: 1rem;
}
/* ========================================================
   LINKS
======================================================== */

a {
  color: var(--ink);
  text-decoration: none;
  transition: opacity 0.2s ease;
}

a:hover {
  opacity: 0.8;
}

/* ========================================================
   MEDIA
======================================================== */

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

/* ========================================================
   ACF BLOCK HELPERS
======================================================== */
.container {
  width: 100%;
  margin: 0 auto;
}

.container-full {
  max-width: var(--container-full-width);
  margin-inline: auto;
  padding-inline: var(--space-md);
}

.container-wide {
  max-width: var(--container-wide);
  margin-inline: auto;
  padding-inline: var(--space-md);
}

.container-medium {
  max-width: var(--container-medium);
  margin-inline: auto;
  padding-inline: var(--space-md);
}

.container-narrow {
  max-width: var(--container-narrow);
  margin-inline: auto;
  padding-inline: var(--space-md);
}

.container-extra-narrow {
  max-width: var(--container-extra-narrow);
  margin-inline: auto;
  padding-inline: var(--space-md);
}
.wp-block-site-logo a {
  display: block !important;
}
.wp-block-site-logo img {
  max-width: 350px;
}

footer.site-footer {
  margin-block-start: 0;
}
/* Woocommerce CSS */
.woocommerce-account main .woocommerce {
  max-width: 1440px;
}
.woocommerce-breadcrumb a {
  margin-left: 5px;
}
.woocommerce-breadcrumb a:first-child {
  margin-left: 0;
}
body.single-product main p,
.woocommerce p {
  font-size: 18px;
}
.entry-content input,
.entry-content textarea,
.entry-content select {
  background: var(--paper-light) !important;
  border: 1px solid color-mix(in srgb, currentColor 20%, transparent) !important;
  padding: 10px;
}
.entry-content input[type="submit"] {
  background: var(--rust) !important;
  color: var(--paper-light);
  box-shadow: 0 4px 0 var(--rust-dark);
  font-family: "Cinzel", serif;
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 15px 30px;
  border-radius: 1px;
  display: inline-block;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.woocommerce .woocommerce-breadcrumb {
  font-size: 18px;
}
.woocommerce div.product form.cart .button,
button.wp-element-button,
button.add_to_cart_button,
.wp-element-button {
  background: var(--rust);
  color: var(--paper-light);
  box-shadow: 0 4px 0 var(--rust-dark);
  font-family: "Cinzel", serif;
  font-size: 13px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 15px 30px;
  border-radius: 1px;
  display: inline-block;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.wp-element-button:hover {
  box-shadow: 0 6px 0 var(--rust-dark);
  transform: translateY(-2px);
}
.wc-block-product-template__responsive > li,
.wc-block-product-template.is-flex-container > li {
  border: 1px solid var(--brass);
  display: flex;
  flex-direction: column;
  height: 100%;
}
.wc-block-components-product-price .woocommerce-Price-amount {
  font-size: var(--fs-xl);
  color: var(--rust-dark);
}

.wp-block-button.wc-block-components-product-button {
  margin-top: auto;
}

ul.wc-block-product-template {
  align-items: stretch !important;
}

ul.wc-block-product-template li.wc-block-product {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  padding-bottom: 20px;
}

ul.wc-block-product-template
  li.wc-block-product
  .wp-block-woocommerce-product-button {
  margin-top: auto !important;
}
body.woocommerce-page .wc-block-components-product-image img {
  height: auto;
  max-width: 100%;
  object-fit: contain !important;
  aspect-ratio: 1;
  max-height: 200px;
}
body.woocommerce-page .wc-block-components-product-image {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  text-decoration: none;
  max-height: 350px;
  overflow: hidden;
  object-fit: contain;
  aspect-ratio: 4 / 3;
  background: var(--color-white);
}
element.style {
  flex-basis: 512px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
}
.wc-block-product-filters__overlay-wrapper {
  width: 95%;
}
.wc-block-product-filter-checkbox-list__label {
  align-items: flex-start !important;
}
.woocommerce .woocommerce-ordering select {
  padding: 10px;
}
.wp-block-query-pagination-numbers > a,
.wp-block-query-pagination-numbers .wp-block-query-pagination-next,
.wp-block-query-pagination .wp-block-query-pagination-prev {
  background: var(--rust);
  color: var(--paper-light);
  box-shadow: 0 4px 0 var(--rust-dark);
  padding: 0 10px;
}
.wp-block-query-pagination-numbers > span.current {
  background: #9c6f5d;
  color: var(--paper-light);
  box-shadow: 0 4px 0 var(--rust-dark);
  padding: 0 10px;
}
.wp-block-woocommerce-checkout-order-summary-block
  .wc-block-components-product-name {
  font-size: 18px !important;
}
.wc-block-components-order-summary
  .wc-block-components-order-summary-item__description
  .wc-block-components-product-metadata,
.wc-block-components-order-summary
  .wc-block-components-order-summary-item__description
  p {
  line-height: 1.4;
  font-size: 18px !important;
}
.wc-block-components-formatted-money-amount {
  white-space: nowrap;
  font-size: 18px;
}
.wc-block-components-panel__button {
  font-size: 18px !important;
}
.wp-block-woocommerce-order-confirmation-billing-wrapper {
  margin-top: 20px;
}
.woocommerce div.product div.images .flex-control-thumbs {
  display: flex;
  column-gap: 5px;
  margin-top: 5px;
}
.woocommerce div.product div.images .flex-control-thumbs li img {
  border: 2px solid var(--rust);
}

.wp-block-search__inside-wrapper input:focus {
  border: 1px solid transparent !important;
  box-shadow: none !important;
  outline-offset: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation {
  float: left;
  width: 25%;
  border: 1px solid var(--wp--preset--color--brass) !important;
  padding: 16px;
  background: #f4ecd8;
}
.woocommerce-account .woocommerce-MyAccount-content {
  width: 72%;
}
.woocommerce-account .woocommerce-MyAccount-navigation li {
  border-bottom: 1px solid color-mix(in srgb, currentColor 20%, transparent);
  padding: 0.75rem 0;
}
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  font-size: var(--fs-lg);
}
.woocommerce-account .addresses .title .edit {
  float: left;
}
.woocommerce-account
  .woocommerce-orders-table__cell.woocommerce-orders-table__cell-order-actions
  a {
  display: inline-block;
  margin-bottom: 1em;
  text-align: center;
  padding: 5px 16px;
}

.wc-block-components-notice-banner
  > .wc-block-components-notice-banner__content
  .wc-forward {
  text-decoration-line: none;
}

.wc-block-cart-item__product p,
.wc-block-cart-item__product a {
  font-size: var(--fs-md) !important;
}
table.wc-block-cart-items
  .wc-block-cart-items__row
  .wc-block-cart-item__quantity
  .wc-block-cart-item__remove-link {
  background: var(--color-light-grey);
}
.editor-styles-wrapper
  table.wc-block-cart-items
  .wc-block-cart-items__row
  .wc-block-cart-item__quantity
  .wc-block-cart-item__remove-link
  svg,
table.wc-block-cart-items
  .wc-block-cart-items__row
  .wc-block-cart-item__quantity
  .wc-block-cart-item__remove-link
  svg {
  fill: var(--rust);
}
