/**
 * assets/css/asm-frontend.css
 *
 * Frontend styles for Artimind Shipping Management.
 *
 * @package ArtimindShippingManagement
 */


/* =========================================================
 * Product Page - Shipping Information
 * ========================================================= */

.asm-shipping-info {
	margin: 15px 0;
	font-size: 14px;
	line-height: 1.7;
}


.asm-custom-product-eta,
.asm-normal-product-eta {
	margin: 15px 0;
}


.asm-product-shipping-fee,
.asm-product-shipping-eta {
	margin: 0 0 4px;
}


.asm-product-local-delivery {
	margin: 0;
}


.asm-view-local-cities {
	margin-left: 8px;
	text-decoration: underline;
	cursor: pointer;
}


/* =========================================================
 * Local Cities Popup
 * ========================================================= */

.asm-local-cities-popup {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
}


.asm-local-cities-overlay {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
}


.asm-local-cities-content {
	position: relative;
	width: 90%;
	max-width: 450px;
	margin: 10vh auto 0;
	padding: 25px;
	background: #ffffff;
	border-radius: 6px;
	box-sizing: border-box;
	z-index: 2;
}


.asm-close-local-cities {
	position: absolute;
	top: 10px;
	right: 15px;
	display: block;
	width: 30px;
	height: 30px;
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
	color: inherit;
	font-size: 25px;
	line-height: 30px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}


.asm-local-cities-content h3 {
	margin: 0 0 10px;
}


.asm-local-cities-eta {
	margin: 0 0 15px;
}


.asm-local-cities-heading {
	display: block;
	margin-bottom: 5px;
}


.asm-local-cities-list {
	margin: 5px 0 15px;
	padding-left: 20px;
}


/* =========================================================
 * Cart - WooCommerce Native Shipping Row
 * ========================================================= */

/*
 * WooCommerce continues to generate this row.
 *
 * It is NOT removed from the DOM.
 *
 * JavaScript takes only the following native elements:
 *
 * - .woocommerce-shipping-destination
 * - .shipping-calculator-button
 * - .woocommerce-shipping-calculator
 *
 * and moves them to the ASM Shipping to row.
 *
 * The original native shipping row is then hidden visually.
 */

.cart_totals .woocommerce-shipping-totals.shipping {
	display: none !important;
}


/* =========================================================
 * Cart Totals - General
 * ========================================================= */

.cart_totals .shop_table.shop_table_responsive th {
	text-align: left;
	vertical-align: top;
}


.cart_totals .shop_table.shop_table_responsive td {
	text-align: right;
	vertical-align: top;
}


/* =========================================================
 * Cart - Shipment
 * ========================================================= */

.cart_totals .asm-cart-shipment {
	margin: 0;
	padding: 12px 0 4px;
	border: 0;
	font-size: 14px;
	line-height: 1.6;
}


.cart_totals .asm-cart-shipment-title {
	padding-top: 0;
	font-weight: 600;
	text-align: left;
	vertical-align: top;
}


.cart_totals .asm-cart-shipment-content {
	padding-top: 0;
	text-align: right !important;
	vertical-align: top;
}


.cart_totals .asm-cart-shipment-content > * {
	text-align: right;
}


/* =========================================================
 * Shipment Price
 * ========================================================= */

.asm-cart-shipment-price {
	margin: 0;
	font-weight: 600;
	white-space: nowrap;
	text-align: right;
}


/* =========================================================
 * Free Shipping Notice
 * ========================================================= */

.asm-cart-shipment-free-shipping-notice {
	margin: 1px 0 3px;
	color: #777777;
	font-size: 12px;
	line-height: 1.5;
	text-align: right;
}


/* =========================================================
 * Shipment ETA
 * ========================================================= */

.asm-cart-shipment-eta {
	margin: 2px 0 0;
	text-align: right;
}


.asm-cart-shipment-eta-date,
.asm-cart-shipment-eta-duration {
	margin: 0;
	color: #555555;
	font-size: 13px;
	line-height: 1.5;
	text-align: right;
}


/* =========================================================
 * Shipment Message
 * ========================================================= */

.asm-cart-shipment-message {
	margin: 0;
	color: #555555;
	font-size: 13px;
	line-height: 1.5;
	text-align: right;
}


/* =========================================================
 * Cart - Package Products
 * ========================================================= */

/*
 * Product list:
 *
 * Column 1:
 * Thumbnail
 *
 * Column 2:
 * Product name
 *
 * Column 3:
 * Quantity
 *
 * Example:
 *
 * | thumbnail | Product Name | ×1 |
 *
 * Product name is LEFT aligned.
 * Quantity is centered horizontally and vertically.
 */

