.resource-full-page {
    display: flex;
    justify-content: center;
    align-content: center;
}

.resource-top-row {
    padding: 15px 0 15px 0;
    margin-left: 0;
}

.resource-top-row-title {
    font-weight: 900;
    font-size: 24px;
}

.resource-full-wrapper {
    padding-right: 0;;
}

.resource-description-wrapper {
    padding-right: 15px;
    flex-direction: column;
}

.resource-report{
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-align: center;
    color: #4F5674;
    text-decoration: underline;
    margin-left: 5px;
}

.resource-report-button{
    border: none !important;
    background: transparent !important;
    color: #4f5674;
    margin-left: -15px;
}

.resource-report-button:hover{
    border: none !important;
    background: transparent !important;
    color: rgba(15, 20, 41, 0.5);
    margin-left: -15px;
}

.resource-description-short {
    line-height: 2rem !important;
    font-weight: bolder !important;
    margin-top: 20px !important;
    word-break: break-word !important;
    font-size: 20px;
}

.resource-description-long {
    word-break: break-word;
    padding-right: 15px;
    font-size: 16px;
}

.preview-short-post, .preview-full-post{
    border: none;
    display: flex;
}

.resource-post-wrapper, .resource-comment-wrapper, .resource-related-wrapper {
    border: none;
    display: flex;
    margin: 15px;
}


.resource-comment-wrapper, .resource-related-wrapper{
    min-width: calc(100% - 370px);
    max-width: calc(100% - 370px)
}

.resource-comments-feed-wrapper {
    max-height: 360px;
    margin: 15px 0 45px 0;
    overflow-y: auto; /* Show vertical scrollbar if needed */
    overflow-x: hidden; /* Hide horizontal scrollbar */
}

/* Style the scrollbar */
.resource-comments-feed-wrapper::-webkit-scrollbar {
    width: 8px; /* Width of the scrollbar */
}

.resource-comments-feed-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1; /* Color of the scrollbar track */
}

.resource-comments-feed-wrapper::-webkit-scrollbar-thumb {
    background: #888; /* Color of the scrollbar thumb */
    border-radius: 4px; /* Rounded corners of the scrollbar thumb */
}

.resource-comments-feed-wrapper::-webkit-scrollbar-thumb:hover {
    background: #555; /* Color of the scrollbar thumb on hover */
}


.resource-related {
    margin: 0 30px 0 40px;
}

.resource-related-title{
    font-size: x-large;
    margin-bottom: 15px;
}
.resource-related .feed-thumb{

    width: 25px;
    height: 25px;
    padding: 1px;
    border: 1px solid #e2e0e0;
    border-radius: 7px;
    position: relative;
    right: -10px;
    bottom: 10px;
    z-index: 99 !important;
    background-color: white;

}
.resource-related .screenshot {
    object-fit: cover;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    overflow: hidden;
}

.resource-full-mobile .resource-related-mobile{
    margin:0;
    padding:0;
}

/*Resource styling for the preview feed /create and /edit*/
.resource-full-preview{
    background: white;
    border-radius: 15px;
    box-shadow: 0 4px 6px 0 lightgray;
}

.resource-top-row-preview{
    width: 100% !important;
    padding: 15px 0 15px 0;
    margin-left: 0;
}

.resource-thumb-preview-wrapper{
    padding-left: 0;
    max-width: fit-content;
}

.resource-thumb-preview{
    width: 64px;
    height: 64px;
    padding: 10px;
    box-shadow: 1px 1px 5px lightgray;
    border-radius: 15px;
}

.resource-screenshot-preview {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0 30px 0;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    border-radius: 15px;
    overflow: hidden;
}

.resource-screenshot-preview img {
    width: 100%;
    max-width: none;
    height: auto;
    max-height: 600px;
    object-fit: cover;
    border: rgba(211, 211, 211, 0.5) 1px solid;
    border-radius: 15px;
}

.action-menu-share {
    justify-content: left;
}

.action-share-title, .action-category-title, .action-description-title{
    font-size: 14px;
    font-weight: 500;
    line-height: 16px;
    text-align: left;
    min-width: 100%;
}

.action-category-title{
    margin: 10px 0 16px -15px;
}

.action-description-title{
    margin-left: -15px ;
}

.action-share-buttons{
    margin: 16px 0 0 15px;
}

.action-full-menu-wrapper {
    flex-direction: column;
    min-width: 370px ;
    max-width: 370px ;
    margin-right: -45px ;
}

.share-preview-title{
    font-size: 1.25rem !important;
    font-weight: bolder;
    color: #0F1429;
    margin-left: 15px ;
    margin-bottom: 15px;
}

.share-inputs-wrapper{
    max-width: 33%;
}

.share-link-validator-container {
    margin: 10px 0;
}

.share-fetch-button {
    font-weight: bold;
    padding: 10px;
    transition: background-color 0.3s ease;
    border-radius: 8px;
}

.preview-full-post {
    pointer-events: none;
}

.preview-short-post {
    pointer-events: none;
    padding: 0;
    border: none;
    background-color: #f8f9fa;
}

