/* ── W3.CSS-compatible minimal stylesheet ────────────────────── */
/* Used in original TrendyBeatz for icon badges and tag chips    */

.w3-badge, .w3-tag { display:inline-block; padding:0 6px; text-align:center; }
.w3-badge { border-radius:50%; min-width:20px; line-height:20px; font-size:12px; }
.w3-tag   { border-radius:2px; font-size:13px; }
.w3-round { border-radius:4px; }
.w3-round-large { border-radius:8px; }

.w3-red     { background:#f44336; color:#fff; }
.w3-green   { background:#4caf50; color:#fff; }
.w3-blue    { background:#2196f3; color:#fff; }
.w3-orange  { background:#ff9800; color:#fff; }
.w3-grey    { background:#9e9e9e; color:#fff; }
.w3-black   { background:#000;    color:#fff; }
.w3-white   { background:#fff;    color:#000; }
.w3-yellow  { background:#ffeb3b; color:#000; }

.w3-small    { font-size:12px; }
.w3-medium   { font-size:15px; }
.w3-large    { font-size:18px; }
.w3-xlarge   { font-size:24px; }
.w3-xxlarge  { font-size:32px; }
.w3-xxxlarge { font-size:48px; }

.w3-container  { padding:0.01em 16px; }
.w3-padding    { padding:8px 16px; }
.w3-margin     { margin:8px; }
.w3-margin-top { margin-top:16px; }
.w3-center     { text-align:center; }
.w3-right      { float:right; }
.w3-left       { float:left; }
.w3-clear      { clear:both; }
.w3-hide       { display:none; }
.w3-show       { display:block; }
.w3-show-inline { display:inline-block; }

.w3-btn {
  display:inline-block; padding:6px 14px; border-radius:4px;
  cursor:pointer; border:none; font-size:14px; text-decoration:none;
  background:#f1f1f1; color:#000; transition:opacity .15s;
}
.w3-btn:hover { opacity:.8; }
.w3-btn.w3-green { background:#4caf50; color:#fff; }
.w3-btn.w3-red   { background:#f44336; color:#fff; }