.elementor-7936 .elementor-element.elementor-element-aeffa6b{--display:flex;}.elementor-7936 .elementor-element.elementor-element-ee11ed2{--spacer-size:0.1rem;}.elementor-7936 .elementor-element.elementor-element-9927630{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;}.elementor-7936 .elementor-element.elementor-element-15dd3af{column-gap:0px;text-align:center;}.elementor-7936 .elementor-element.elementor-element-51bf24c{--display:flex;}.elementor-7936 .elementor-element.elementor-element-7f6deeb{--spacer-size:0.1rem;}.elementor-7936 .elementor-element.elementor-element-7db81ee{--display:flex;}.elementor-7936 .elementor-element.elementor-element-7645501:hover .elementor-widget-container{box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-7936 .elementor-element.elementor-element-a72d3a3{--display:flex;}.elementor-7936 .elementor-element.elementor-element-e57f366 > .elementor-widget-container{margin:0rem 2rem -1rem 1rem;padding:0rem 0rem 0rem 0rem;}.elementor-7936 .elementor-element.elementor-element-5290d23{--display:flex;}.elementor-7936 .elementor-element.elementor-element-5290d23.e-con{--flex-grow:1;--flex-shrink:1;}.elementor-7936 .elementor-element.elementor-element-6f358b7{--display:flex;}.elementor-7936 .elementor-element.elementor-element-33a2da9{--display:flex;}.elementor-7936 .elementor-element.elementor-element-7f02e9c > .elementor-widget-container{margin:0rem 2rem -1rem 1rem;padding:0rem 0rem 0rem 0rem;}.elementor-7936 .elementor-element.elementor-element-3b6d9c4{--display:flex;}.elementor-7936 .elementor-element.elementor-element-4b93f2ac{--display:flex;}.elementor-7936 .elementor-element.elementor-element-35e630ef > .elementor-widget-container{margin:0rem 2rem -1rem 1rem;padding:0rem 0rem 0rem 0rem;}.elementor-7936 .elementor-element.elementor-element-99bc639{--display:flex;}.elementor-7936 .elementor-element.elementor-element-59fca4cf{--display:flex;}.elementor-7936 .elementor-element.elementor-element-676f4a51 > .elementor-widget-container{margin:0rem 2rem -1rem 1rem;padding:0rem 0rem 0rem 0rem;}.elementor-7936 .elementor-element.elementor-element-f7dd2de{--display:flex;}@media(max-width:1024px){.elementor-7936 .elementor-element.elementor-element-7645501 > .elementor-widget-container{margin:0rem 0rem 0rem 0rem;padding:0rem 0rem 0rem 0rem;}.elementor-7936 .elementor-element.elementor-element-7645501.elementor-element{--align-self:center;}.elementor-7936 .elementor-element.elementor-element-7645501{text-align:center;font-size:0.1rem;word-spacing:0em;}}@media(min-width:768px){.elementor-7936 .elementor-element.elementor-element-9927630{--content-width:1600px;}}@media(max-width:1024px) and (min-width:768px){.elementor-7936 .elementor-element.elementor-element-51bf24c{--content-width:500px;}}@media(max-width:767px){.elementor-7936 .elementor-element.elementor-element-aeffa6b{--min-height:0.1rem;}.elementor-7936 .elementor-element.elementor-element-ee11ed2{--spacer-size:0.1rem;}.elementor-7936 .elementor-element.elementor-element-7f6deeb{--spacer-size:0.1rem;}.elementor-7936 .elementor-element.elementor-element-7645501 > .elementor-widget-container{margin:-1rem -1rem -1rem -1rem;padding:0rem 0rem 0rem 0rem;border-radius:0rem 0rem 0rem 0rem;}.elementor-7936 .elementor-element.elementor-element-7645501.elementor-element{--flex-grow:0;--flex-shrink:1;}.elementor-7936 .elementor-element.elementor-element-7645501{text-align:left;letter-spacing:0rem;word-spacing:0em;}.elementor-7936 .elementor-element.elementor-element-7645501 p{margin-bottom:0.1rem;}}/* Start custom CSS for text-editor, class: .elementor-element-7645501 *//* 全局粉金色變量 */
:root {
  --pink-gold: #e5b8a0;      /* 按鈕靜態時的粉金色 */
  --dark-text: #4a3833;      /* 按鈕靜態時的文字色 */
  --hover-gold: #f3e0b8;     /* 按鈕懸停時貓耳朵使用的顏色，與漸變中的主色調相符 */
  /* 新增一個變量來控制貓耳朵的靜態顏色 */
  --ear-color-static: var(--pink-gold); 
}

.product-poster {
  list-style: none;
  margin: 0;
  padding: 0;
}

.product-poster li {
  margin-bottom: 8px; 
}

.product-poster li a {
  display: block;
  padding: 8px 14px;
  text-decoration: none;
  color: #444;
  background: #ffffff;
  transition: background 0.25s ease, color 0.25s ease;
}

/* 滑鼠移上去：淺金色漸層 (適用於所有按鈕) */
.product-poster li a:hover {
  background: linear-gradient(135deg, #fff7d1, #f3e0b8);
  color: #5a4100;
}

/* 1. 【通用化】當前頁面按鈕 (.active) 的粉金色主體樣式 */
/* 這裡使用 .active 選擇器，它會覆蓋 li a 的樣式 */
.product-poster li a.active { 
  /* 按鈕主體樣式 */
  background-color: var(--pink-gold) !important; 
  color: var(--dark-text) !important;
  text-decoration: none;
  /* 移除 position: relative; 和 z-index: 1; 讓它只在 cat-ear-button 上出現 */
  border-radius: 8px;
  padding: 10px 20px;
  border: none;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  display: inline-block; 
  transition: background 0.25s ease, color 0.25s ease;
}

/* 2. 【通用化】貓耳朵結構和靜態樣式 (只應用於 cat-ear-button) */
.cat-ear-button {
  position: relative; /* 啟用偽元素的定位 */
  z-index: 1; /* 確保按鈕在耳朵之上 */
}

.cat-ear-button::before,
.cat-ear-button::after {
  content: '';
  position: absolute;
  top: -12px; 
  width: 0;
  height: 0;
  border-style: solid;
  z-index: 0; 
  transition: border-color 0.25s ease; 
}

/* 左耳的三角形形狀和定位 (通用化) */
.cat-ear-button::before {
  left: 8px;
  border-width: 0 12px 15px 12px; 
  /* 注意：這裡的顏色暫時設置為靜態粉金色，但它會被 .active 的樣式覆蓋 */
  border-color: transparent transparent var(--ear-color-static) transparent; 
  transform: rotate(-15deg); 
}

/* 右耳的三角形形狀和定位 (通用化) */
.cat-ear-button::after {
  right: 8px; 
  border-width: 0 12px 15px 12px; 
  border-color: transparent transparent var(--ear-color-static) transparent; 
  transform: rotate(15deg); 
}

/* 3. 【通用化】確保只有當前按鈕 (active) 才顯示粉金色的耳朵 */
.active.cat-ear-button::before,
.active.cat-ear-button::after {
    /* 靜態狀態下，耳朵顏色使用粉金色 */
    border-color: transparent transparent var(--pink-gold) transparent; 
}

/* 4. 【通用化】當前按鈕懸停效果：按鈕變色與貓耳朵變色！ */
.active.cat-ear-button:hover {
  /* 按鈕主體保持您現有的 hover 樣式 */
  background: linear-gradient(135deg, #fff7d1, #f3e0b8) !important; 
  color: #5a4100 !important;
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15); 
}

/* 貓耳朵懸停時的顏色變化 */
.active.cat-ear-button:hover::before,
.active.cat-ear-button:hover::after {
  /* 改變底部的邊框顏色，使其與按鈕的 hover 金色 (var(--hover-gold)) 一致 */
  border-color: transparent transparent var(--hover-gold) transparent; 
}/* End custom CSS */