/* =========================================================
   NovelGiftShop.com
   SP Easy Image Gallery Styling
   Helix Ultimate custom.css

   Safe version:
   - Does NOT affect Helix header
   - Does NOT affect footer
   - Does NOT affect menu
   - Soft background stays around gallery only
   - Image titles are hidden
   ========================================================= */


/* =========================================================
   1. Optional custom intro module above the gallery
   Only applies if your custom module uses:
   <div class="ngs-speasy-intro">
   ========================================================= */

/* ==================================================
   Tiny Liquor Cabinets
   SP Easy Image Gallery Header
   Deluxe 3D Emergency Break Glass Gallery
   ================================================== */

.tlc-break-glass-header {
  max-width: 1180px;
  margin: 0 auto 30px auto;
  padding: 28px 18px 0;
}

.tlc-break-glass-header .tlc-sp-gallery-header-inner {
  background: linear-gradient(135deg, #f8f8f6 0%, #f1eee9 45%, #e3d7cb 100%);
  border: 1px solid rgba(70, 60, 50, 0.18);
  border-radius: 22px;
  padding: 42px 30px;
  text-align: center;
  box-shadow: 0 10px 28px rgba(50, 40, 35, 0.12);
}

.tlc-break-glass-header .tlc-sp-gallery-eyebrow {
  margin: 0 0 10px;
  font-size: 0.85rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8a5a44;
  font-weight: 700;
}

.tlc-break-glass-header h1 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.1;
  color: #3b2a24;
  font-weight: 800;
}

.tlc-break-glass-header .tlc-sp-gallery-subtitle {
  max-width: 780px;
  margin: 0 auto 14px;
  font-size: 1.15rem;
  line-height: 1.6;
  color: #51413a;
}

.tlc-break-glass-header .tlc-sp-gallery-note {
  max-width: 760px;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1.5;
  color: #6f5b50;
}

/* Mobile adjustment */
@media (max-width: 700px) {
  .tlc-break-glass-header {
    padding: 20px 12px 0;
    margin-bottom: 22px;
  }

  .tlc-break-glass-header .tlc-sp-gallery-header-inner {
    padding: 30px 20px;
    border-radius: 18px;
  }

  .tlc-break-glass-header h1 {
    font-size: 2rem;
  }

  .tlc-break-glass-header .tlc-sp-gallery-subtitle {
    font-size: 1.03rem;
  }

  .tlc-break-glass-header .tlc-sp-gallery-note {
    font-size: 0.95rem;
  }
}


/* =========================================================
   2. SP Easy Image Gallery soft background
   Gallery area ONLY
   This keeps the cream color out of the header/footer/menu
   ========================================================= */

.speasyimagegallery-gallery,
.speasyimagegallery-albums {
  display: flow-root !important;
  clear: both !important;
  width: 100% !important;
  max-width: 1180px !important;
  box-sizing: border-box !important;

  background-color: #efe6d8 !important;
  margin: 30px auto 45px auto !important;
  padding: 36px 26px 42px 26px !important;
  border-radius: 22px !important;

  box-shadow:
    inset 0 0 0 1px rgba(74, 45, 26, 0.12),
    0 8px 22px rgba(43, 33, 24, 0.08) !important;
}


/* Make sure inner gallery rows do not cover the cream background */

.speasyimagegallery-gallery > *,
.speasyimagegallery-albums > * {
  background-color: transparent !important;
}


/* =========================================================
   3. Gallery thumbnail cards
   ========================================================= */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item,
.speasyimagegallery-albums .speasyimagegallery-album {
  background-color: #ffffff !important;
  border: 1px solid rgba(74, 45, 26, 0.18) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 24px rgba(43, 33, 24, 0.14) !important;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease !important;
}


/* Inner wrappers only inside SP Easy Image Gallery cards */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item > div,
.speasyimagegallery-albums .speasyimagegallery-album > div {
  background-color: #ffffff !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}


/* =========================================================
   4. Gallery hover effect
   ========================================================= */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item:hover,
.speasyimagegallery-albums .speasyimagegallery-album:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 14px 34px rgba(43, 33, 24, 0.22) !important;
  border-color: rgba(122, 74, 40, 0.38) !important;
}


