@import "https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";
.profile-content,.profile-form{flex-direction:column;justify-content:center;align-items:center;width:90%;min-height:100vh;margin-top:60px;margin-left:auto;margin-right:auto;display:flex}.profile-form form{background:var(--bg-white);box-shadow:0 4px 16px var(--song-item);border:none;border-radius:8px;flex-direction:column;width:90%;max-width:320px;padding:20px;display:flex}.profile-form .form-group{margin-bottom:20px}.profile-form input[type=email],.profile-form input[type=password]{border:2px solid var(--border);border-radius:4px;width:100%;padding:12px}.profile-info input{border:1.25px solid var(--border);border-radius:8px;padding:10px}.profile-info label,.profile-info span{color:var(--light-txt)}.save-button{margin-left:15px}.profile-form .auth-button{background-color:var(--accent);color:var(--txt-white);cursor:pointer;border-radius:4px;padding:12px;transition:background-color .2s}.profile-form .auth-button:hover{background-color:var(--accent)}.profile-form .login-error,.signup-success{text-align:center;width:100%;margin-top:10px;font-size:14px}.signup-success{background-color:var(--signup-bg);color:var(--signup-color);box-shadow:0 2px 4px var(--song-item);border-radius:8px;max-width:750px;margin-bottom:20px;padding:12px 24px}.profile-form .toggle-button{color:var(--accent);cursor:pointer;background:0 0;border:none;margin-top:20px;transition:-webkit-text-decoration .2s,text-decoration .2s}.profile-form .toggle-button:hover{text-decoration:underline}.toggle-button{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:10px;font-size:18px;transition:-webkit-text-decoration .3s,text-decoration .3s,color .3s}.toggle-button:hover{color:var(--accent-hover);text-decoration:underline}.profile-content .button{cursor:pointer;border:none;border-radius:4px;padding:8px 16px;transition:background-color .2s}.upload-button,.my-songs-button,.logout-button{background-color:var(--accent);color:var(--txt-white);font-size:16px}.upload-button:hover,.my-songs-button:hover,.logout-button:hover{background-color:var(--accent-hover)}.profile-loading{height:100vh;color:var(--txt);justify-content:center;align-items:center;display:flex}.upload-success,.upload-error{text-align:center;border-radius:4px;width:90%;margin:10px 0;padding:10px}.upload-success{color:var(--accent);background-color:var(--upload-success-bg);border:1px solid var(--accent)}.upload-error{color:var(--upload-error);background-color:var(--upload-error-bg);border:1px solid var(--upload-error)}.profile-actions{flex-wrap:wrap;justify-content:center;gap:10px;width:100%;margin:20px 0;display:flex}.welcome-message{background-color:var(--txt-white);text-align:left;width:100%;box-shadow:0 4px 8px var(--song-item);background:var(--bg-white);color:var(--txt);border-radius:15px;margin-bottom:20px;padding:20px}.welcome-message strong{color:var(--accent)}.toggle-upload-button{background-color:var(--accent);color:var(--txt-white);cursor:pointer;border:none;border-radius:4px;padding:8px 16px;transition:background-color .2s}.toggle-upload-button:hover{background-color:var(--accent-hover)}.upload-button{margin-bottom:50px}.logout-button{background-color:var(--logout-button);transition:background-color .2s}.logout-button:hover{background-color:var(--logout-button-hover)}.profileDetails{justify-content:space-between;align-items:center;display:flex}.profileDetailsText{align-items:center;gap:8px;display:flex}.profileDetailsText label,.profileDetailsText span{font-size:16px}.editUserName{color:var(--icon-color);background-color:#0000;padding:5px;font-size:20px}.editUserName:hover{color:var(--icon-color-hover)}.my-songs:hover{background-color:var(--accent-hover)}.profile-form .form-group{width:100%;margin-bottom:20px}.profile-form input[type=text],.profile-form input[type=email],.profile-form input[type=password],.profile-form textarea{border:2px solid var(--border);background:var(--bg);width:100%;color:var(--txt);border-radius:4px;padding:12px}.profile-form input:focus,.profile-form textarea:focus,.profile-form select:focus{border-color:var(--accent);box-shadow:0 0 8px var(--accent);outline:none}.profile-form input,.profile-form input:focus,.profile-form input:active,.profile-form input:focus-visible{background-color:var(--bg);color:var(--txt)}.profile-form h1{color:var(--accent);margin-bottom:20px}.song-upload-section input[type=text],.song-upload-section textarea{box-sizing:border-box;min-width:100%}.song-upload-section h2{color:var(--accent);margin-bottom:10px}.song-upload-section .form-group{flex-direction:column;align-items:flex-start;display:flex}.song-upload-section select{border:1px solid var(--border-2);border-radius:4px;width:100%;margin:8px 0;padding:8px}@media (max-width:768px){.profile-form .form-group{width:100%}}.song-upload-section{background:var(--bg-white);width:100%;max-width:900px;box-shadow:0 4px 16px var(--song-item);border-radius:10px;margin-bottom:30px;padding:20px}.song-upload-section .form-group{width:100%;margin-bottom:15px}.song-upload-section input[type=text],.song-upload-section textarea{border:1px solid var(--border);background-color:var(--bg);text-align:center;border-radius:4px;width:100%;padding:12px}.song-upload-section textarea{resize:none;min-height:210px;line-height:2;overflow:hidden}.song-upload-section select{border:1px solid var(--border);background-color:var(--bg);border-radius:4px;width:100%;padding:12px}.song-upload-section label{margin-bottom:8px;font-weight:700;display:block}.profile-form .writer-selection label{align-items:center;margin-bottom:5px;display:flex}.profile-form .writer-selection input[type=radio]{margin-right:10px}.profile-form .writer-selection .radio-label-text{margin-left:5px}.writer-selection input{margin-right:10px}.song-upload-section select,.song-upload-section option{font-family:Comfortaa,sans-serif;font-weight:400}.song-upload-section select{border:1px solid var(--border);background-color:var(--bg-white);width:100%;color:var(--txt-dark);appearance:none;cursor:pointer;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2212%22%20height%3D%2212%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cg%3E%3Cpolygon%20fill%3D%22%23666%22%20points%3D%220%2C0%206%2C6%2012%2C0%22%2F%3E%3C/g%3E%3C/svg%3E);background-position:right 10px center;background-repeat:no-repeat;background-size:12px;border-radius:4px;padding:8px 12px;font-family:Comfortaa,sans-serif;font-size:1rem}.song-upload-section select:focus{border-color:var(--accent);outline:none}.song-upload-section option{font-family:Comfortaa,sans-serif}.profile-hero-image{justify-content:center;margin:30px 0;display:flex}.profile-hero-image img{border-radius:18px;width:100%;max-width:320px;height:auto}.song-upload-section .form-group input{text-align:left}.profile-form input:-webkit-autofill{caret-color:var(--txt);transition:background-color 9999s ease-in-out;-webkit-box-shadow:0 0 0 1000px var(--bg) inset!important;-webkit-text-fill-color:var(--txt)!important}.profile-form input:-webkit-autofill:hover{caret-color:var(--txt);transition:background-color 9999s ease-in-out;-webkit-box-shadow:0 0 0 1000px var(--bg) inset!important;-webkit-text-fill-color:var(--txt)!important}.profile-form input:-webkit-autofill:focus{caret-color:var(--txt);transition:background-color 9999s ease-in-out;-webkit-box-shadow:0 0 0 1000px var(--bg) inset!important;-webkit-text-fill-color:var(--txt)!important}.profile-form input:-webkit-autofill:active{caret-color:var(--txt);transition:background-color 9999s ease-in-out;-webkit-box-shadow:0 0 0 1000px var(--bg) inset!important;-webkit-text-fill-color:var(--txt)!important}.login-error{background-color:var(--signup-bg);color:var(--signup-color);text-align:center;border-radius:8px;margin-top:12px;margin-bottom:12px;padding:12px 16px;font-size:14px}.welcome-header{justify-content:center;align-items:center;gap:20px;margin-bottom:30px;display:flex}.welcome-avatar{object-fit:cover;border:1px solid var(--border);border-radius:12px;width:80px;height:80px}.welcome-text{margin:0}.welcome-text strong{background:var(--bg);border-radius:6px;padding:5px}.welcome-subtext{text-align:center}.edit-username-button{font-size:16px;transition:background-color .2s}.edit-username-button:hover{background-color:var(--accent-hover)}.edit-username-group{text-align:left;width:100%;max-width:420px}.edit-username-actions{gap:14px;margin-top:12px;display:flex}.cancel-button{background-color:var(--border);color:var(--txt)}.cancel-button:hover{background-color:var(--border-2)}.profile-info input{background-color:var(--bg-white);color:var(--txt);outline:none}input:focus,textarea:focus,select:focus,input:focus-visible,textarea:focus-visible,select:focus-visible{box-shadow:0 0 8px var(--accent);outline:none;border-color:var(--accent)!important}.lyrics-help-text{color:var(--lyrics-help-text)}.profile-content button,.profile-content .auth-button,.profile-content .my-songs{background-color:var(--accent);color:var(--txt-white);cursor:pointer;font-family:var(--font-main);border:none;border-radius:6px;padding:8px 16px;font-size:16px}.profile-content button:hover,.profile-content .auth-button:hover,.profile-content .my-songs:hover{background-color:var(--accent-hover)}.profile-content .logout-button{background-color:var(--logout-button);color:var(--txt-white)}.profile-content .logout-button:hover{background-color:var(--logout-button-hover)}.song-upload-section,.song-upload-section label,.song-upload-section h2,.song-upload-section p,.song-upload-section span{color:var(--txt)}.song-upload-section h2{color:var(--accent)}.writer-selection label{color:var(--txt)}.script-toggle{margin:10px auto 20px}.script-option{color:var(--txt-toggle)}.script-option.active{color:var(--txt-white)}.script-toggle{background-color:var(--border);border:1px solid var(--toggle-border);border-radius:8px;width:fit-content;margin:10px auto 20px;padding:4px;display:flex}.script-option{cursor:pointer;color:var(--txt-toggle);-webkit-user-select:none;user-select:none;border-radius:5px;padding:6px 18px;font-size:.9rem;transition:all .25s}.script-option.active{background-color:var(--accent);color:#fff;font-weight:500;box-shadow:0 2px 6px #00000026}@media (max-width:600px){.profile-actions{flex-direction:column;align-items:stretch;width:100%}.profile-actions button,.profile-actions .my-songs{text-align:center;width:100%;max-width:320px;margin:0 auto}}