/* ==== Collections: birthstones, stone listings, collection grids ====
   Markup from includes/sections/collections.php ([gf_birthstone_jewellery],
   [gf_stone_listing], [gf_collection_products]) and the birthstone tiles on
   /jewellery-knowledge-centre/birthstones/ (class gft-bs-tile). */

.gft-stones { --gcol-gold: #A8802D; --gcol-ink: #23201A; --gcol-line: #EDE3CE; --gcol-cream: #FBF7EF; }

/* the twelve months */
.gft-stone-nav { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 0 0 30px; }
.gft-stone-chip { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 8px 12px; background: #fff; border: 1px solid var(--gcol-line); text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.gft-stone-chip img { width: 100%; height: auto; aspect-ratio: 250 / 155; object-fit: contain; margin: 0 0 6px; }
.gft-stone-chip:hover, .gft-stone-chip:focus-visible { border-color: var(--gcol-gold); transform: translateY(-2px); }
.gft-stone-chip.is-on { border-color: var(--gcol-gold); box-shadow: inset 0 0 0 1px var(--gcol-gold); background: var(--gcol-cream); }
.gft-stone-month { font-family: "Cormorant Garamond", serif; font-size: 19px; font-weight: 600; line-height: 1.2; color: var(--gcol-ink); }
.gft-stone-name { font-family: "Jost", sans-serif; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--gcol-gold); }
@media (max-width: 1024px) { .gft-stone-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 600px) { .gft-stone-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; } .gft-stone-month { font-size: 16px; } .gft-stone-name { font-size: 10.5px; letter-spacing: .06em; } }

/* a stone filter row */
.gft-stone-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 22px; }
.gft-stone-filter a { padding: 7px 14px; border: 1px solid var(--gcol-line); background: #fff; font-family: "Jost", sans-serif; font-size: 13px; color: var(--gcol-ink); text-decoration: none; }
.gft-stone-filter a:hover, .gft-stone-filter a.is-on { border-color: var(--gcol-gold); color: var(--gcol-gold); }

/* group headings and notes */
.gft-stone-list, .gft-col-group { scroll-margin-top: 120px; }
.gft-col-group + .gft-col-group, .gft-col-group + .gft-col-empty, .gft-col-empty + .gft-col-group { margin-top: 34px; }
.gft-col-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 18px; margin: 0 0 16px; padding: 0 0 10px; border-bottom: 1px solid var(--gcol-line, #EDE3CE); }
.gft-col-head h2 { margin: 0; font-family: "Cormorant Garamond", serif; font-size: 26px; font-weight: 600; line-height: 1.25; color: #23201A; }
.gft-col-all { font-family: "Jost", sans-serif; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: #A8802D; text-decoration: none; }
.gft-col-all:hover { color: #23201A; }
.gft-col-empty { padding: 22px 24px; background: #FBF7EF; border: 1px solid #EDE3CE; font-family: "Jost", sans-serif; font-size: 15px; line-height: 1.7; color: #5A554B; }
.gft-col-empty p { margin: 0 0 10px; }
.gft-col-empty p:last-child { margin-bottom: 0; }
.gft-col-empty a:not(.gft-col-btn) { color: #A8802D; }
.gft-col-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding-top: 4px; }
.gft-col-btn { display: inline-block; padding: 11px 22px; background: #1A1A1A; border: 1px solid #1A1A1A; color: #fff; font-family: "Jost", sans-serif; font-size: 12.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; transition: background-color .2s ease, border-color .2s ease; }
.gft-col-btn:hover, .gft-col-btn:focus { background: #C6A44E; border-color: #C6A44E; color: #fff; }
.gft-col-btn.gft-col-btn-alt { background: transparent; border-color: #C6A44E; color: #A8802D; }
.gft-col-btn.gft-col-btn-alt:hover, .gft-col-btn.gft-col-btn-alt:focus { background: #A8802D; border-color: #A8802D; color: #fff; }
.gft-col-tel { font-family: "Jost", sans-serif; font-size: 14px; color: #A8802D; text-decoration: none; }
@media (max-width: 600px) { .gft-col-head h2 { font-size: 22px; } .gft-col-empty { padding: 18px 16px; } }

/* birthstone tiles built in Elementor on the Birthstones guide */
.gft-bs-tile img { width: 100%; height: auto; aspect-ratio: 250 / 155; object-fit: contain; }
.gft-bs-tile { transition: border-color .2s ease, transform .2s ease; }
.gft-bs-tile:hover { border-color: #A8802D !important; transform: translateY(-2px); }

/* auction alerts tick box on the register and account details forms */
.gft-auction-optin { margin: 4px 0 14px; }
.gft-auction-optin label { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; line-height: 1.5; }
.gft-auction-optin input[type="checkbox"] { margin-top: 3px; }