/**
 * CSS code for the "Edit" screen
 *
 * @package TablePress
 * @subpackage Views CSS
 * @author Tobias Bäthge
 * @since 1.0.0
 */

/* Import spinner and alert box styling. */
@import "spinner-alert";

/* container for Table Preview, Advanced Editor, and Help Box dialogs */
.hidden-container {
	display: none;
}

.help-box {
	padding-top: 0;
	padding-bottom: 0;
}

/* Positioning of the "Help" button in the header section of a postbox. */
.postbox-header .handle-actions .button-module-help {
	margin-right: 10px;
}
@media screen and (min-width: 783px) {
	.postbox-header .handle-actions .button-module-help {
		position: relative;
		top: -5px;
	}
}

/* Allow wide postboxes to scroll sideways. */
body,
div#post-body.metabox-holder.columns-1 {
	overflow: visible !important;
}

/* Add space between the screen options fieldsets. */
#tablepress-screen-options {
	margin-top: 20px;
}

/* Move backdrop of the wpLink dialog above the "Advanced Editor" dialog */
body #wp-link-backdrop {
	z-index: 100103;
}

/* Table Preview (CSS for actual preview is directly in the preview HTML) */
#table-preview {
	padding: 0;
}
#table-preview-iframe {
	width: 100%;
	height: 100%;
}

/* Styling and positioning of buttons in wpdialogs */
.ui-dialog .button {
	box-shadow: none;
}
.ui-dialog .ui-dialog-buttonset {
	width: 100%;
}
.ui-dialog .button-cancel,
.ui-dialog .button-cancel:hover {
	color: #b32d2e;
	border-color: transparent;
	background-color: transparent;
	text-decoration: underline;
}
.ui-dialog .button-ok {
	float: right;
}

/* Content of the Advanced Editor wpdialog */
#advanced-editor {
	padding: 5px;
}
#advanced-editor .wp-editor-container {
	border: none;
}

#tablepress-page #tablepress_edit-table-data {
	display: inline-block; /* Stretch to the width of the table. */
	min-width: 99.9%; /* but use the full width, minus approx. 1px as the box is wider than the others otherwise. */
}

#tablepress-page .button {
	vertical-align: baseline;
}

#table-id-shortcode-wrapper {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 99%;
	gap: 5px 0;
}
#table-information-shortcode {
	margin: 0 -1px 0 1px;
}

#tablepress_edit-table-manipulation .column-1,
#tablepress_edit-table-manipulation .column-2 {
	width: 50%;
}

/* Align with checkbox labels */
.checkbox-left {
	display: inline-block;
	padding-left: 1.25rem; /* Checkboxes are 1rem wide + 0.25rem margin. */
	padding-top: 8px;
}

#table-editor {
	font-size: 14px;
}

/* Jspreadsheet CSS * /

/* Minimum row height, using :after to keep resize animation */
.jexcel > tbody > tr:after {
	content: "";
	display: inline-block;
	min-height: 22px;
}

.jexcel > thead > tr > td {
	text-align: center !important;
	z-index: 22; /* Prevent drag corner from floating above fixed header. */
}

.jexcel > tbody > tr > td {
	vertical-align: top;
	word-break: break-word;
	padding: 0;
}
.jexcel > tbody > tr > td:first-child {
	padding: 4px;
}

/* Show all lines of text in an edited cell. */
.jexcel > tbody > tr > td.editing {
	--table-editor-line-clamp-editing: 0;
}

.jexcel > tbody > tr > td > div {
	display: -webkit-box;
	-webkit-line-clamp: var(--table-editor-line-clamp-editing, var(--table-editor-line-clamp));
	-webkit-box-orient: vertical;
	overflow: hidden;
	padding: 4px;
}

/* Fixed header */
@media screen and (min-width: 601px) {
	.admin-bar .jexcel > thead > tr > td {
		top: 46px;
	}
}
@media screen and (min-width: 783px) {
	.admin-bar .jexcel > thead > tr > td {
		top: 31px;
	}
}

/* Fixed left column, taking into account the width of the admin bar */
body .jexcel > tbody > tr > .jexcel_row {
	position: sticky;
	z-index: 21; /* Prevent drag corner from floating above fixed left column. */
	left: 160px;
}
body.folded .jexcel > tbody > tr > .jexcel_row {
	left: 36px;
}
@media only screen and (max-width: 960px) {
	body.auto-fold .jexcel > tbody > tr > .jexcel_row {
		left: 36px;
	}
}
@media screen and (max-width: 782px) {
	body.auto-fold .jexcel > tbody > tr > .jexcel_row {
		left: 0;
	}
}

.jexcel tbody tr:nth-child(even) td:not(.jexcel_row) {
	background-color: #f9f9f9;
}

.jexcel_container .jexcel tbody tr td.highlight {
	background-color: rgba(0, 94, 255, 0.05);
}

.jexcel_container .jexcel tbody tr.head-row td:not(.jexcel_row):not(.column-hidden),
.jexcel_container .jexcel tbody tr.foot-row td:not(.jexcel_row):not(.column-hidden) {
	background-color: #d9edf7;
}

.jexcel_container .jexcel tbody tr.row-hidden td:not(.jexcel_row),
.jexcel_container .jexcel tbody tr td.column-hidden {
	background-color: rgba(255, 224, 224, 0.7);
}

.jexcel > tbody > tr > .highlight-top {
	border-top: 1px solid rgb(82, 146, 247);
}

.jexcel > tbody > tr > .highlight-left {
	border-left: 1px solid rgb(82, 146, 247);
}

.jexcel > tbody > tr > .highlight-right {
	border-right: 1px solid rgb(82, 146, 247);
}

.jexcel > tbody > tr > .highlight-bottom {
	border-bottom: 1px solid rgb(82, 146, 247);
}

.jexcel_corner {
	background-color: rgb(82, 146, 247);
}

.jexcel > tbody > tr > td > textarea {
	font-size: inherit;
	box-shadow: none;
	padding: 3px !important;
	line-height: 1 !important;
}

/* Fullscreen mode */
.admin-bar .jexcel_container.fullscreen .jexcel > thead > tr > td {
	top: 0;
}
.jexcel_container.fullscreen {
	z-index: 99999;
}

/* Context menu */
.jcontextmenu {
	margin: 1px; /* Don't trigger actions by accident */
	z-index: 99999; /* Hover above WP Admin bar */
}
.jcontextmenu > div.header {
	display: none !important;
}
.jcontextmenu > div a {
	color: #111111;
	font-size: 14px;
}
.jcontextmenu > div {
	padding: 4px 4px 4px 16px;
}
.jcontextmenu > .jcontextmenu-disabled,
.jcontextmenu > .jcontextmenu-disabled a {
	color: #999999;
	cursor: default;
}
.jcontextmenu > div.jcontextmenu-disabled:hover {
	background: transparent;
}

/* The sorting arrow icon feels wrong, so flip the images for arrow-up and arrow-down. */
.jexcel > thead > tr > td.arrow-up {
	/* stylelint-disable-next-line function-url-quotes */
	background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' d='M0 0h24v24H0V0z'/%3E%3Cpath d='M7 10l5 5 5-5H7z' fill='gray'/%3E%3C/svg%3E");
}
.jexcel > thead > tr > td.arrow-down {
	/* stylelint-disable-next-line function-url-quotes */
	background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='none' d='M0 0h24v24H0V0z'/%3E%3Cpath d='M7 14l5-5 5 5H7z' fill='gray'/%3E%3C/svg%3E");
}

/* WP Feature Pointers */
.pointer-tp21_edit_screen_options .wp-pointer-arrow {
	left: 225px;
}