/**
 * DBIZ Patterns CSS - Part 2
 * Contact page and additional patterns styling
 *
 * @package WordPress
 * @subpackage Twenty_Twenty_Five
 * @since Twenty Twenty-Five 1.0
 */

/* ========================================
   CONTACT PAGE STYLES
   ======================================== */

/* Contact Hero Section */
.dbiz-contact-hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, #0066FF 0%, #00C8FF 100%) !important;
}

.dbiz-hero-fullscreen {
	min-height: 588px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.dbiz-hero-fullscreen > .wp-block-group {
	width: 100%;
}

.dbiz-contact-hero::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: radial-gradient(circle at 30% 50%, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
	            radial-gradient(circle at 70% 80%, rgba(0, 200, 255, 0.2) 0%, transparent 50%);
	pointer-events: none;
}

.dbiz-contact-hero .wp-block-group {
	position: relative;
	z-index: 1;
}

.dbiz-contact-hero h1 {
	color: #ffffff !important;
	text-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}

.dbiz-contact-hero h1 mark {
	background-color: rgba(0, 0, 0, 0) !important;
	color: rgba(255, 255, 255, 0.85) !important;
	padding: 0;
	font-weight: 700;
}

.dbiz-contact-hero p {
	color: rgba(255, 255, 255, 0.95) !important;
	text-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
	max-width: 700px;
	margin-left: auto;
	margin-right: auto;
}

/* Responsive adjustments for hero */
@media (max-width: 768px) {
	.dbiz-hero-fullscreen {
		min-height: 70vh;
	}
	
	.dbiz-contact-hero h1 {
		font-size: 2.5rem !important;
	}
	
	.dbiz-contact-hero p {
		font-size: 1rem !important;
	}
}

@media (max-width: 600px) {
	.dbiz-hero-fullscreen {
		min-height: 60vh;
	}
}

/* Contact Form Styles */
.dbiz-contact-form {
	max-width: 100%;
}

.dbiz-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	margin-bottom: 1.5rem;
}

@media (max-width: 768px) {
	.dbiz-form-grid {
		grid-template-columns: 1fr;
	}
}

.dbiz-form-field {
	margin-bottom: 1.5rem;
}

.dbiz-form-label {
	display: block;
	font-size: 0.875rem;
	font-weight: 600;
	color: #334155;
	margin-bottom: 0.5rem;
}


.dbiz-form-input,
.dbiz-form-textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 2px solid #e2e8f0;
	border-radius: 0.5rem;
	font-size: 1rem;
	transition: all 0.2s;
	font-family: inherit;
	background: #ffffff;
	color: #1e293b;
}

.dbiz-form-input::placeholder,
.dbiz-form-textarea::placeholder {
	color: #94a3b8;
}

.dbiz-form-input:hover,
.dbiz-form-textarea:hover {
	border-color: #cbd5e1;
}

.dbiz-form-input:focus,
.dbiz-form-textarea:focus {
	outline: none;
	border-color: #0066FF;
	box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);
	background: #ffffff;
}

.dbiz-form-textarea {
	resize: vertical;
	padding-top: 0.75rem;
	min-height: 150px;
}

.dbiz-form-submit {
	width: 100%;
	padding: 1rem 2rem;
	background: linear-gradient(135deg, #0066FF 0%, #7C3AED 100%);
	color: white;
	border: none;
	border-radius: 0.5rem;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	transition: all 0.3s;
	box-shadow: 0 10px 25px rgba(0, 102, 255, 0.3);
}

.dbiz-form-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 15px 30px rgba(0, 102, 255, 0.4);
	background: linear-gradient(135deg, #0052CC 0%, #6B21A8 100%);
}

.dbiz-form-submit:active {
	transform: translateY(0);
}

.dbiz-form-submit i {
	transition: transform 0.2s;
	font-size: 1.125rem;
}

.dbiz-form-submit:hover i {
	transform: translateX(2px);
}

.dbiz-form-note {
	margin-top: 1rem;
	font-size: 0.75rem;
	color: #64748b;
	text-align: center;
	line-height: 1.5;
}

/* Editable form fields styling */
.dbiz-editable-field {
	position: relative;
	cursor: text;
	margin: 0 !important;
}

.dbiz-editable-field:hover {
	border-color: #cbd5e1 !important;
}

.dbiz-contact-form-section .dbiz-form-label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}

.dbiz-contact-form-section .dbiz-form-label i {
	font-size: 1rem;
	color: #334155;
}

/* Contact Info Styles */
.dbiz-contact-info-section {
	position: relative;
}

.dbiz-contact-methods {
	flex-direction: column;
	gap: 1rem;
}

.dbiz-contact-method {
    background-color: rgb(248, 250, 252);
	transition: all 0.3s ease;
	cursor: pointer;
	display: flex;
	align-items: flex-start;
	gap: 1rem;
}

.yeu-cau-demo>a{
    background-color: rgb(255, 255, 255, 0.95) !important;
    color: rgb(0, 82, 204) !important;
}

.gui-tin-nhan>a{
    color: rgb(255, 255, 255) !important;
}

.dbiz-contact-method:hover {
	transform: translateY(-4px);
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
	background-color: rgb(241, 245, 249) !important;
}

.dbiz-contact-method-icon {
	flex-shrink: 0;
}

.dbiz-contact-method a {
	text-decoration: none;
	color: inherit;
	transition: color 0.2s;
}

.dbiz-contact-method a:hover {
	text-decoration: underline;
}

/* Quick Actions */
.dbiz-quick-actions {
	position: relative;
	overflow: hidden;
}

.dbiz-quick-actions .wp-block-button__link {
	display: block;
	text-align: left;
	padding: 1rem 1.5rem;
	transition: all 0.3s;
}

