@charset "utf-8";
/*=================================================

store-locator.css
Date - 2025.12.23
msdia - screen
[Table of contents]

=================================================*/

:root {
  --sl-border: #e5e5e5;
  --sl-fg:#262626;
  --sl-muted: #666;
  --sl-link: #ff6600;
  --sl-bg-muted: #f5f5f5;
}

/* ===== Base ===== */

.sl-wrap {
  max-width: 900px;
  margin: 0 auto;
}

.sl-title {
  font-size: 3rem;
  font-weight: 900;
  color: rgba(38, 38, 38, 1.00);
  text-align: center;
  margin-bottom: 1rem;
}

.sl-meta {
  color: var(--sl-muted);
  font-size: 13px;
  margin-left: 8px;
}

/* ===== Filters =====
   - 支援 2~3 個 select
   - 桌機：同列平均
   - 手機：自動換行（一行一個）
*/
.sl-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}

.sl-select {
  flex: 1 1 220px;
  /* 最小寬度 220px，空間足夠就平均 */
  min-width: 0;
  /* 避免 flex overflow */
  padding: 10px;
  border-radius: 10px;
  border: 1px solid #ccc;
  background: #fff;
}

.sl-select:disabled {
  background-color: var(--sl-bg-muted);
  color: #999;
  cursor: not-allowed;
}

/* ===== List ===== */
.sl-list {
  border: 1px solid var(--sl-border);
  border-radius: 14px;
  overflow: hidden;
}

.sl-row {
  display: grid;
  grid-template-columns: 1.2fr 1.2fr 3fr 1.2fr;/* grid-template-columns: 1fr 1.2fr 2.5fr 1fr 1.2fr */
  gap: 10px;
  padding: 12px 14px;
  border-bottom: 1px solid #eee;
  align-items: center;
}

.sl-row:last-child {
  border-bottom: none;
}

.sl-row.sl-header {
  background: var(--sl-bg-muted);
  font-weight: 600;
  font-size: 14px;
}

/* Icons */
.sl-icon {
  margin-right: 6px;
  color: #555;
  width: 16px;
  text-align: center;
}

.sl-icon.phone {
  color: #24c7c5;
}

.sl-icon.map {
  color: #24c7c5;
}

.sl-icon.line {
  color: #24c7c5;
}

/* Links / Text */
.sl-a {
  color: var(--sl-fg);
  text-decoration: none;
}

.sl-a:hover {
  color: var(--sl-link);
  text-decoration: underline;
}

.sl-big {
  font-weight: 500;}

.sl-small {
  color: var(--sl-muted);
}

.sl-empty {
  padding: 16px;
  text-align: center;
  color: #777;
}

/* ===== Pager ===== */
.sl-pager {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  margin-top: 12px;
}

.sl-pager-left {
  color: #555;
  font-size: 13px;
}

.sl-pages {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.sl-btn {
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 10px;
  padding: 8px 10px;
  cursor: pointer;
  font-size: 13px;
  line-height: 1;
}

.sl-btn[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

.sl-btn.is-active {
  border-color: var(--sl-link);
  background: var(--sl-link);
  color: #fff;
  font-weight: 700;
}

/* ===== RWD ===== */

/* 平板以下：表格改卡片（單欄），header 隱藏 */
@media (max-width: 900px) {
  .sl-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .sl-row.sl-header {
    display: none;
  }
}

/* 手機：下拉一行一個、分頁更緊湊 */
@media (max-width: 640px) {
  .sl-filters {
    gap: 8px;
  }

  .sl-select {
    flex: 1 1 150px;/*flex: 1 1 100%;*/
  }

  .sl-pages {
    gap: 4px;
  }

  .sl-btn {
    padding: 6px 8px;
  }
}