@import "./partials/notice.scss";

.wp-core-ui .doc-category-kb[multiple] {
    padding: 10px 0;
    min-width: 300px;
}

.doc-category-kb option {
    padding: 10px;
}

#taxonomy-knowledge_base #knowledge_base-add-toggle {
    display: none;
}

.wp-list-table {
    .reactions-count {
        display: flex;
        flex-direction: row;
        gap: 6px;

        .betterdocs-feelings {
            display: flex;
            flex-direction: row;
            align-items: center;
            color: #2c3338;

            svg {
                margin-right: 3px;
                fill: #696969;
            }
        }
    }
}

/** Estimated Reading Time Metabox Css **/
#advanced-sortables {
    .postbox {
        flex: 1;

        .postbox-header {
            .hndle {

                &.ui-sortable-handle {
                    color: #1d2939;
                    font-size: 20px;
                    font-style: normal;
                    font-weight: 600;
                    line-height: normal;
                    text-align: center;
                }

            }

            .handle-order-higher, .handle-order-lower {
                    display: none;
            }
        }

        .inside {
            .est-reading-box-wrapper {
                .est-reading-box-outer-wrapper {
                    background: #f9fafb;
                    border-radius: 6px;
                    display: flex;
                    margin: 0px 0px 25px 0px;
                    padding: 1em;
                    width: 98%;

                    input {
                        align-items: center;
                        background: #fff;
                        border: 1px solid #d0d5dd;
                        border-radius: 8px;
                        display: flex;
                        flex: 1;
                        justify-content: space-between;
                        padding: 13px 35px 13px 20px;

                        &:focus {
                            outline: none;
                        }

                        &:active {
                            outline: none;
                        }

                        &:focus-visible {
                            outline: none;
                        }
                    }
                }

                p {
                    color: #475467;
                    font-size: 16px;
                    font-style: normal;
                    font-weight: 400;
                    line-height: 1.5em;
                    margin: 0 0 30px;
                }
            }
        }
    }
}

.wpnotice-wrapper.betterdocs {
    border-left-color: #00b682;
    .wpnotice-thumbnail-wrapper {
        flex: 0 0 auto;
    }

    .wpnotice-content-wrapper {
        flex: 1;
        overflow: hidden;
    }

    .betterdocs-notice-body {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        p {
            margin: 0;
            flex: 1;
            font-size: 14px;
        }
        a.button-primary {
            text-align: right;
            flex-shrink: 0;
            background-color: #5626E7;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 10px;
            svg {
                margin-right: 8px;
            }
            &:hover {
                background-color: #5626E7;
            }
            &:focus {
                box-shadow: none;
            }
        }
		&.betterdocs-summer-notice-body {
			flex-direction: row;
			align-items: center;
			.betterdocs-notice-actions {
				display: flex;
				flex-direction: row;
			}
			.dismiss-btn {
				color: #5252DC;
				border-bottom: 1px solid #5252DC;
				font-size: 14px;
				line-height: 28px;
				margin-left: 16px;
			}
		}
    }
}

.notice-betterdocs-summer-campaign-26 {
	.betterdocs-summer-notice-body {
		p {
			font-size: 14px;
			line-height: 100%;
			text-transform: capitalize;
			color: #171717;
			margin: 0;
		}
	}
	.betterdocs-notice-links {
		.offer-button {
			border-radius: 6px;
			padding-top: 8px;
			padding-right: 16px;
			padding-bottom: 8px;
			padding-left: 16px;
			font-weight: 500;
			font-size: 14px;
			text-align: center;
			background-color: #5252DC;
			color: #fff;
			text-decoration: none;
		}
		.dismiss-btn {
			text-decoration: underline;
			font-weight: 400;
			font-size: 14px;
			color: #696969;
			border-bottom: none;
		}
	}
}