.asm-cart-shipment-products {
	width: 100%;
	margin: 0 0 10px;
	padding: 0;
	box-sizing: border-box;
	text-align: right;
}


.asm-cart-shipment-products[hidden] {
	display: none;
}


/* Individual product row */

.asm-cart-shipment-product {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr) 40px;
	align-items: center;
	width: 100%;
	margin: 0 0 10px;
	padding: 0;
	box-sizing: border-box;
	text-align: left;
}


/* Remove bottom margin from final product */

.asm-cart-shipment-product:last-child {
	margin-bottom: 0;
}


/* =========================================================
 * Product Thumbnail - Column 1
 * ========================================================= */

.asm-cart-shipment-product-image {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	min-width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	text-align: center;
}


.asm-cart-shipment-product-thumbnail {
	display: block;
	width: 48px;
	height: 48px;
	max-width: 48px;
	max-height: 48px;
	margin: 0;
	object-fit: cover;
}


/* =========================================================
 * Product Details - Column 2
 * ========================================================= */

.asm-cart-shipment-product-details {
	min-width: 0;
	margin: 0;
	padding: 0 10px;
	box-sizing: border-box;
	text-align: left;
	align-self: center;
}


/*
 * Product name:
 *
 * IMPORTANT:
 * Product name is LEFT aligned.
 */

.asm-cart-shipment-product-name {
	margin: 0;
	padding: 0;
	color: inherit;
	font-size: 14px;
	line-height: 1.4;
	font-weight: 400;
	text-align: left;
	word-break: break-word;
	overflow-wrap: anywhere;
}


/*
 * Quantity is no longer displayed inside the
 * product details column.
 */

.asm-cart-shipment-product-details
.asm-cart-shipment-product-quantity {
	display: none;
}


/* =========================================================
 * Product Quantity - Column 3
 * ========================================================= */

.asm-cart-shipment-product > .asm-cart-shipment-product-quantity {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	min-width: 40px;
	height: 48px;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	color: inherit;
	font-size: 14px;
	line-height: 1.4;
	font-weight: 400;
	text-align: center;
	white-space: nowrap;
}


/*
 * WooCommerce / theme styles should not force
 * quantity to the right.
 */

.asm-cart-shipment-product
.asm-cart-shipment-product-quantity {
	text-align: center !important;
}


/* =========================================================
 * Local Delivery Supported Cities
 * ========================================================= */

.asm-package-local-cities {
	margin-top: 3px;
	text-align: right;
}


/*
 * The View supported cities trigger.
 *
 * It remains on the right side of the shipment content.
 * JavaScript should open the popup rather than displaying
 * the city list inline.
 */

.asm-package-local-cities > summary {
	display: inline-block;
	cursor: pointer;
	color: inherit;
	font-size: 13px;
	line-height: 1.5;
	text-decoration: underline;
	text-align: right;
}


/*
 * Hide the native details content because the supported
 * cities are intended to be shown inside the popup.
 *
 * JavaScript should move/open the popup when the user
 * activates the View supported cities trigger.
 */

.asm-package-local-cities-content {
	margin-top: 8px;
	text-align: right;
}


/* =========================================================
 * Cart Shipment Product Toggle
 * ========================================================= */

.asm-cart-shipment-toggle {
	display: inline-block;
	color: inherit;
	text-decoration: none;
	cursor: pointer;
}


.asm-cart-shipment-toggle:hover,
.asm-cart-shipment-toggle:focus {
	color: inherit;
	text-decoration: underline;
}


/* =========================================================
 * Cart - Shipping Address Row
 * ========================================================= */

.cart_totals .asm-cart-shipping-address {
	border: 0;
}


.cart_totals .asm-cart-shipping-address-title {
	padding-top: 10px;
	padding-bottom: 0;
	font-weight: 600;
	text-align: left;
	vertical-align: top;
	white-space: nowrap;
}


.cart_totals .asm-cart-shipping-address-content {
	padding-top: 10px;
	padding-bottom: 0;
	text-align: right !important;
	vertical-align: top;
}


/* =========================================================
 * Native Shipping Area
 * ========================================================= */

.asm-cart-native-shipping-area {
	margin: 0;
	padding: 0;
	text-align: right !important;
}


.asm-cart-native-shipping-content {
	margin: 0;
	padding: 0;
	text-align: right !important;
}


.asm-cart-native-shipping-content > * {
	text-align: right !important;
}


/* =========================================================
 * Native Shipping Destination
 * ========================================================= */

.asm-cart-native-shipping-content
.woocommerce-shipping-destination {
	display: block;
	margin: 0;
	padding: 0;
	color: inherit;
	font-size: 13px;
	line-height: 1.5;
	text-align: right !important;
}


.asm-cart-native-shipping-content
.woocommerce-shipping-destination strong {
	font-weight: 600;
}