.action-wrapper-parent, .action-wrapper-parent-author {
    margin-bottom: 24px;
    margin-left: -15px;
}

.action-menu-buttons {
    flex-wrap: nowrap !important;
    text-wrap: none;
    justify-content: space-between;
}

.resource-post-wrapper{
    margin-left: -15px;
}

.resource-post-wrapper{
    margin-left: -15px;
}

.resource-comments:last-of-type {
    border-bottom: none;
}

.resource-post-wrapper img {
    margin: auto;
    object-fit: contain;
}

.resource-edit-title {
    font-size: 20px;
    font-weight: bolder;
    margin: 0 0 0 3px;
}

.resource-edit-wrapper {
    border-radius: 15px !important;
    background-color: #ffffff;
    border: solid lightgray 1px;
    padding: 5px 15px;
    margin-top: 20px;
}

#form-control-tags {
    border-radius: 10px 0 0 10px !important;
    text-transform: capitalize !important;
    padding-top: 30px !important;
}

.form-control-tags-add {
    border-radius: 0 10px 10px 0 !important;
    border: 1px solid lightgray;
}

.form-control{
    border-radius: 10px ;
}

.form-control:focus {
    border-radius: 10px !important;
    box-shadow: 0 0 10px #F18805 !important;
    border-color: #F18805 !important;
    text-shadow: none !important;
    outline: none !important;
}

.resource-full-desktop{
    margin: 0 15px;
}

.resource-screenshot {
    width: 100%;
    height: auto;
    padding: 5px 0 30px 0;
    justify-content: center;
}

.resource-screenshot img {
    display: flex;
    width: 100%;
    height: auto;
    /*height: 250px;*/
    max-height: 600px;
    object-fit: cover;
    border-radius: 15px;
}


.resource-comments-user {
    font-weight: bold;
    justify-content: space-evenly;
}

.resource-comments-feed {
    flex-direction: column;
}

.comment-profile-pic {
    color: #2d4456 !important;
    border: #2D4456 solid thin;
    border-radius: 5px;
    text-align: center;
    overflow: hidden;
    height: 60px;
    width: 60px;
    background-position: center center;
    background-repeat: no-repeat;
}

.author-profile-pic {
    display: none;
}

.resource-comments-profile-pic {
    max-width: 60px;
    max-height: max-content;
    padding-top: 22px;
    margin-left: 7px;
    padding-right: 7px;
}
.action-parent-wrapper{
    margin-left: -15px;
}

.action-author-pic{
    max-width: 48px;
    padding-left: 0;
}

.action-author-pic img {
    border-radius: 50%;
    height: 48px;
    width: 48px;
}

.resource-comments-profile-pic img {
    object-fit: cover;
    object-position: center;
}

.resource-author-wrapper {
    margin: 10px auto 0 10px;
    flex-wrap: nowrap;
    width: max-content;
}

.resource-comments-user-wrapper {
    border-bottom: lightgray solid 1px;
    padding: 22px 0 40px 50px;
    max-width: 88%;
}

.resource-comments-user-wrapper:first-of-type {
    border-bottom: none;
}

.resource-comments-title {
    font-weight: 900;
    /*padding: 5px;*/
    color: #2d4456;
    margin-left: 15px;
}