.dbiz-quick-actions .wp-block-button:hover .wp-block-button__link {
	transform: translateY(-2px);
}

.dbiz-quick-actions .wp-block-button__link small {
	display: block;
	margin-top: 0.25rem;
	opacity: 0.9;
}

/* Support Hours */
.dbiz-support-hours {
	position: relative;
}

.dbiz-support-hours ul {
	list-style: none;
	padding-left: 0;
}

.dbiz-support-hours ul li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.25rem 0;
}

.dbiz-support-hours ul li span {
	font-size: 0.5rem;
	line-height: 1;
}

/* Contact Map Section */
.dbiz-contact-map-section {
	position: relative;
}

.dbiz-location-card {
	transition: all 0.3s ease;
	overflow: hidden;
	height: 100%;
	flex-direction: column;
}

.dbiz-location-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}

.dbiz-location-card .wp-block-group:first-child {
	flex-shrink: 0;
}

.dbiz-location-card ul {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.dbiz-location-card ul li {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	line-height: 1.6;
}

.dbiz-location-card ul li span {
	flex-shrink: 0;
	font-size: 0.5rem;
	line-height: 1.6;
	margin-top: 0.25rem;
}

/* Contact CTA */
.dbiz-contact-cta {
	text-align: center;
}

.dbiz-contact-cta .wp-block-buttons {
	margin-top: 1.5rem;
}

.dbiz-contact-cta .wp-block-button {
	margin: 0.5rem;
}

/* Contact Content Section */
.dbiz-contact-content-section .wp-block-columns {
	align-items: flex-start;
}

.dbiz-contact-content-section {
	background-color: #ffffff !important;
}

/* Form label with icon styling */
.dbiz-form-label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.dbiz-form-label i {
	font-size: 1rem;
	color: #334155;
}

/* Responsive Adjustments */
@media (max-width: 1024px) {
	.dbiz-contact-content-section .wp-block-columns {
		flex-direction: column;
	}
	
	.dbiz-contact-content-section .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}
}

@media (max-width: 768px) {
	.dbiz-contact-hero h1 {
		font-size: 2.5rem !important;
	}
	
	.dbiz-contact-map-section h2 {
		font-size: 2rem !important;
	}
	
	.dbiz-location-card {
		margin-bottom: 2rem;
	}
	
	.dbiz-contact-cta .wp-block-buttons {
		flex-direction: column;
	}
	
	.dbiz-contact-cta .wp-block-button {
		width: 100%;
		margin: 0.25rem 0;
	}
}

@media (max-width: 600px) {
	.dbiz-contact-hero {
		padding-top: 3rem !important;
		padding-bottom: 3rem !important;
	}
	
	.dbiz-contact-hero h1 {
		font-size: 2rem !important;
	}
	
	.dbiz-contact-hero p {
		font-size: 1rem !important;
	}
	
	.dbiz-contact-content-section,
	.dbiz-contact-map-section {
		padding-top: 3rem !important;
		padding-bottom: 3rem !important;
	}
	
	.dbiz-form-submit {
		font-size: 0.95rem;
		padding: 0.875rem 1.5rem;
	}
}

/* Accessibility */
.dbiz-form-input:focus-visible,
.dbiz-form-textarea:focus-visible,
.dbiz-form-submit:focus-visible {
	outline: 2px solid #0066FF;
	outline-offset: 2px;
}

/* Print Styles */
@media print {
	.dbiz-contact-hero {
		background: none !important;
		color: #000 !important;
	}
	
	.dbiz-form-submit,
	.dbiz-quick-actions {
		display: none;
	}
}

/* ========================================
   TRAINING PAGE STYLES
   ======================================== */

/* Training Hero */
.dbiz-training-hero {
	position: relative;
	overflow: hidden;
}

.dbiz-training-hero::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: 
		linear-gradient(rgba(255,255,255,0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,0.05) 1px, transparent 1px);
	background-size: 20px 20px;
	pointer-events: none;
}

.dbiz-training-hero .wp-block-group {
	position: relative;
	z-index: 1;
}

/* Training Program Cards */
.dbiz-training-program-card {
	transition: all 0.3s ease;
	cursor: pointer;
}

.dbiz-training-program-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
	border-color: #2563eb !important;
}

/* Course Cards */
.dbiz-course-card {
	transition: all 0.3s ease;
	height: 100%;
}

.dbiz-course-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
	border-color: #2563eb !important;
}

/* Benefit Cards */
.dbiz-benefit-card {
	transition: all 0.3s ease;
	text-align: center;
}

.dbiz-benefit-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Tabs Navigation */
.dbiz-tabs-wrapper {
	margin-bottom: 3rem;
}

.dbiz-tabs-nav {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1rem;
	background: #f3f4f6;
	padding: 0.5rem;
	border-radius: 12px;
}

.dbiz-tab-btn {
	padding: 1rem 1.5rem;
	border: none;
	background: transparent;
	color: #6b7280;
	font-size: 1rem;
	font-weight: 600;
	cursor: pointer;
	border-radius: 8px;
	transition: all 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
}

.dbiz-tab-btn i {
	font-size: 1rem;
}

.dbiz-tab-btn:hover {
	background: rgba(37, 99, 235, 0.1);
	color: #2563eb;
}

.dbiz-tab-btn.active {
	background: #ffffff;
	color: #2563eb;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.dbiz-tab-panel {
	display: none;
}

.dbiz-tab-panel.active {
	display: block;
}

.wp-block-getwid-tabs__tab-content {
    border: none !important;
    padding: 0 !important;
}