/* =========================================================
   5. Gallery images
   ========================================================= */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item img,
.speasyimagegallery-albums .speasyimagegallery-album img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 16px !important;
  transition: transform 0.3s ease !important;
}


/* Slight image zoom on hover */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item:hover img,
.speasyimagegallery-albums .speasyimagegallery-album:hover img {
  transform: scale(1.03) !important;
}


/* =========================================================
   6. Remove image titles and dark title overlays
   ========================================================= */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item-title,
.speasyimagegallery-albums .speasyimagegallery-album-title {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}


/* Hide the title/caption overlay box */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item-content,
.speasyimagegallery-albums .speasyimagegallery-album-content {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
}


/* Remove extra dark overlay/shading */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item > div::after,
.speasyimagegallery-albums .speasyimagegallery-album > div::after {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: transparent !important;
}


/* =========================================================
   7. Gallery links only
   ========================================================= */

.speasyimagegallery-gallery .speasyimagegallery-gallery-item a,
.speasyimagegallery-albums .speasyimagegallery-album a {
  color: inherit !important;
  text-decoration: none !important;
}

.speasyimagegallery-gallery .speasyimagegallery-gallery-item a:hover,
.speasyimagegallery-albums .speasyimagegallery-album a:hover {
  color: inherit !important;
  text-decoration: none !important;
}


/* =========================================================
   8. Mobile styling
   ========================================================= */

@media (max-width: 768px) {
  .ngs-speasy-intro {
    margin: 16px auto 24px auto !important;
    padding: 24px 18px !important;
    border-radius: 16px !important;
  }

  .ngs-speasy-intro h2 {
    font-size: 28px !important;
  }

  .ngs-speasy-intro p {
    font-size: 16px !important;
  }

  .speasyimagegallery-gallery,
  .speasyimagegallery-albums {
    margin-top: 20px !important;
    margin-bottom: 30px !important;
    padding: 24px 14px 30px 14px !important;
    border-radius: 16px !important;
  }

  .speasyimagegallery-gallery .speasyimagegallery-gallery-item,
  .speasyimagegallery-albums .speasyimagegallery-album {
    border-radius: 14px !important;
    margin-bottom: 18px !important;
  }

  .speasyimagegallery-gallery .speasyimagegallery-gallery-item > div,
  .speasyimagegallery-albums .speasyimagegallery-album > div,
  .speasyimagegallery-gallery .speasyimagegallery-gallery-item img,
  .speasyimagegallery-albums .speasyimagegallery-album img {
    border-radius: 14px !important;
  }
}

/* =========================================================
   NovelGiftShop.com
   SP Easy Image Gallery Styling
   Helix Ultimate custom.css

   Novel Wine Gallery
   ========================================================= */

/* ==================================================
   Tiny Liquor Cabinets
   SP Easy Image Gallery Header
   Novel Wine Collection
   ================================================== */

.tlc-sp-gallery-header {
  max-width: 1180px;
  margin: 0 auto 30px auto;
  padding: 28px 18px 0;
}

.tlc-sp-gallery-header-inner {
  background: linear-gradient(135deg, #fbf7f0 0%, #f4e7dc 45%, #ead3c3 100%);
  border: 1px solid rgba(120, 72, 55, 0.2);
  border-radius: 22px;
  padding: 42px 30px;
  text-align: center;
  box-shadow: 0 10px 28px rgba(80, 48, 37, 0.12);
}

.tlc-sp-gallery-eyebrow {
  margin: 0 0 10px;
  font-size: 0.85rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8a5a44;
  font-weight: 700;
}

.tlc-sp-gallery-header h1 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.1;
  color: #4b1f2f;
  font-weight: 800;
}

.tlc-sp-gallery-subtitle {
  max-width: 780px;
  margin: 0 auto 14px;
  font-size: 1.15rem;
  line-height: 1.6;
  color: #5e3b33;
}

.tlc-sp-gallery-note {
  max-width: 720px;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1.5;
  color: #765246;
}

