/* Fragment / Gem / Kutu ödül havuzu sayfası. */

.lunora-gen { display: grid; gap: 14px; }

/* Grup sekmeleri ve materyal butonları: sitenin genel mor button stilini sıfırla. */
.lunora-subpage #lunora-main button.lunora-gen-group,
.lunora-subpage #lunora-main button.lunora-gen-material { min-height: 0 !important; height: auto !important; margin: 0; border: 1px solid var(--lunora-border) !important; border-radius: 0 !important; color: #b5bfcd !important; background: linear-gradient(180deg, rgba(20,18,17,.94), rgba(10,10,11,.96)) !important; font-size: inherit !important; font-weight: inherit !important; letter-spacing: normal; text-transform: none; white-space: normal !important; cursor: pointer; transition: border-color .2s ease, background .2s ease, transform .2s ease; }

.lunora-gen-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lunora-subpage #lunora-main button.lunora-gen-group { display: flex !important; align-items: center; justify-content: flex-start; gap: 12px; padding: 12px 16px !important; }
.lunora-gen-group img { width: 36px; height: 36px; border: 1px solid rgba(200,164,93,.3); }
.lunora-gen-group span { flex: 1; color: #e9edf4 !important; font: 500 20px/1.1 var(--lunora-heading) !important; text-align: left; }
.lunora-gen-group b { min-width: 28px; padding: 3px 7px; border: 1px solid rgba(226,216,198,.12); color: #8f9bad !important; font-size: 11px !important; text-align: center; }
.lunora-subpage #lunora-main button.lunora-gen-group:hover { border-color: rgba(200,164,93,.45) !important; }
.lunora-subpage #lunora-main button.lunora-gen-group[aria-selected="true"] { border-color: rgba(200,164,93,.85) !important; background: linear-gradient(180deg, rgba(200,164,93,.16), rgba(10,10,11,.96)) !important; box-shadow: 0 0 22px rgba(200,164,93,.12); }
.lunora-gen-group[aria-selected="true"] b { border-color: rgba(200,164,93,.5); color: var(--lunora-gold) !important; }

.lunora-gen-materials { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.lunora-gen-materials[hidden] { display: none; }
.lunora-subpage #lunora-main button.lunora-gen-material { display: flex !important; flex-direction: column; align-items: center; justify-content: flex-start; gap: 8px; padding: 12px 8px !important; text-align: center; }
.lunora-gen-material img { width: 44px; height: 44px; border: 1px solid rgba(226,216,198,.14); }
.lunora-gen-material span { color: #aeb8c6 !important; font-size: 12px !important; line-height: 1.25; }
.lunora-subpage #lunora-main button.lunora-gen-material:hover { border-color: rgba(85,214,194,.45) !important; transform: translateY(-2px); }
.lunora-subpage #lunora-main button.lunora-gen-material[aria-pressed="true"] { border-color: rgba(85,214,194,.8) !important; background: linear-gradient(180deg, rgba(85,214,194,.12), rgba(10,10,11,.96)) !important; box-shadow: 0 0 20px rgba(85,214,194,.12); }
.lunora-gen-material[aria-pressed="true"] img { border-color: rgba(85,214,194,.7); }
.lunora-gen-material[aria-pressed="true"] span { color: #eef2f8 !important; }

.lunora-gen-stage { border: 1px solid var(--lunora-border); background: linear-gradient(125deg, rgba(20,18,17,.94), rgba(10,10,11,.97)); }
.lunora-gen-stage__head { display: flex; align-items: center; gap: 14px; padding: 16px 20px; border-bottom: 1px solid var(--lunora-border); }
.lunora-gen-stage__head img { width: 48px; height: 48px; border: 1px solid rgba(200,164,93,.45); }
.lunora-gen-stage__head h2 { flex: 1; margin: 0; color: #f1f4f9 !important; font: 500 26px/1.1 var(--lunora-heading) !important; }
.lunora-gen-search { margin: 0; }
.lunora-gen-search input { width: 240px; height: 40px; padding: 0 14px; border: 1px solid rgba(226,216,198,.14) !important; background: rgba(14,12,11,.7) !important; color: #e6eaf1 !important; font-size: 13px !important; }
.lunora-gen-search input:focus { border-color: rgba(200,164,93,.6) !important; outline: none; box-shadow: none !important; }

/* Uzun ödül listeleri sayfayı değil, kendi kutusunu kaydırır. */
.lunora-gen-rewards { min-height: 240px; max-height: min(62vh, 640px); padding: 16px 20px 20px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(200,164,93,.4) transparent; }
.lunora-gen-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.lunora-gen-reward { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center; column-gap: 12px; row-gap: 6px; padding: 10px 12px; border: 1px solid rgba(226,216,198,.07); background: rgba(14,12,11,.5); }
.lunora-gen-reward[hidden] { display: none; }
.lunora-gen-reward:hover { border-color: rgba(200,164,93,.35); }
.lunora-gen-reward__icon { grid-row: 1 / 3; width: 44px; height: 44px; border: 1px solid var(--reward-color); cursor: help; }
.lunora-gen-reward__icon img { display: block; width: 100%; height: 100%; }
.lunora-gen-reward strong { overflow: hidden; color: #d6dce5 !important; font-size: 13px !important; white-space: nowrap; text-overflow: ellipsis; }
.lunora-gen-reward b { color: var(--reward-color) !important; font-size: 14px !important; font-variant-numeric: tabular-nums; }
.lunora-gen-reward em { grid-column: 2 / 4; height: 4px; background: rgba(226,216,198,.07); }
.lunora-gen-reward em i { display: block; height: 100%; background: var(--reward-color); }
.lunora-gen-reward--common { --reward-color: #9fb0c4; }
.lunora-gen-reward--uncommon { --reward-color: #4fd6a6; }
.lunora-gen-reward--rare { --reward-color: #6fa8ff; }
.lunora-gen-reward--mythic { --reward-color: #e7c45e; }

/* Narki: dört havuz sekmesi, havuz bilgileri ve ödül adedi rozeti. */
.lunora-gen-groups--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
/* Madencilik/Balıkçılık: altı araç sekmesi ve "boş çıkma" kartı. */
.lunora-gen-groups--six { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.lunora-gen-groups--six .lunora-gen-group span { display: grid; gap: 2px; font-size: 15px !important; }
.lunora-gen-groups--six .lunora-gen-group span small { color: #6f7c90 !important; font: 800 9px/1 var(--lunora-body, sans-serif) !important; letter-spacing: .12em; text-transform: uppercase; }
.lunora-gen-reward--empty { --reward-color: #5d687b; }
.lunora-gen-reward--empty .lunora-gen-reward__icon { display: grid; place-items: center; color: #5d687b !important; font-size: 18px !important; }
.lunora-gen-facts { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lunora-gen-facts li { display: grid; gap: 2px; padding: 6px 12px; border: 1px solid rgba(226,216,198,.1); background: rgba(14,12,11,.5); }
.lunora-gen-facts small { color: #6f7c90 !important; font-size: 9px !important; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.lunora-gen-facts b { color: var(--lunora-gold) !important; font-size: 14px !important; }
.lunora-gen-facts em { color: #6f7c90 !important; font-size: 10px !important; font-style: normal; }
.lunora-gen-reward__icon { position: relative; }
.lunora-gen-reward__icon i { position: absolute; right: 2px; bottom: 1px; color: #fff !important; font: 700 10px/1 Arial, sans-serif !important; font-style: normal; text-shadow: 0 0 2px #000, 1px 1px 0 #000, -1px -1px 0 #000; }

.lunora-gen-empty { margin: 30px 0; color: #8a96a9 !important; text-align: center; }
.lunora-gen-loading { display: grid; place-items: center; min-height: 200px; }
.lunora-gen-loading span { width: 34px; height: 34px; border: 2px solid rgba(200,164,93,.2); border-top-color: var(--lunora-gold); border-radius: 50%; animation: lunora-gen-spin .8s linear infinite; }
@keyframes lunora-gen-spin { to { transform: rotate(360deg); } }

@media (max-width: 1100px) {
    .lunora-gen-groups--six { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lunora-gen-materials { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .lunora-gen-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .lunora-gen-groups, .lunora-gen-groups--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lunora-gen-facts { width: 100%; }
    .lunora-gen-materials { display: flex; overflow-x: auto; }
    .lunora-gen-materials[hidden] { display: none; }
    .lunora-subpage #lunora-main button.lunora-gen-material { flex: 0 0 110px; }
    .lunora-gen-stage__head { flex-wrap: wrap; }
    .lunora-gen-search, .lunora-gen-search input { width: 100%; }
    .lunora-gen-grid { grid-template-columns: 1fr; }
    .lunora-gen-rewards { max-height: none; overflow: visible; }
}
