.site-wrapper:has(.user-settings-container){flex-direction:column;flex-grow:1;display:flex}.user-settings-container{flex-grow:1;grid-template-columns:1fr 4fr;gap:1em;display:grid}.user-settings-left{flex-direction:column;justify-content:space-between;display:flex}.user-settings-left,.user-settings-right{background-color:var(--ap-colour-card);border-radius:10px;padding:.5em 1em}.user-settings-left-title{margin-bottom:.5em;font-weight:700}.user-settings-left-links{margin:1em 0;display:block}@media only screen and (max-width:600px){.user-settings-container{grid-template-columns:1fr;grid-auto-rows:min-content auto}.user-settings-left{gap:1em;padding-bottom:1em;display:flex;overflow-x:auto}.user-settings-left-links{white-space:nowrap;margin:0}.user-settings-left-title{white-space:nowrap;margin-bottom:0}}.settings-input-container{flex-direction:column;gap:.5em;margin-top:.5em;display:flex}.settings-input-container input,.settings-input-container .settings-input-container-input{border:1px solid var(--ap-colour-primary);background-color:var(--ap-colour-background);width:100%;color:var(--ap-colour-white);box-sizing:border-box;border-radius:8px;outline:none;padding:.75rem .5rem}.settings-input-container input::placeholder{color:var(--ap-colour-white);opacity:.5}.settings-input-container button{background-color:var(--ap-colour-primary);cursor:pointer;color:var(--ap-colour-white);border:none;border-radius:10px;width:100%;margin:1em 0;padding:1em 3em}.settings-input-container button:disabled{color:#6f6f6f;cursor:not-allowed;background-color:#353535}.user-settings-helper-text,.helper-text{opacity:.4;margin-top:.5em}.user-settings-red-btn{background-color:#af2103;width:150px;display:block}.user-settings-delete-popup{margin-top:1em}.user-settings-delete-popup-btn-container{gap:1em;display:flex}.user-settings-delete-popup-btn-container button{width:100%;padding:1.5em}.settings-layout-skeleton>div:first-child{width:20%;height:100%}.settings-layout-skeleton>div:last-child{width:80%;height:100%}@media only screen and (max-width:600px){.settings-layout-skeleton{flex-direction:column}.settings-layout-skeleton>div:first-child{width:100%;height:30%}.settings-layout-skeleton>div:last-child{width:100%;height:70%}}