/* Getwid Tabs Styling for Training Courses */
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	/* margin-bottom: 3rem; */
	padding: 0.5rem;
	background: #f3f4f6;
	border-radius: 12px;
	list-style: none;
	border: none;
}

.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link {
	margin: 0;
	flex: 1;
	min-width: 0;
}

.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.75rem 1rem;
	color: #6b7280;
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
	border-radius: 8px;
	background: transparent;
	transition: all 0.2s ease;
	border: 1px solid transparent;
}

.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link a i {
	font-size: 1rem;
	color: inherit;
}

/* Active/Selected Tab - Only apply when truly active */
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link.is-active a,
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link.active a,
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link.ui-tabs-active a,
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link a[aria-selected="true"] {
	background: #ffffff;
	color: #1e3a8a;
	border: 1px solid #e5e7eb;
	box-shadow: none;
}

.wp-block-getwid-tabs__nav-link.ui-tabs-active {
    background: none!important;
}

/* Ensure inactive tabs don't have active styles */
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link:not(.is-active):not(.active):not(.ui-tabs-active) a:not([aria-selected="true"]) {
	background: transparent !important;
	color: #6b7280 !important;
	border: 1px solid transparent !important;
}

/* Inactive Tab Hover */
.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link:not(.is-active):not(.active):not(.ui-tabs-active) a:hover {
	background: rgba(255, 255, 255, 0.5);
	color: #4b5563;
}

/* Responsive */
@media (max-width: 1024px) {
	.dbiz-training-hero h1 {
		font-size: 2.5rem !important;
	}
	
	.dbiz-training-hero p {
		font-size: 1rem !important;
	}
	
	.dbiz-tabs-nav {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.dbiz-training-courses-section .wp-block-getwid-tabs__nav-links {
		gap: 0.5rem;
		padding: 0.5rem;
	}
	
	.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link {
		flex: 1 1 calc(50% - 0.25rem);
	}
}

@media (max-width: 768px) {
	.dbiz-training-hero {
		padding-top: 4rem !important;
		padding-bottom: 4rem !important;
	}
	
	.dbiz-training-hero h1 {
		font-size: 2rem !important;
	}
	
	.dbiz-tabs-nav {
		grid-template-columns: 1fr;
	}
	
	.dbiz-training-courses-section .wp-block-getwid-tabs__nav-links {
		flex-direction: column;
		gap: 0.5rem;
	}
	
	.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link {
		flex: 1 1 100%;
	}
	
	.dbiz-training-courses-section .wp-block-getwid-tabs__nav-link a {
		justify-content: flex-start;
		padding: 0.75rem 1rem;
	}
}

/* ========================================
   DEMO PAGE STYLES
   ======================================== */

/* Demo Hero Section */
.dbiz-demo-hero {
	position: relative;
	overflow: hidden;
}

.dbiz-demo-hero .wp-block-group {
	position: relative;
	z-index: 1;
}

.dbiz-demo-hero h1 {
	color: #ffffff !important;
	text-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}

.dbiz-demo-hero p {
	color: rgba(255, 255, 255, 0.95) !important;
}

/* Demo Form Section */
.dbiz-demo-form-section {
	max-width: 100%;
}

.dbiz-demo-form-section .dbiz-form-label,
.dbiz-demo-form-section label.dbiz-form-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	color: #334155;
	font-weight: 600;
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
	margin-top: 0;
}

.dbiz-demo-form-section .dbiz-form-label i,
.dbiz-demo-form-section label.dbiz-form-label i {
	font-size: 1rem;
	color: #0066FF;
}

.dbiz-demo-form-section .dbiz-form-input {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 2px solid #e2e8f0;
	border-radius: 0.5rem;
	background-color: #ffffff;
	color: #334155;
	font-size: 1rem;
	transition: all 0.2s ease;
	font-family: inherit;
	display: block;
}

/* Inputs in columns don't need margin-bottom (columns handle spacing) */
.dbiz-demo-form-section .wp-block-column .dbiz-form-input {
	margin-bottom: 0;
}

/* Inputs outside columns need margin-bottom */
.dbiz-demo-form-section .wp-block-html .dbiz-form-input {
	margin-bottom: 1.5rem;
}

.dbiz-demo-form-section .dbiz-form-input::placeholder {
	color: #94a3b8;
}

.dbiz-demo-form-section .dbiz-form-input:focus {
	border-color: #0066FF;
	box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);
	outline: none;
}

.dbiz-demo-form-section .dbiz-form-input:hover {
	border-color: #cbd5e1;
}

.dbiz-demo-form-section .dbiz-form-textarea {
	min-height: 120px;
	resize: vertical;
	font-family: inherit;
}

.dbiz-demo-form-section select.dbiz-form-input {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%2394a3b8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 1em;
	padding-right: 2.5rem;
}

.dbiz-demo-form-section .dbiz-form-submit .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-weight: 600;
}

/* Demo Features Section */
.dbiz-demo-features-section {
	max-width: 100%;
}

.dbiz-demo-benefit-card {
	text-align: center;
	transition: all 0.3s ease;
}

.dbiz-demo-benefit-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.dbiz-demo-process {
	position: relative;
	overflow: hidden;
}

.dbiz-demo-step {
	align-items: flex-start;
}

.dbiz-demo-step-number {
	flex-shrink: 0;
	min-width: 2rem;
	text-align: center;
}

.dbiz-demo-product-card {
	transition: all 0.3s ease;
	border: 2px solid #e2e8f0;
}

.dbiz-demo-product-card:hover {
	border-color: #cbd5e1;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transform: translateY(-2px);
}

.dbiz-demo-product-features {
	list-style: none;
	padding: 0;
	margin: 0;
}

.dbiz-demo-product-features li {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}

