/*
Theme Name: Kadence Child
Theme URI: https://pixelcreds.com/
Description: PixelCreds Child Theme for Kadence
Author: PixelCreds
Author URI: https://pixelcreds.com/
Template: kadence  
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kadence-child
*/

/* === Kadence Child Theme style.css === */
/* (/wp-content/themes/kadence-child/style.css) */

/* --- Font Definitions --- */
@font-face { font-family: 'PF Tempesta Seven'; src: url('fonts/PFTempestaSeven.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'PF Tempesta Seven'; src: url('fonts/PFTempestaSeven-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }

/* --- Global Styles & Font Application --- */
body { font-family: 'PF Tempesta Seven', sans-serif !important; font-weight: 400 !important; font-size: 15px !important; image-rendering: pixelated; image-rendering: crisp-edges; -webkit-font-smoothing: none; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeSpeed; }
h1, h2, h3, h4, h5, h6 { font-family: 'PF Tempesta Seven', sans-serif !important; font-weight: 700 !important; letter-spacing: 1px; }

/* --- Base Plugin Styles --- */

/* Base styles for common section boxes */
.plugin-section-box { background-color: var(--mlbb-plugin-bg, #0B0024); border-radius: 0.5rem; padding: 1rem; border: 1px solid var(--mlbb-plugin-border-dark, #4b5563); margin-bottom: 1.5rem; }

/* Apply base rendering hints to main plugin wrappers (Font inherited from body) */
.mlbb-product-page-wrapper, .homepage-content {
	/* font-family rule removed as redundant */
	image-rendering: pixelated;
	image-rendering: crisp-edges;
	-webkit-font-smoothing: none;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeSpeed;
}

/* Basic styles for error/notice messages */
.plugin-error-message { color: var(--mlbb-plugin-error-text, #f87171); border: 1px solid var(--mlbb-plugin-error-border, #ef4444); background-color: rgba(153, 27, 27, 0.1); padding: 0.75rem 1rem; margin: 1rem 0; border-radius: 0.25rem; }
.product-status-notice { background-color: #fffbeb; border-left: 4px solid #facc15; color: #b45309; padding: 1rem; margin: 1rem 0; }


/* --- Product Page Styles --- */
.product-page-layout-container { /* Base: stacked */ }
@media (min-width: 768px) { .product-page-layout-container { display: flex; gap: 1rem; } }
@media (min-width: 1024px) { .product-page-layout-container { gap: 1.5rem; } }
.product-main-content { width: 100%; }
@media (min-width: 768px) { .product-main-content { width: 66.666667%; } }
@media (min-width: 1024px) { .product-main-content { width: 75%; } }
.product-info-column { align-self: flex-start; aspect-ratio: 1 / 1; display: flex; flex-direction: column; width: 100%; }
.product-info-image-wrapper { flex-shrink: 0; }
.product-info-image { object-fit: contain; border-radius: 0.5rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); display: block; max-width: 100%; }
.product-info-text-wrapper { margin-top: 1rem; flex-grow: 1; }
.product-info-title { font-size: 1.25rem !important; color: var(--mlbb-plugin-text-white, #f3f4f6); margin-bottom: 0.25rem; }
.product-info-slug { font-size: 0.75rem; line-height: 1rem; color: var(--mlbb-plugin-text-lighter, #9ca3af); margin-bottom: 1rem; }
.product-info-regions { margin-bottom: 1rem; }
.product-info-regions-title { font-size: 0.72rem; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 0.5rem; }
.product-info-regions-list { list-style: none; padding-left: 0; font-size: 0.72rem; line-height: 1rem; display: flex; flex-direction: column; gap: 0.25rem; }
.product-info-regions-list.recommended li { color: #34d399; }
.product-info-regions-list.restricted li { color: var(--mlbb-plugin-error-text, #f87171); }
.product-info-regions.restricted { margin-top: 0.75rem; border-top: 1px solid #374151; padding-top: 0.75rem; }
@media (min-width: 768px) { .product-info-column { width: 33.333333%; margin-bottom: 0; } }
@media (min-width: 1024px) { .product-info-column { width: 25%; } }
.product-verification-section { /* Inherits from .plugin-section-box */ }
@media (min-width: 640px) { .product-verification-section { padding: 1.5rem; } }
.verification-title { text-align: center; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 1rem; font-size: 0.95rem; line-height: 1.25rem; }
.verification-form-container { margin-bottom: 1rem; }
.verification-inputs-wrapper { display: flex; flex-direction: column; gap: 0.5rem; }
.verification-input-group { flex-grow: 1; }
.verification-label { display: block; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 0.25rem; font-size: 0.875rem !important; }
.verification-input { font-family: 'PF Tempesta Seven', sans-serif !important; width: 100%; padding: 0.5rem; border: 2px solid #FF69B4 !important; border-radius: 0.25rem; color: var(--mlbb-plugin-text-white, #ffffff); background-color: var(--mlbb-plugin-input-bg, #220047); line-height: 1.5; -moz-appearance: textfield; font-weight: 400 !important; font-size: 0.93rem !important; }
.verification-input::-webkit-outer-spin-button, .verification-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.verification-input::placeholder { color: var(--mlbb-plugin-text-lighter, #6b7280); opacity: 1; }
.verification-input:focus { outline: none; border-color: #FF69B4; box-shadow: 0 0 0 1px #FF69B4; }
.verification-button-wrapper { padding-top: 0.5rem; }
/* .verification-button rule removed - Use .plugin-button--primary */
@media (min-width: 640px) { .verification-inputs-wrapper { flex-direction: row; align-items: center; justify-content: center; gap: 1rem; } .verification-input-group { flex-grow: 0; } .verification-input-group.user-id { width: 12rem; } .verification-input-group.zone-id { width: 6rem; } .verification-label { display: none; } .verification-button-wrapper { padding-top: 0; } }
.verification-result { width: fit-content; margin: 0 auto 0.25rem auto; text-align: center; padding: 0.75rem; border-width: 2px; border-style: solid; border-color: var(--mlbb-plugin-border-dark, #4b5563); font-size: 0.875rem !important; font-weight: 700 !important; }
.verification-result.success { border-color: var(--mlbb-plugin-success-border, #22c55e) !important; background-color: var(--mlbb-plugin-success-bg, #16a34a) !important; color: var(--mlbb-plugin-text-white, #ffffff) !important; }
.verification-result.error { border-color: var(--mlbb-plugin-error-border, #ef4444) !important; background-color: #991b1b !important; color: var(--mlbb-plugin-text-white, #ffffff) !important; }
.verification-result.hidden { display: none; }
.verification-disclaimer { font-size: 0.75rem; line-height: 1rem; color: var(--mlbb-plugin-warning-text, #facc15); margin-top: 1rem; padding-top: 0.75rem; text-align: center; border-top: 1px solid #374151; }
.package-section-title { text-align: center; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 1rem; font-size: 0.95rem; line-height: 1.25rem; }
.package-group-title { font-weight: 600 !important; color: var(--mlbb-plugin-accent-green, #00FF00); margin-bottom: 0.75rem; margin-top: 1.25rem; text-align: center; font-size: 1.125rem !important; }
.package-group-box { max-height: 400px; overflow-y: auto; padding: 0.75rem; }
.package-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
.package-button { display: flex; flex-direction: column; justify-content: space-between; align-items: center; border: 2px solid #ff00ff; padding: 0.5rem; border-radius: 0.375rem; text-align: center; cursor: pointer; color: var(--mlbb-plugin-text-white, #ffffff); background-color: #000000; transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), outline 150ms cubic-bezier(0.4, 0, 0.2, 1); min-height: 5rem; text-decoration: none; position: relative; outline-offset: 2px; outline: 2px solid transparent; }
.package-button:hover { background-color: var(--mlbb-plugin-accent-neon-green, #70ff00); color: #000000; outline-color: #000000; }
.package-button.selected { background-color: var(--mlbb-plugin-accent-neon-green, #70ff00) !important; color: #000000 !important; outline-color: #000000 !important; }
.package-button-amount { display: block; font-size: 0.9rem !important; line-height: 1rem; text-align: right; width: 100%; }
.package-button-price { display: block; font-size: 0.75rem; line-height: 1rem; text-align: left; width: 100%; margin-top: 0.25rem; }
@media (min-width: 640px) { .package-group-title { text-align: left; } .package-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .package-button-amount { font-size: 0.875rem; line-height: 1.25rem; } }
@media (min-width: 768px) { .package-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.75rem; } }
@media (min-width: 1024px) { .package-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.buy-now-details-section { margin-top: 1.5rem; margin-bottom: 1rem; padding: 1rem; }
.buy-now-details-package { font-size: 1.125rem !important; font-weight: 600 !important; color: var(--mlbb-plugin-accent-neon-green, #70ff00); margin-bottom: 0.25rem; text-align: center; }
.buy-now-details-bonus { font-size: 0.75rem; line-height: 1rem; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 0.5rem; text-align: center; }
.buy-now-details-warning { font-size: 0.75rem; line-height: 1rem; color: var(--mlbb-plugin-text-white, #f3f4f6); margin-bottom: 0.5rem; text-align: center; }
.buy-now-details-price { font-size: 1rem !important; font-weight: 700 !important; color: #34d399; text-align: center; }
.email-input-section { padding: 1rem; }
@media (min-width: 768px) { .email-input-section { padding: 1.5rem; } }
.email-section-title { text-align: center; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 1rem; font-size: 0.95rem; line-height: 1.25rem; }
.email-input { font-family: 'PF Tempesta Seven', sans-serif !important; display: block; width: 25rem; margin: 0 auto; padding: 0.5rem; border: 1px solid var(--mlbb-plugin-border-dark, #4b5563); border-radius: 0.25rem; color: var(--mlbb-plugin-text-white, #ffffff); background-color: var(--mlbb-plugin-input-bg, #220047); font-size: 0.93rem !important; line-height: 1.5; }
.email-input::placeholder { color: var(--mlbb-plugin-text-lighter, #6b7280); opacity: 1; }
.email-input:focus { outline: none; border-color: #c084fc; box-shadow: 0 0 0 1px #c084fc; }
@media (min-width: 640px) { .email-input { max-width: 24rem; } }
.email-error-message { color: var(--mlbb-plugin-error-text, #f87171); margin-top: 0.5rem; font-size: 0.75rem; line-height: 1rem; text-align: center; display: none; }
.email-privacy-notice { font-size: 0.75rem; line-height: 1rem; color: var(--mlbb-plugin-text-lighter, #9ca3af); margin-top: 0.5rem; text-align: center; }
.buy-now-button-container { text-align: center; margin: 1.5rem 0 0.5rem 0; }
/* .buy-now-action-button rule remains separate */
.buy-now-action-button { padding: 0.75rem 1.5rem; background-color: var(--mlbb-plugin-accent-pink, #FF69B4); color: var(--mlbb-plugin-text-white, #ffffff); font-size: 1rem !important; font-weight: 700 !important; letter-spacing: 1px; border-radius: 0.375rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1); transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 150ms cubic-bezier(0.4, 0, 0.2, 1); border: none; cursor: pointer; display: inline-block; }
.buy-now-action-button:hover { background-color: var(--mlbb-plugin-accent-green, #00FF00); color: #000000; }
.buy-now-action-button:disabled { opacity: 0.5; cursor: not-allowed; }
.verification-error-message { color: var(--mlbb-plugin-error-text, #f87171); margin-top: 0.5rem; font-size: 0.875rem; line-height: 1.25rem; display: none; }
.confirmation-modal-overlay { position: fixed; inset: 0; z-index: 50; display: flex; align-items: center; justify-content: center; padding: 1rem; background-color: rgba(0, 0, 0, 0.6); }
.confirmation-modal-overlay.hidden { display: none; }
.confirmation-modal-content {
	background-color: #1f2937;
	border-radius: 0.5rem;
	box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
	padding: 1.5rem;
	width: 100%;
	max-width: 28rem;
	border: 1px solid #a855f7;
	max-height: 90vh; /* Limit height to 90% of viewport height */
	overflow-y: auto; /* Add vertical scrollbar if content overflows */
	display: flex; /* Use flexbox for internal layout */
	flex-direction: column; /* Stack content vertically */
}
.confirmation-modal-title { font-size: 1.125rem !important; font-weight: 600 !important; margin-bottom: 2rem !important; text-align: center; color: var(--mlbb-plugin-text-white, #f3f4f6); }
.confirmation-modal-details {
	margin-top: 1rem;
	color: #e5e7eb;
	font-size: 0.875rem;
	line-height: 1.2; /* Slightly tighter line height */
	display: flex;
	flex-direction: column;
	flex-grow: 1; /* Allow details to grow */
	margin-bottom: 1rem; /* Add space before disclaimer */
}
.detail-item {
	display: flex;
	align-items: baseline;
	font-weight: 400;
	margin-bottom: 0.8rem !important; /* Reduced bottom margin */
	flex-wrap: wrap; /* Allow wrapping if value is very long */
}
.detail-item-label {
	width: 7rem; /* Slightly reduced label width */
	flex-shrink: 0;
	margin-right: 0.5rem; /* Reduced margin */
	font-weight: 400;
	color: #34d399;
}
.detail-item-value {
	word-break: break-word;
	font-weight: 400;
	text-align: left; /* <<< CHANGED from right */
	flex-grow: 1; /* Allow value to take remaining space */
}
/* Styling for the new price format in modal */
#confirm-price .modal-final-price {
	font-weight: bold; /* Make final price bold */
	/* color: #34d399; */ /* Optional: Color final price green */
}
#confirm-price.detail-item-value {
	line-height: 1.3; /* Adjust line height for multi-line price */
}
#confirm-price .modal-final-price {
	font-weight: bold; /* Make final price bold */
	color: #34d399; /* Optional: Color final price green */
	display: block; /* Ensure it's on its own line */
}
#confirm-price .modal-original-price-striked {
	display: block; /* Put on new line */
	text-decoration: line-through;
	color: var(--mlbb-plugin-text-lighter, #9ca3af);
	font-size: 0.9em; /* Slightly smaller */
	margin-top: 0.1rem; /* Space between final and original */
}
.confirmation-modal-disclaimer, .confirmation-modal-policy { font-size: 0.75rem; line-height: 1rem; margin-bottom: 1rem !important; }
.confirmation-modal-disclaimer { color: var(--mlbb-plugin-warning-text, #eab308); margin-bottom: 0.75rem; border-top: 1px solid var(--mlbb-plugin-border-dark, #4b5563); padding-top: 0.75rem; }
.confirmation-modal-policy { color: var(--mlbb-plugin-text-lighter, #9ca3af); margin-bottom: 1.25rem; border-bottom: 1px solid var(--mlbb-plugin-border-dark, #4b5563); padding-bottom: 0.75rem; }
.confirmation-modal-link { color: var(--mlbb-plugin-link-text, #60a5fa); text-decoration: none; }
.confirmation-modal-link:hover { text-decoration: underline; }
.confirmation-modal-actions {
	display: flex;
	justify-content: flex-end; /* Keep buttons to the right */
	gap: 0.75rem; /* Slightly increased gap between buttons */
	margin-top: auto; /* Push actions to the bottom */
	padding-top: 1rem; /* Add space above buttons */
	flex-shrink: 0; /* Prevent actions container from shrinking */
}

/* Adjust button padding to prevent wrapping */
.confirmation-modal-actions .plugin-button {
	padding: 0.5rem 1rem; /* Adjusted padding */
	white-space: nowrap; /* Prevent text wrapping */
	flex-shrink: 0; /* Prevent buttons from shrinking too much */
	min-width: 80px; /* Give buttons a minimum width */
	text-align: center; /* Ensure text is centered */
}


/* --- Static Page Styles --- */

/* Base container for simple static pages (Track Order, Payment Success/Cancelled) */
.static-page-container {
	max-width: 42rem; /* max-w-2xl equivalent */
	margin: 2rem auto; /* my-8 mx-auto */
	padding: 1.5rem; /* p-6 equivalent */
	color: var(--mlbb-plugin-text-white, #f3f4f6);
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
	/* Optional: Add background/border if needed */
	background-color: var(--mlbb-plugin-bg, #0B0024);
	border: 1px solid var(--mlbb-plugin-border-dark, #4b5563);
	border-radius: 0.5rem;
}

/* Responsive padding for the static page container */
@media (min-width: 640px) { /* sm breakpoint based on original rules */
	.static-page-container {
		padding: 2rem; /* p-8 equivalent */
	}
}

/* Page: Track Your Order */
#order-status-checker-container {
	/* All layout styles moved to .static-page-container */
}
.order-status-title { font-size: 1.5rem; line-height: 2rem; font-weight: 700; color: var(--mlbb-plugin-text-white, #f3f4f6); margin-bottom: 1.5rem; text-align: center; }
#order-status-form { margin-bottom: 1.5rem; }
.order-status-label { font-size: 0.9rem; display: block; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 0.5rem; }
.order-status-input-wrapper { display: flex; flex-direction: column; gap: 0.75rem; }
#order_id_input { font-family: 'PF Tempesta Seven', sans-serif !important; flex-grow: 1; padding: 0.5rem; border: 1px solid var(--mlbb-plugin-border-dark, #4b5563); border-radius: 0.25rem; line-height: 1.5; }
#order_id_input::placeholder { opacity: 1; }
#order_id_input:focus { outline: none; border-color: #c084fc; box-shadow: 0 0 0 1px #c084fc; }
/* #order-status-submit-button rule removed - Use .plugin-button--primary */
#order-status-result { margin-top: 1.5rem; border-top: 1px solid var(--mlbb-plugin-border-dark, #4b5563); padding-top: 1.5rem; min-height: 100px; }
.order-status-result-placeholder { color: var(--mlbb-plugin-text-lighter, #9ca3af); text-align: center; }
@media (min-width: 640px) { .order-status-title { font-size: 1.875rem; line-height: 2.25rem; } .order-status-input-wrapper { flex-direction: row; } }

/* --- Status Text Colors --- */
/* Used by payment-success.js and order-status-checker.js */

.order-status-value.status-success,
.status-success { /* Green for success/delivered */
	color: #34d399; /* Tailwind green-400 */
	/* Or use a variable if defined: var(--mlbb-plugin-success-text, #34d399); */
}

.order-status-value.status-failed,
.status-failed { /* Red for failed/error/stock */
	color: var(--mlbb-plugin-error-text, #f87171); /* Tailwind red-400 / variable */
}

.order-status-value.status-pending,
.status-pending,
.order-status-value.status-processing,
.status-processing { /* Yellow for pending/processing */
	color: var(--mlbb-plugin-warning-text, #facc15); /* Tailwind yellow-400 / variable */
}

.order-status-value.status-info,
.status-info { /* Blue for info/other */
	color: var(--mlbb-plugin-link-text, #60a5fa); /* Tailwind blue-400 / variable */
}

.order-status-value.status-unknown,
.status-unknown { /* Gray for unknown */
	color: var(--mlbb-plugin-text-lighter, #9ca3af); /* Tailwind gray-400 / variable */
}

/* Ensure the base class has default styling if needed */
.order-status-value {
	display: inline; /* Default display */
	font-weight: 500; /* Copied from previous #order-status rule */
	word-break: break-word; /* Allow long statuses to wrap */
}
@media (max-width: 639px) { /* Apply block display on small screens if needed */
	.order-status-value {
		/* display: block; */ /* Uncomment if needed */
	}
}

/* Page: Payment Cancelled */
#payment-cancelled-container {
	/* All layout styles moved to .static-page-container */
}
.payment-cancelled-title { font-size: 1.5rem; line-height: 2rem; font-weight: 700; color: var(--mlbb-plugin-warning-text, #facc15); margin-bottom: 0.75rem; text-align: center; }
.payment-cancelled-message { font-size: 1.125rem; line-height: 1.75rem; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 1.5rem; text-align: center; }
.payment-cancelled-actions { margin-top: 1.5rem; text-align: center; }
/* .payment-cancelled-button rule removed - Use .plugin-button--blue */
@media (min-width: 640px) { .payment-cancelled-title { font-size: 1.5rem; line-height: 2.25rem; } }

/* Page: Payment Success */
#order-status-container {
	/* All layout styles moved to .static-page-container */
}
/* Main Title */
.payment-success-title { font-size: 1.5rem; line-height: 2rem; font-weight: 700; color: #34d399; margin-bottom: 0.75rem; text-align: center; }
/* Status Message Paragraph */
.payment-success-status { font-size: 0.9rem; line-height: 1.75rem; color: var(--mlbb-plugin-text-light, #d1d5db); margin-bottom: 1.5rem; text-align: center; }
/* Loading Indicator Container */
.payment-success-loader { display: flex; justify-content: center; align-items: center; margin-bottom: 1.5rem; }
/* Loading Indicator SVG */
.payment-success-loader svg { animation: spin 1s linear infinite; width: 2.5rem; height: 2.5rem; color: var(--mlbb-plugin-link-text, #60a5fa); }
.payment-success-loader circle { opacity: 0.25; stroke: currentColor; stroke-width: 4; }
.payment-success-loader path { opacity: 0.75; fill: currentColor; }
/* Order Details Container */
#order-details { margin-top: 1.5rem; border-top: 1px solid var(--mlbb-plugin-border-dark, #4b5563); padding-top: 1.5rem; font-size: 0.9rem; line-height: 1.5rem; }
#order-details.hidden { display: none; }
/* Order Details Title */
.order-details-title { font-size: 1.25rem; line-height: 1.75rem; font-weight: 600; margin-bottom: 1rem; color: var(--mlbb-plugin-text-white, #f3f4f6); }
/* Individual Order Detail Item Row */
.order-detail-item { margin-bottom: 0.75rem; }
/* Label part of detail item */
.order-detail-label { display: block; margin-bottom: 0.25rem; color: var(--mlbb-plugin-text-lighter, #9ca3af); }
/* Value part of detail item */
.order-detail-value { display: block; word-break: break-word; color: var(--mlbb-plugin-text-white, #f3f4f6); }
#final-order-id.order-detail-value { color: #fde047; }
#order-status.order-detail-value { font-weight: 500; }
/* Timeout Section Container */
#timeout-link-container { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--mlbb-plugin-border-dark, #4b5563); text-align: center; }
#timeout-link-container.hidden { display: none; }
/* Timeout Message Paragraph */
.timeout-message { font-size: 0.9rem; color: var(--mlbb-plugin-text-lighter, #9ca3af); margin-bottom: 0.75rem; }
/* Timeout Link Button */
.timeout-link-button { display: inline-block; padding: 0.5rem 1.25rem; background-color: var(--mlbb-plugin-border-dark, #4b5563); color: var(--mlbb-plugin-text-white, #ffffff); border-radius: 0.375rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1); text-decoration: none; }
.timeout-link-button:hover { background-color: var(--mlbb-plugin-border, #6b7280); }
/* Payment Success Responsive */
@media (min-width: 640px) { .payment-success-title { font-size: 1.5rem; line-height: 2.25rem; } #order-details { font-size: 0.95rem; line-height: 1.75rem; } .order-details-title { font-size: 1.5rem; line-height: 2rem; } .order-detail-item { display: flex; align-items: baseline; } .order-detail-label { width: 8rem; flex-shrink: 0; margin-right: 0.75rem; margin-bottom: 0; } .order-detail-value { display: inline; } }
/* --- End Static Page Styles --- */


/* --- Button Styles (Consolidated) --- */

/* Base styles for plugin buttons */
.plugin-button {
	display: inline-block; /* Or block if they should take full width by default */
	padding: 0.5rem 1.25rem; /* Common padding - adjust if needed */
	border-radius: 0.375rem; /* Common radius */
	border: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font-size: 0.875rem !important; /* Common font size */
	transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* Common shadow */
}

/* Primary Action Button (Pink -> Green Hover) */
/* Replaces: .verification-button, .confirmation-modal-button-confirm, #order-status-submit-button */
.plugin-button--primary {
	background-color: var(--mlbb-plugin-accent-pink, #FF69B4);
	color: var(--mlbb-plugin-text-white, #ffffff);
	font-weight: 700 !important; /* From .verification-button */
	letter-spacing: 1px; /* From .verification-button */
	/* Adjust padding if different from base */
	/* padding: 0.5rem 1.25rem; */ /* Example if needed */
}
.plugin-button--primary:hover {
	background-color: var(--mlbb-plugin-accent-green, #00FF00);
	color: #000000;
}
.plugin-button--primary:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}
/* Responsive width for verification button context */
@media (min-width: 640px) {
	.verification-button-wrapper .plugin-button--primary {
		width: auto; /* Restore auto width on larger screens */
	}
}
/* Ensure full width by default if needed */
.verification-button-wrapper > .plugin-button--primary {
	width: 100%; /* Ensure it takes full width initially */
}


/* Secondary Action Button (Gray -> Darker Gray Hover) */
/* Replaces: .confirmation-modal-button-cancel */
.plugin-button--secondary {
	background-color: var(--mlbb-plugin-border-dark, #4b5563);
	color: var(--mlbb-plugin-text-white, #ffffff);
	padding: 0.5rem 1rem; /* Specific padding from modal cancel button */
}
.plugin-button--secondary:hover {
	background-color: var(--mlbb-plugin-border, #6b7280);
}

/* Blue Action Button (Blue -> Darker Blue Hover) */
/* Replaces: .payment-cancelled-button */
.plugin-button--blue {
	background-color: #3b82f6;
	color: var(--mlbb-plugin-text-white, #ffffff);
	padding: 0.5rem 1.5rem; /* Specific padding from payment cancel button */
}
.plugin-button--blue:hover {
	background-color: #2563eb;
}


/* Buy Now Button (Remains separate for now due to unique styles) */
.buy-now-action-button {
	padding: 0.75rem 1.5rem;
	background-color: var(--mlbb-plugin-accent-pink, #FF69B4);
	color: var(--mlbb-plugin-text-white, #ffffff);
	font-size: 1rem !important;
	font-weight: 700 !important;
	letter-spacing: 1px;
	border-radius: 0.375rem;
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
	transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
	border: none;
	cursor: pointer;
	display: inline-block;
}
.buy-now-action-button:hover {
	background-color: var(--mlbb-plugin-accent-green, #00FF00);
	color: #000000;
}
.buy-now-action-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* --- End Button Styles --- */


/* --- Utility Styles --- */

/* --- Ensure this CSS exists in style.css --- */
/* Loading Indicator */
.loading-indicator { display: none; }
.loading-indicator.active {
	display: inline-block;
	border: 4px solid #f3f3f3; /* Light grey base circle */
	border-top: 4px solid var(--mlbb-plugin-accent-green, #00FF00); /* Green spinning segment */
	border-radius: 50%;
	width: 20px;
	height: 20px;
	animation: spin 0.7s linear infinite;
	vertical-align: middle;
	margin-right: 5px;
}
@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* Optional: Style the wrapper div if needed */
.verification-loading {
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--mlbb-plugin-text-light, #d1d5db);
	font-size: 0.875rem;
}
/* --- End Loading Indicator CSS --- */

/* Custom Scrollbar for Package Boxes */
.package-group-box::-webkit-scrollbar { width: 8px; height: 8px; }
.package-group-box::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.5); border-radius: 10px; }
.package-group-box::-webkit-scrollbar-thumb { background-color: var(--mlbb-plugin-border-dark, #4b5563); border-radius: 10px; }
.package-group-box::-webkit-scrollbar-thumb:hover { background-color: var(--mlbb-plugin-border, #6b7280); }

/* === Contact Us Page Styles (Optimized) === */

/* Main container for the contact us content block */
.contact-us-container {
	background-color: var(--mlbb-plugin-bg, #0B0024); /* bg-[#0B0024] */
	color: var(--mlbb-plugin-text-light, #d1d5db); /* text-gray-300 (applied default) */
	border: 1px solid var(--mlbb-plugin-border-dark, #4b5563); /* border border-gray-600 */
	border-radius: 0.5rem; /* rounded-lg */
	padding: 1.5rem; /* p-6 */
	margin: 2rem auto; /* my-8 mx-auto */
	max-width: 42rem; /* max-w-2xl */
	/* font-tempesta is assumed to be applied globally via body */
}

/* Responsive padding for medium screens and up */
@media (min-width: 768px) { /* md */
	.contact-us-container {
		padding: 2rem; /* md:p-8 */
	}
}

/* Main heading */
.contact-us-heading {
	font-size: 1.5rem; /* text-2xl */
	line-height: 2rem;
	font-weight: 700; /* font-bold */
	color: var(--mlbb-plugin-text-white, #ffffff); /* text-white */
	text-align: center; /* text-center */
	margin-bottom: 1.5rem; /* mb-6 */
}

/* Introductory paragraph */
.contact-us-intro {
	font-size: 0.875rem; /* text-sm */
	line-height: 1.25rem;
	color: var(--mlbb-plugin-text-light, #d1d5db); /* text-gray-300 */
	text-align: center; /* text-center */
	margin-bottom: 2rem; /* mb-8 */
}

/* Section heading (within .plugin-section-box) */
.contact-section-heading {
	font-size: 0.875rem; /* text-sm */
	line-height: 1.25rem;
	font-weight: 600; /* font-semibold */
	color: var(--mlbb-plugin-accent-green, #00FF00); /* text-[#00FF00] */
	text-align: center; /* text-center */
	margin-bottom: 1rem; /* mb-4 */
}

/* Responsive text alignment for section heading */
@media (min-width: 640px) { /* sm */
	.contact-section-heading {
		text-align: left; /* sm:text-left */
	}
}

/* Container for contact links/buttons */
.contact-links-container {
	font-size: 0.75rem; /* text-xs */
	line-height: 1rem;
}
/* Applies spacing between direct children links/buttons */
.contact-links-container > * + * {
	margin-top: 1rem; /* space-y-4 */
}

/* Individual contact link/button */
.contact-button {
	display: flex; /* flex */
	align-items: center; /* items-center */
	padding: 0.75rem; /* p-3 */
	background-color: #374151; /* bg-gray-700 */
	border-radius: 0.375rem; /* rounded-md */
	transition: background-color 150ms ease-in-out; /* transition duration-150 ease-in-out */
	text-decoration: none;
	color: var(--mlbb-plugin-text-white, #f3f4f6); /* text-gray-100 */
}
.contact-button:hover {
	background-color: var(--mlbb-plugin-border-dark, #4b5563); /* hover:bg-gray-600 */
}

/* Icon within the contact button */
.contact-icon {
	width: 1.25rem; /* w-5 */
	height: 1.25rem; /* h-5 */
	margin-right: 0.75rem; /* mr-3 */
	flex-shrink: 0; /* flex-shrink-0 */
	fill: currentColor; /* fill="currentColor" */
}
.contact-icon.whatsapp {
	color: #34d399; /* text-green-400 */
}
.contact-icon.telegram {
	color: var(--mlbb-plugin-link-text, #60a5fa); /* text-blue-400 */
}
.contact-icon.email {
	color: var(--mlbb-plugin-text-lighter, #9ca3af); /* text-gray-400 */
}

/* Paragraph text within sections */
.contact-section-text {
	color: var(--mlbb-plugin-text-light, #d1d5db); /* text-gray-300 */
	margin-bottom: 0.75rem; /* mb-3 */
	font-size: 0.75rem; /* text-xs */
	line-height: 1rem;
}

/* Link within paragraph text */
.contact-text-link {
	color: var(--mlbb-plugin-link-text, #60a5fa); /* text-blue-400 */
	text-decoration: none;
}
.contact-text-link:hover {
	text-decoration: underline; /* hover:underline */
}

/* Small note text (e.g., refund policy details) */
.contact-section-note {
	font-size: 10px; /* text-[10px] */
	line-height: 1.2; /* Adjust as needed */
	color: var(--mlbb-plugin-text-lighter, #9ca3af); /* text-gray-400 */
	margin-top: 0.75rem; /* mt-3 */
}

/* === End Contact Us Page Styles === */

/* === Policy Pages Styles (Updated for Nested Lists) === */

/* Container for policy page blocks */
.policy-page-container {
	margin: 2rem auto; /* my-8 mx-auto */
	max-width: 48rem; /* max-w-3xl */
	padding: 1rem; /* p-4 */
	/* Optional: Add background/border if the block is on a plain background */
	/* background-color: var(--mlbb-plugin-bg, #0B0024); */
	/* border: 1px solid var(--mlbb-plugin-border-dark, #4b5563); */
	/* border-radius: 0.5rem; */
}

/* Responsive padding for medium screens and up */
@media (min-width: 768px) { /* md */
	.policy-page-container {
		padding: 2rem; /* md:p-8 */
	}
}

/* Content wrapper - sets default text color and base sizing */
.policy-page-content {
	color: var(--mlbb-plugin-text-light, #d1d5db); /* default: text-gray-200 */
	font-size: 1rem; /* Base size, adjust if needed */
	line-height: 1.6; /* Base line height */
}

/* --- START: Specific Font Application --- */
/* Apply Arial font specifically to common text elements within the policy content */
/* Added !important to override global !important font */
.policy-page-content h1,
.policy-page-content h2,
.policy-page-content h3,
.policy-page-content h4,
.policy-page-content h5,
.policy-page-content h6,
.policy-page-content p,
.policy-page-content ul,
.policy-page-content ol,
.policy-page-content li,
.policy-page-content strong,
.policy-page-content b {
	font-family: Arial, sans-serif !important; /* Apply Arial specifically and force override */
}
/* --- END: Specific Font Application --- */


/* Main Page Title (H1) */
.policy-title {
	font-size: 1.875rem; /* text-3xl */
	line-height: 2.25rem;
	font-weight: 700; /* font-bold */
	color: var(--mlbb-plugin-text-white, #ffffff); /* text-white */
	text-align: center; /* text-center */
	margin-bottom: 1rem; /* mb-4 */
}

/* Subtitle / Effective Date */
.policy-subtitle {
	font-size: 0.875rem; /* text-sm */
	line-height: 1.25rem;
	color: var(--mlbb-plugin-text-lighter, #9ca3af); /* text-gray-400 */
	text-align: center; /* text-center */
	margin-bottom: 1.5rem; /* mb-6 */
}

/* Section Heading (H2) */
.policy-heading-2 {
	font-size: 1.5rem; /* text-2xl */
	line-height: 2rem;
	font-weight: 600; /* font-semibold */
	color: var(--mlbb-plugin-text-white, #ffffff); /* text-white */
	margin-top: 1.5rem; /* mt-6 */
	margin-bottom: 0.75rem; /* mb-3 */
	padding-bottom: 0.25rem; /* pb-1 */
	border-bottom: 1px solid var(--mlbb-plugin-border-dark, #4b5563); /* border-b border-gray-600 */
}

/* Sub-Section Heading (H3) */
.policy-heading-3 {
	font-size: 1.25rem; /* text-xl */
	line-height: 1.75rem;
	font-weight: 600; /* font-semibold */
	color: var(--mlbb-plugin-text-white, #f3f4f6); /* text-gray-100 */
	margin-top: 1rem; /* mt-4 */
	margin-bottom: 0.5rem; /* mb-2 */
}

/* Sub-Sub-Section Heading (H4) */
.policy-heading-4 {
	font-size: 1.125rem; /* text-lg */
	line-height: 1.75rem;
	font-weight: 600; /* font-semibold */
	color: var(--mlbb-plugin-text-white, #f3f4f6); /* text-gray-100 */
	margin-top: 0.75rem; /* mt-3 */
	margin-bottom: 0.25rem; /* mb-1 */
}


/* Standard Paragraph */
.policy-paragraph {
	margin-bottom: 1rem; /* mb-4 */
}

/* Links within text */
.policy-link {
	color: var(--mlbb-plugin-link-text, #60a5fa); /* text-blue-400 */
	text-decoration: none;
}
.policy-link:hover {
	text-decoration: underline; /* hover:underline */
}

/* Ordered List */
.policy-list-ordered {
	list-style-type: lower-alpha; /* list-[lower-alpha] */
	padding-left: 1.5rem; /* pl-6 */
	margin-bottom: 1rem; /* mb-4 */
}

/* Unordered List */
.policy-list-unordered {
	list-style-type: none; /* list-none */
	padding-left: 1.5rem; /* pl-6 */
	margin-bottom: 1rem; /* mb-4 */
}

/* List Item (applies to both ol and ul) */
.policy-list-item {
	/* Add specific list item styling if needed */
}

/* --- START: Nested List Styling --- */
/* Style for UL nested directly inside an LI */
.policy-list-item ul {
	list-style-type: disc; /* list-disc */
	padding-left: 1.5rem; /* pl-6 */
	margin-top: 0.25rem; /* mt-1 */
	margin-bottom: 0.5rem; /* Add some bottom margin */
}
/* Spacing for items within a nested UL */
.policy-list-item ul > li + li {
	margin-top: 0.25rem; /* space-y-1 */
}
/* --- END: Nested List Styling --- */


/* --- START: List Item Spacing Modifiers --- */
/* Add class="policy-list-spacing-1" or "policy-list-spacing-2" to top-level ol/ul */
.policy-list-spacing-1 > li + li {
	margin-top: 0.25rem; /* space-y-1 */
}
.policy-list-spacing-2 > li + li {
	margin-top: 0.5rem; /* space-y-2 */
}
/* --- END: List Item Spacing Modifiers --- */


/* Bold text */
.policy-text-bold {
	font-weight: 700; /* Corresponds to implicit bold or font-bold */
}


/* === End Policy Pages Styles === */

/* --- Add styles for Contest Countdown Timer --- */
#contest-countdown-timer {
	font-size: 1rem; /* Adjust size as needed */
	line-height: 1.5;
	color: var(--mlbb-plugin-text-light, #d1d5db); /* Color for "Contest Ends In:" text */
	/* Inherits background, border-radius from .plugin-section-box */
	/* Added specific border color and padding in the inline style, but could be moved here */
    /* Example:
    padding: 0.75rem 1rem;
    background-color: #1f2937;
    border: 1px solid var(--mlbb-plugin-accent-green, #00FF00);
    */
}

#contest-countdown-timer #countdown-time {
	font-weight: 700; /* Make the time bold */
	color: var(--mlbb-plugin-text-white, #ffffff); /* Make the time white */
	margin-left: 0.25rem;
}
/* --- End Contest Countdown Timer Styles --- */

/* --- Add styles for Contest Subtitle --- */
.contest-subtitle {
	font-size: 0.8rem; /* Adjust as needed */
	line-height: 1.5; /* Adjust as needed */
	color: #FFD700; /* Standard gold color */
	/* text-align: center; */ /* Already set inline */
	/* margin-bottom: 1.5rem; */ /* Already set inline */
	font-weight: 600; /* Make it semi-bold */
}
/* --- End Contest Subtitle Styles --- */