/*
 * DIGIKROM Share Cart 0.2.0
 * Cart tools + cart threshold.
 */

.dksc-tools,
.dksc-tools *,
.dksc-threshold,
.dksc-threshold * {
	box-sizing: border-box;
}

.dksc-tools {
	--dksc-green: #187d32;
	--dksc-green-hover: #126728;
	--dksc-text: #171a18;
	--dksc-muted: #7d837f;
	--dksc-line: #d7ddd8;
	--dksc-soft: #f5f8f5;
	--dksc-danger: #b42318;
	position: relative;
	width: 100%;
}

.dksc-tools__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	width: 100%;
}

.dksc-tools__button {
	position: relative;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 9px !important;
	width: 100% !important;
	min-height: 48px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	border: 1px solid var(--dksc-text) !important;
	border-radius: 3px !important;
	background: #fff !important;
	color: var(--dksc-text) !important;
	box-shadow: none !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	letter-spacing: .045em !important;
	line-height: 1.15 !important;
	text-align: center !important;
	text-transform: uppercase !important;
	transition: border-color .18s ease, background .18s ease, color .18s ease;
}

.dksc-tools__button:hover:not(:disabled),
.dksc-tools__button.is-active {
	border-color: var(--dksc-green) !important;
	background: var(--dksc-green) !important;
	color: #fff !important;
}

.dksc-tools__button--save.is-saved:not(.is-active) {
	border-color: var(--dksc-green) !important;
	background: var(--dksc-soft) !important;
	color: var(--dksc-green) !important;
}

.dksc-tools__button:disabled {
	cursor: not-allowed;
	opacity: .42;
}

.dksc-tools__button.is-disabled {
	opacity: .62;
}

.dksc-tools__icon,
.dksc-tools__icon svg {
	display: block;
	flex: 0 0 17px;
	width: 17px;
	height: 17px;
}

.dksc-tools__badge {
	position: absolute;
	top: 5px;
	right: 6px;
	display: grid;
	place-items: center;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: var(--dksc-green);
	color: #fff;
	font-size: 9px;
	font-weight: 900;
	line-height: 1;
}

.dksc-tools__button:hover .dksc-tools__badge,
.dksc-tools__button.is-active .dksc-tools__badge {
	background: #fff;
	color: var(--dksc-green);
}

.dksc-tools__panel {
	position: absolute;
	z-index: 100;
	right: 0;
	top: calc(100% + 9px);
	width: min(520px, 94vw);
	padding: 18px;
	border: 1px solid var(--dksc-line);
	border-top: 3px solid var(--dksc-green);
	border-radius: 3px;
	background: #fff;
	box-shadow: 0 18px 45px rgba(13, 41, 24, .14);
}

.dksc-tools__panel[hidden] {
	display: none !important;
}

.dksc-tools__panel-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
}

.dksc-tools__panel-head strong {
	color: var(--dksc-text);
	font-size: 15px;
	line-height: 1.3;
}

.dksc-tools__panel p {
	margin: 9px 0 14px;
	color: var(--dksc-muted);
	font-size: 11px;
	line-height: 1.5;
}

.dksc-tools__close {
	display: grid !important;
	place-items: center !important;
	flex: 0 0 28px !important;
	width: 28px !important;
	height: 28px !important;
	min-width: 28px !important;
	margin: -5px -5px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	color: var(--dksc-muted) !important;
	box-shadow: none !important;
	font-size: 23px !important;
	line-height: 1 !important;
}

.dksc-tools__link-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px;
}

.dksc-tools__link {
	width: 100% !important;
	min-width: 0 !important;
	height: 43px !important;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 1px solid var(--dksc-line) !important;
	border-radius: 3px !important;
	background: var(--dksc-soft) !important;
	color: var(--dksc-text) !important;
	box-shadow: none !important;
	font-size: 11px !important;
}

.dksc-tools__copy,
.dksc-tools__native-share,
.dksc-tools__action {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 43px !important;
	margin: 0 !important;
	padding: 0 15px !important;
	border: 1px solid var(--dksc-green) !important;
	border-radius: 3px !important;
	background: var(--dksc-green) !important;
	color: #fff !important;
	box-shadow: none !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	text-align: center !important;
	text-decoration: none !important;
	text-transform: none !important;
}

