/* Sandeal Public APIs Panel — modern, professional */

/* ── Stats row ── */
.apis-stats{
  display:flex;
  align-items:stretch;
  gap:0;
  padding:18px 20px;
  background:var(--bg-glass);
  border:1px solid var(--border-glass);
  border-radius:16px;
  box-shadow:var(--shadow-card)
}
.apis-stat{
  flex:1;
  text-align:center;
  padding:4px 12px
}
.apis-stat-val{
  font-family:'Space Grotesk',sans-serif;
  font-size:1.5rem;
  font-weight:800;
  letter-spacing:-.5px;
  color:var(--accent-blue);
  line-height:1;
  font-variant-numeric:tabular-nums
}
.apis-stat-lbl{
  font-size:.7rem;
  font-weight:700;
  color:var(--text-tertiary);
  text-transform:uppercase;
  letter-spacing:.5px;
  margin-top:6px
}
.apis-stat-divider{
  width:1px;
  align-self:center;
  background:var(--border-glass);
  flex-shrink:0
}

/* ── Toolbar (search + filters) ── */
.apis-toolbar{
  display:flex;
  gap:10px;
  align-items:center;
  margin-bottom:14px;
  flex-wrap:wrap
}

.apis-search{
  flex:1;
  min-width:240px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  background:var(--bg-glass);
  border:1px solid var(--border-glass);
  border-radius:12px;
  transition:border-color .2s,box-shadow .2s
}
.apis-search:focus-within{
  border-color:rgba(232,93,42,.4);
  box-shadow:0 4px 20px rgba(232,93,42,.1)
}
.apis-search-icon{opacity:.6;font-size:.95rem;flex-shrink:0}
.apis-search input{
  flex:1;
  border:none;
  outline:none;
  background:transparent;
  font-family:'Inter',sans-serif;
  font-size:1rem;
  font-weight:600;
  color:var(--text-primary);
  min-width:0;
  padding:2px 0
}
.apis-search input::placeholder{color:var(--text-tertiary);font-weight:500}
.apis-clear{
  display:none;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border:none;
  background:rgba(0,0,0,.06);
  border-radius:50%;
  color:var(--text-secondary);
  font-size:.85rem;
  cursor:pointer;
  flex-shrink:0;
  transition:background .15s
}
.apis-clear:hover{background:rgba(0,0,0,.12);color:var(--text-primary)}

.apis-filters{
  display:flex;
  gap:8px;
  flex-shrink:0
}
.apis-select{
  padding:10px 32px 10px 14px;
  background:var(--bg-glass);
  border:1px solid var(--border-glass);
  border-radius:12px;
  font-family:'Inter',sans-serif;
  font-size:1rem;
  font-weight:600;
  color:var(--text-primary);
  cursor:pointer;
  outline:none;
  transition:border-color .2s;
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23666' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:10px
}
.apis-select:hover{border-color:rgba(0,0,0,.15)}
.apis-select:focus{border-color:var(--accent-orange)}

/* ── Auth segmented filter ── */
.apis-auth-filter{
  display:inline-flex;
  gap:2px;
  padding:4px;
  background:rgba(0,0,0,.04);
  border:1px solid var(--border-glass);
  border-radius:12px;
  margin-bottom:14px;
  flex-wrap:wrap
}
.apis-auth-btn{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:7px 14px;
  background:transparent;
  border:none;
  border-radius:8px;
  font-family:'Inter',sans-serif;
  font-size:.8rem;
  font-weight:700;
  color:var(--text-secondary);
  cursor:pointer;
  transition:all .15s;
  white-space:nowrap;
  -webkit-tap-highlight-color:transparent
}
.apis-auth-btn:hover{color:var(--text-primary)}
.apis-auth-btn.active{
  background:#fff;
  color:var(--accent-blue);
  box-shadow:0 1px 3px rgba(0,0,0,.08)
}

/* ── Card list ── */
.apis-list{
  display:flex;
  flex-direction:column;
  gap:8px
}

.apis-cat-header{
  font-size:.72rem;
  font-weight:800;
  color:var(--text-tertiary);
  text-transform:uppercase;
  letter-spacing:.8px;
  margin:14px 0 4px;
  padding-left:4px
}
.apis-cat-header:first-child{margin-top:0}

.apis-card{
  background:var(--bg-glass);
  border:1px solid var(--border-glass);
  border-radius:12px;
  transition:all .2s
}
.apis-card:hover{
  border-color:rgba(0,0,0,.15);
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.06)
}
.apis-card-body{padding:14px 16px}

.apis-card-name{
  font-size:.95rem;
  font-weight:800;
  color:var(--text-primary);
  letter-spacing:-.2px;
  margin-bottom:4px;
  line-height:1.3
}
.apis-card-desc{
  font-size:.82rem;
  color:var(--text-secondary);
  line-height:1.5;
  margin-bottom:10px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden
}

.apis-card-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap
}
.apis-card-url{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-family:'SF Mono','Monaco','Consolas',monospace;
  font-size:.72rem;
  font-weight:600;
  color:var(--accent-blue);
  text-decoration:none;
  min-width:0;
  flex:1;
  word-break:break-all
}
.apis-card-url:hover{text-decoration:underline}
.apis-card-url svg{opacity:.7;flex-shrink:0}

.apis-card-tags{
  display:flex;
  gap:4px;
  flex-shrink:0;
  flex-wrap:wrap
}
.apis-badge{
  display:inline-flex;
  align-items:center;
  padding:2px 8px;
  font-size:.65rem;
  font-weight:800;
  border-radius:100px;
  border:1px solid var(--border-glass);
  background:rgba(0,0,0,.03);
  color:var(--text-tertiary);
  letter-spacing:.3px;
  white-space:nowrap
}
.apis-badge-ok{
  background:rgba(22,163,74,.08);
  border-color:rgba(22,163,74,.18);
  color:#15803d
}
.apis-badge-warn{
  background:rgba(217,119,6,.08);
  border-color:rgba(217,119,6,.2);
  color:#b45309
}
.apis-badge-plain{
  background:rgba(59,125,255,.06);
  border-color:rgba(59,125,255,.18);
  color:var(--accent-blue)
}

.apis-more{
  text-align:center;
  padding:14px;
  color:var(--text-tertiary);
  font-size:.82rem;
  font-weight:600
}
.apis-empty{
  text-align:center;
  padding:48px 20px;
  color:var(--text-tertiary);
  font-weight:600;
  font-size:.9rem
}

@media(max-width:480px){
  .apis-stats{grid-template-columns:1fr 1fr 1fr;padding:12px;gap:8px}
  .apis-stat-divider{display:none}
  .apis-stat{padding:4px}
  .apis-stat-val{font-size:1.15rem}
  .apis-stat-lbl{font-size:.62rem;letter-spacing:.3px}
  .apis-toolbar{flex-direction:column;align-items:stretch}
  .apis-search{min-width:0}
  .apis-filters{width:100%}
  .apis-select{flex:1;font-size:.82rem;padding:9px 30px 9px 12px}
  .apis-card-body{padding:12px 14px}
  .apis-card-name{font-size:.88rem}
  .apis-card-desc{font-size:.78rem}
  .apis-card-meta{flex-direction:column;align-items:flex-start}
  .apis-auth-filter{width:100%;justify-content:space-between}
  .apis-auth-btn{flex:1;justify-content:center;padding:6px 8px;font-size:.72rem}
}