/* BombCryptoOT site styles shared by our own pages (served as
   templates/tibiacom/bombcrypto.css, linked from index.php). Colours follow
   the tibiacom theme's own palette (config.ini: lightborder #F1E0C6,
   darkborder #D4C0A1, vdarkborder #505050) so our pages read as part of
   the same site. Everything is prefixed bc- to stay clear of MyAAC's CSS. */

/* ---- parchment box: the one "standard Tibia" box used everywhere ------
   Home sidebar boxes (index.php #PlayBox/#GetBcoinBox, add bc-box-side),
   the BCoin pages (bcoin-box.macros.html.twig) and the Downloads page.
   Kind modifiers only change the border + title bar colour. */
.bc-box { border: 2px solid #505050; border-radius: 4px; background: linear-gradient(#F1E0C6, #D4C0A1); margin-bottom: 15px; }
.bc-box-title { background: #505050; color: #FFF; font-weight: bold; padding: 5px 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; }
.bc-box-body { padding: 10px 12px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #333; }
.bc-box-warning { border-color: #8a6d1f; } .bc-box-warning > .bc-box-title { background: #8a6d1f; }
.bc-box-success { border-color: #2e7d32; } .bc-box-success > .bc-box-title { background: #2e7d32; }
.bc-box-error { border-color: #8a3030; } .bc-box-error > .bc-box-title { background: #8a3030; }
.bc-box-body a { color: #1a3a6b; text-decoration: underline; }
.bc-box-body a:hover { color: #0d2547; }
.bc-box-body code { background: rgba(0,0,0,0.08); padding: 1px 4px; border-radius: 3px; }
.bc-box-body table td { padding: 3px 4px; }
/* sidebar variant: .Themebox (basic.css) gives a fixed 154px height and a
   -4px offset meant for the stock image boxes - undone here */
.Themebox.bc-box-side { height: auto; position: static; top: 0; padding: 0 0 8px 0; margin-bottom: 10px; }
.bc-box-side > .bc-box-title { padding: 4px 8px; font-size: 11px; }
.bc-box-side > .bc-box-body { padding: 8px; font-size: 11px; }

/* ---- buttons (links styled as buttons) --------------------------------
   `a.` + :hover so the theme's `.Content a` / `.Content a:hover` (blue,
   underline on hover) never repaints them; this file loads after basic.css. */
a.bc-btn, a.bc-btn:link, a.bc-btn:visited, a.bc-btn:hover, a.bc-btn:focus { display: inline-block; color: #fff; font-weight: bold; padding: 10px 18px; margin: 6px; border-radius: 4px; text-decoration: none; }
a.bc-btn-block, a.bc-btn-block:link, a.bc-btn-block:visited, a.bc-btn-block:hover, a.bc-btn-block:focus { display: block; padding: 6px 10px; margin: 6px 0; }
.bc-btn-web { background: #1565C0; border: 1px solid #0d47a1; }
.bc-btn-download { background: #2e7d32; border: 1px solid #1b5e20; }
a.bc-btn-admin, a.bc-btn-admin:link, a.bc-btn-admin:visited, a.bc-btn-admin:hover, a.bc-btn-admin:focus { background: #5a2a2a; border: 1px solid #3d1a1a; padding: 6px 12px; margin: 4px; font-size: 11px; }
a.bc-btn-donate, a.bc-btn-donate:link, a.bc-btn-donate:visited, a.bc-btn-donate:hover, a.bc-btn-donate:focus { display: block; text-align: center; background: linear-gradient(#e6c34d, #b8901f); border: 1px solid #8a6a12; color: #3a2c00; padding: 7px 10px; margin: 0; }
.bc-btn-soon { display: inline-block; background: #ddd; border: 1px solid #bbb; color: #888; font-weight: bold; padding: 10px 18px; border-radius: 4px; margin: 6px; }

/* ---- home: Discord banner (index.php) ---------------------------------- */
#DiscordBanner { position: relative; display: flex; align-items: center; gap: 14px; margin: 0 0 12px; padding: 14px 44px 14px 16px; border: 2px solid #cfa600; border-radius: 6px; background: linear-gradient(120deg, #5865F2 0%, #4752c4 55%, #2f3796 100%); box-shadow: 0 2px 6px rgba(0,0,0,0.45); font-family: Verdana, Arial, Helvetica, sans-serif; color: #fff; overflow: hidden; }
#DiscordBanner::after { content: ""; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255,255,255,0.07); pointer-events: none; }
#DiscordBanner .dcb-logo { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; background: rgba(255,255,255,0.14); display: flex; align-items: center; justify-content: center; }
#DiscordBanner .dcb-logo svg { width: 34px; height: 34px; fill: #fff; }
#DiscordBanner .dcb-body { flex: 1 1 auto; min-width: 0; }
#DiscordBanner .dcb-title { margin: 0 0 3px; font-size: 14px; font-weight: bold; line-height: 1.3; }
#DiscordBanner .dcb-text { margin: 0 0 7px; font-size: 11px; line-height: 1.45; color: #e3e6ff; }
#DiscordBanner .dcb-tags { display: flex; flex-wrap: wrap; gap: 5px; }
#DiscordBanner .dcb-tags span { font-size: 10px; font-weight: bold; padding: 3px 7px; border-radius: 10px; background: rgba(0,0,0,0.22); color: #fff; white-space: nowrap; }
#DiscordBanner .dcb-cta { position: relative; z-index: 1; flex: 0 0 auto; display: inline-block; padding: 9px 16px; border: 1px solid #8a6a12; border-radius: 4px; background: linear-gradient(#f2d266, #c99b1f); color: #2b2000 !important; font-size: 12px; font-weight: bold; text-decoration: none !important; white-space: nowrap; box-shadow: 0 1px 3px rgba(0,0,0,0.35); }
#DiscordBanner .dcb-cta:hover { background: linear-gradient(#f7de85, #d6a92a); }
#DiscordBanner .dcb-close { position: absolute; z-index: 1; top: 6px; right: 8px; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; background: rgba(0,0,0,0.2); color: #fff; font-size: 14px; line-height: 22px; cursor: pointer; }
#DiscordBanner .dcb-close:hover { background: rgba(0,0,0,0.4); }
@media (max-width: 560px) {
	#DiscordBanner { flex-wrap: wrap; }
	#DiscordBanner .dcb-cta { width: 100%; text-align: center; }
}

/* ---- home: gold plaque behind the BombCrypto logo (index.php) ----------
   Echoes the gold/dark tones of the left logo's scrollwork frame; sits fully
   above #PedestalAndOnline (top:-105px) so it never covers the "Servidor
   ONLINE / Jogadores Online" text inside that box. */
#LogoFrame { position: absolute; top: -142px; left: 6px; width: 120px; box-sizing: border-box; padding: 5px 4px; background: linear-gradient(#1a1a1a, #0d0d0d); border: 2px solid #cfa600; border-radius: 6px; box-shadow: 0 0 4px rgba(0,0,0,0.6); z-index: 15; text-align: center; }
#LogoFrame #BombCryptoLogo { display: block; width: 100%; height: auto; cursor: pointer; }
#LogoFrame .bc-powered { font-size: 9px; color: #cfa600; margin-top: 3px; font-family: Verdana, Arial, Helvetica, sans-serif; letter-spacing: 0.5px; }
/* Status box under the plaque: two lines (status / "N Jogadores Online",
   summed over every open world). Pinned to the box's visible area so no line
   ever slides under #LogoFrame. */
#RightArtwork #PlayersOnline { bottom: 9px; line-height: 8pt; white-space: nowrap; }
#RightArtwork #PlayersOnline .bc-status-online { color: #00E000; font-weight: bold; }
#RightArtwork #PlayersOnline .bc-status-offline { color: red; font-weight: bold; }

/* ---- our own content pages ---------------------------------------------- */
.bc-intro { margin: 0 0 10px; line-height: 1.5; }
.bc-note { font-size: 11px; color: #5a4a32; margin: 6px 0 0; }

/* tabs */
.bc-tabs { display: flex; gap: 4px; margin: 0 0 -2px; position: relative; z-index: 1; }
.bc-tab { padding: 6px 16px; border: 2px solid #505050; border-bottom: 0; border-radius: 5px 5px 0 0; background: #D4C0A1; color: #3a2c1a; font-weight: bold; cursor: pointer; font-family: Verdana, Arial, sans-serif; font-size: 12px; }
.bc-tab[aria-selected="true"] { background: #505050; color: #fff; }

/* filter bar */
.bc-filters { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end; padding: 10px; border: 2px solid #505050; border-radius: 0 4px 4px 4px; background: linear-gradient(#F1E0C6, #D4C0A1); margin-bottom: 8px; }
.bc-filters label { display: flex; flex-direction: column; gap: 3px; font-size: 11px; font-weight: bold; color: #3a2c1a; }
.bc-filters input[type=text], .bc-filters input[type=number], .bc-filters select { font-size: 12px; padding: 3px 5px; border: 1px solid #8a7658; border-radius: 3px; background: #fffaf0; }
.bc-filters input[type=text] { width: 170px; }
.bc-filters input[type=number] { width: 70px; }
.bc-filters .bc-check { flex-direction: row; align-items: center; gap: 5px; padding-bottom: 4px; }
.bc-filters .bc-reset { padding: 4px 10px; font-size: 11px; font-weight: bold; border: 1px solid #505050; border-radius: 3px; background: #505050; color: #fff; cursor: pointer; }
.bc-count { font-size: 11px; color: #5a4a32; margin: 0 0 6px; }

/* data table */
.bc-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.bc-table th { background: #505050; color: #fff; text-align: left; padding: 5px 6px; white-space: nowrap; font-size: 11px; }
.bc-table th[data-sort] { cursor: pointer; user-select: none; }
.bc-table th[data-sort]::after { content: " \2195"; opacity: .45; }
.bc-table th.bc-asc::after { content: " \25B2"; opacity: 1; }
.bc-table th.bc-desc::after { content: " \25BC"; opacity: 1; }
.bc-table td { padding: 4px 6px; border-bottom: 1px solid #c9b48f; vertical-align: middle; }
.bc-table tbody tr:nth-child(odd) td { background: #F1E0C6; }
.bc-table tbody tr:nth-child(even) td { background: #E7D5B6; }
.bc-table tbody tr.bc-clickable { cursor: pointer; }
.bc-table tbody tr.bc-clickable:hover td { background: #fff3da; }
.bc-table tbody tr.bc-detail td { background: #fffaf0; padding: 10px 12px; }
.bc-table .bc-num { text-align: right; white-space: nowrap; }
.bc-table .bc-empty { text-align: center; padding: 16px; font-style: italic; }
.bc-words { display: block; font-family: Consolas, "Courier New", monospace; font-size: 11px; color: #6b4a12; }
.bc-icon { width: 32px; height: 32px; vertical-align: middle; margin-right: 6px; image-rendering: pixelated; }
.bc-icon-sm { width: 22px; height: 22px; vertical-align: middle; margin-right: 4px; image-rendering: pixelated; }
.bc-name { font-weight: bold; }
/* monster look: sprites range from 32px to ~128px; shown at up to 48px, aligned bottom like in game */
.bc-mon { display: flex; align-items: center; }
.bc-look { flex: 0 0 auto; display: inline-flex; align-items: flex-end; justify-content: center; width: 48px; height: 48px; margin-right: 8px; vertical-align: middle; }
.bc-look img { max-width: 48px; max-height: 48px; image-rendering: pixelated; }

/* badges */
.bc-badge { display: inline-block; padding: 1px 6px; margin: 1px 2px 1px 0; border-radius: 8px; font-size: 10px; font-weight: bold; white-space: nowrap; color: #fff; background: #6d6d6d; }
.bc-voc-knight { background: #8b2e2e; }
.bc-voc-paladin { background: #2e6b2e; }
.bc-voc-sorcerer { background: #2e3f8b; }
.bc-voc-druid { background: #1f6f6a; }
.bc-voc-monk { background: #8a5a12; }
.bc-voc-none { background: #7a7a7a; }
.bc-el-fire { background: #c2410c; }
.bc-el-ice { background: #2b7bb9; }
.bc-el-energy { background: #7c3aed; }
.bc-el-earth { background: #4d7c0f; }
.bc-el-holy { background: #b58900; }
.bc-el-death { background: #3f3f46; }
.bc-el-physical { background: #7c5a3a; }
.bc-el-healing { background: #15803d; }
.bc-el-lifedrain, .bc-el-manadrain, .bc-el-drown { background: #475569; }
.bc-prem { background: #b8901f; color: #2b2000; }
.bc-learn { background: #9a3412; }
.bc-boss { background: #7f1d1d; }
.bc-bc { background: #b8901f; color: #2b2000; }
.bc-weak { background: #b91c1c; }
.bc-resist { background: #166534; }
.bc-stars { color: #b8901f; letter-spacing: 1px; white-space: nowrap; }

/* detail panel (monster loot etc.) */
.bc-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 20px; }
.bc-detail-grid h4 { margin: 0 0 4px; font-size: 12px; }
.bc-loot { list-style: none; margin: 0; padding: 0; max-height: 260px; overflow-y: auto; }
.bc-loot li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 0; border-bottom: 1px dotted #d8c7a5; font-size: 11px; }
.bc-loot li span:first-child { display: flex; align-items: center; }

/* pager */
.bc-pager { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 10px 0 0; font-size: 12px; }
.bc-pager button { padding: 3px 10px; border: 1px solid #505050; border-radius: 3px; background: #D4C0A1; cursor: pointer; font-weight: bold; }
.bc-pager button:disabled { opacity: .4; cursor: default; }

/* ---- bazaars (bazaar.php / item-bazaar.php) -------------------------------
   Tibia-style auction cards: outfit / featured items / highlights / bid. */
.bc-auction { border: 2px solid #505050; border-radius: 4px; margin: 0 0 10px; background: #F1E0C6; }
.bc-auction-head { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 5px 10px; background: #505050; color: #fff; font-size: 12px; }
.bc-auction-head a, .bc-auction-head a:visited { color: #fff; }
.bc-auction-name { font-weight: bold; font-size: 13px; }
.bc-auction-body { display: grid; grid-template-columns: 72px 176px 1fr 210px; gap: 10px; align-items: center; padding: 8px 10px; font-size: 12px; }
.bc-auction-outfit { width: 64px; height: 64px; display: flex; align-items: flex-end; justify-content: center; }
.bc-auction-outfit img { max-width: 64px; max-height: 64px; }
.bc-auction-featured { display: flex; gap: 4px; }
.bc-auction-highlights { margin: 0; padding-left: 16px; }
.bc-auction-highlights li { margin: 1px 0; }
.bc-auction-bid { display: flex; flex-direction: column; gap: 6px; }
.bc-price { color: #6b4a12; }
.bc-bid-form { white-space: nowrap; }
.bc-bid-form input[type=number] { width: 80px; }
.bc-badge.bc-world { background: #1f4f8b; }
.bc-item { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid #8a7658; border-radius: 3px; background: #fffaf0; }
.bc-item img { width: 32px; height: 32px; image-rendering: pixelated; }
.bc-item-count { position: absolute; right: 1px; bottom: 0; font-size: 9px; font-weight: bold; color: #fff; text-shadow: 0 0 2px #000, 0 0 2px #000; }
.bc-item-grid { display: flex; flex-wrap: wrap; gap: 4px; }
.bc-rarity-2 { border: 2px solid #59D959; } .bc-rarity-3 { border: 2px solid #59A6FF; } .bc-rarity-4 { border: 2px solid #A659FF; }
.bc-rarity-5 { border: 2px solid #FFA626; } .bc-rarity-6 { border: 2px solid #FF5959; } .bc-rarity-7 { border: 2px solid #40FFE6; }
.bc-rarity-8 { border: 2px solid #FF59D9; } .bc-rarity-9 { border: 2px solid #FFD926; }
.bc-rarity-10 { border: 2px solid transparent; background: linear-gradient(#fffaf0, #fffaf0) padding-box, linear-gradient(90deg, #ff5959, #ffd926, #59d959, #59a6ff, #a659ff) border-box; }
.bc-rarity-text-2 { color: #2f8f2f; } .bc-rarity-text-3 { color: #2f6fbf; } .bc-rarity-text-4 { color: #7a35c9; } .bc-rarity-text-5 { color: #c27610; }
.bc-rarity-text-6 { color: #c23535; } .bc-rarity-text-7 { color: #138f80; } .bc-rarity-text-8 { color: #b8309a; } .bc-rarity-text-9 { color: #a88a00; } .bc-rarity-text-10 { color: #5a2a8a; }
.bc-world-picker .bc-world-option { display: inline-block; margin: 4px 14px 4px 0; }

@media (max-width: 700px) {
	.bc-detail-grid { grid-template-columns: 1fr; }
	.bc-table .bc-hide-sm { display: none; }
	.bc-auction-body { grid-template-columns: 72px 1fr; }
	.bc-auction-highlights, .bc-auction-bid { grid-column: 1 / -1; }
}

/* Top 5 box (boxes/highscores.php): one box per world, the arrows inside the
   parchment switch them. Taller than the stock box (basic.css .Themebox is
   154px, the list already overflowed it) so the rows can breathe. */
.Themebox.bc-top-world { height: 250px; }
.bc-top-world .top_level { height: 210px !important; background-size: 100% 100% !important; }
.bc-top-world .bc-top-row { position: relative; height: 31px; margin-bottom: 3px; text-align: left; }
.bc-top-world .bc-top-row a { display: block; height: 32px; }
.bc-top-world .bc-top-outfit { position: absolute; left: -22px; top: -30px; }
.bc-top-world .bc-top-name { position: absolute; left: 40px; right: 6px; top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bc-top-world .bc-top-rank { color: #ccc; }
.bc-top-world .bc-top-level { position: absolute; left: 50px; top: 17px; color: #fff; font-size: 9px; white-space: nowrap; }
.bc-top-world .Bottom { top: auto !important; bottom: 0; }
.bc-top-world a { text-decoration: none; }
.bc-top-empty { padding: 60px 14px 0; text-align: center; font: bold 11px Verdana, Arial, sans-serif; color: #5a3a1a; text-shadow: none; }
.bc-top-switch { position: absolute; left: 0; right: 0; bottom: 18px; text-align: center; font: bold 11px Verdana, Arial, sans-serif; color: #fff; text-shadow: 0.1em 0.1em #333; }
.bc-top-switch a { color: #f0c040; text-decoration: none; padding: 0 10px; }
.bc-top-switch a:hover { color: #fff; }