.dksc-tools__copy:hover,
.dksc-tools__native-share:hover,
.dksc-tools__action:hover {
	border-color: var(--dksc-green-hover) !important;
	background: var(--dksc-green-hover) !important;
	color: #fff !important;
}

.dksc-tools__native-share {
	width: 100% !important;
	margin-top: 8px !important;
}

.dksc-tools__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.dksc-tools__actions[hidden] {
	display: none !important;
}

.dksc-tools__action--ghost {
	border-color: var(--dksc-text) !important;
	background: #fff !important;
	color: var(--dksc-text) !important;
}

.dksc-tools__action--ghost:hover {
	border-color: var(--dksc-green) !important;
	background: var(--dksc-soft) !important;
	color: var(--dksc-green) !important;
}

.dksc-tools__action--danger {
	border-color: #efc6c2 !important;
	background: #fff !important;
	color: var(--dksc-danger) !important;
}

.dksc-tools__action--danger:hover {
	border-color: var(--dksc-danger) !important;
	background: #fff4f2 !important;
	color: var(--dksc-danger) !important;
}

.dksc-tools__status {
	min-height: 0;
	margin-top: 7px;
	color: var(--dksc-green);
	font-size: 10px;
	line-height: 1.4;
}

.dksc-tools__status:empty {
	display: none;
}

.dksc-tools__status.is-error {
	color: var(--dksc-danger);
}

.dksc-tools.is-loading .dksc-tools__button {
	pointer-events: none;
	opacity: .6;
}


/* Threshold / free shipping progress */
.dksc-threshold {
	--dksc-green: #187d32;
	--dksc-green-dark: #0f2d1b;
	--dksc-text: #171a18;
	--dksc-muted: #7d837f;
	--dksc-line: #dfe5e0;
	--dksc-soft: #f4f8f4;
	width: 100%;
	padding: 14px 16px;
	border: 1px solid var(--dksc-line);
	border-radius: 3px;
	background: var(--dksc-soft);
}

.dksc-threshold__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 14px;
}

.dksc-threshold__eyebrow {
	flex: 0 0 auto;
	color: var(--dksc-green);
	font-size: 9px;
	font-weight: 900;
	letter-spacing: .09em;
	line-height: 1.2;
	text-transform: uppercase;
}

.dksc-threshold__message {
	color: var(--dksc-text);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.35;
	text-align: right;
}

.dksc-threshold__message .woocommerce-Price-amount,
.dksc-threshold__message .amount {
	color: var(--dksc-green);
	font-size: inherit;
	font-weight: 900;
}

.dksc-threshold__track {
	position: relative;
	height: 5px;
	margin-top: 10px;
	overflow: hidden;
	border-radius: 999px;
	background: #dfe7df;
}

.dksc-threshold__progress {
	display: block;
	width: 0;
	height: 100%;
	border-radius: inherit;
	background: var(--dksc-green);
	transition: width .35s ease;
}

.dksc-threshold.is-reached {
	border-color: rgba(24, 125, 50, .35);
	background: #f1f8f2;
}

.dksc-threshold.is-reached .dksc-threshold__message {
	color: var(--dksc-green);
}


/* Shared-cart restore notice from v0.1.x */
.dksc-restore-notice__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 10px;
}

.dksc-restore-notice__actions .button {
	margin: 0 !important;
}


@media (max-width: 760px) {
	.dksc-tools__grid {
		grid-template-columns: 1fr;
	}

	.dksc-tools__button {
		min-height: 46px !important;
	}

	.dksc-threshold__head {
		display: block;
	}

	.dksc-threshold__message {
		display: block;
		margin-top: 5px;
		text-align: left;
	}
}

@media (max-width: 560px) {
	.dksc-tools__panel {
		position: fixed;
		left: 12px;
		right: 12px;
		top: auto;
		bottom: 14px;
		width: auto;
	}

	.dksc-tools__link-row {
		grid-template-columns: 1fr;
	}

	.dksc-tools__copy {
		width: 100% !important;
	}

	.dksc-tools__actions {
		display: grid;
		grid-template-columns: 1fr;
	}

	.dksc-tools__action {
		width: 100% !important;
	}
}