/* =========================================================
 * Native Change Address
 * ========================================================= */

.asm-cart-native-shipping-content
.shipping-calculator-button {
	display: block;
	width: fit-content;
	margin: 0 0 0 auto;
	padding: 0;
	color: inherit;
	font-size: 13px;
	line-height: 1.5;
	text-align: right !important;
	text-decoration: underline;
	cursor: pointer;
}


/* =========================================================
 * Native Shipping Calculator
 * ========================================================= */

.asm-cart-native-shipping-content
.woocommerce-shipping-calculator {
	display: block;
	width: 100%;
	margin: 10px 0 0;
	padding: 10px 0 0;
	border-top: 0;
	text-align: right !important;
}


.asm-cart-native-shipping-content
.shipping-calculator-form {
	margin: 0;
	padding: 0;
}


.asm-cart-native-shipping-content
.shipping-calculator-form .form-row {
	margin-bottom: 10px;
	text-align: right;
}


.asm-cart-native-shipping-content
.shipping-calculator-form label {
	display: block;
	margin-bottom: 4px;
	text-align: right;
}


.asm-cart-native-shipping-content
.shipping-calculator-form input,
.asm-cart-native-shipping-content
.shipping-calculator-form select {
	width: 100%;
	box-sizing: border-box;
	text-align: right;
}


.asm-cart-native-shipping-content
.shipping-calculator-form button {
	display: inline-block;
	margin-left: auto;
	margin-right: 0;
	cursor: pointer;
}


/* =========================================================
 * IMPORTANT:
 *
 * We do NOT style #shipping_method inside the ASM address
 * container because #shipping_method is intentionally NOT
 * moved there.
 * ========================================================= */


/* =========================================================
 * Cart - Subtotal
 * ========================================================= */

.cart_totals .cart-subtotal th {
	text-align: left;
	vertical-align: top;
}


.cart_totals .cart-subtotal td {
	text-align: right !important;
	vertical-align: top;
}


/* =========================================================
 * Cart - Order Total
 * ========================================================= */

.cart_totals .order-total th {
	text-align: left;
	vertical-align: top;
}


.cart_totals .order-total td {
	text-align: right !important;
	vertical-align: top;
}


/* =========================================================
 * WooCommerce Price
 * ========================================================= */

.cart_totals .woocommerce-Price-amount,
.cart_totals .woocommerce-Price-amount bdi {
	text-align: right !important;
}


/* =========================================================
 * Checkout Button
 * ========================================================= */

.cart_totals .wc-proceed-to-checkout {
	margin-top: 28px;
}


.cart_totals .checkout-button {
	margin-top: 0;
}


/* =========================================================
 * Cart Policies
 * ========================================================= */

.returns-refunds-policy-cart {
	margin: 16px 0 0;
	padding: 0;
	font-size: 14px;
	line-height: 1.6;
	text-align: center;
}


.returns-refunds-policy-cart a {
	text-decoration: underline;
}
.returns-refunds-policy-cart a:hover {
	color: #0073aa;
}


/* =========================================================
 * Cart / Checkout Package ETA
 * ========================================================= */

.asm-package-eta {
	margin: 10px 0;
	font-size: 14px;
	line-height: 1.6;
}


.asm-package-eta-title {
	margin-bottom: 3px;
}


.asm-package-eta-date {
	margin-bottom: 3px;
}


.asm-package-eta-method {
	margin-bottom: 5px;
}


/* =========================================================
 * Checkout ETA Box
 * ========================================================= */

.asm-shipping-eta-box {
	margin: 10px 0;
	font-size: 14px;
	line-height: 1.6;
}


.asm-eta-no-address {
	margin: 10px 0;
}


.asm-package-eta-message {
	margin-top: 4px;
}


/* =========================================================
 * Local Cities - Cart / Checkout
 * ========================================================= */

.asm-package-local-cities-content .asm-local-cities-list {
	margin-top: 5px;
}


/* =========================================================
 * Popup Open State
 * ========================================================= */

body.asm-local-cities-open {
	overflow: hidden;
}


/* =========================================================
 * Mobile
 * ========================================================= */

