/* ===== a31 歷史開獎（位置交換：日期時間 ←→ 系列/輪次；防止號碼被擠出） ===== */

/* 容器 */
#tab-history { padding: 8px 0; }

/* 列表容器 */
#a31-history-list{
  max-height: calc(80vh - 200px);
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid rgba(255,255,255,0.1);
}

/* 單一卡片 */
#a31-history-list li{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;   /* 不拉開三欄距離 */
  gap: 8px;                      /* 固定左中距離 */
  padding: 10px 14px;
  margin: 8px 0;
  background: rgba(20,20,50,0.8);
  border-left: 4px solid #08f;
  border-radius: 6px;
  color: #ddd;
  font-family: monospace;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  transition: background 0.2s ease;
  min-width: 0;                  /* 讓子項可收縮 */
}

/* 左：日期/時間（兩行且不換行） */
#a31-history-list .ticket-info{
  order: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 0 0 auto;                /* 依內容寬 */
  min-width: 10ch;               /* 夠放 2025-08-27 */
}
#a31-history-list .ticket-date{
  font-weight: 700;
  font-size: .9em;
  color: #0ff;
  text-shadow: 0 0 4px rgba(0,255,255,.6);
  margin-bottom: 2px;
  white-space: nowrap;
}
#a31-history-list .ticket-time{
  font-size: .8em;
  color: #ffe;
  text-shadow:
    0 0 4px rgba(255,255,255,.8),
    0 0 8px rgba(255,50,150,.6),
    0 0 12px rgba(255,50,150,.4),
    0 0 16px rgba(255,200,200,.3);
  white-space: nowrap;
}

/* 中：系列/回合（可收縮，避免把右欄擠出） */
#a31-history-list .ticket-series{
  order: 1;
  flex: 1 1 0;                   /* ★ 允許收縮與伸展 */
  min-width: 0;                  /* ★ iOS/Safari 關鍵：可縮到 0 */
  line-height: 1.25;
  overflow: hidden;              /* 過窄時避免溢出推擠 */
}

/* 右：中獎號碼（含 No.；零間距、保證可見） */
#a31-history-list .ticket-code{
  order: 2;
  margin-left: auto !important;  /* 靠最右 */
  flex: 0 0 auto;                /* 不參與縮放 */
  min-width: max-content;        /* ★ 內容寬度優先，避免被壓縮 */
  font-size: 1.5em;
  font-weight: 700;
  color: #f0f;
  text-shadow: 0 0 8px #f0f;
  padding-left: 0 !important;    /* No. 與數字緊貼 */
  white-space: nowrap;
}
#a31-history-list .ticket-code::before{
  content: attr(data-label);
  color: #0ff;
  text-shadow: 0 0 4px #0ff;
  font-size: 1em;
  margin-right: 0 !important;    /* 零間距 */
  vertical-align: middle;
}

/* More 按鈕 */
#a31-more{ text-align:center; margin-top: 8px; }
#a31-more .a31-btn{
  background: transparent;
  border: 1px solid rgba(0,255,255,.6);
  padding: 6px 12px;
  border-radius: 8px;
  cursor: pointer;
}

/* 小螢幕微調 */
@media (max-width: 420px){
  #a31-history-list li{ gap: 6px; }
  #a31-history-list .ticket-code{ font-size: 1.35em; }
}
