/* ===== Browse (table style) ===== */
:root{
  --blue:#3396D3; --gray:#EEEEEE; --white:#FFFFFF; --ink:#000;
  --r:12px;
  --shadow:0 10px 30px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.06);
  --border:1px solid #EEEEEE;
}

.browse-wrap{max-width:1100px;margin:18px auto 48px;padding:0 16px;color:var(--ink);}
.browse-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px;}
.browse-title{margin:0;font-weight:900;font-size:clamp(1.25rem,1rem+1vw,1.8rem);}
.browse-sub{margin:2px 0 0;color:#444;}

.tools{display:flex;gap:8px;flex-wrap:wrap}
.input,.select{
  background:var(--gray);
  border:1px solid #EEEEEE;
  color:var(--ink);
  border-radius:10px;
  padding:.6rem .8rem;
  font:inherit;
  outline:none;
  transition:box-shadow .15s ease, transform .08s ease, background-color .15s ease;
}
/* subtle black stroke ONLY for search & filter controls */
.tools .input,
.tools .select{
  background:#FFFFFF;
  border:1px solid #000000;
}
.input:hover,.select:hover{transform:translateY(-1px)}
.input:focus,.select:focus{background:#fff;box-shadow:0 0 0 3px rgba(51,150,211,.25)}

.alert-success{
  background:#fff;border:var(--border);border-left:5px solid var(--blue);
  padding:.7rem 1rem;border-radius:10px;margin:8px 0 12px
}

.table-card{background:#fff;border:var(--border);border-radius:12px;box-shadow:var(--shadow);overflow:hidden}
.table-scroll{overflow:auto}
.data-table{border-collapse:separate;border-spacing:0;width:100%;min-width:900px}
.data-table thead th{
  position:sticky;top:0;background:#fff;border-bottom:2px solid #EEE;text-align:left;
  padding:12px 14px;font-weight:900
}
.data-table tbody td{border-top:1px solid #EEE;padding:12px 14px;vertical-align:top}
.data-table tbody tr:hover{background:#FDFDFD}

.title-cell{position:relative;padding-left:36px!important}
.row-toggle{
  position:absolute;left:10px;top:16px;width:16px;height:16px;background:#fff;cursor:pointer;
  border:2px solid var(--blue);border-radius:3px;padding:0
}
.row-toggle::after{
  content:"";display:block;width:6px;height:6px;margin:3px auto 0;border:2px solid var(--blue);
  border-top:0;border-left:0;transform:rotate(45deg) translateY(-1px)
}
.row-toggle[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(1px)}
.row-details{margin-top:8px;border-top:1px solid #EEE;padding-top:8px;color:#333}

.badge{display:inline-flex;align-items:center;background:#EEE;color:#000;border-radius:999px;padding:.22rem .55rem;font-weight:800;font-size:.9rem}
.cell-meta{display:flex;flex-wrap:wrap;gap:6px 10px;color:#333}
.emph{font-weight:800}

.btn-link{color:var(--blue);text-decoration:none;font-weight:900}
.btn-link:hover{text-decoration:underline;text-underline-offset:3px}

.empty{margin:16px 0 0;color:#444}

/* mobile dense */
@media (max-width:700px){
  .data-table{min-width:100%}
  .cell-meta span{white-space:nowrap}
}