/**
 * All of the CSS for your admin-specific functionality should be
 * included in this file.
 */

/** PRODUCT CATALOG DETAILS MAPPING **/
.details-mapping-wrapper {
	width: 100%;
	margin: 0 auto;
	font-family: Arial, sans-serif;
}

.salesmanago-table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 20px;
	table-layout: fixed; /* Ensures cells take up equal width */
}

.salesmanago-table th, .salesmanago-table td {
	text-align: left;
	padding: 10px;
	border-bottom: 1px solid #ddd;
	vertical-align: top;
}

.salesmanago-table th {
	background-color: #f7f7f7;
	font-weight: bold;
	border-bottom: 2px solid #ccc;
}

.attribute-select {
	width: 90vw;
	padding: 10px;
	font-size: 14px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #fff;
}

.btn-save {
	margin-top: 20px;
	padding: 10px 20px;
	font-size: 16px;
	color: #fff;
	background-color: #0073aa;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	display: block;
	width: 100%; /* Full width button */
	max-width: 200px;
	text-align: center;
}

.btn-save:hover {
	background-color: #005a87;
}

.cron-method-description {
	margin-top: 8px;
	padding: 8px 12px;
	background-color: #f8f8f8;
	border-left: 4px solid #ddd;
	display: none;
	text-align: left; /* Add this to ensure left alignment */
}

.cron-method-description.active {
	display: block;
}

.salesmanago-cron-token-box {
    margin-top:15px;
    padding:12px;
    border:1px solid #ddd;
    border-radius:6px;
}

/* Responsive Styles */
@media (max-width: 768px) {
	.attribute-select {
		width: 90vw;
		display: block;
	}
	.salesmanago-table th, .salesmanago-table td {
		display: block;
		width: 100%;
	}

	.salesmanago-table th {
		background-color: transparent;
		font-weight: bold;
		border-bottom: none;
		margin-top: 10px;
	}

	.salesmanago-table td {
		padding: 10px 0;
	}

	.salesmanago-table tr {
		margin-bottom: 15px;
		border-bottom: 2px solid #eee;
	}

	.btn-save {
		max-width: 100%; /* Full-width button for small screens */
	}
}

#salesmanago .nav-tab-wrapper
{
	max-width: calc(100% - 80px)
}

#salesmanago .button-logout
{
	position: absolute;
	right: 20px;
}
.refresh-owner-success {
	display:inline-block;
	width: 10px;
	height:18px;
	-ms-transform: rotate(45deg); /* IE 9 */
	-webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
	transform: rotate(45deg);
}

.checkmark_stem_success {
	position: absolute;
	width:3px;
	height:9px;
	background-color: #119D00;
	left:11px;
	top:6px;
}

.checkmark_kick_success {
	position: absolute;
	width:3px;
	height:3px;
	background-color: #119D00;
	left:8px;
	top:12px;
}

#salesmanago-logo
{
	max-height: 35px;
	max-width: 175px;
	margin-top: 5px;
	margin-left: 5px;
}

#salesmanago select
{
	min-width: 230px;
}

#salesmanago input[type="text"],
#salesmanago input[type="password"],
#salesmanago input[type="email"]
{
	min-width: 230px;
}


#salesmanago select[value=""]
{
	color: gray;
}

#salesmanago option
{
	color: black;
}

#salesmanago .form-title-header
{
	display: flex;
	justify-content: space-between;
	max-width: 590px;
}


#salesmanago .button-inline
{
	margin: 0 20px;
}

#salesmanago .salesmanago-button
{
	margin: 0 15px;
}

#salesmanago .salesmanago-form-configuration .button-inline
{
	margin: 10px 20px;
}

#salesmanago .hidden
{
	display: none !important;
}

#salesmanago th .plugin-not-active
{
	font-weight: normal;
	margin: 0;
	color: #FF0000;
}

#salesmanago .notice
{
	display: inline-block;
	padding: 11px 15px;
	font-size: 14px;
	line-height: 1.4;
	width: calc(100% - 40px);
}

#salesmanago-export-notice
{
	margin-top: 20px;
	display: none;
}

#salesmanago-export-restore
{
	margin-top: 20px;
	display: none;
}

#salesmanago-export-continue
{
	margin-top: 20px;
}

