/* Global Fix for "Huge Box" issues - removing default outlines and focus rings */
*:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Only apply a subtle border color change for accessibility if needed, or rely on custom styles */
input:focus, textarea:focus, select:focus {
    border-color: var(--neon-purple) !important;
    box-shadow: 0 0 5px rgba(176, 38, 255, 0.3) !important;
}

/* Remove any potential transform causing 3D effects globally on cards */
.card, .profile-header-card, .inventory-card, .skin-card {
    transform: none !important;
    perspective: none !important;
    transform-style: flat !important;
}

/* Ensure hover states don't re-add transforms */
.card:hover, .profile-header-card:hover, .inventory-card:hover, .skin-card:hover {
    transform: none !important;
}

.ripple-effect {
    position: absolute !important;
    left: 0;
    top: 0;
    transform: translate(-50%, -50%) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    background: rgba(255, 255, 255, 0.25) !important;
    opacity: 0.7;
    width: 0;
    height: 0;
    z-index: 0;
}

@keyframes ripple-expand {
    from { transform: translate(-50%, -50%) scale(0); opacity: 0.7; }
    to   { transform: translate(-50%, -50%) scale(1); opacity: 0; }
}

/* Expand messages tab to full width and remove sidebars */
.profile-container:has(#tab-content-messages.active) .profile-grid-3-cols {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}
.profile-container:has(#tab-content-messages.active) .profile-sidebar-left,
.profile-container:has(#tab-content-messages.active) .profile-sidebar-right {
    display: none !important;
}
.profile-container:has(#tab-content-messages.active) .profile-content-center {
    grid-column: 1 / -1 !important;
}

/* Block horizontal scroll in chat areas */
.chat-messages { overflow-x: hidden !important; }