/* NYC Ferry custom store styling
   Target: https://nyc-ferry.tri-pod.com/
   Prepared for Tri-POD custom CSS injection.
*/

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;600;700;900&display=swap');

:root {
  --nyc-ferry-blue: #0092E3;
  --nyc-ferry-text: #212529;
}

/* 1) Global font */
html,
body,
button,
input,
select,
textarea,
.main,
.header,
.footer {
  font-family: 'Lato', sans-serif !important;
}

/* 2a) Homepage nav bar */
.header .header-middle .container,
.header .header-left {
  display: flex;
  align-items: center;
}

.header .header-left {
  flex: 1 1 auto;
}

.header .main-nav {
  margin-left: auto !important;
}

.header .main-nav .menu {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-left: auto;
}

.header .main-nav .menu > li > a {
  color: var(--nyc-ferry-text) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding: 50px 20px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}

.header .main-nav .menu > li.active > a,
.header .main-nav .menu > li.show > a,
.header .main-nav .menu > li:hover > a {
  color: var(--nyc-ferry-blue) !important;
}

/* 2b) Homepage webslide / hero */
.home-slider,
.home-slide,
.home-slide.banner,
.home-slide .slide-bg,
.banner.home-slide {
  min-height: 500px !important;
  height: 500px !important;
}

.home-slide img,
.home-slide .slide-bg img,
.home-slider img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
}

/* 2c) Header/title styling */
.page-header h1,
.page-header .page-title,
.home-slide h1,
.home-slide h2,
.home-slide .slide-title,
.section-title,
.heading-title,
.main h1.product-title {
  color: var(--nyc-ferry-blue) !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  letter-spacing: 0.25px !important;
  text-transform: none !important;
}

/* 2d) Homepage product cards */
.product-default figure img,
.product-item figure img {
  display: block;
  width: 80% !important;
  max-width: 80% !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  object-fit: contain;
}

.product-default .product-title,
.product-default .product-title a,
.product-item .product-title,
.product-item .product-title a {
  color: var(--nyc-ferry-text) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

/* 2e) Product price */
.product-default .price-box,
.product-default .product-price,
.product-item .price-box,
.product-item .product-price {
  color: var(--nyc-ferry-text) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
}

/* 2f) Quick View always visible */
.product-default .btn-quickview,
.inner-quickview figure .btn-quickview {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  color: var(--nyc-ferry-text) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  line-height: 1.2 !important;
}

/* Keep Quick View readable over product imagery. */
.inner-quickview figure .btn-quickview {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(33, 37, 41, 0.18) !important;
}

/* 2g) Footer / background graphic */
.footer {
  background-color: #0095d9 !important;
}

.footer,
.footer p,
.footer a,
.footer li,
.footer label,
.footer .widget-title,
.footer .contact-info,
.footer .links,
.footer .widget-newsletter,
.footer .footer-middle {
  color: #fff !important;
  font-size: 14px !important;
  text-transform: none !important;
}

.footer .widget-title,
.footer h4 {
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  margin-bottom: 12px !important;
  text-transform: none !important;
}

.footer a:hover {
  color: #fff !important;
  opacity: 0.85;
}

.footer .form-control,
.footer input[type="email"] {
  background-color: #fff !important;
  color: var(--nyc-ferry-text) !important;
}

.footer .form-control::placeholder,
.footer input[type="email"]::placeholder {
  color: #6c757d !important;
}

/* 3a) Product detail text: remove uppercase transformations */
.product-single-details,
.product-single-details *,
.product-single-tabs,
.product-single-tabs *,
.product-desc-content,
.product-desc-content *,
.tab-content,
.tab-content * {
  text-transform: none !important;
}

/* 3b) Product thumbnails: move from bottom to top-left of product media */
.product-single-gallery {
  position: relative;
}

@media (min-width: 768px) {
  .product-single-gallery {
    display: flex;
    align-items: flex-start;
    gap: 16px;
  }

  .product-single-gallery .prod-thumbnail {
    order: -1;
    flex: 0 0 74px;
    width: 74px !important;
    max-width: 74px !important;
    margin: 0 !important;
  }

  .product-single-gallery .product-slider-container {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
  }

  .product-single-gallery .prod-thumbnail .owl-stage-outer,
  .product-single-gallery .prod-thumbnail .owl-stage {
    width: 74px !important;
    height: auto !important;
    transform: none !important;
  }

  .product-single-gallery .prod-thumbnail .owl-stage {
    display: flex;
    flex-direction: column;
  }

  .product-single-gallery .prod-thumbnail .owl-item {
    width: 74px !important;
    margin-right: 0 !important;
    margin-bottom: 8px !important;
  }

  .product-single-gallery .prod-thumbnail .owl-dot,
  .product-single-gallery .prod-thumbnail img {
    width: 74px !important;
    height: 74px !important;
    object-fit: cover;
  }
}

/* 3c) Breadcrumb */
.breadcrumb,
.breadcrumb-nav,
.breadcrumb-item,
.breadcrumb-item a,
.breadcrumb-item.active {
  color: var(--nyc-ferry-blue) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-transform: none !important;
}

.breadcrumb-item,
.breadcrumb-item + .breadcrumb-item,
.breadcrumb-item + .breadcrumb-item::before,
.breadcrumb-item a:not(:first-child) {
  margin-right: 5px !important;
}

/* 3d) Product detail hero */
body:not(.home) .page-header,
.product-single-container .page-header,
.product-detail-hero,
.product-hero {
  min-height: 300px !important;
  height: 300px !important;
}

body:not(.home) .page-header h1,
body:not(.home) .page-header .page-title,
.product-detail-hero h1,
.product-hero h1,
.product-single-details .product-title {
  font-size: 30px !important;
  font-weight: 900 !important;
  letter-spacing: 0.25px !important;
}

/* Product detail page title: requested display case */
.product-single-details .product-title {
  text-transform: capitalize !important;
}

/* Mobile guardrails */
@media (max-width: 767.98px) {
  .header .main-nav .menu > li > a {
    padding: 16px 20px !important;
  }

  .home-slider,
  .home-slide,
  .home-slide.banner,
  .home-slide .slide-bg,
  .banner.home-slide {
    min-height: 360px !important;
    height: 360px !important;
  }
}