/* PerunOTS visual polish layer (30.10.2026): shared look for list/database pages. Loaded after ui.css. */
@keyframes pl-in { from { opacity:0; transform:translateY(6px); } }
.BoxContent > .ui-wrap, .BoxContent > .prof, .BoxContent > .TableContainer, .BoxContent > #itemsCategoriesBox { animation:pl-in .35s ease-out both; }

/* cards and headers */
.ui-card { box-shadow:0 1px 4px rgba(0,0,0,.18); transition:box-shadow .2s; }
.ui-card > .ui-head { background:linear-gradient(90deg,#5f4d41,#3c2f26); color:#ffd24a; border-left:4px solid #d9b45a; letter-spacing:.3px; }
.ui-table thead th { background:linear-gradient(#e3cfa8,#d4c0a1); text-transform:uppercase; font-size:10px; letter-spacing:.6px; }
.ui-table tbody tr td { transition:background .12s; }
.ui-table tbody tr:hover td:first-child { box-shadow:inset 3px 0 0 #d19a1f; }

/* legacy framed boxes (render_table_box) flattened into a modern card */
.TableContainer { margin:0 0 14px; border:2px solid #5f4d41; background:#f1e0c6; box-shadow:0 1px 4px rgba(0,0,0,.18); }
.TableContainer .CaptionContainer { position:static; height:auto; background:none; }
.TableContainer .CaptionContainer span { display:none !important; }
.TableContainer .CaptionInnerContainer { position:static !important; height:auto !important; background:none !important; width:auto !important; }
.TableContainer .CaptionContainer .Text { position:static !important; display:block; width:auto !important; height:auto !important; padding:6px 12px !important; margin:0 !important;
	background:linear-gradient(90deg,#5f4d41,#3c2f26) !important; color:#ffd24a !important; border-left:4px solid #d9b45a; font:bold 13px Verdana,Arial,sans-serif !important; text-shadow:none !important; background-image:none !important; }
.TableContainer table.Table3, .TableContainer .InnerTableContainer, .TableContainer .TableContentContainer { border:0 !important; background:none !important; padding:0 !important; margin:0 !important; }
.TableContainer .TableContentContainer { padding:8px !important; }
.TableContainer table.Table3 > tbody > tr > td, .TableContainer .InnerTableContainer > table > tbody > tr > td { border:0 !important; background:none !important; padding:0 !important; }

/* items: category cards */
.it-cats { display:grid; grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:8px; }
.it-cat { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:84px; padding:8px 4px; text-align:center; text-decoration:none !important;
	background:linear-gradient(#f6e8cf,#e3cfa8); border:2px solid #5f4d41; color:#3c1e00 !important; font:bold 12px Verdana,Arial,sans-serif; transition:transform .15s, box-shadow .15s, border-color .15s; }
.it-cat img { width:34px; height:34px; object-fit:contain; image-rendering:pixelated; transition:transform .2s; filter:drop-shadow(0 2px 1px rgba(0,0,0,.35)); }
.it-cat:hover { transform:translateY(-3px); border-color:#d19a1f; box-shadow:0 4px 10px rgba(0,0,0,.3), 0 0 0 1px #f5c94a; }
.it-cat:hover img { transform:scale(1.18) rotate(-4deg); }

/* items: list tables */
table.items-sortable { border:0 !important; border-collapse:collapse; }
table.items-sortable thead th, table.items-sortable thead td { background:linear-gradient(#e3cfa8,#d4c0a1) !important; color:#5a2800 !important; text-transform:uppercase; font-size:10px; letter-spacing:.6px; padding:5px 8px; }
table.items-sortable tbody tr { transition:background .12s; }
table.items-sortable tbody tr:hover td { background:#fff1d4 !important; }
table.items-sortable tbody tr:hover td:first-child { box-shadow:inset 3px 0 0 #d19a1f; }

/* spells: coloured filter chips, type badges */
#sp-voc button, #sp-type button { transition:transform .12s, background .12s; }
#sp-voc button:hover, #sp-type button:hover { transform:translateY(-1px); background:#e6d3b5; }
#sp-voc button[data-v="4"].on { background:#8b2e1e; } #sp-voc button[data-v="3"].on { background:#b8860b; }
#sp-voc button[data-v="1"].on { background:#6a3e8e; } #sp-voc button[data-v="2"].on { background:#2e6b2e; }
.sp-voc.v3 { background:#b8860b !important; } .sp-voc.v1 { background:#6a3e8e !important; } .sp-voc.v2 { background:#2e6b2e !important; }
.sp-type { border-radius:8px; padding:1px 8px !important; }
tr[data-type="instant"] .sp-type { background:#28509a; } tr[data-type="rune"] .sp-type { background:#7a3e9a; } tr[data-type="conjure"] .sp-type { background:#2e7d5b; }
.sp-table tbody tr:hover .ico img { transform:scale(1.25); } .sp-table .ico img { transition:transform .15s; }

/* highscores podium: three equal cards with a full-width rank ribbon on top */
.hs-podium { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:0 0 10px; }
.hs-pod { display:flex; flex-direction:column; align-items:stretch; border:2px solid #5f4d41; background:linear-gradient(#f6e8cf,#e3cfa8); text-align:center; transition:transform .15s, box-shadow .15s; }
.hs-pod:hover { transform:translateY(-3px); box-shadow:0 4px 10px rgba(0,0,0,.3); }
.hs-pod .medal { display:block; padding:3px 0; color:#fff; font:bold 11px Verdana,Arial,sans-serif; letter-spacing:1.5px; text-transform:uppercase; text-shadow:1px 1px 0 rgba(0,0,0,.4); }
.hs-pod.p1 { border-color:#d19a1f; } .hs-pod.p1 .medal { background:linear-gradient(#e8b53a,#b8860b); }
.hs-pod.p2 { border-color:#8f9a9a; } .hs-pod.p2 .medal { background:linear-gradient(#a9b3b3,#7c8686); }
.hs-pod.p3 { border-color:#b5651d; } .hs-pod.p3 .medal { background:linear-gradient(#cd7a2e,#9a5214); }
.hs-pod .pic { height:64px; display:flex; align-items:center; justify-content:center; margin-top:6px; }
.hs-pod img { max-height:58px; image-rendering:pixelated; }
.hs-pod a { display:block; padding:0 6px; font:bold 13px Verdana,Arial,sans-serif; color:#0b1fa3; text-decoration:none; }
.hs-pod .v { margin-top:2px; font-size:18px; font-weight:bold; color:#3c1e00; line-height:1.2; }
.hs-pod .s { padding:0 6px 8px; font-size:10px; color:#7a5a3a; }
@media (max-width:640px) { .hs-podium { grid-template-columns:1fr; } }

/* highscores table: equal rank badges, centred */
.hs-table th:nth-child(2), .hs-table td:nth-child(2) { text-align:center; width:44px; }
.hs-table td .hs-rank { display:inline-block; box-sizing:border-box; width:28px; height:22px; line-height:20px; padding:0; text-align:center; font-weight:bold; border:1px solid #8a7560; color:#5a2800; background:rgba(255,255,255,.35); }
.hs-table td .hs-rank.r1 { background:#d19a1f; border-color:#a06f00; color:#fff; }
.hs-table td .hs-rank.r2 { background:#8f9a9a; border-color:#6b7676; color:#fff; }
.hs-table td .hs-rank.r3 { background:#b5651d; border-color:#8a4a10; color:#fff; }
.hs-table tr.top1 td { font-weight:inherit; background:inherit; }

/* quests + accordions */
.questHeader, .quest-head { transition:background .12s, transform .12s; }

@media (prefers-reduced-motion: reduce) { .BoxContent > * { animation:none !important; } .it-cat, .hs-pod { transition:none; } }

/* houses / legacy tables */
#housetable, #housesTable { width:100%; border-collapse:collapse; box-shadow:0 1px 4px rgba(0,0,0,.18); }
#housetable tr.yellow th, #housesTable tr.yellow th { background:linear-gradient(90deg,#5f4d41,#3c2f26); color:#ffd24a; text-transform:uppercase; font-size:10px; letter-spacing:.6px; padding:6px 8px; }
#housetable tr:not(.yellow) td, #housesTable tr:not(.yellow) td { transition:background .12s; }
#housetable tr:not(.yellow):hover td, #housesTable tr:not(.yellow):hover td { background:#fff1d4 !important; }