@media screen and (max-width: 600px) {

	.asm-local-cities-content {
		width: calc(100% - 30px);
		margin-top: 8vh;
		padding: 20px;
	}


	.cart_totals .asm-cart-shipment {
		padding-top: 10px;
	}


	.cart_totals .asm-cart-shipping-address-title {
		padding-top: 8px;
	}


	.cart_totals .asm-cart-shipping-address-content {
		padding-top: 8px;
	}


	.asm-cart-native-shipping-content
	.woocommerce-shipping-destination,
	.asm-cart-native-shipping-content
	.shipping-calculator-button {
		text-align: right !important;
	}


	.asm-cart-native-shipping-content
	.shipping-calculator-form {
		text-align: right !important;
	}


	.cart_totals .shop_table.shop_table_responsive td {
		text-align: right !important;
	}


	.asm-cart-shipment-content {
		text-align: right !important;
	}


	.asm-cart-shipping-address-content {
		text-align: right !important;
	}


	/* =====================================================
	 * Mobile Product List
	 * ===================================================== */

	.asm-cart-shipment-product {
		grid-template-columns: 48px minmax(0, 1fr) 40px;
	}


	.asm-cart-shipment-product-image {
		width: 48px;
		min-width: 48px;
		height: 48px;
	}


	.asm-cart-shipment-product-thumbnail {
		width: 48px;
		height: 48px;
		max-width: 48px;
		max-height: 48px;
	}


	.asm-cart-shipment-product-details {
		padding-left: 10px;
		padding-right: 8px;
	}


	.asm-cart-shipment-product-name {
		text-align: left;
	}


	.asm-cart-shipment-product > .asm-cart-shipment-product-quantity {
		width: 40px;
		min-width: 40px;
		height: 48px;
		text-align: center !important;
	}

}


/* =========================================================
 * Very Small Screens
 * ========================================================= */

@media screen and (max-width: 380px) {

	.cart_totals .asm-cart-shipping-address-title {
		white-space: normal;
	}


	.asm-cart-native-shipping-content
	.woocommerce-shipping-destination,
	.asm-cart-native-shipping-content
	.shipping-calculator-button {
		text-align: right !important;
	}


	/* =====================================================
	 * Very Small Product List
	 * ===================================================== */

	.asm-cart-shipment-product {
		grid-template-columns: 42px minmax(0, 1fr) 36px;
	}


	.asm-cart-shipment-product-image {
		width: 42px;
		min-width: 42px;
		height: 42px;
	}


	.asm-cart-shipment-product-thumbnail {
		width: 42px;
		height: 42px;
		max-width: 42px;
		max-height: 42px;
	}


	.asm-cart-shipment-product-details {
		padding-left: 8px;
		padding-right: 6px;
	}


	.asm-cart-shipment-product > .asm-cart-shipment-product-quantity {
		width: 36px;
		min-width: 36px;
		height: 42px;
	}

}


/* =========================================================
 * Final Alignment
 * ========================================================= */

.cart_totals .shop_table.shop_table_responsive td {
	text-align: right !important;
	vertical-align: top;
}


.cart_totals .cart-subtotal td,
.cart_totals .order-total td {
	text-align: right !important;
}


.cart_totals .asm-cart-shipment-content {
	text-align: right !important;
}


.cart_totals .asm-cart-shipping-address-content {
	text-align: right !important;
}


.cart_totals .asm-cart-shipment-price,
.cart_totals .asm-cart-shipment-free-shipping-notice,
.cart_totals .asm-cart-shipment-eta,
.cart_totals .asm-cart-shipment-eta-date,
.cart_totals .asm-cart-shipment-eta-duration,
.cart_totals .asm-package-local-cities {
	text-align: right !important;
}


.cart_totals .asm-cart-native-shipping-content {
	text-align: right !important;
}


.cart_totals .asm-cart-native-shipping-content
.woocommerce-shipping-destination {
	text-align: right !important;
}


.cart_totals .asm-cart-native-shipping-content
.shipping-calculator-button {
	text-align: right !important;
	margin-left: auto;
}


.cart_totals .woocommerce-Price-amount,
.cart_totals .woocommerce-Price-amount bdi {
	text-align: right !important;
}


/* =========================================================
 * Final Product List Alignment
 * ========================================================= */

/*
 * Product name is explicitly LEFT aligned.
 */

.cart_totals .asm-cart-shipment-product-name {
	text-align: left !important;
}


/*
 * Quantity is explicitly CENTER aligned both horizontally
 * and vertically.
 */

.cart_totals .asm-cart-shipment-product > .asm-cart-shipment-product-quantity {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	vertical-align: middle !important;
}


/*
 * Thumbnail is centered inside its first column.
 */

.cart_totals .asm-cart-shipment-product-image {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
}


/*
 * Product details remain left aligned even though the
 * parent shipment content is right aligned.
 */

.cart_totals .asm-cart-shipment-product-details {
	text-align: left !important;
}


/*
 * Product list itself keeps its normal width.
 */

.cart_totals .asm-cart-shipment-products {
	width: 100%;
	text-align: left !important;
}


/* =========================================================
 * Checkout - WooCommerce Native Shipping Row
 * ========================================================= */

.woocommerce-cart .woocommerce-shipping-totals.shipping,
.woocommerce-checkout .woocommerce-shipping-totals.shipping {
    display: none !important;
}