.dbiz-demo-product-features li:last-child {
	margin-bottom: 0;
}

/* Responsive adjustments for demo page */
@media (max-width: 1024px) {
	.dbiz-demo-hero h1 {
		font-size: 2.5rem !important;
	}
	
	.dbiz-demo-hero p {
		font-size: 1.125rem !important;
	}
}

@media (max-width: 768px) {
	.dbiz-demo-hero {
		padding-top: 4rem !important;
		padding-bottom: 4rem !important;
	}
	
	.dbiz-demo-hero h1 {
		font-size: 2rem !important;
	}
	
	.dbiz-demo-hero .wp-block-columns {
		flex-direction: column;
		gap: 1.5rem;
	}
	
	.dbiz-demo-form-section .wp-block-columns,
	.dbiz-demo-features-section .wp-block-columns {
		flex-direction: column;
	}
}

/* ========================================
   TRIAL PAGE STYLES
   ======================================== */

/* Trial Hero Section */
.dbiz-trial-hero {
	position: relative;
	overflow: hidden;
}

.dbiz-trial-hero .wp-block-group {
	position: relative;
	z-index: 1;
}

.dbiz-trial-hero h1 {
	color: #ffffff !important;
	text-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}

.dbiz-trial-hero p {
	color: rgba(255, 255, 255, 0.95) !important;
}

/* Trial Form Section - Reuse demo form styles */
.dbiz-trial-form-section {
	max-width: 100%;
}

.dbiz-trial-form-section .dbiz-form-label,
.dbiz-trial-form-section label.dbiz-form-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	color: #334155;
	font-weight: 600;
	margin-bottom: 0.5rem;
	font-size: 0.875rem;
	margin-top: 0;
}

.dbiz-trial-form-section .dbiz-form-label i,
.dbiz-trial-form-section label.dbiz-form-label i {
	font-size: 1rem;
	color: #0066FF;
}

.dbiz-trial-form-section .dbiz-form-input {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 2px solid #e2e8f0;
	border-radius: 0.5rem;
	background-color: #ffffff;
	color: #334155;
	font-size: 1rem;
	transition: all 0.2s ease;
	font-family: inherit;
	display: block;
}

.dbiz-trial-form-section .wp-block-column .dbiz-form-input {
	margin-bottom: 0;
}

.dbiz-trial-form-section .wp-block-html .dbiz-form-input {
	margin-bottom: 1.5rem;
}

.dbiz-trial-form-section .dbiz-form-input::placeholder {
	color: #94a3b8;
}

.dbiz-trial-form-section .dbiz-form-input:focus {
	border-color: #0066FF;
	box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);
	outline: none;
}

.dbiz-trial-form-section .dbiz-form-input:hover {
	border-color: #cbd5e1;
}

.dbiz-trial-form-section .dbiz-form-textarea {
	min-height: 120px;
	resize: vertical;
	font-family: inherit;
}

.dbiz-trial-form-section select.dbiz-form-input {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%2394a3b8' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 1em;
	padding-right: 2.5rem;
}

.dbiz-trial-form-section .dbiz-form-submit .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-weight: 600;
}

/* Trial Features Section */
.dbiz-trial-features-section {
	max-width: 100%;
}

.dbiz-trial-benefit {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
    background-color: rgb(248, 250, 252) !important;
    padding: 15px;
    border-radius: 12px;
    margin-bottom: 5px !important;
    transition: all 0.3s ease;
}

.dbiz-trial-benefit:hover {
	transform: translateY(-4px);
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
	background-color: rgb(241, 245, 249) !important;
}

.dbiz-trial-benefit-icon {
	flex-shrink: 0;
	margin: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.dbiz-trial-benefit-icon i {
	margin: 0;
}

.dbiz-trial-benefit h4 {
	margin-top: 0;
	margin-bottom: 0.25rem;
}

.dbiz-trial-benefit p {
	margin: 0;
}

/* Trial Process */
.dbiz-trial-process {
	background: linear-gradient(135deg, rgb(0, 102, 255) 0%, rgb(124, 58, 237) 100%);
	color: #ffffff;
}

.dbiz-trial-step {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	margin-bottom: 1rem;
}

.dbiz-trial-step:last-child {
	margin-bottom: 0;
}

.dbiz-trial-step-number {
	flex-shrink: 0;
	margin: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
}

.dbiz-trial-step h4 {
	margin-top: 0;
	margin-bottom: 0.25rem;
	color: #ffffff;
}

.dbiz-trial-step p {
	margin: 0;
}

/* Trial Stats */
.dbiz-trial-features-section .wp-block-columns {
	align-items: center;
}

.dbiz-trial-features-section .wp-block-column h3 {
	margin-top: 0;
}

/* Trial Layout */
.dbiz-trial-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 3rem;
}

@media (min-width: 1024px) {
	.dbiz-trial-layout {
		grid-template-columns: 56% 44%;
		gap: 4rem;
	}
}

/* Responsive adjustments for Trial page */
@media (max-width: 768px) {
	.dbiz-trial-hero h1 {
		font-size: 2.5rem;
	}
	.dbiz-trial-hero p {
		font-size: 1rem;
	}
	.dbiz-trial-layout {
		grid-template-columns: 1fr;
	}
	.dbiz-trial-form-section h2,
	.dbiz-trial-features-section h2 {
		font-size: 1.5rem;
	}
	.dbiz-trial-benefit {
		flex-direction: column;
		text-align: center;
	}
	.dbiz-trial-benefit-icon {
		margin: 0 auto;
	}
}

/* ========================================
   DMS ROI CALCULATOR STYLES
   ======================================== */