/* Mobile adjustment */
@media (max-width: 700px) {
  .tlc-sp-gallery-header {
    padding: 20px 12px 0;
    margin-bottom: 22px;
  }

  .tlc-sp-gallery-header-inner {
    padding: 30px 20px;
    border-radius: 18px;
  }

  .tlc-sp-gallery-header h1 {
    font-size: 2rem;
  }

  .tlc-sp-gallery-subtitle {
    font-size: 1.03rem;
  }

  .tlc-sp-gallery-note {
    font-size: 0.95rem;
  }
}

/* =========================================================
   NovelGiftShop.com
   SP Easy Image Gallery Styling
   Helix Ultimate custom.css

   Novel Spirit Gallery
   ========================================================= */

/* ==================================================
   Novel Gift Shop
   SP Easy Image Gallery Header
   Novel Spirits Collection
   ================================================== */

.tlc-novel-spirits-header {
  max-width: 1180px;
  margin: 0 auto 30px auto;
  padding: 28px 18px 0;
}

.tlc-novel-spirits-header .tlc-sp-gallery-header-inner {
  background: linear-gradient(135deg, #fbf6ee 0%, #ead8c1 45%, #d8b58b 100%);
  border: 1px solid rgba(110, 68, 34, 0.22);
  border-radius: 22px;
  padding: 42px 30px;
  text-align: center;
  box-shadow: 0 10px 28px rgba(70, 42, 20, 0.13);
}

.tlc-novel-spirits-header .tlc-sp-gallery-eyebrow {
  margin: 0 0 10px;
  font-size: 0.85rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #8b5a2b;
  font-weight: 700;
}

.tlc-novel-spirits-header h1 {
  margin: 0 0 14px;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.1;
  color: #4a2512;
  font-weight: 800;
}

.tlc-novel-spirits-header .tlc-sp-gallery-subtitle {
  max-width: 780px;
  margin: 0 auto 14px;
  font-size: 1.15rem;
  line-height: 1.6;
  color: #5c3a25;
}

.tlc-novel-spirits-header .tlc-sp-gallery-note {
  max-width: 720px;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1.5;
  color: #76513a;
}

/* Mobile adjustment */
@media (max-width: 700px) {
  .tlc-novel-spirits-header {
    padding: 20px 12px 0;
    margin-bottom: 22px;
  }

  .tlc-novel-spirits-header .tlc-sp-gallery-header-inner {
    padding: 30px 20px;
    border-radius: 18px;
  }

  .tlc-novel-spirits-header h1 {
    font-size: 2rem;
  }

  .tlc-novel-spirits-header .tlc-sp-gallery-subtitle {
    font-size: 1.03rem;
  }

  .tlc-novel-spirits-header .tlc-sp-gallery-note {
    font-size: 0.95rem;
  }
}

/* ==================================================
   Novel Gift Shop
   Contacts Component
   Background color
   ================================================== */

/* Novel Gift Shop Contact page - Helix Ultimate */
body.com_contact.view-contact #sp-main-body {
  background-color: #f8f5ef !important;
  padding-top: 45px;
  padding-bottom: 45px;
}

/* Beige card around the actual contact component */
body.com_contact.view-contact #sp-component,
body.com_contact.view-contact .com-contact,
body.com_contact.view-contact .contact {
  background-color: #f8f5ef !important;
  padding: 34px;
  border-radius: 18px;
}

/* White form box inside the beige background */
body.com_contact.view-contact .contact-form,
body.com_contact.view-contact form#contact-form,
body.com_contact.view-contact fieldset {
  background-color: #ffffff;
  padding: 24px;
  border-radius: 14px;
  margin-top: 20px;
}

/* Input fields */
body.com_contact.view-contact input,
body.com_contact.view-contact textarea {
  background-color: #ffffff;
  border: 1px solid #d8cfc3;
  border-radius: 8px;
}

/* Send Email button */
body.com_contact.view-contact .btn-primary,
body.com_contact.view-contact button[type="submit"] {
  border-radius: 999px;
  padding: 10px 24px;
}


/* ==================================================
   Novel Gift Shop
   Privacy Policy
   Background color
   ================================================== */