#salesmanago progress
{
	width: 100%;
	max-width: 380px;
	color: rgb(45,0,247);
}
#salesmanago progress::-moz-progress-bar
{
	background: rgb(45,0,247);
	background: linear-gradient(90deg, rgba(45,0,247,1) 0%, rgba(188,0,221,1) 50%, rgba(242,0,137,1) 100%);
}
#salesmanago progress::-webkit-progress-value
{
	background: rgb(45,0,247);
	background: linear-gradient(90deg, rgba(45,0,247,1) 0%, rgba(188,0,221,1) 50%, rgba(242,0,137,1) 100%);
}

#salesmanago-content #monitcode-area
{
	background: rgb(255,255,255);
	resize: none;
	cursor: not-allowed;
}

#salesmanago .log-textarea
{
	background: rgb(255,255,255);
	resize: none;
	cursor: not-allowed;
	width: 60%;
	min-height: 256px;
	margin-bottom: 2px;
}

#salesmanago .about-info-span
{
	display: block;
	text-align: start !important;
	font-size: 12px;
	letter-spacing: 1px;
}

#salesmanago .button-count
{
	margin-bottom: 20px;
	display: inline-block;
}

#salesmanago .salesmanago-count-result
{
	display: inline-block;
	margin-bottom: 20px;
	font-size: 16px;
}

.salesmanago-export-modal-button
{
	margin-left: 5px !important;
}

.text-input-validation-error
{
	border: 2px solid #FF0000 !important;
}

.sm-product-catalog-info-list
{
	font-size: 14px;
}

.sm-product-catalog-container
{
	display: flex;
	padding: 10px;
}

.sm-product-catalog-image-container
{
	margin: auto;
	padding: 20px;
}

.sm-product-catalog-text-container
{
	height: auto;
}

.sm-product-catalog-input-container
{
	display: flex;
}