/* DMS ROI Calculator Container */
.dbiz-dms-roi-calculator {
	background-color: #ffffff;
}

/* Form Section */
.dbiz-dms-roi-form {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.dbiz-dms-roi-form-icon {
	flex-shrink: 0;
	margin: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.dbiz-dms-roi-form-icon i {
	margin: 0;
}

.dbiz-dms-roi-label {
	font-size: 1rem;
	font-weight: 500;
	color: #334155;
	margin: 0;
}

.dbiz-dms-roi-input {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 2px solid #e2e8f0;
	border-radius: 0.5rem;
	background-color: #ffffff;
	color: #334155;
	font-size: 1.125rem;
	transition: all 0.2s ease;
	font-family: inherit;
}

.dbiz-dms-roi-input:focus {
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
	outline: none;
}

.dbiz-dms-roi-input:hover {
	border-color: #cbd5e1;
}

.dbiz-dms-roi-note {
	background-color: #eff6ff;
}

/* ROI Card */
.dbiz-dms-roi-roi-card {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.dbiz-dms-roi-roi-icon {
	margin: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 4rem;
	height: 4rem;
}

.dbiz-dms-roi-roi-icon i {
	margin: 0;
}

.dbiz-dms-roi-roi-value {
	margin: 0;
	line-height: 1;
}

.dbiz-dms-roi-payback {
	color: inherit;
}

.dbiz-dms-roi-metric {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.dbiz-dms-roi-metric-value {
	margin: 0;
	line-height: 1.2;
}

/* Benefits Section */
.dbiz-dms-roi-benefits {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

.dbiz-dms-roi-benefits-icon {
	margin: 0;
}

.dbiz-dms-roi-benefits-icon i {
	margin: 0;
}

.dbiz-dms-roi-benefit-item {
	transition: all 0.2s ease;
}

.dbiz-dms-roi-benefit-item:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.dbiz-dms-roi-benefit-icon {
	margin: 0;
	flex-shrink: 0;
}

.dbiz-dms-roi-benefit-icon i {
	margin: 0;
}

.dbiz-dms-roi-benefit-value {
	margin: 0;
	line-height: 1.2;
	flex-shrink: 0;
}

.dbiz-dms-roi-total {
	border-top: 2px solid #e5e7eb;
}

.dbiz-dms-roi-total-value {
	margin: 0;
	line-height: 1.2;
}

.dbiz-dms-roi-cta .wp-block-button__link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-weight: 600;
	transition: all 0.2s ease;
}

.dbiz-dms-roi-cta .wp-block-button__link:hover {
	opacity: 0.9;
	transform: translateY(-1px);
}

/* Responsive adjustments for DMS ROI Calculator */
@media (max-width: 1024px) {
	.dbiz-dms-roi-calculator .wp-block-columns {
		flex-direction: column;
	}
	
	.dbiz-dms-roi-calculator .wp-block-column {
		flex-basis: 100% !important;
	}
	
	.dbiz-dms-roi-roi-value {
		font-size: 3rem !important;
	}
}

@media (max-width: 768px) {
	.dbiz-dms-roi-calculator {
		padding-top: var(--wp--preset--spacing--50) !important;
		padding-bottom: var(--wp--preset--spacing--50) !important;
		padding-left: var(--wp--preset--spacing--40) !important;
		padding-right: var(--wp--preset--spacing--40) !important;
	}
	
	.dbiz-dms-roi-form,
	.dbiz-dms-roi-roi-card,
	.dbiz-dms-roi-benefits {
		padding: 1.5rem !important;
	}
	
	.dbiz-dms-roi-roi-value {
		font-size: 2.5rem !important;
	}
}

/* ========================================
   DEMO BOOKING HERO STYLES
   ======================================== */

/* Demo Booking Hero Container */
.dbiz-demo-booking-hero {
	position: relative;
	overflow: hidden;
}

/* Content Section (Left) */
.dbiz-demo-booking-hero .wp-block-column:first-child {
	display: flex;
	align-items: left;
}

.dbiz-demo-booking-hero .wp-block-heading.has-white-color {
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Features List */
.dbiz-demo-booking-features {
	list-style: none;
	padding: 0;
	margin: 0;
}

.dbiz-demo-booking-features .wp-block-list-item {
	margin: 0;
	padding: 0;
}

.dbiz-demo-booking-features .wp-block-list-item .wp-block-group {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
}

.dbiz-demo-booking-features .wp-block-list-item p {
	margin: 0;
	display: flex;
	align-items: center;
}

.dbiz-demo-booking-features .wp-block-list-item i {
	flex-shrink: 0;
}

/* Form Wrapper (Right) */
.dbiz-demo-booking-form-wrapper {
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
}

/* Responsive adjustments for Demo Booking Hero */
@media (max-width: 1024px) {
	.dbiz-demo-booking-hero .wp-block-columns {
		flex-direction: column;
	}
	
	.dbiz-demo-booking-hero .wp-block-column {
		flex-basis: 100% !important;
	}
	
	.dbiz-demo-booking-hero .wp-block-column:first-child {
		margin-bottom: 2rem;
	}
	
	.dbiz-demo-booking-hero .wp-block-heading.has-white-color {
		font-size: 2rem !important;
	}
}

@media (max-width: 768px) {
	.dbiz-demo-booking-hero {
		padding-top: var(--wp--preset--spacing--50) !important;
		padding-bottom: var(--wp--preset--spacing--50) !important;
		padding-left: var(--wp--preset--spacing--40) !important;
		padding-right: var(--wp--preset--spacing--40) !important;
	}
	
	.dbiz-demo-booking-form-wrapper {
		padding: 1.5rem !important;
	}
	
	.dbiz-demo-booking-hero .wp-block-heading.has-white-color {
		font-size: 1.75rem !important;
	}
	
	.dbiz-demo-booking-features .wp-block-list-item p {
		font-size: 1rem !important;
	}
}

/* ========================================
   DEMO SCHEDULE HERO STYLES
   ======================================== */

/* Demo Schedule Hero Container */
.dbiz-demo-schedule-hero {
	background-color: #f8fafc;
}

.dbiz-demo-schedule-hero .wp-block-columns {
	gap: 3rem;
}

/* Content Section (Left) */
.dbiz-demo-schedule-content {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
	height: 100%;
}

/* Feature Items */
.dbiz-schedule-feature-item {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.dbiz-schedule-feature-item:last-child {
	margin-bottom: 0;
}

.dbiz-schedule-feature-icon {
	flex-shrink: 0;
}

.dbiz-schedule-feature-content {
	flex: 1;
}

.dbiz-schedule-feature-content h4 {
	font-size: 1.125rem;
	font-weight: 600;
	color: #1e293b;
	margin: 0 0 0.5rem 0;
}

.dbiz-schedule-feature-content p {
	font-size: 0.9375rem;
	color: #64748b;
	margin: 0;
	line-height: 1.6;
}

/* Trust Indicators */
.dbiz-demo-schedule-trust {
	margin-top: 2rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(148, 163, 184, 0.3);
}

/* Form Input with Icon */
.dbiz-form-input-wrapper {
	position: relative;
	display: flex;
	align-items: center;
}

.dbiz-form-input-icon {
	position: absolute;
	left: 1rem;
	color: #94a3b8;
	font-size: 1.125rem;
	pointer-events: none;
	z-index: 1;
	display: flex;
	align-items: center;
}

.dbiz-form-input-wrapper .dbiz-form-input-with-icon {
	padding-left: 3rem !important;
	width: 100%;
}

.dbiz-form-input-wrapper:focus-within .dbiz-form-input-icon {
	color: #2563eb;
}

/* Responsive adjustments for Demo Schedule Hero */
@media (max-width: 1024px) {
	.dbiz-demo-schedule-hero .wp-block-columns {
		flex-direction: column;
	}
	
	.dbiz-demo-schedule-hero .wp-block-column {
		flex-basis: 100% !important;
	}
	
	.dbiz-demo-schedule-content {
		margin-bottom: 2rem;
	}
}

@media (max-width: 768px) {
	.dbiz-demo-schedule-hero {
		padding-top: var(--wp--preset--spacing--50) !important;
		padding-bottom: var(--wp--preset--spacing--50) !important;
		padding-left: var(--wp--preset--spacing--40) !important;
		padding-right: var(--wp--preset--spacing--40) !important;
	}
	
	.dbiz-demo-schedule-content,
	.dbiz-demo-schedule-form-wrapper {
		padding: 1.5rem !important;
	}
	
	.dbiz-demo-schedule-content h1 {
		font-size: 2rem !important;
	}
	
	.dbiz-schedule-feature-item {
		flex-direction: column;
		text-align: center;
	}
	
	.dbiz-schedule-feature-icon {
		margin: 0 auto;
	}
}

/* ========================================
   DBIZ MODAL SYSTEM - Bootstrap-like Modal
   ======================================== */

[id^="dbiz-content-modal-"] > div{
	margin-left: 0 !important;
	margin-right: 0 !important;
}

[id^="dbiz-toggle-modal-"] > p.has-text-align-left{
	margin-left: 0 !important;
}

/* Modal Content - Frontend (ẩn mặc định) */
.dbiz-modal-content,
[id^="dbiz-content-modal-"] {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	max-height: 100%;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Modal Content - Khi mở (frontend) */
.dbiz-modal-content.is-open,
[id^="dbiz-content-modal-"].is-open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* Modal Overlay - Backdrop đen mờ */
/* .dbiz-modal-content::before,
[id^="dbiz-content-modal-"]::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: -1;
	opacity: 0;
	transition: opacity 0.3s ease;
} */

.dbiz-modal-content.is-open::before,
[id^="dbiz-content-modal-"].is-open::before {
	opacity: 1;
}

/* Modal Wrapper - Component modal chính (căn giữa màn hình, có backdrop) */
.dbiz-modal-wrapper-inner {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	max-width: 100% !important;
	height: 100%;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	pointer-events: none !important;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Đảm bảo tất cả children cũng không có pointer events khi chưa mở */
.dbiz-modal-wrapper-inner:not(.is-open) * {
	pointer-events: none !important;
}

/* Modal khi mở */
.dbiz-modal-wrapper-inner.is-open {
  padding-inline: 10px !important;
	opacity: 1;
	visibility: visible;
	pointer-events: auto !important;
}

/* Khi modal mở, backdrop có pointer events */
.dbiz-modal-wrapper-inner.is-open .dbiz-modal-backdrop {
	pointer-events: auto;
}

/* Khi modal mở, nội dung có pointer events */
.dbiz-modal-wrapper-inner.is-open > *:not(.dbiz-modal-backdrop) {
	pointer-events: auto !important;
}

/* Backdrop - Overlay đen mờ (element riêng) */
.dbiz-modal-backdrop {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	z-index: 1;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

.dbiz-modal-wrapper-inner.is-open .dbiz-modal-backdrop {
	opacity: 1;
	pointer-events: auto;
}

/* Nội dung bên trong modal wrapper (bỏ qua backdrop) */
.dbiz-modal-wrapper-inner > *:not(.dbiz-modal-backdrop) {
	width: 90%;
	max-width: 1200px;
	max-height: 90vh;
	overflow-y: auto;
	overflow-x: hidden;
	position: relative;
	z-index: 1000;
	margin: 0;
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important;
	background: #ffffff;
	-webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
	pointer-events: auto;
}

/* Đảm bảo nội dung hiển thị khi modal mở (bỏ qua backdrop) */
.dbiz-modal-wrapper-inner.is-open > *:not(.dbiz-modal-backdrop) {
	opacity: 1 !important;
	visibility: visible !important;
	display: block !important;
	pointer-events: auto;
}

/* Scrollbar styling cho modal content */
.dbiz-modal-wrapper-inner > *::-webkit-scrollbar {
	width: 8px;
}

.dbiz-modal-wrapper-inner > *::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 4px;
}

.dbiz-modal-wrapper-inner > *::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 4px;
}

.dbiz-modal-wrapper-inner > *::-webkit-scrollbar-thumb:hover {
	background: #555;
}

@media (max-width: 1024px) {
  [id^="dbiz-content-modal-"] .dbiz-feature-detail-card__features {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Responsive cho modal wrapper */
@media (max-width: 768px) {
	.dbiz-modal-wrapper-inner > * {
		width: 100%;
		max-height: 100vh;
	}

  [id^="dbiz-content-modal-"] .dbiz-feature-detail-card__features {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

/* Modal Container - Chỉ căn giữa, KHÔNG sửa style nội dung bên trong */
.dbiz-modal-content > *,
[id^="dbiz-content-modal-"] {
	position: relative;
	z-index: 1;
	/*width: fit-content !important;*/
	width: 724px !important;
	/* Giữ nguyên style của nội dung, chỉ đảm bảo hiển thị */
}

/* target the modal element itself when it has the class */
[id^="dbiz-content-modal-"].no-fit-modal,
.dbiz-modal-content > *.no-fit-modal {
	width: inherit !important;
}

/* Đảm bảo tất cả nội dung trong modal đều hiển thị */
.dbiz-modal-wrapper-inner *,
[id^="dbiz-content-modal-"] * {
	visibility: visible !important;
}

.dbiz-modal-wrapper-inner.is-open * {
	opacity: 1 !important;
	visibility: visible !important;
}

/* Toggle Button - Cursor pointer */
.dbiz-toggle-modal,
[id^="dbiz-toggle-modal-"] {
	cursor: pointer;
}

/* Editor Styles - Modal luôn hiện trong editor */
.block-editor-block-list__layout .dbiz-modal-wrapper-inner,
.block-editor-block-list__layout .dbiz-modal-content,
.block-editor-block-list__layout [id^="dbiz-content-modal-"],
.is-root-container .dbiz-modal-wrapper-inner,
.is-root-container .dbiz-modal-content,
.is-root-container [id^="dbiz-content-modal-"],
body[class*="block-editor"] .dbiz-modal-wrapper-inner,
body[class*="block-editor"] .dbiz-modal-content,
body[class*="block-editor"] [id^="dbiz-content-modal-"],
iframe[name="editor-canvas"] .dbiz-modal-wrapper-inner,
iframe[name="editor-canvas"] .dbiz-modal-content,
iframe[name="editor-canvas"] [id^="dbiz-content-modal-"] {
	position: relative !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	display: block !important;
	width: 100% !important;
	height: auto !important;
	margin: 20px 0 !important;
	z-index: 1 !important;
}

.block-editor-block-list__layout .dbiz-modal-backdrop,
.block-editor-block-list__layout .dbiz-modal-wrapper-inner::before,
.block-editor-block-list__layout .dbiz-modal-content::before,
.block-editor-block-list__layout [id^="dbiz-content-modal-"]::before,
.is-root-container .dbiz-modal-backdrop,
.is-root-container .dbiz-modal-wrapper-inner::before,
.is-root-container .dbiz-modal-content::before,
.is-root-container [id^="dbiz-content-modal-"]::before,
body[class*="block-editor"] .dbiz-modal-backdrop,
body[class*="block-editor"] .dbiz-modal-wrapper-inner::before,
body[class*="block-editor"] .dbiz-modal-content::before,
body[class*="block-editor"] [id^="dbiz-content-modal-"]::before,
iframe[name="editor-canvas"] .dbiz-modal-backdrop,
iframe[name="editor-canvas"] .dbiz-modal-wrapper-inner::before,
iframe[name="editor-canvas"] .dbiz-modal-content::before,
iframe[name="editor-canvas"] [id^="dbiz-content-modal-"]::before {
	display: none !important;
}

.block-editor-block-list__layout .dbiz-modal-content > *,
.block-editor-block-list__layout [id^="dbiz-content-modal-"] > *,
.is-root-container .dbiz-modal-content > *,
.is-root-container [id^="dbiz-content-modal-"] > *,
body[class*="block-editor"] .dbiz-modal-content > *,
body[class*="block-editor"] [id^="dbiz-content-modal-"] > *,
iframe[name="editor-canvas"] .dbiz-modal-content > *,
iframe[name="editor-canvas"] [id^="dbiz-content-modal-"] > * {
	position: relative !important;
	transform: scale(1) !important;
	max-width: 100% !important;
	margin: 0 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
	border: 1px solid #e5e7eb !important;
	background: #ffffff !important;
}

/* Responsive - Không áp dụng style cho nội dung modal */

/* ========================================
   FEATURE DETAIL CARD
   ======================================== */

.dbiz-feature-detail-card {
	margin: 40px 0;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Header Section - Gradient Green */
.dbiz-feature-detail-card__header {
	background: linear-gradient(135deg, #10b981 0%, #059669 100%);
	padding: 32px 40px;
	color: #ffffff;
}

.dbiz-feature-detail-card__header-left {
	display: flex;
	align-items: center;
	gap: 20px;
	flex: 1;
}

.dbiz-feature-detail-card__icon {
	margin: 0;
	font-size: 3rem;
	color: #ffffff;
	width: 64px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 12px;
}

.dbiz-feature-detail-card__title {
	margin: 0 0 8px 0;
	font-size: 2rem;
	font-weight: 700;
	color: #ffffff;
}

.dbiz-feature-detail-card__subtitle {
	margin: 0;
	font-size: 1rem;
	color: rgba(255, 255, 255, 0.9);
}

.dbiz-feature-detail-card__close {
	background: none;
	border: none;
	color: #ffffff;
	font-size: 1.5rem;
	cursor: pointer;
	padding: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 6px;
	transition: background-color 0.2s ease;
}

.dbiz-feature-detail-card__close:hover {
	background: rgba(255, 255, 255, 0.2);
}

/* Features Grid - 2x2 */
.dbiz-feature-detail-card__features {
	margin: 0;
	padding: 40px;
	background: #ffffff;
	gap: 24px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 768px) {
	.dbiz-feature-detail-card__features {
		grid-template-columns: 1fr;
	}
}

.dbiz-feature-detail-card__feature {
	padding: 24px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	background: #ffffff;
	height: 100%;
}

.dbiz-feature-detail-card__feature-icon {
	margin: 0 0 16px 0;
	font-size: 2rem;
	color: #10b981;
}

.dbiz-feature-detail-card__feature-title {
	margin: 0 0 12px 0;
	font-size: 1.25rem;
	font-weight: 600;
	color: #111827;
}

.dbiz-feature-detail-card__feature-description {
	margin: 0 0 16px 0;
	font-size: 0.9rem;
	color: #6b7280;
	line-height: 1.6;
}

.dbiz-feature-detail-card__feature-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.dbiz-feature-detail-card__feature-list li {
	padding: 8px 0;
	padding-left: 24px;
	position: relative;
	font-size: 0.9rem;
	color: #374151;
	line-height: 1.5;
}

.dbiz-feature-detail-card__feature-list li::before {
	content: '✓';
	position: absolute;
	left: 0;
	color: #10b981;
	font-weight: bold;
}

/* CTA Section - Light Green */
.dbiz-feature-detail-card__cta {
	background: #d1fae5;
	padding: 40px;
	text-align: center;
}

.dbiz-feature-detail-card__cta-title {
	margin: 0 0 12px 0;
	font-size: 1.5rem;
	font-weight: 700;
	color: #111827;
}

.dbiz-feature-detail-card__cta-description {
	margin: 0 0 24px 0;
	font-size: 1rem;
	color: #374151;
}

/* Modal Styling - Khi card nằm trong modal */
.dbiz-modal-wrapper-inner .dbiz-feature-detail-card,
[id^="dbiz-content-modal-"] .dbiz-feature-detail-card {
	width: 100%;
	margin: 0;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
	display: flex;
	flex-direction: column;
}

[id^="dbiz-content-modal-"] .dbiz-feature-detail-card__header {
	position: sticky;
	top: 0;
	z-index: 10;
	flex-shrink: 0;
	display: flex !important;
	visibility: visible !important;
}

[id^="dbiz-content-modal-"] .dbiz-feature-detail-card__features {
	flex: 1;
	overflow-y: visible;
	display: grid !important;
	gap: 24px !important;
	visibility: visible !important;
}

[id^="dbiz-content-modal-"] .dbiz-feature-detail-card__features .wp-block-column {
	margin: 0 !important;
	padding: 0 !important;
}

[id^="dbiz-content-modal-"] .dbiz-feature-detail-card__feature {
	display: block !important;
	visibility: visible !important;
}

[id^="dbiz-content-modal-"] .dbiz-feature-detail-card__cta {
	flex-shrink: 0;
	display: block !important;
	visibility: visible !important;
}

[id^="dbiz-content-modal-"] .dbiz-feature-detail-card__close {
	cursor: pointer;
	display: flex !important;
	visibility: visible !important;
}

/* Responsive */
@media (max-width: 768px) {
	.dbiz-feature-detail-card__header {
		padding: 24px;
		flex-direction: column;
		align-items: flex-start;
	}

	.dbiz-feature-detail-card__header-left {
		width: 100%;
	}

	.dbiz-feature-detail-card__close {
		position: absolute;
		top: 16px;
		right: 16px;
	}

	.dbiz-feature-detail-card__title {
		font-size: 1.5rem;
	}

	.dbiz-feature-detail-card__features {
		padding: 24px;
	}

	.dbiz-feature-detail-card__feature {
		padding: 20px;
	}

	.dbiz-feature-detail-card__cta {
		padding: 32px 24px;
	}

	.dbiz-feature-detail-card__cta-title {
		font-size: 1.25rem;
	}

	/* Modal responsive */
	[id^="dbiz-content-modal-"] .dbiz-feature-detail-card {
		max-width: 95%;
		max-height: 95vh;
	}
}

/* Header ẩn/hiện khi modal mở/đóng */
header,
.dbiz-header,
.site-header,
.wp-block-template-part[data-area="header"] {
	position: relative;
	transition: transform 0.3s ease, opacity 0.3s ease;
	z-index: 100;
}

/* Khi modal mở - ẩn header */
body:has(.dbiz-modal-wrapper-inner.is-open) header,
body:has(.dbiz-modal-wrapper-inner.is-open) .dbiz-header,
body:has(.dbiz-modal-wrapper-inner.is-open) .site-header,
body:has(.dbiz-modal-wrapper-inner.is-open) .wp-block-template-part[data-area="header"] {
	transform: translateY(-100%);
	opacity: 0;
	pointer-events: none;
}