/* MMO8386-MANAGED-FILE-V1 | assets/css/modules/audit-logs.css */
.audit-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;min-width:0}
.audit-toolbar>div{min-width:0}
.audit-filter-card{margin-bottom:14px;min-width:0}
.audit-filters{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:end;min-width:0}
.audit-filter-actions{display:flex;gap:8px;align-items:center;min-width:0}

.audit-table-wrap{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden;
  overflow-y:auto;
  border:1px solid #e5e5e5;
  border-radius:12px;
  background:#fff;
  box-sizing:border-box;
}
.audit-table{
  width:100%;
  max-width:100%;
  table-layout:fixed;
  border-collapse:collapse;
}
.audit-table th,.audit-table td{
  padding:11px 12px;
  border-bottom:1px solid #eee;
  text-align:left;
  font-size:12px;
  vertical-align:top;
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.audit-table th{background:#f8f8f8;color:#666;position:sticky;top:0;z-index:1}
.audit-table tr:last-child td{border-bottom:0}

/* Stable column proportions. Details receives most available width. */
.audit-table th:nth-child(1),.audit-table td:nth-child(1){width:16%}
.audit-table th:nth-child(2),.audit-table td:nth-child(2){width:16%}
.audit-table th:nth-child(3),.audit-table td:nth-child(3){width:19%}
.audit-table th:nth-child(4),.audit-table td:nth-child(4){width:43%}
.audit-table th:nth-child(5),.audit-table td:nth-child(5){width:6%}

.audit-user,.audit-meta,.audit-action-code,.audit-action{
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.audit-user strong,.audit-user small,.audit-action,.audit-action-code{display:block}
.audit-user small,.audit-action-code{margin-top:3px;color:#92979e;font-size:10px}
.audit-action{font-weight:700}
.audit-meta{
  line-height:1.5;
  color:#666;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.audit-time{white-space:normal}
.audit-id{white-space:normal;color:#999;overflow-wrap:anywhere}
.audit-pagination{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:12px;min-width:0;flex-wrap:wrap}
.audit-page-info{font-size:12px;color:#777}

html[data-theme="dark"] .audit-filter-card,
html[data-theme="dark"] .audit-table-wrap{
  background:#1a1d22!important;
  color:#f1f3f5!important;
  border-color:#30343b!important;
}
html[data-theme="dark"] .audit-table th{
  background:#20242a!important;
  color:#c9ced6!important;
  border-bottom-color:#30343b!important;
}
html[data-theme="dark"] .audit-table td{
  background:#1a1d22!important;
  color:#e8eaed!important;
  border-bottom-color:#30343b!important;
}
html[data-theme="dark"] .audit-table tbody tr:hover td{background:#20242a!important}
html[data-theme="dark"] .audit-user small,
html[data-theme="dark"] .audit-action-code,
html[data-theme="dark"] .audit-meta,
html[data-theme="dark"] .audit-id,
html[data-theme="dark"] .audit-page-info{color:#a6adb7!important}
html[data-theme="dark"] .audit-action{color:#f1f3f5!important}

@media(max-width:900px){
  .audit-filters{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .audit-filter-actions{grid-column:1/-1}
  .audit-table th,.audit-table td{padding:9px 8px;font-size:11px}
  .audit-table th:nth-child(1),.audit-table td:nth-child(1){width:17%}
  .audit-table th:nth-child(2),.audit-table td:nth-child(2){width:15%}
  .audit-table th:nth-child(3),.audit-table td:nth-child(3){width:18%}
  .audit-table th:nth-child(4),.audit-table td:nth-child(4){width:44%}
  .audit-table th:nth-child(5),.audit-table td:nth-child(5){width:6%}
}

@media(max-width:700px){
  /* On phones/tablets each log becomes a compact card. No horizontal table scroll. */
  .audit-table,.audit-table tbody,.audit-table tr,.audit-table td{display:block;width:100%;max-width:100%}
  .audit-table thead{display:none}
  .audit-table tbody{padding:8px}
  .audit-table tr{
    margin:0 0 10px;
    border:1px solid #e8e8e8;
    border-radius:10px;
    overflow:hidden;
    background:#fff;
  }
  .audit-table td{
    width:auto!important;
    border-bottom:1px solid #eee;
    padding:8px 10px 8px 104px;
    position:relative;
    min-height:34px;
    box-sizing:border-box;
  }
  .audit-table td:last-child{border-bottom:0}
  .audit-table td::before{
    position:absolute;
    left:10px;
    top:8px;
    width:84px;
    font-size:10px;
    font-weight:700;
    color:#777;
  }
  .audit-table td:nth-child(1)::before{content:"Thời gian"}
  .audit-table td:nth-child(2)::before{content:"Tài khoản"}
  .audit-table td:nth-child(3)::before{content:"Hành động"}
  .audit-table td:nth-child(4)::before{content:"Chi tiết"}
  .audit-table td:nth-child(5)::before{content:"ID"}
  .audit-meta{max-height:none}
  .audit-pagination{justify-content:space-between}
  html[data-theme="dark"] .audit-table tr{background:#1a1d22;border-color:#30343b}
  html[data-theme="dark"] .audit-table td::before{color:#a6adb7}
}

@media(max-width:620px){
  .audit-toolbar{align-items:flex-start;flex-direction:column}
  .audit-filters{grid-template-columns:minmax(0,1fr)}
  .audit-filter-actions{grid-column:auto;flex-wrap:wrap}
  .audit-pagination{justify-content:space-between}
}

@media(max-width:420px){
  .audit-table tbody{padding:6px}
  .audit-table td{padding-left:88px}
  .audit-table td::before{width:70px}
}