.sm-create-catalog-form-container
{
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.sm-create-catalog-input-container
{
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.sm-product-catalog-input
{
	width: 60%;
	margin: 4px 0;
	border-style: solid;
	border-width: 1px;
	padding: 5px;
}

.sm-product-catalog-description
{
	font-size: 12px !important;
}

.sm-product-catalog-button
{
	border-style: solid;
	background-color: #D7FC81;
	border-width: 1px;
	border-left: none;
	cursor: pointer;
	min-width: 60px;
	margin: 4px 0;
}

.sm-product-catalog-button:hover
{
	filter: brightness(95%);
}

.sm-product-api-label
{
	font-weight: bold;
}

.sm-product-catalog-label-container
{
	padding: 4px;
	color: #646970;
}

.sm-product-catalog-synchro-container
{
	width: 100%;
}

.sm-product-export-container
{
	margin-top: 100px;
}

.sm-product-synchro-heading
{
	margin-bottom: 2px;
}

.sm-btn-top-margin
{
	margin-top: 10px !important;
}

.sm-product-catalog-select-wrapper
{
	display: flex;
}

.sm-modal
{
	display: none;
}
.sm-center-content
{
	text-align: center;
}

#sm-product-export-notice
{
	display: none;
	margin-top: 20px;
}
#sm-btn-set-active-catalog
{
	margin-right: 3px;
	height: 50%;
	text-transform: uppercase;
}

.sm-hidden
{
	display: none;
}

.span-error
{
	color: #FF0000;
}

.sm-new-api-v3-error
{
	border-color: #FF0000 !important;
}

.sm-api-key-error-wrapper
{
	height: 30px;
}

.sm-api-v3-log-label-wrapper
{
	display: flex;
	width: 60%;
}

.sm-tooltip
{
	position: relative;
	display: inline-block;
	cursor: pointer;
}

.sm-tooltip .sm-tooltip-text
{
	background-color: #fff;
	color: #646970;
	min-width: 150px;
	text-align: center;
	border-radius: 6px;
	border: 1px solid #8c8f94;
	padding: 5px 5px;
	font-family: apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
	position: absolute;
	z-index: 1;
	bottom: 20px;
	left: 20px;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s;
}

.sm-tooltip:hover .sm-tooltip-text
{
	opacity: 1;
	visibility: visible;
}

.sm-create-catalog-tooltip-container
{
	display: flex;
	align-items: center;
	gap: 5px;
}

.salesmanago-arrow-icon
{
	font-size: 15px;
	margin-top: 7.5px;
}

.sm-product-catalog-headline-and-btn-wrapper
{
	display: flex;
	justify-content: space-between;
	text-decoration: none;
	padding-right: 20px;
}

.sm-product-catalog-headline-and-btn-wrapper a
{
	text-decoration: none;
}

.sm-btn-link
{
	text-align: center;
	padding: 10px;
}

.sm-refresh-catalogs
{
	text-decoration: none;
	position: relative;
	color: #2271b1;
	cursor: pointer;
	height: 50%;
}

.sm-refresh-catalog-success
{
	margin-top: 5px;
	color: #119D00;
}

.sm-refresh-catalog-fail
{
	margin-top: 5px;
	color: #FF0000;
}

.sm-rotating
{
	animation: rotation 1s ease-in 1;
}

.sm-int-exp-item
{
	display: grid;
	grid-template-columns: 165px 150px;
	column-gap: 10px;
}

#sm-btn-turn-off-catalog
{
	display: inline-flex;
	align-items: center;
	text-transform: uppercase;
	gap: 2px;
}

#sm-notice-product-exp-interrupted-wrapper,
#sm-continue-product-exp-btn-wrapper
{
	display: none;
}

#sm-product-catalog-btn-and-refresh-wrapper
{
	display: flex;
	align-items: center;
	height: 50%;
}
#sm-btn-product-export-try-again,
#sm-btn-product-export
{
	text-transform: uppercase;
}

/**
 * salesmanago_and_leadoo.php:
 */
.integration-wrap {
	max-width: 800px;
	margin: 40px auto;
	display: flex;
	flex-direction: column;
}
.integration-wrap h1 { margin-bottom: 8px; }
.integration-wrap p.intro { margin-top: 0; margin-bottom: 24px; color: #555; }

.integration-card {
	display: flex;
	align-items: center;
	border: 1px solid #ddd;
	border-radius: 4px;
	background: #fff;
	padding: 16px;
	margin-bottom: 16px;
	text-decoration: none;
	color: inherit;
	transition: border-color .2s;
}
.integration-card:hover {
	border-color: #0073aa;
}

.integration-card .icon {
	margin-right: 16px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.integration-card .icon.sales { background: #e6ff33; }
.integration-card .icon.leadoo { background: #005ca8; }

.integration-card h2 {
	margin: 0 0 4px;
	font-size: 18px;
}
.integration-card p {
	margin: 0;
	font-size: 13px;
	color: #444;
}

.integration-note {
	border-left: 4px solid #0073aa;
	background: #f1f1f1;
	padding: 16px;
	border-radius: 4px;
}
.integration-note strong { display: block; margin-bottom: 6px; }
.integration-note p { margin: 0; color: #333; font-size: 13px; }
/* salesmanago_and_leadoo.php END*/

.wrap.leadoo-wrap {
	display: flex;
	flex-direction: column;
}
.wrap.leadoo-wrap h1 .logo {
	vertical-align: middle;
	height: 32px;
	margin-right: 8px;
}
.wrap.leadoo-wrap h1 {
	font-size: 24px;
	margin-bottom: 16px;
}
.wrap.leadoo-wrap .nav-tab-wrapper {
	margin-bottom: 24px;
}
.wrap.leadoo-wrap h2.section-title {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 8px;
}
.wrap.leadoo-wrap .script-label {
	font-size: 13px;
	margin: 0 0 4px;
}
.wrap.leadoo-wrap textarea.large-text.code {
	width: 100%;
	min-height: 200px;
	font-family: Menlo, Monaco, Consolas, monospace;
}
.wrap.leadoo-wrap .description {
	text-align: right;
	font-size: 12px;
	color: #555;
	margin-top: 4px;
}
#leadoo-tutorial .tutorial-content {
	display: none;
}
#leadoo-tutorial .tutorial-toggle {
	cursor: pointer;
}
#leadoo-tutorial {
	border: 1px solid #ddd; padding: 0; margin-bottom: 1em; background: #fff;
}
#leadoo-tutorial h2 {
	margin: 0; padding: 10px 12px; background: #f7f7f7; font-size: 14px;
}
#leadoo-tutorial .tutorial-content {
	padding: 12px;
}
#leadoo-tutorial .tutorial-content {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}
#leadoo-tutorial .tutorial-steps {
	flex: 1;
	min-width: 200px;
}
#leadoo-tutorial .tutorial-images {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 10px;
}
#leadoo-tutorial .tutorial-images img {
	height: auto;
	display: block;
	border: 1px solid #ddd;
}
#leadoo-tutorial .tutorial-steps ol {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tutorial-steps .steps-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.tutorial-steps .steps-list > li {
	margin-bottom: 1em;
}
.tutorial-steps .steps-list > li > strong {
	display: block;
	margin-bottom: 0.25em;
}
.tutorial-steps .step-details {
	list-style: disc inside;
	margin: 0;
	padding-left: 1.5em; /* wcięcie żeby kropka była z lewej */
}
.tutorial-steps .step-details li {
	line-height: 1.4;
}
.alert-bar {
	position: relative;
	background: #fff;
	border: 1px solid #c7e8f1;
	border-left: 4px solid #00a0d2; /* wp-blue */
	padding: 12px 40px 12px 16px;
	margin: 16px 0;
	font-family: sans-serif;
	line-height: 1.4;
}
.alert-bar .message {
	font-size: 14px;
	color: #333;
}
.alert-bar .message .highlight {
	color: #46b450;
	font-weight: 600;
}
.alert-bar .close-btn {
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
	background: none;
	border: none;
	font-size: 16px;
	line-height: 1;
	color: #666;
	cursor: pointer;
}
.alert-bar .close-btn:hover {
	color: #000;
}