.resource-editor {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.resource-edit-title {
    margin: 0;
}

.resource-delete-button {
    background: none;
    color: red;
    border: none;
    text-decoration: none;
    cursor: pointer;
    padding: 0;
    font-size: inherit;
}

.action-report-button-wrapper {
    padding-top: 30px;
    /*text-align: center;*/
    /*transform: scale(0.70);*/
}

.action-author-name {
    font-size: 18px;
    font-weight: 700;
    /*line-height: 32px;*/
    text-align: left;
    color: #0F1429;
}

.action-divider{
    color: #E5E6EA;
    width: 310px;
    margin-left: -15px;
    margin-right: -15px;
}

.action-divider-author{
    color: #E5E6EA;
    margin-left: -15px;
    margin-right: 15px;
}

.action-stats-kudos{
    display: flex;
    justify-content: flex-end;
}

.action-stats-save{
    display: flex;
    justify-content: flex-start;
}

.action-author-creator-wrapper{
    display: flex;
    flex-direction: column;
    justify-content: left;
}

.action-author-creator{
    font-size: 14px;
    font-weight: 500;
    text-align: left;
}

.price-tag {
    background-color: #9B84C3;
    color: black;
    border-radius: 8px;
    margin-top: 10px;
    padding: 5px 15px;
    display: inline-block;
    font-size: 16px;
    font-weight: bold;
    border: 1px solid black;
    width: 65px;
    height: max-content;
}

.resource-author-content {
    color: #2d4456;
    flex-flow: nowrap;
    font-size: small;
}

.resource-author-view-profile {
    justify-content: flex-end;
    margin: 30px 0 0 0;
    padding-right: 30px;
}

.resource-comments-textarea-wrapper {
    flex-wrap: nowrap !important;
    margin: 0 auto;
}

.resource-comments-textarea {
    display: block;
    width: 100%;
    height: 60px;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 10px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    padding: 5px 100px 5px 5px;
    overflow-y: hidden;

}

.resource-comments-textarea:focus {
    outline: none !important;
    box-shadow: 0 0 10px #F18805 !important;
    border-color: #F18805 !important;
    text-shadow: none !important;
}

.resource-tags-wrapper {
    margin: 16px 0 24px 0;
}

.button-resource-comments {
    align-self: center;
    margin-left: -85px;
    z-index: 100;
}

.resource-add-image-wrapper {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}

.button-resource {
    width: 80%;
    height: 50px;
}

.action-seeit{
    display: flex;
    justify-content: left;
}

.button-seeit {
    width: 310px;
    padding: 30px !important;
    border-radius: 10px !important;
    color: white !important;
    border: none !important;
    background-color: #FF4A00 !important;
    margin: 0 0 24px 0;
}

.button-seeit:hover {
    width: 310px;
    border-radius: 10px !important;
    color: white !important;
    background-color: rgba(15, 20, 41, 0.8) !important;
    border: none !important;
}

.action-cta-buttons{
    text-align: center;
    display: flex;
    margin-left: -45px;
}

.button-kudos-action-not-given, .button-kudos-action-given,
.button-save-action, .button-save-action-saved{
    border: 1px solid rgba(27, 43, 66, 0.1) !important;
    width: 130px;
    cursor: pointer !important;
    font-size: 14px;
    font-weight: 500 !important;
    text-align: center;
    height: 40px;
    padding: 0 !important;
    border-radius: 8px !important;
}

.action-social-title {
    font-weight: bolder;
    max-width: fit-content;
    width: fit-content;
    margin: 0;
    padding: 0;
}

.action-social-content, .action-social-content-share {
    display: flex;
    justify-content: center;
    border-radius: 50%;
    border: none;
    outline: none;
    margin-right: 8px;
    cursor: pointer;
    height: 40px;
    width: 40px;
    background-color: #c8cbd4;
    padding: 0;
    align-items: center;
}

.action-social-content-share{
    background-color: #0cceb3;
    color: white;
}

.action-social-content-share:hover{
    background-color: rgba(12, 206, 179, 0.3);
}

.action-social-content-share:focus{
    background-color: #FF4A00;
}

.action-social-content-share:active{
    background-color: #FF4A00;
}

.action-social-content:hover {
    background-color: rgba(12, 206, 179, 0.3);
}

.action-social-content-icons {
}

.action-menu-social-row{
    justify-content: center;
}


.button-copy-action-menu:focus {
    outline: none;
}

#create-platform-dropdown optgroup[label] {
    color: rgb(45, 68, 86) !important;
    background-color: rgba(45, 68, 86, 0.15) !important;
    text-transform: uppercase;
}

#create-platform-dropdown option {
    color: rgba(45, 68, 86, 0.8) !important;
    text-transform: capitalize;
    background-color: white;
}

.create-link-validator-fail,
.create-link-validator-pass,
.create-link-validator-warning {
    position: absolute;
    display: flex;
    justify-content: center;
    z-index: 1001;
    font-weight: bolder;
    font-size: 16px;
    margin-top: 5px;
    left: 0;
    right: 0;
    color: red;
}

.create-link-validator-pass {
    color: #1E9F22 !important;
}

.create-link-validator-warning {
    color: #f18805 !important;
}

.create-link-validator-container {
    position: relative;
    min-height: 30px; /* Reserve space for the validation messages */
    margin-top: 5px;
}

.share-left-col {
    background-color: white;
    padding: 20px;
    border: 1px solid lightgray;
    border-radius: 15px;
}

.resource-alert {
    margin: 0 auto 30px auto;
    padding: 30px;
}

.RLV-remove {
    color: red;
    font-weight: bolder;
    border: 1px solid;
    border-radius: 12px;
    padding: 2px 5px;
    margin: 0 auto 45px auto;
    max-width: 50%;
    text-align: center;
}

.RLV-remove:hover {
    background: rgba(217, 93, 57, 0.3);
}

.sharedResources-wrapper,
.purchasedResources-wrapper{
    display: flex;
    flex-wrap: nowrap;
}

.sharedResources-posts,
.purchasedResources-posts{
    width: 70%;
    flex-direction: column;
    padding: 15px;
}

.sharedResources-sidebar,
.purchasedResources-sidebar{
    min-width: 350px;
    max-width: 350px;
    padding: 15px;
    margin-right: -15px;
    margin-top: 30px;
}

/*Styling for sharedResourceView.jsx*/
.shareResource-sidebar {
    border: solid 1px lightgrey;
    border-radius: 15px;
    padding: 15px;
    margin-top: 30px;
    margin-bottom: 30px;
    height: fit-content;
}

.share-resource-button{
    width: 100%;
    margin-top: 30px;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.share-price-input input {
    background-color: #f8f9fa !important;
    border: none !important;
    box-shadow: none !important;
    height: 40px !important;
    outline: none !important;
    border-radius: 0 !important;
    display: block !important;
}