/* ========== Nokta site CSS ========== */
:root{ --bg:#0b1220; --card:#121a2b; --txt:#e6e9f2; --mut:#9aa4bd; --brand:#ffb020; --ok:#16a34a; --br:#22304f; }

body{ margin:0; background:var(--bg); color:var(--txt); font-family:Inter,system-ui,Segoe UI,Roboto,sans-serif; }
a{ color:#f7d07c; text-decoration:none; }

.page-title{ margin:10px 0 6px; font-size:28px; font-weight:800; }

/* Filters */
form.filter{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr auto; gap:8px; margin:12px 0; }
@media(max-width:900px){ form.filter{ grid-template-columns:1fr 1fr; } }
input,select,textarea{ width:100%; padding:10px; border-radius:10px; border:1px solid var(--br); background:#0d1426; color:var(--txt); }

/* Cards */
.cards{ gap:14px; }
.card{ background:var(--card); border:1px solid var(--br); border-radius:16px; padding:14px; }
.pill{ display:inline-block; padding:4px 10px; border-radius:999px; background:#17203a; color:#cbd5e1; font-size:12px; }
.btn{ display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px; background:linear-gradient(135deg,#ffd166,var(--brand)); color:#111; font-weight:700; border:none; cursor:pointer; text-decoration:none; }
.btn:hover{ filter:brightness(0.98); }
.mut{ color:var(--mut); }
.small{ font-size:12px; }

/* Shop card */
.shop-card__head{ display:flex; justify-content:space-between; align-items:center; gap:8px; }
.shop-card__title{ margin:0; font-size:18px; }
.shop-card__actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }

/* Pager */
.pager{ margin:16px 0; display:flex; gap:8px; flex-wrap:wrap; }
.ads{display:grid;gap:12px;margin:12px 0}
.ads--header,.ads--footer{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.ads--middle{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.ad{border:1px solid #e5e7eb;border-radius:12px;background:#fff;padding:12px;box-shadow:0 4px 14px rgba(0,0,0,.05)}
.ad--admin { overflow:hidden }
.ad--spon, .ad--spon-inline{display:block;text-decoration:none;color:#0f172a}
.ad__label{display:inline-block;background:#eef2ff;color:#3730a3;border:1px solid #c7d2fe;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:700;margin-bottom:6px}
.ad__title{font-weight:800;margin:0 0 4px}
.ad__desc{color:#6b7280;font-size:14px;margin:0}
/* Card container */
.card {
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:18px;
  padding:20px;
  box-shadow:0 8px 22px rgba(0,0,0,.06);
}

/* Labels */
label {
  display:block;
  margin:12px 0 6px;
  font:600 14px/1.2 Poppins,system-ui;
  color:#111;
}

/* Inputs */
.input {
  width:100%;
  background:#fff;
  border:1px solid rgba(15,23,42,.15);
  border-radius:12px;
  padding:12px 14px;
  font:500 14px/1.2 Poppins,system-ui;
  color:#111;
  outline:0;
  box-shadow:0 1px 0 rgba(0,0,0,.03) inset;
}
.input:focus {
  border-color:#f26622; /* brand orange */
  box-shadow:0 0 0 4px rgba(242,102,34,.18);
}

/* Button */
.btn {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  width:100%;
  padding:12px 16px;
  border:none;
  border-radius:12px;
  background:linear-gradient(90deg,#f26622,#ff8a3d);
  color:#fff;
  font:700 15px/1.2 Poppins,system-ui;
  box-shadow:0 6px 16px rgba(242,102,34,.25);
  cursor:pointer;
}
.btn:disabled {
  opacity:.6;
  pointer-events:none;
}

/* Alerts */
.alert {
  border-radius:12px;
  padding:12px 14px;
  margin-bottom:12px;
  font:500 14px/1.4 Poppins,system-ui;
}
.alert.ok {
  background:#ecfdf5;
  border:1px solid #86efac;
  color:#065f46;
}
.alert.bad {
  background:#fef2f2;
  border:1px solid #fecaca;
  color:#991b1b;
}

/* Muted text */
.mut {
  color:#6b7280;
  font-size:13px;
}
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.9); backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(15,23,42,.06);
  box-shadow:0 6px 18px rgba(15,23,42,.06);
}
.site-header__row{
  width:var(--container); margin-inline:auto;
  display:flex; align-items:center; gap:16px; padding:10px 0;
}
.brand{ font-weight:800; font-size:18px; letter-spacing:.2px; color:var(--ink); text-decoration:none; }
.spacer{ flex:1; }
.btn{
  display:inline-flex; align-items:center; gap:8px; border:0; cursor:pointer;
  padding:9px 14px; border-radius:999px; font-weight:600; color:#fff; text-decoration:none;
  background:linear-gradient(90deg,var(--brand),var(--brand2));
  box-shadow:0 8px 16px rgba(242,102,34,.25);
  transition:transform .12s ease, filter .2s ease;
}
.btn:hover{ transform:translateY(-1px); filter:saturate(1.05) }
.btn:active{ transform:none }
