/* Base */
.wsl-page { padding: 24px 0; }
.wsl-container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }

/* Optional top row */
.wsl-toprow { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom: 12px; }

/* Grid: ~65/35 split */
.wsl-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 24px;
  align-items: start;
}

.wsl-main { min-width: 0; }
.wsl-side { min-width: 0; }

/* Cards */
.wsl-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 16px;
}

/* Sticky sidebar (desktop) */
@media (min-width: 980px) {
  .wsl-sticky { position: sticky; top: 18px; }
}

/* Typography */
.wsl-h2 { margin: 0 0 10px; font-size: 18px; line-height: 1.2; }
.wsl-h3 { margin: 0 0 10px; font-size: 16px; line-height: 1.2; }
.wsl-muted { color: rgba(0,0,0,.62); }
.wsl-small { font-size: 12px; }

/* Buttons / chips */
.wsl-btn {
  display: inline-flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  cursor: pointer;
  text-decoration:none;
  color: #111;
  font-weight: 600;
}
.wsl-btn:hover { background: rgba(0,0,0,.03); }

.wsl-btn-primary {
  background: #d32323;
  border-color: #d32323;
  color: #fff;
}
.wsl-btn-primary:hover { filter: brightness(.95); }

.wsl-btn-wide { width: 100%; margin-top: 10px; }

.wsl-action-buttons { display:flex; flex-wrap:wrap; gap: 10px; margin-top: 12px; }

.wsl-chip {
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.18);
  background:#fff;
  cursor:pointer;
}
.wsl-chip:hover { background: rgba(0,0,0,.03); }

/* Recommend row */
.wsl-recommend { margin-top: 14px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap: 10px; }
.wsl-recommend-label { font-weight: 700; }
.wsl-recommend-buttons { display:flex; gap: 10px; }

/* Form */
.wsl-form { margin-top: 10px; }
.wsl-form-label { font-weight: 700; margin: 10px 0; }
.wsl-radio { display:block; margin: 8px 0; }

/* Key/Value block */
.wsl-kv { display:grid; grid-template-columns: 90px 1fr; gap: 10px 12px; }
.wsl-k { font-weight: 700; }
.wsl-v a { word-break: break-word; }

/* Alert */
.wsl-alert {
  padding: 12px;
  background: #fff4f4;
  border: 1px solid rgba(211,35,35,.25);
  border-radius: 10px;
  margin-bottom: 16px;
}

/* Mobile: stack columns */
@media (max-width: 979px) {
  .wsl-grid { grid-template-columns: 1fr; }
}
