/* DigiClicks UX v4.4 — visual polish authority layer
   Loaded after legacy UX layers so rarity filters, side-menu popovers and combat action colors win. */

/* --- Side menus: semantic vector icons --- */
.dc-side-icon{display:grid !important;place-items:center !important;width:32px !important;height:32px !important;flex:0 0 32px !important;color:#79efff !important;filter:drop-shadow(0 0 7px currentColor) !important;}
.dc-side-icon svg{width:25px !important;height:25px !important;stroke:currentColor !important;fill:none !important;stroke-width:1.35 !important;stroke-linecap:round !important;stroke-linejoin:round !important;}
.dc-side-label{letter-spacing:.55px !important;text-shadow:0 0 7px rgba(121,239,255,.22) !important;}
#sideMenuLeft,#sideMenuRight{z-index:100020 !important;}
#sideMenuLeft button,#sideMenuRight button{position:relative !important;z-index:100021 !important;overflow:hidden !important;}
#sideMenuLeft button:has(.dc-side-icon:hover),#sideMenuRight button:has(.dc-side-icon:hover){filter:brightness(1.12) !important;}

/* --- Digi picker: always above side menus and positioned beside the button --- */
#ventanaPets.dc-pets-popover{position:fixed !important;left:var(--dc-pets-left,92px) !important;top:var(--dc-pets-top,80px) !important;width:min(var(--dc-pets-width,300px),calc(100vw - 24px)) !important;max-width:calc(100vw - 24px) !important;max-height:min(70vh,520px) !important;overflow:auto !important;z-index:100040 !important;display:flex !important;padding:10px !important;box-sizing:border-box !important;border:1px solid rgba(89,235,255,.30) !important;border-radius:14px !important;background:linear-gradient(145deg,rgba(5,22,33,.97),rgba(3,10,19,.96)) !important;box-shadow:0 18px 55px rgba(0,0,0,.55),0 0 24px rgba(29,218,255,.11) !important;backdrop-filter:blur(16px) saturate(140%) !important;-webkit-backdrop-filter:blur(16px) saturate(140%) !important;}
#ventanaPets.dc-pets-popover .petItem{position:relative !important;z-index:100041 !important;display:grid !important;grid-template-columns:48px minmax(0,1fr) !important;align-items:center !important;gap:9px !important;min-height:54px !important;padding:6px 8px !important;border:1px solid rgba(90,225,255,.10) !important;border-radius:10px !important;background:rgba(8,25,38,.72) !important;color:#dffcff !important;cursor:pointer !important;pointer-events:auto !important;}
#ventanaPets.dc-pets-popover .petItem:hover{background:rgba(24,67,83,.82) !important;border-color:rgba(89,235,255,.28) !important;transform:translateX(2px) !important;}
#ventanaPets.dc-pets-popover .pet-thumbnail{object-fit:contain !important;image-rendering:auto !important;}

/* --- Rarity filters: this layer must outrank the old generic combat drop-shadow rule --- */
.dc-pet-visual.dc-pet-normal{filter:drop-shadow(0 6px 6px rgba(0,0,0,.70)) !important;}
.dc-pet-visual.dc-pet-shiny{filter:brightness(1.4) contrast(1.2) saturate(1.6) hue-rotate(180deg) drop-shadow(0 0 25px #c0c0c0) drop-shadow(0 0 50px #aaddff) !important;}
.dc-pet-visual.dc-pet-shiny-gold{filter:brightness(1.5) contrast(1.2) saturate(2) sepia(.6) hue-rotate(-10deg) drop-shadow(0 0 30px #ffd700) drop-shadow(0 0 60px #ffaa00) !important;}
.dc-pet-visual.dc-pet-legendary{filter:brightness(1.4) contrast(1.3) saturate(1.8) drop-shadow(0 0 25px #ff3333) drop-shadow(0 0 50px #ff6666) !important;animation:dcLegendaryGlow 1.25s ease-in-out infinite !important;}
@keyframes dcLegendaryGlow{0%,100%{filter:brightness(1.34) contrast(1.28) saturate(1.72) drop-shadow(0 0 18px #ff3333) drop-shadow(0 0 36px #ff6666) !important;}50%{filter:brightness(1.56) contrast(1.36) saturate(1.96) drop-shadow(0 0 30px #ff3333) drop-shadow(0 0 65px #ff6666) !important;}}

/* --- Clan combat: same blue/cyan identity as the other combat modes --- */
.clan-battle-action.elemental,.clan-battle-action.hiper,.clan-battle-action.especial,.clan-battle-action.primary{background:linear-gradient(145deg,rgba(7,30,48,.92),rgba(3,18,31,.88)) !important;color:#7deeff !important;border-color:rgba(59,130,246,.58) !important;box-shadow:inset 0 0 18px rgba(59,130,246,.08),0 0 10px rgba(34,174,255,.05) !important;}
.clan-battle-action.elemental:hover,.clan-battle-action.hiper:hover,.clan-battle-action.especial:hover,.clan-battle-action.primary:hover{background:linear-gradient(145deg,rgba(12,54,82,.94),rgba(4,24,41,.92)) !important;border-color:#3b82f6 !important;box-shadow:0 0 18px rgba(59,130,246,.17) !important;}
.clan-battle-action.tactical{background:linear-gradient(145deg,rgba(37,25,61,.88),rgba(17,14,32,.88)) !important;color:#d8b6ff !important;border-color:rgba(166,102,255,.46) !important;}

/* --- Clan Hall / badge creator --- */
.clan-creation-panel,.clan-hall-card,.clan-badge-editor-wrap{background:linear-gradient(145deg,rgba(5,25,37,.88),rgba(4,12,22,.84)) !important;border:1px solid rgba(81,221,248,.14) !important;box-shadow:inset 0 0 28px rgba(43,199,244,.025) !important;}
.clan-create-kicker,.clan-modal-kicker{color:#69edff !important;letter-spacing:1.8px !important;}
.clan-create-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0;}
.clan-create-fields label{display:grid;gap:5px;color:#8bbcc6;font:800 7px/1.2 Orbitron,sans-serif;letter-spacing:.8px;}
.clan-create-fields input,.clan-create-fields textarea,.clan-hall-card input,.clan-hall-card textarea{width:100%;box-sizing:border-box;border:1px solid rgba(98,232,255,.13);border-radius:9px;background:rgba(2,13,22,.72);color:#eaffff;padding:9px 10px;font:700 9px/1.35 Orbitron,sans-serif;outline:none;}
.clan-create-fields textarea,.clan-hall-card textarea{min-height:64px;resize:vertical;}
.clan-badge-editor{display:grid;grid-template-columns:128px minmax(0,1fr);gap:12px;align-items:center;padding:11px;border-radius:12px;border:1px solid rgba(110,222,255,.09);background:rgba(0,8,16,.34);}
.clan-badge-preview{display:grid;place-items:center;gap:5px;min-height:130px;border-radius:11px;background:radial-gradient(circle at 50% 35%,rgba(50,215,255,.12),transparent 64%);}
.clan-badge-preview small{font:800 6px Orbitron,sans-serif;color:#74aebb;letter-spacing:1px;}
.clan-badge-controls{display:grid;gap:7px;}
.clan-badge-row{display:flex;flex-wrap:wrap;align-items:center;gap:5px;}
.clan-badge-row>b{width:58px;font:900 6px Orbitron,sans-serif;color:#7eafbb;letter-spacing:.6px;}
.clan-badge-choice{min-width:31px;height:27px;padding:3px 6px;border:1px solid rgba(92,226,255,.12);border-radius:7px;background:rgba(6,21,31,.84);color:#8fbcc4;font:800 6px Orbitron,sans-serif;cursor:pointer;}
.clan-badge-choice.active{border-color:#69edff;background:rgba(30,126,151,.24);color:#ecffff;box-shadow:0 0 12px rgba(70,230,255,.12);}
.clan-badge-choice i{display:block;width:16px;height:16px;margin:auto;border-radius:50%;background:var(--badge-color);box-shadow:0 0 9px var(--badge-color);}
.clan-create-btn{margin-top:10px;width:100%;padding:10px 12px;border:1px solid rgba(89,235,255,.32);border-radius:10px;background:linear-gradient(90deg,rgba(18,170,205,.22),rgba(111,90,220,.20));color:#e9ffff;font:900 8px Orbitron,sans-serif;letter-spacing:1px;cursor:pointer;}
.clan-ghost-btn{margin-top:8px;padding:8px 10px;border:1px solid rgba(102,226,255,.18);border-radius:8px;background:rgba(4,21,31,.72);color:#9bd8e2;font:800 7px Orbitron,sans-serif;cursor:pointer;}
@media(max-width:720px){.clan-create-fields{grid-template-columns:1fr}.clan-badge-editor{grid-template-columns:1fr}.clan-badge-preview{min-height:112px}}

/* V120.26 — responsive Digi picker / outside click friendly geometry */
#ventanaPets.dc-pets-popover{
  max-width:calc(100vw - 24px)!important;
  width:min(var(--dc-pets-width,300px),calc(100vw - 24px))!important;
  max-height:min(68vh,560px)!important;
  box-sizing:border-box!important;
  overflow:auto!important;
}
@media(max-width:480px){
  #ventanaPets.dc-pets-popover{width:min(280px,calc(100vw - 20px))!important;max-height:64vh!important;}
  #ventanaPets.dc-pets-popover .petItem{grid-template-columns:40px minmax(0,1fr)!important;min-height:48px!important;font-size:.78rem!important;}
}


/* V120.28 — compact responsive Digi picker */
#ventanaPets.dc-pets-popover{width:min(var(--dc-pets-width,250px),calc(100vw - 78px))!important;max-width:250px!important;max-height:min(55vh,420px)!important;padding:7px!important;gap:5px!important;border-radius:12px!important;backdrop-filter:blur(10px) saturate(125%)!important;-webkit-backdrop-filter:blur(10px) saturate(125%)!important;}
#ventanaPets.dc-pets-popover h3{font-size:.9em!important;margin:2px 3px 6px!important;}
#ventanaPets.dc-pets-popover .petItem{grid-template-columns:38px minmax(0,1fr)!important;gap:6px!important;min-height:44px!important;padding:4px 6px!important;font-size:.72rem!important;border-radius:9px!important;}
#ventanaPets.dc-pets-popover .pet-thumbnail{width:32px!important;height:32px!important;}
@media(max-width:480px){#ventanaPets.dc-pets-popover{width:min(225px,calc(100vw - 70px))!important;max-width:225px!important;max-height:52vh!important;padding:6px!important;}#ventanaPets.dc-pets-popover .petItem{grid-template-columns:34px minmax(0,1fr)!important;min-height:40px!important;font-size:.68rem!important;}#ventanaPets.dc-pets-popover .pet-thumbnail{width:30px!important;height:30px!important;}}
#petContainer.dc-game-pet-host{isolation:isolate;overflow:visible;}#petContainer .dc-game-pet3d{touch-action:manipulation;}

/* V120.28 compact Digi picker: smaller, fixed, touch-safe; outside layer handles dismissal. */
#ventanaPets.dc-pets-popover{width:min(205px,var(--dc-pets-width,205px),calc(100vw - 74px))!important;max-width:205px!important;max-height:min(48vh,360px)!important;padding:6px!important;gap:4px!important;border-radius:10px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
#ventanaPets.dc-pets-popover h3{font-size:.82em!important;margin:1px 3px 4px!important;}
#ventanaPets.dc-pets-popover .petItem{grid-template-columns:34px minmax(0,1fr)!important;gap:5px!important;min-height:38px!important;padding:3px 5px!important;font-size:.66rem!important;border-radius:8px!important;}
#ventanaPets.dc-pets-popover .pet-thumbnail{width:28px!important;height:28px!important;}
@media(max-width:480px){#ventanaPets.dc-pets-popover{width:min(195px,calc(100vw - 68px))!important;max-height:46vh!important;}#ventanaPets.dc-pets-popover .petItem{grid-template-columns:31px minmax(0,1fr)!important;min-height:36px!important;font-size:.62rem!important;}#ventanaPets.dc-pets-popover .pet-thumbnail{width:26px!important;height:26px!important;}}


/* V120.35 — DIGIS popup is body-level and internally scrollable; outside click closes, inside never closes. */
#ventanaPets.dc-pets-popover{position:fixed!important;z-index:100050!important;pointer-events:auto!important;touch-action:pan-y!important;overscroll-behavior:contain!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;}
#ventanaPets.dc-pets-popover .petItem{pointer-events:auto!important;touch-action:manipulation!important;}
#dcPetsDismissLayerV12028{z-index:100039!important;}
