/* ----- Start Styles For ModuleLayoutCss ---- */
.poem-details {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: wrap;
}

.poem-details .poem-title {
    font-size: 1.5rem;
}

.poem-details .poem-text {
    font-size: 1.1rem;
    font-style: italic;
    white-space: pre-line;
    line-height: 2;
    margin-bottom: 1.6rem;
}

.poem-details .poem-rate {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.poem-details .poem-rate .rate-value {
    background-color: #0a989e;
    padding: .6rem 1.2rem;
    color: #fff;
    line-height: 1;
    border-radius: .6rem;
    margin-bottom: .6rem;
}

.poem-details .poem-rate .rate-count {
    font-size: .85rem;
}


.comments {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    row-gap: 1rem;
}

.comments .comment-item {
    display: flex;
    flex-direction: column;
    row-gap: .6rem;
}

.comments .comment-item .user-basic-info {
    display: flex;
    flex-direction: row;
    column-gap: .5rem;
    font-size: .9rem;
    align-items: center;
    color: #626262;
}

.comments .comment-item .user-basic-info>img {
    border-radius: .5rem;
}

.comments .comment-item .comment-comment {
    font-size: .9rem;
    font-weight: 300;
    margin: 0;
    line-height: 1;
}

.comments .comment-item .comment-date {
    font-size: .8rem;
    font-style: italic;
    color: gray;
}


.default__details .b-field {
    margin-bottom: 1.3em;
}

.default__details .b-field .b-field-label {
    margin-bottom: .45em;
}


.default__details .field-rate {
    display: flex;
    justify-content: flex-end;
    flex-direction: row;
    flex-wrap: wrap;
}

.default__details .field-rate .b-field-label {
    flex: 0 0 96px;
}

.default__details .field-rate .b-field-subtext {
    flex: 1 1 100%;
    margin-left: auto;
    text-align: left;
    font-size: .8rem;
}


/* ----- Start Styles For BootstrapStarRating ---- */

/* ----- End Styles For BootstrapStarRating ----*/

/* ----- Start Styles For Button ---- */
.b-btn {
    display: flex;
    border-radius: .4em;
    border: none;
    color: #fff;
    font-size: .9em;
    font-weight: 400;
    text-align: center;
    align-items: center;
    padding: .5em .8em;
    transition: all 100ms;
    user-select: none;
    touch-action: manipulation;
    column-gap: .5em;
}

.b-btn:disabled {
    opacity: .5;
}

.b-btn.b-btn-default {
    background-image: linear-gradient(-180deg, #37aee2 0%, #1e96c8 100%);
}

.b-btn.b-btn-default:hover {
    background-image: linear-gradient(-180deg, #1d95c9 0%, #17759c 100%);
}

.b-btn.b-btn-submit {
    background-image: linear-gradient(-180deg, #4caf50 0%, #2e7d32 100%);
}

.b-btn.b-btn-submit:hover {
    background-image: linear-gradient(-180deg, #66bb6a 0%, #388e3c 100%);
}

.b-btn.b-btn-action {
    background-image: linear-gradient(-180deg, #f05e4b 0%, #ef4d36 100%);
}

.b-btn.b-btn-action:hover {
    background-image: linear-gradient(-180deg, #ffb84d 0%, #ef4d36 100%);
}

.b-btn.b-btn-cancel {
    background-image: linear-gradient(-180deg, #b0b0b0 0%, #707070 100%);
}

.b-btn.b-btn-cancel:hover {
    background-image: linear-gradient(-180deg, #c9c9c9 0%, #5c5c5c 100%);
}

.b-btn.b-btn-remove {
    background-image: linear-gradient(-180deg, #ff4d4d 0%, #cc0000 100%);
}

.b-btn.b-btn-remove:hover {
    background-image: linear-gradient(-180deg, #ff6666 0%, #e60000 100%);
}
/* ----- End Styles For Button ----*/

/* ----- Start Styles For Textarea ---- */
.b-textarea-group {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 0;
    position: relative;
    padding: .35em .6em;
    border: solid .1em rgb(0 0 0 / 14%);
    column-gap: .4em;
    font-size: .9em;
    width: 100%;
}

.b-textarea-group.b-textarea-small {
    font-size: .75em;
}

.b-textarea-group.b-textarea-large {
    font-size: 1.2em;
}

.b-textarea-group>.b-textarea-icon {
    display: inline-flex;
    font-size: 1.2em;
}

.b-textarea-group>.b-textarea-control {
    background: none;
    border: none;
    box-shadow: none;
    outline: none;
    display: inline-flex;
    flex-grow: 1;
    font-size: 1em;
    line-height: 1em;
}
/* ----- End Styles For Textarea ----*/