/* ========================================================= */
/* MÓDULO DOS CARTÕES DE PRODUTOS E PAINEL CONFIG            */
/* ========================================================= */

.gpl-card {
background: #1f2937;
border: 2px solid #374151;
border-radius: 16px;
overflow: hidden;
transition: all 0.4s ease;
cursor: pointer;
position: relative;
display: flex;
flex-direction: column;
}

.gpl-card:hover {
border-color: #10b981;
box-shadow: 0 10px 25px rgba(16, 185, 129, 0.15), 0 0 0 1px #10b981 inset;
transform: scale(0.97);
}

.gpl-card.active-card-gpl {
border-color: #10b981;
box-shadow: 0 0 20px rgba(16, 185, 129, 0.5), 0 0 0 1px #10b981 inset;
transform: scale(1);
z-index: 5;
}

.gpl-card-stage {
width: 100%;
position: relative;
overflow: hidden;
background: #111827;
display: flex;
align-items: center;
justify-content: center;
}

.gpl-card:hover .gpl-global-preview-stage img,
.gpl-card.active-details-gpl .gpl-global-preview-stage img {
transform: scale(1.08);
}

.gpl-badge-version-bottom {
position: absolute;
bottom: 10px;
left: 10px;
background: #111827;
backdrop-filter: blur(4px);
border: 1px solid #38bdf8;
color: #ffffff;
padding: calc(5px * var(--card-scale, 1)) calc(10px * var(--card-scale, 1));
border-radius: 8px;
font-size: calc(0.85rem * var(--card-scale, 1));
font-weight: bold;
z-index: 10;
display: flex;
align-items: center;
gap: 6px;
transition: all 0.3s ease;
}
.gpl-badge-version-bottom i { color: #facc15; transition: all 0.3s ease; font-size: calc(0.85rem * var(--card-scale, 1)); }

.gpl-card:hover .gpl-badge-version-bottom,
.gpl-badge-version-bottom:hover {
background: #111827;
border-color: #ec4899;
box-shadow: 0 0 12px rgba(236, 72, 153, 0.4);
}
.gpl-card:hover .gpl-badge-version-bottom i,
.gpl-badge-version-bottom:hover i { color: #4ade80; }

.gpl-card-config-btn {
position: absolute;
top: 10px;
right: 10px;
background: rgba(15, 23, 42, 0.85);
backdrop-filter: blur(4px);
color: #9ca3af;
width: calc(34px * var(--card-scale, 1));
height: calc(34px * var(--card-scale, 1));
border-radius: 8px;
font-size: calc(1rem * var(--card-scale, 1));
z-index: 15;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #374151;
transition: all 0.3s ease;
cursor: pointer;
}
.gpl-card-config-btn i { transition: transform 0.4s ease; }

.gpl-card:hover .gpl-card-config-btn {
border-color: #8b5cf6;
color: #a78bfa;
box-shadow: 0 0 10px rgba(139, 92, 246, 0.3);
}
.gpl-card-config-btn:hover {
background: #111827;
border-color: #d946ef;
color: #f0abfc;
box-shadow: 0 0 15px rgba(217, 70, 239, 0.5);
}
.gpl-card-config-btn:hover i { transform: rotate(90deg); }

.gpl-card-config-btn.active-config-gpl {
background: #111827;
border-color: #10b981;
color: #34d399;
box-shadow: 0 0 20px rgba(16, 185, 129, 0.6);
}
.gpl-card-config-btn.active-config-gpl i { transform: rotate(180deg); color: #10b981; }

/* Overlay Escuro Bem Suave Restaurado - Apenas 0.25 de transparência! */
.gpl-card-hover-overlay {
position: absolute;
inset: 0;
background: rgba(15, 23, 42, 0.25);
z-index: 4;
opacity: 0;
transition: opacity 0.4s ease;
pointer-events: none;
}
.gpl-card:hover .gpl-card-hover-overlay,
.gpl-card.active-details-gpl .gpl-card-hover-overlay { opacity: 1; }

.gpl-card-info {
padding: 16px;
flex-grow: 1;
display: flex;
flex-direction: column;
background: rgba(15, 23, 42, 0.9);
border-top: 2px solid #374151;
transition: border-top-color 0.4s ease;
}

.gpl-card:hover .gpl-card-info,
.gpl-card.active-card-gpl .gpl-card-info {
border-top-color: #10b981;
}

.gpl-card-title {
font-size: calc(1.1rem * var(--card-scale, 1));
font-weight: 700;
color: #f3f4f6;
line-height: 1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
margin: 0;
text-align: center;
transition: all 0.3s ease;
}

.gpl-card:hover .gpl-card-title,
.gpl-card.active-card-gpl .gpl-card-title {
color: #38bdf8;
text-shadow: 0 0 10px rgba(56, 189, 248, 0.5);
}

/* ========================================================= */
/* --- PAINEL DE CONFIGURAÇÕES (THUMBNAIL & BOTÕES)          */
/* ========================================================= */

.gpl-config-header-magic {
display: flex;
flex-direction: column;
align-items: center;
margin-bottom: 25px;
width: 100%;
}

/* Ajustes da Miniatura da Preview do Painel */
.gpl-config-mini-preview {
width: 70%;
max-width: 280px;
border-radius: 5px; /* Raio Científico Mágico de 5px */
border: 1px solid #8b5cf6; /* Espessura Super Fina de 1px */
box-shadow: 0 0 25px rgba(139, 92, 246, 0.3);
margin-bottom: 16px;
overflow: hidden; /* Garante que as imagens não fujam do raio */
}

.gpl-config-sci-title {
font-size: 1.35rem;
font-weight: 900;
color: #fff;
text-align: center;
margin: 0;
background: linear-gradient(90deg, #ffffff, #00fffa, #2eff00);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-shadow: 0 0 20px rgba(168, 85, 247, 0.4);
padding: 0 10px;
}

.gpl-config-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 15px;
padding: 4px;
}

.gpl-config-grid .painel-mestre-card {
border: 1px solid var(--btn-border-color, rgba(255, 255, 255, 0.15)) !important;
background: rgba(31, 41, 55, 0.5) !important;
}

.gpl-config-grid .painel-mestre-card-icon i {
color: var(--btn-icon-color, #ffffff) !important;
opacity: 1 !important;
filter: drop-shadow(0 0 8px var(--btn-border-color, transparent));
}

.gpl-config-grid .painel-mestre-card:hover {
border-color: var(--btn-icon-color) !important;
box-shadow: 0 0 15px var(--btn-border-color) !important;
}

.painel-mestre-card.active-fav-magic {
border: 2px solid #facc15 !important;
background: rgba(250, 204, 21, 0.1) !important;
box-shadow: 0 0 20px rgba(250, 204, 21, 0.4), inset 0 0 10px rgba(250, 204, 21, 0.2) !important;
}
.painel-mestre-card.active-fav-magic .painel-mestre-card-icon i {
color: #facc15 !important;
filter: drop-shadow(0 0 10px rgba(250, 204, 21, 0.9));
transform: scale(1.15);
}

.gpl-btn-share-magic.is-magic-shared {
border: 2px solid #d946ef !important;
background: rgba(217, 70, 239, 0.15) !important;
box-shadow: 0 0 30px rgba(217, 70, 239, 0.8) !important;
color: #f0abfc !important;
transform: scale(0.95);
}
.gpl-btn-share-magic.is-magic-shared i {
color: #d946ef !important;
filter: drop-shadow(0 0 15px #d946ef);
animation: pulseShare 0.5s ease-in-out infinite alternate;
}

@keyframes pulseShare {
from { transform: scale(1); }
to { transform: scale(1.3); }
}

.gpl-config-grid .painel-mestre-card:last-child:nth-child(odd) {
grid-column: 1 / -1;
width: fit-content;
margin: 0 auto;
min-width: 65%;
display: flex;
justify-content: center;
}

@media (max-width: 768px) {
.gpl-config-grid { gap: 10px; }
.gpl-config-grid .painel-mestre-card { padding: 12px 10px !important; }
.gpl-config-grid .painel-mestre-card span { font-size: 0.78rem !important; }
.gpl-config-grid .painel-mestre-card-icon i { font-size: 1.15rem !important; }
.gpl-config-grid .painel-mestre-card:last-child:nth-child(odd) { min-width: 80%; }
.gpl-config-mini-preview { width: 85%; }
.gpl-config-sci-title { font-size: 1.15rem; }
}