/* Copyright (c) 2026 K.N.Narin (github.com/narin-kura). All rights reserved.
   Non-commercial use only. See LICENSE. */

.ex-filter-bar { display:flex; gap:8px; margin-bottom:14px; }
.ex-filter-btn { padding:7px 16px; border:1.5px solid #1e3050; border-radius:99px; font-size:12px; font-weight:700;
  color:#7e95b8; background:#0f1a30; cursor:pointer; font-family:inherit; }
.ex-filter-btn:hover { border-color:#3c4f80; color:#a5b4fc; }
.ex-filter-btn.active { color:#fff; background:linear-gradient(135deg,#6366f1,#8b5cf6); border-color:transparent; }
.examples-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(330px, 1fr)); gap:14px; }
.examples-loading { color:#4a6080; font-size:13px; padding:20px 0; }
.ex-card { display:flex; flex-direction:column; gap:9px; background:#0f1a30; border:1.5px solid #1e3050;
  border-radius:13px; padding:17px 18px; }
.ex-card:hover { border-color:#3c4f80; }
.ex-num { font-size:10.5px; font-weight:800; color:#5b74a0; letter-spacing:1px; display:flex; align-items:center; gap:7px; }
.ex-provider { font-size:9.5px; font-weight:800; padding:2px 7px; border-radius:99px; letter-spacing:.5px; }
.ex-provider-aws { background:#2a1f0f; color:#e8a23c; }
.ex-provider-azure { background:#0f1f36; color:#4fa3e3; }
.ex-title { font-size:15.5px; font-weight:800; color:#dde8ff; line-height:1.3; }
.ex-desc { font-size:12.5px; color:#7e95b8; line-height:1.65; flex:1; }
.ex-meta { display:flex; flex-wrap:wrap; gap:5px; }
.ex-tag { font-size:10px; font-weight:700; padding:3px 8px; border-radius:99px; background:#141f3a; color:#8ba6c9; }
.ex-foot { display:flex; align-items:center; gap:8px; margin-top:2px; }
.ex-btn { padding:8px 14px; border:none; border-radius:8px; font-size:12px; font-weight:800; cursor:pointer;
  color:#fff; background:linear-gradient(135deg,#6366f1,#8b5cf6); font-family:inherit; }
.ex-btn:disabled { opacity:.5; cursor:default; }
.ex-link { font-size:11.5px; color:#6b85a8; text-decoration:none; }
.ex-link:hover { color:#a5b4fc; }
.ex-expect { font-size:11px; color:#4a6080; }
