/* General styling */
body {
  scroll-behavior: smooth;
  font-family: "Helvetica Neue", sans-serif;
}

.navbar-brand img {
  width: 80px;
  height: 80px;
}
.navbar-brand {
	font-size: 1.3rem;
	font-weight: bold;
}

.nav-link {
  margin-left: 1rem;
}

/* 手機尺寸調整 */
@media (max-width: 767.98px) {
  .navbar-brand img {
    width: 60px;
    height: 60px;
  }
  .navbar-brand {
    font-size: 1rem;
  }
}


.thumbnail{
	margin-top:150px;
	margin-bottom:25px;
}

.banner {
  background: linear-gradient(to right, #e0f7fa, #ffffff);
  border-left: 6px solid #007bff;
}


.text-shadow {
  text-shadow: 2px 2px 4px rgba(0,0,0,0.7);
}

.profile-pic {
  width: 180px;
  height: 180px;
  object-fit: cover;
  border: 4px solid #fff;
}

/* Scroll section for products and blogs */
.scroll-container {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 1rem;
  scroll-behavior: smooth;
}

.scroll-container::-webkit-scrollbar {
  display: none;
}

.scroll-item {
  flex: 0 0 auto;
  width: 300px;
  margin-right: 1rem;
  scroll-snap-align: start;
}

/* Arrow button */
.arrow-btn {
  cursor: pointer;
  font-size: 1.5rem;
  margin: 0 1rem;
  user-select: none;
  transition: transform 0.2s ease;
}

.arrow-btn:hover {
  transform: scale(1.2);
}

/* Section spacing */
section {
  padding-top: 60px;
  padding-bottom: 60px;
}

/* Card overrides (optional) */
.card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.btn-primary:hover{
  background-color: #0a58ca;
  transform: scale(1.05);
  transition: all 0.3s ease;
}

.btn-secondary:hover {
  background-color: #6c757d;
  transform: scale(1.05);
  transition: all 0.3s ease;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .scroll-item {
    width: 80%;
  }

  .arrow-btn {
    display: none;
  }
}