.integration-wrap .integration-card {
	display: flex;
	align-items: center;
	background: #fff;
	border: 1px solid #ccc;
	padding: 12px;
	margin-bottom: 12px;
	text-decoration: none;
}

.integration-card .icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 10px 15px;
}

.integration-card .icon img {
	display: block;
	width: 60px;
	height: 60px;
}

.integration-card .text h2 {
	margin: 0 0 4px;
	font-size: 18px;
}

.integration-card .text p {
	margin: 0;
	font-size: 13px;
	line-height: 1.4;
	color: #555;
}

.integration-card.sales {
	border-color: #cfeadf;
}
.integration-card.sales .icon {
	background: #e8fdf7;
}
.integration-card.leadoo {
	border-color: #cce5fc;
}
.integration-card.leadoo .icon {
	background: #eaf4fe;
}
.integration-card.combined {
	border-color: #dedede;
}
.integration-card.combined .icon {
	background: #f7f7f7;
}
.integration-note {
	display: flex;
	align-items: flex-start;
	gap: 16px;
	border: 1px solid #ddd;
	padding: 12px;
	margin-top: 12px;
	background: none !important;
}
.integration-note .icon {
	flex: 0 0 auto;
}
.integration-note .text strong {
	display: block;
	margin-bottom: 4px;
}
.integration-note .text p {
	margin: 0;
}

.tutorial-images img:nth-child(1) {
	margin-right: 30px;
}

.video-container {
	position: relative;
	width: 75%;
	padding-bottom: 42.25%;
	height: 0;
	margin: 0 auto;
}

.video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video-description {
	margin-bottom: 1em;
	max-width: 100%;
	text-align: justify;
}

.discover-cta-paragraph {
	margin:0 0.5em 16px;
	text-align:center;
}

.discover-cta-button {
	display: inline-flex;
	align-items: center;
	background: #dafc8b;
	color: #23282d;
	text-decoration: none;
	font-weight: 600;
	text-transform: uppercase;
	padding: 8px 16px;
	border-radius: 4px;
	font-size: 13px;
}

.discover-cta-button-image {
	width:24px;
	height:20px;
	margin-right:8px;
}

@media screen and (min-width: 1440px){
	#salesmanago .nav-tab-wrapper
	{
		max-width: 100%;
	}
}

@media screen and (max-width: 1270px) {
	.sm-product-catalog-container
	{
		flex-direction: column;
	}
	#salesmanago-refresh-owner
	{
		margin: 5px 0 !important;
	}
}

@media screen and (max-width: 786px){
	#salesmanago .nav-tab-wrapper
	{
		max-width: 100%;
	}
	#salesmanago .button-logout
	{
		margin-top: -45px;
	}
	#sm-product-catalog-flow
	{
		max-width: 300px;
		height: auto;
	}
	.sm-tooltip .sm-tooltip-text-responsive
	{
		left: auto;
		right: 15px;
	}
	#salesmanago-add-form-button
	{
		margin: 5px 0 !important;
	}
	.sm-product-catalog-select-wrapper
	{
		flex-direction: column;
	}
}
