.new-price-label { display: inline-block; margin-right: .35em; color: #c62127 !important; font-size: .78em; font-weight: 800; line-height: 1.25; white-space: nowrap; vertical-align: .05em; }
.new-price-label[hidden], [data-price-notice-count][hidden] { display: none !important; }
.price-notice-entry { display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid #d7e1e5; border-radius: 6px; padding: 8px 10px; background: #fff; color: #204959; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.price-notice-entry svg { width: 18px; height: 18px; }
[data-price-notice-count] { display: inline-block; min-width: 17px; padding: 1px 4px; border-radius: 20px; background: #c62127; color: white; font-size: 10px; line-height: 16px; text-align: center; }
.price-notice-dialog { width: min(960px, calc(100vw - 28px)); max-width: 960px; max-height: calc(100dvh - 32px); margin: auto; padding: 0; border: 0; border-radius: 12px; color: #243943; background: #fff; box-shadow: 0 18px 65px #122a4140; }
.price-notice-dialog[open] { display: flex; flex-direction: column; }
.price-notice-dialog::backdrop { background: #14293788; }
.price-notice-heading { display: flex; justify-content: space-between; gap: 10px; padding: 18px 22px 12px; background: #f3f7f8; flex: 0 0 auto; }
.price-notice-heading h2 { margin: 0; font-size: 21px; }
.price-notice-heading p { margin: 5px 0 0; color: #5b6d76; font-size: 13px; }
.price-notice-dialog button { font: inherit; cursor: pointer; }
.price-notice-heading > button { width: 40px; height: 40px; border: 0; border-radius: 7px; background: #e4ecef; font-size: 25px; }
.price-notice-tabs { display: flex; gap: 8px; padding: 12px 22px 0; }
.price-notice-tabs button, .price-notice-toolbar button, .price-notice-pagination button, .price-notice-dialog footer button { min-height: 40px; padding: 8px 16px; border: 1px solid #d5e0e4; border-radius: 6px; background: white; color: #264653; }
.price-notice-tabs button[aria-pressed="true"] { background: #194f65; color: white; border-color: #194f65; }
.price-notice-history-mode { display: flex; gap: 8px; padding: 10px 22px 0; }
.price-notice-history-mode[hidden] { display: none; }
.price-notice-history-mode button { min-height: 36px; padding: 6px 12px; border: 1px solid #d5e0e4; border-radius: 6px; background: white; color: #264653; }
.price-notice-history-mode button[aria-pressed="true"] { background: #e4eff3; border-color: #194f65; font-weight: 700; }
.price-notice-dialog td small { display: block; margin-top: 5px; font-size: 11px; font-weight: 400; line-height: 1.4; color: #627882; white-space: normal; }
.price-notice-toolbar { display: flex; gap: 12px; align-items: end; padding: 12px 22px 0; }
.price-notice-toolbar label { display: grid; flex: 1; gap: 5px; font-size: 12px; }
.price-notice-toolbar input { width: 100%; min-width: 0; min-height: 40px; padding: 8px 10px; border: 1px solid #cbd8df; border-radius: 6px; font: inherit; font-size: 16px; }
.price-notice-status { margin: 10px 22px; color: #677b83; font-size: 12px; line-height: 1.6; }
.price-notice-status:empty { display: none; }
.price-notice-body { min-height: 120px; overflow: auto; overscroll-behavior: contain; padding: 12px 22px 16px; }
.price-notice-card { margin-bottom: 12px; border: 1px solid #d9e3e7; border-radius: 8px; overflow: hidden; }
.price-notice-card summary { padding: 14px; cursor: pointer; background: #f8fafb; }
.price-notice-card summary span { display: block; margin-top: 5px; font-size: 12px; color: #637984; }
.price-notice-table-wrap { overflow-x: auto; }
.price-notice-dialog table { width: 100%; border-collapse: collapse; font-size: 13px; }
.price-notice-dialog th, .price-notice-dialog td { padding: 11px 12px; text-align: left; border-bottom: 1px solid #e5ecef; vertical-align: top; }
.price-notice-dialog th { background: #f2f6f8; white-space: nowrap; font-weight: 700; }
.price-notice-dialog td:first-child { min-width: 120px; color: #627882; font-size: 12px; }
.price-notice-dialog td:nth-child(2) { min-width: 180px; overflow-wrap: anywhere; }
.price-notice-dialog td > span:not(.new-price-label) { display: block; margin-top: 5px; }
.price-notice-new { font-weight: 700; white-space: nowrap; }
.price-notice-value { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.price-notice-direction { display: inline-flex; flex: 0 0 auto; color: #c62127; }
.price-notice-direction svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.price-notice-dialog footer { padding: 12px 22px; border-top: 1px solid #e5ecef; text-align: right; }
.price-notice-empty { padding: 40px 10px; text-align: center; color: #697c85; }
.price-notice-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 14px; }
.price-notice-pagination button:disabled { opacity: .4; cursor: default; }
.bulletin-title button { border: 0; background: transparent; color: #194f65; font: inherit; cursor: pointer; }
@media (max-width: 700px) {
  .mobile-nav:has([data-price-notices]) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .price-notice-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 20px); }
  .price-notice-heading, .price-notice-dialog footer { padding: 12px; }
  .price-notice-tabs, .price-notice-toolbar, .price-notice-history-mode { padding: 10px 12px 0; }
  .price-notice-status { margin: 8px 12px; }
  .price-notice-body { padding: 10px 12px 12px; }
  .price-notice-entry { min-height: 40px; padding: 6px; font-size: 12px; }
  .price-notice-toolbar button { padding: 8px; white-space: nowrap; }
  .price-notice-table-wrap { overflow-x: visible; }
  .price-notice-dialog table, .price-notice-dialog tbody { display: block; width: 100%; }
  .price-notice-dialog thead { display: none; }
  .price-notice-dialog tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px 12px; border-bottom: 1px solid #e5ecef; }
  .price-notice-dialog td, .price-notice-dialog td:first-child, .price-notice-dialog td:nth-child(2) { min-width: 0; padding: 5px 0; border: 0; }
  .price-notice-dialog td::before { content: attr(data-label); display: block; margin-bottom: 4px; color: #687c85; font-size: 11px; font-weight: 400; }
  .price-notice-dialog td[data-label="貨品"] { order: 0; grid-column: 1 / -1; font-size: 14px; }
  .price-notice-dialog td[data-label="貨品"]::before { display: none; }
  .price-notice-dialog td[data-label="價格變動日期"] { order: 1; grid-column: 1 / -1; }
  .price-notice-dialog td[data-label="價格變動日期"]::before { display: inline; margin-right: 6px; }
  .price-notice-dialog td[data-label="價目表"] { order: 2; grid-column: 1 / -1; }
  .price-notice-dialog td[data-label="價目表"]::before { display: inline; margin-right: 6px; }
  .price-notice-dialog td[data-label="比較基準價"] { order: 3; }
  .price-notice-dialog td.price-notice-old { order: 4; }
  .price-notice-dialog td.price-notice-new { order: 5; color: #c62127; }
  .price-notice-dialog td[data-label="單位"] { order: 6; grid-column: 1 / -1; }
  .price-notice-dialog td[data-label="單位"]::before { display: inline; margin-right: 6px; }
}

.price-notice-dialog .price-notice-suspended { color: #c62127; font-weight: 800; white-space: nowrap; }

.bulletin-categories { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 10px 22px 0; }
.bulletin-categories[hidden] { display: none; }
.bulletin-categories button { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #cad8df; border-radius: 8px; padding: 10px 12px; background: white; color: #244552; font: inherit; cursor: pointer; }
.bulletin-categories button[aria-pressed="true"] { background: #184f62; color: white; border-color: #184f62; }
.bulletin-category-count { border-radius: 20px; background: #c62127; color: white; font-size: 12px; padding: 1px 6px; }
.arrival-notice-list { list-style: none; padding: 0; margin: 0; }
.arrival-notice-list li { padding: 16px; border-top: 1px solid #e0e8ec; overflow-wrap: anywhere; }
.arrival-notice-list p { margin: 8px 0 0; line-height: 1.6; color: #235e42; }
@media(max-width: 480px) { .bulletin-categories { gap: 6px; padding-inline: 12px; } .bulletin-categories button { padding: 9px 8px; font-size: 14px; } }