.codeSnippetContainer{background:linear-gradient(135deg,#484d6a,#a6b6ff);border-radius:8px;color:#fff;position:relative;padding:1px 10px 40px;max-width:100%;overflow:hidden;font-family:Source Code Pro,monospace}.header{display:flex;justify-content:space-between;align-items:center;width:-moz-fit-content;width:fit-content;gap:25px;margin:20px;background-color:#34394f;border-radius:39px;padding:8px 16px;z-index:1}.language{color:#fff;font-size:14px;font-weight:700}.changeLanguage{color:#a0a0a0;font-size:12px;margin-left:8px}.actions{display:flex;gap:12px;z-index:11}.icon{cursor:pointer;color:#a0a0a0;transition:color .2s}.icon:hover{color:#fff}.languageMenu{display:flex;gap:12px;justify-content:flex-start;background-color:#34394f;border-radius:4px;padding:3px 16px;position:absolute;top:21px;left:17%;border-radius:0 17px 17px 17px;opacity:0;transform:scaleX(0);transform-origin:top;transition:opacity .3s ease,transform .3s ease;z-index:0}.languageMenu,.languageMenu.show{width:-moz-fit-content;width:fit-content}.languageMenu.show{opacity:1;transform:scaleX(1);border-radius:39px}.languageOption{padding:8px 16px;color:#ddd;cursor:pointer;font-size:10px;border-radius:50px;transition:background-color .3s ease-in-out}.languageOption:hover{background-color:#2a3b4c}.languageOption.selected{background-color:#3a4b5c}.codeBody{background-color:#0f111a;color:#dcdcdc;padding:20px;border-radius:8px;overflow:auto;font-family:Courier New,Courier,monospace;font-size:14px;line-height:1.6;height:500px}.codeBody code{color:#a0e87e;font-size:14px}.copiedText{color:#a0e87e;font-size:12px;transition:cubic-bezier(.175,.885,.32,1.275)}.languageName{font-weight:700;color:#fff}.changeLanguage{cursor:pointer;transition:opacity .3s ease-in-out;opacity:1}.changeLanguage.hidden{opacity:0}.closeIcon{cursor:pointer;transition:opacity .3s ease-in-out;opacity:0;visibility:hidden}.closeIcon.visible{opacity:1;position:absolute;visibility:visible;left:13%}@media (max-width:768px){.languageMenu{flex-direction:column;left:21%;transform:scaleY(0);width:200px}.languageMenu.show{border-radius:1px;width:200px;transform:scaleY(1)}.closeIcon.visible{left:52%;z-index:1}.actions{z-index:0}}@media (max-width:480px){.header{gap:1px;margin:15px;background-color:#34394f;border-radius:39px;padding:8px 12px;z-index:1;width:236px}.closeIcon.visible{left:77%;z-index:1}}