﻿/* =========================================================
   過去紀錄列表頁
========================================================= */

.old-log-page{
    padding:28px 28px 34px;
}

.old-log-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    margin-bottom:18px;
}

.old-log-titlebox{
    min-width:0;
}

.old-log-kicker{
    display:inline-flex;
    align-items:center;
    height:22px;
    padding:0 10px;
    margin-bottom:8px;
    border-radius:999px;
    background:rgba(37,99,235,.10);
    border:1px solid rgba(37,99,235,.16);
    color:#1d4ed8;
    font-size:11px;
    font-weight:900;
    letter-spacing:.10em;
}

.old-log-titlebox h2{
    margin:0;
    color:#111827;
    font-size:23px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:.02em;
}

.old-log-titlebox p{
    margin:7px 0 0;
    color:#64748b;
    font-size:13px;
    font-weight:600;
    line-height:1.55;
}

.old-log-back{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:7px 13px;
    border-radius:12px;
    background:rgba(255,255,255,.62);
    border:1px solid rgba(255,255,255,.72);
    box-shadow:0 5px 14px rgba(15,23,42,.06), inset 0 1px 0 rgba(255,255,255,.78);
    color:#334155 !important;
    font-size:13px;
    font-weight:800;
    text-decoration:none !important;
    transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.old-log-back:hover{
    transform:translateY(-1px);
    background:rgba(255,255,255,.82);
    box-shadow:0 9px 20px rgba(15,23,42,.09), inset 0 1px 0 rgba(255,255,255,.88);
}

.old-log-search{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 14px;
    padding:12px;
    border-radius:18px;
    background:rgba(255,255,255,.50);
    border:1px solid rgba(255,255,255,.62);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.74);
}

.old-log-search label{
    flex:0 0 auto;
    color:#334155;
    font-size:13px;
    font-weight:900;
}

.old-log-search input[type="text"]{
    flex:1 1 auto;
    min-width:220px;
    height:34px;
    padding:7px 11px !important;
    border-radius:12px !important;
    background:rgba(248,251,255,.92) !important;
    font-size:13px;
}

.old-log-search button{
    flex:0 0 auto;
    height:34px;
    padding:0 16px;
    border-radius:12px;
    font-size:13px;
    font-weight:900;
}

.old-log-clear{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    height:34px;
    padding:0 12px;
    border-radius:12px;
    background:rgba(226,232,240,.72);
    color:#475569 !important;
    font-size:13px;
    font-weight:800;
    text-decoration:none !important;
}

.old-log-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:0 0 12px;
    color:#64748b;
    font-size:12px;
    font-weight:700;
}

.old-log-meta span{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:3px 9px;
    border-radius:999px;
    background:rgba(255,255,255,.54);
    border:1px solid rgba(255,255,255,.58);
}

.old-log-meta strong{
    color:#111827;
    padding:0 2px;
}

.old-log-table-wrap{
    overflow-x:auto;
    border-radius:18px;
    background:rgba(255,255,255,.48);
    border:1px solid rgba(255,255,255,.66);
    box-shadow:0 10px 28px rgba(15,23,42,.07), inset 0 1px 0 rgba(255,255,255,.76);
}

.old-log-table{
    width:100%;
    min-width:860px;
    margin:0;
    border-collapse:separate;
    border-spacing:0;
    background:transparent;
    box-shadow:none;
    border-radius:0;
    overflow:hidden;
    font-size:13px;
}

.old-log-table thead{
    background:linear-gradient(180deg, rgba(248,250,252,.96), rgba(226,232,240,.78));
}

.old-log-table th{
    padding:10px 8px;
    color:#334155;
    font-size:12px;
    font-weight:900;
    letter-spacing:.05em;
    text-align:center;
    white-space:nowrap;
    border-bottom:1px solid rgba(15,23,42,.10);
}

.old-log-table td{
    padding:8px 8px;
    vertical-align:middle;
    border-bottom:1px solid rgba(15,23,42,.055);
}

.old-log-table tbody tr:last-child td{
    border-bottom:0;
}

.old-log-row{
    background:rgba(255,255,255,.38);
    transition:background .16s ease, transform .16s ease, box-shadow .16s ease;
}

.old-log-row:nth-child(even){
    background:rgba(248,250,252,.46);
}

.old-log-row:hover{
    background:rgba(255,255,255,.78);
}

.old-log-row.is-dead-room{
    opacity:.68;
    filter:grayscale(.35);
}

.log-no{
    width:62px;
    color:#475569;
    text-align:right;
    font-variant-numeric:tabular-nums;
    font-weight:900;
}

.log-name{
    min-width:250px;
    text-align:left;
}

.log-room-link{
    display:inline-flex;
    align-items:center;
    max-width:360px;
    color:#1d4ed8 !important;
    font-size:14px;
    font-weight:900;
    text-decoration:none !important;
    vertical-align:middle;
}

.log-room-link:hover{
    color:#1e40af !important;
    text-decoration:underline !important;
}

.log-view-links{
    display:inline-flex;
    flex-wrap:wrap;
    gap:0px;
    margin-left:8px;
    vertical-align:middle;
}

.log-view-links a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:20px;
    height:22px;
    padding:0 2px;
    border-radius:999px;
    background:rgba(241,245,249,.82);
    border:1px solid rgba(148,163,184,.20);
    color:#475569 !important;
    font-size:11px;
    font-weight:900;
    line-height:1;
    text-decoration:none !important;
}

.log-view-links a:hover{
    background:rgba(219,234,254,.95);
    border-color:rgba(96,165,250,.30);
    color:#1d4ed8 !important;
}

.log-time{
    width:142px;
    color:#64748b;
    text-align:center;
    font-size:12px;
    font-weight:800;
    font-variant-numeric:tabular-nums;
    white-space:nowrap;
}

.log-count,
.log-win,
.log-option-cell{
    text-align:center;
    white-space:nowrap;
}

.log-count{
    width:54px;
}

.log-win{
    width:30px;
}

.log-option-cell{
    width:24px;
    padding-left:2px !important;
    padding-right:2px !important;
}

.log-icon{
    display:inline-block;
    vertical-align:-3px;
    image-rendering:auto;
}

.log-empty-dot{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:16px;
    height:16px;
    color:rgba(100,116,139,.32);
    font-size:16px;
    font-weight:900;
    line-height:1;
}

.log-text-muted{
    color:#94a3b8;
    font-weight:900;
}

.old-log-pager{
    text-align:center;
    color:#64748b;
    font-size:13px;
    font-weight:800;
}

.old-log-pager.top{
    margin:0 0 12px;
}

.old-log-pager.bottom{
    margin:14px 0 0;
}

.old-log-pager a,
.old-log-pager strong,
.old-log-pager span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:28px;
    height:28px;
    margin:2px;
    padding:0 8px;
    border-radius:10px;
    background:rgba(255,255,255,.56);
    border:1px solid rgba(255,255,255,.64);
    color:#475569 !important;
    font-size:12px;
    font-weight:900;
    text-decoration:none !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}

.old-log-pager a:hover{
    background:rgba(219,234,254,.92);
    border-color:rgba(96,165,250,.32);
    color:#1d4ed8 !important;
}

.old-log-empty{
    margin-top:12px;
    padding:22px 16px;
    border-radius:18px;
    background:rgba(255,255,255,.54);
    border:1px solid rgba(255,255,255,.66);
    color:#64748b;
    text-align:center;
    font-size:14px;
    font-weight:900;
}
