/**
 * Forms Stylesheet - Contact Form 7 & Easy Digital Downloads
 *
 * Comprehensive styling for all form elements, inputs, buttons, and validation states
 * Compatible with Contact Form 7 and Easy Digital Downloads
 *
 * @package Developry_Themes
 * @since 1.0.0
 */

/* ========================================
   FORM ELEMENTS - BASE STYLES
   ======================================== */

/* Form Container */
form {
	margin-bottom: var(--spacing-sm);
}

/* Form Fields */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="number"],
input[type="date"],
input[type="password"],
input[type="search"],
select,
textarea {
	background-color: var(--color-surface-elevated);
	border: 2px solid var(--color-border);
	border-radius: var(--border-radius);
	box-shadow: var(--shadow-sm);
	color: var(--color-text);
	font-family: var(--font-primary);
	font-size: 1rem;
	padding: 1rem !important;
	transition: all var(--transition-speed) var(--transition-smooth);
	width: 100%;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="date"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
select:focus,
textarea:focus {
	background-color: var(--color-background);
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px var(--color-primary-light);
	outline: none;
}

input[type="text"]:hover,
input[type="email"]:hover,
input[type="url"]:hover,
input[type="tel"]:hover,
input[type="number"]:hover,
input[type="date"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
select:hover,
textarea:hover {
	border-color: var(--color-primary);
}

/* Textarea */
textarea {
	min-height: 150px;
	resize: vertical;
}

/* Select Dropdown */
select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%230066cc' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
	background-position: right 1rem center;
	background-repeat: no-repeat;
	background-size: 12px;
	cursor: pointer;
	padding-right: 2.5rem;
}

/* Checkboxes and Radio Buttons */
input[type="checkbox"],
input[type="radio"] {
	border: 2px solid var(--color-border);
	cursor: pointer;
	height: 1.25rem;
	margin-right: 0.5rem;
	transition: all var(--transition-speed);
	width: 1.25rem;
	position: relative;
	top: 4px;
	left: 4px;
}

input[type="checkbox"]:focus,
input[type="radio"]:focus {
	outline: 3px solid var(--color-primary-light);
	outline-offset: 2px;
}

input[type="checkbox"]:checked,
input[type="radio"]:checked {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
}

/* Labels */
label {
	color: var(--color-text);
	cursor: pointer;
	display: inline-block;
	font-weight: 600;
	margin-bottom: 0.5rem;
}

/* Required Field Indicator */
.required,
.wpcf7-form-control-wrap .wpcf7-not-valid-tip,
span.required {
	color: var(--color-error);
}

/* Fieldset */
fieldset {
	border: 2px solid var(--color-border-light);
	border-radius: var(--border-radius);
	margin-bottom: var(--spacing-md);
	padding: var(--spacing-md);
}

fieldset fieldset {
	border: 0;
	border-radius: none;
	margin-bottom: var(--spacing-sm) !important;
	padding: 0;
}

fieldset#edd_sl_renewal_fields,
fieldset#edd_purchase_submit {
	margin-bottom: 0 !important;
}

fieldset :last-of-type {
	margin-bottom: 0;
	padding-bottom: 0;
}

legend {
	color: var(--color-primary);
	font-size: 1.125rem;
	font-weight: 700;
	padding: 0 var(--spacing-sm);
}

/* Disabled State */
input:disabled,
select:disabled,
textarea:disabled,
button:disabled {
	background-color: var(--color-surface);
	cursor: not-allowed;
	opacity: 0.6;
}

/* Placeholder */
::placeholder {
	color: var(--color-text-muted);
	opacity: 0.7;
}

/* ========================================
   CONTACT FORM 7 STYLES
   ======================================== */

/* CF7 Form Container */
.wpcf7 {
	margin-bottom: var(--spacing-lg);
}

.wpcf7-form {
	background-color: var(--color-surface-elevated);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius-lg);
	box-shadow: var(--shadow-md);
	padding: var(--spacing-lg);
}

/* CF7 Form Rows */
.wpcf7-form p {
	margin-bottom: var(--spacing-md);
}

/* CF7 Form Control Wrapper */
.wpcf7-form-control-wrap {
	display: block;
	position: relative;
}

/* CF7 Input Fields */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="date"],
.wpcf7-form textarea,
.wpcf7-form select {
	width: 100%;
}

/* CF7 Submit Button */
.wpcf7-form input[type="submit"],
.wpcf7-submit {
	background-color: var(--color-primary);
	border: 2px solid var(--color-primary);
	border-radius: var(--border-radius);
	box-shadow: var(--shadow-md);
	color: white;
	cursor: pointer;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: var(--letter-spacing-wide);
	min-width: 200px;
	padding: 1rem 2rem;
	text-transform: uppercase;
	transition: all var(--transition-speed) var(--transition-smooth);
	width: auto;
}

.wpcf7-form input[type="submit"]:hover,
.wpcf7-submit:hover {
	background-color: var(--color-primary-dark);
	border-color: var(--color-primary-dark);
	box-shadow: var(--shadow-lg);
	transform: translateY(-2px);
}

.wpcf7-form input[type="submit"]:active,
.wpcf7-submit:active {
	transform: translateY(0);
}

/* CF7 Validation Messages */
.wpcf7-not-valid-tip {
	color: var(--color-error);
	display: block;
	font-size: 0.875rem;
	margin-top: 0.25rem;
}

.wpcf7-validation-errors {
	background-color: var(--color-error);
	border: 2px solid var(--color-error);
	border-radius: var(--border-radius);
	color: white;
	margin-top: var(--spacing-md);
	padding: var(--spacing-md);
}

/* CF7 Success Message */
.wpcf7-mail-sent-ok {
	background-color: var(--color-success);
	border: 2px solid var(--color-success);
	border-radius: var(--border-radius);
	color: white;
	margin-top: var(--spacing-md);
	padding: var(--spacing-md);
}

/* CF7 Spinner */
.wpcf7-spinner {
	display: inline-block;
	margin-left: var(--spacing-sm);
}

/* CF7 Response Output */
.wpcf7-response-output {
	border-radius: var(--border-radius);
	font-weight: 600;
	margin-top: var(--spacing-md);
	padding: var(--spacing-md);
}

/* CF7 Invalid Fields */
.wpcf7-form-control.wpcf7-not-valid {
	background-color: rgba(204, 0, 0, 0.05);
	border-color: var(--color-error);
}

.wpcf7-form-control.wpcf7-not-valid:focus {
	box-shadow: 0 0 0 3px rgba(204, 0, 0, 0.2);
}

/* CF7 Acceptance Checkbox */
.wpcf7-acceptance {
	margin-bottom: var(--spacing-md);
}

.wpcf7-acceptance label {
	align-items: center;
	cursor: pointer;
	display: flex;
}

/* CF7 File Upload */
.wpcf7-form input[type="file"] {
	background-color: var(--color-surface);
	border: 2px dashed var(--color-border);
	cursor: pointer;
	padding: 0.5rem;
}

.wpcf7-form input[type="file"]:hover {
	background-color: var(--color-primary-light);
	border-color: var(--color-primary);
}

/* CF7 Quiz */
.wpcf7-quiz-label {
	font-weight: 600;
	margin-bottom: var(--spacing-sm);
}

/* ========================================
   EASY DIGITAL DOWNLOADS FORMS
   ======================================== */

/* EDD Checkout Form */
#edd_checkout_form_wrap {
	background-color: var(--color-surface-elevated);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius-lg);
	box-shadow: var(--shadow-md);
	padding: var(--spacing-md);
}

/* EDD Fieldset */
#edd_checkout_form_wrap fieldset {
	background-color: var(--color-surface);
	margin-bottom: var(--spacing-lg);
}

#edd_checkout_form_wrap legend {
	margin-bottom: var(--spacing-sm);
	padding: 0 var(--spacing-sm);
}

/* EDD Form Fields */
#edd_checkout_form_wrap input[type="text"],
#edd_checkout_form_wrap input[type="email"],
#edd_checkout_form_wrap input[type="tel"],
#edd_checkout_form_wrap input[type="password"],
#edd_checkout_form_wrap select,
#edd_checkout_form_wrap textarea {
	margin-bottom: var(--spacing-sm);
	width: 100%;
}

/* EDD Purchase Button */
#edd-purchase-button,
.edd-submit,
.edd-add-to-cart {
	background-color: var(--color-primary) !important;
	border: 2px solid var(--color-primary) !important;
	border-radius: var(--border-radius) !important;
	box-shadow: var(--shadow-md);
	color: white !important;
	cursor: pointer;
	display: inline-block;
	font-size: 1rem !important;
	font-weight: 600 !important;
	letter-spacing: var(--letter-spacing-wide);
	padding: 1rem 2rem !important;
	text-align: center;
	text-transform: uppercase;
	transition: all var(--transition-speed) var(--transition-smooth) !important;
}

#edd-purchase-button:hover,
.edd-submit:hover,
.edd-add-to-cart:hover {
	background-color: var(--color-primary-dark) !important;
	border-color: var(--color-primary-dark) !important;
	box-shadow: var(--shadow-lg);
	transform: translateY(-2px);
}

/* EDD Cart */
#edd_checkout_cart {
	background-color: var(--color-surface);
	border-radius: var(--border-radius);
	margin-bottom: var(--spacing-sm);
	padding: var(--spacing-sm);
}

#edd_checkout_cart th {
	background-color: var(--color-primary);
	color: white;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: var(--letter-spacing-wide);
	padding: var(--spacing-sm);
	text-transform: uppercase;
}

#edd_checkout_cart td {
	border-bottom: 1px solid var(--color-border-light);
	padding: var(--spacing-sm);
}

/* EDD Cart Total */
#edd_checkout_cart .edd_cart_total {
	color: var(--color-primary);
	font-size: 1.5rem;
	font-weight: 700;
}

/* EDD Discount Code */
#edd-discount-code-wrap {
	margin-bottom: var(--spacing-md);
}

#edd-discount-code {
	display: inline-block;
	margin-right: var(--spacing-sm);
	width: auto;
}

#edd-apply-discount {
	background-color: var(--color-secondary);
	border: 2px solid var(--color-secondary);
	border-radius: var(--border-radius);
	color: white;
	cursor: pointer;
	padding: 0.875rem 1.5rem;
	transition: all var(--transition-speed);
}

#edd-apply-discount:hover {
	background-color: var(--color-secondary);
	opacity: 0.9;
	transform: translateY(-2px);
}

/* EDD Payment Methods */
#edd_payment_mode_select {
	margin-bottom: var(--spacing-lg);
}

.edd-payment-mode-label {
	align-items: center;
	background-color: var(--color-surface);
	border: 2px solid var(--color-border);
	border-radius: var(--border-radius);
	cursor: pointer;
	display: flex;
	margin-bottom: var(--spacing-sm);
	padding: var(--spacing-md);
	transition: all var(--transition-speed);
}

.edd-payment-mode-label:hover {
	background-color: var(--color-primary-light);
	border-color: var(--color-primary);
}

.edd-payment-mode-label input[type="radio"] {
	margin-right: var(--spacing-sm);
}

/* EDD Credit Card Form */
#edd-card-number-wrap,
#edd-card-cvc-wrap,
#edd-card-name-wrap,
#edd-card-address-wrap,
#edd-card-address-2-wrap,
#edd-card-city-wrap,
#edd-card-state-wrap,
#edd-card-country-wrap,
#edd-card-zip-wrap {
	margin-bottom: var(--spacing-md);
}

.edd-credit-card-form {
	background-color: var(--color-surface);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	padding: var(--spacing-md);
}

/* EDD Error Messages */
.edd-alert {
	border-radius: var(--border-radius);
	font-weight: 600;
	margin-bottom: var(--spacing-md);
	padding: var(--spacing-md);
}

.edd-alert-error {
	background-color: rgba(204, 0, 0, 0.1);
	border: 2px solid var(--color-error);
	color: var(--color-error);
}

.edd-alert-success {
	background-color: rgba(0, 128, 0, 0.1);
	border: 2px solid var(--color-success);
	color: var(--color-success);
}

.edd-alert-warn {
	background-color: rgba(204, 119, 0, 0.1);
	border: 2px solid var(--color-warning);
	color: var(--color-warning);
}

.edd-alert-info {
	background-color: var(--color-primary-light);
	border: 2px solid var(--color-primary);
	color: var(--color-primary);
}

/* EDD Required Fields */
.edd-required-indicator {
	color: var(--color-error);
	font-weight: 700;
}

/* EDD Loading Indicator */
.edd-loading {
	animation: edd-spin 0.8s linear infinite;
	border: 3px solid var(--color-border);
	border-radius: 50%;
	border-top-color: var(--color-primary);
	display: inline-block;
	height: 20px;
	width: 20px;
}

@keyframes edd-spin {
	to {
		transform: rotate(360deg);
	}
}

/* EDD Cart Widget */
.edd-cart-widget {
	background-color: var(--color-surface-elevated);
	border: 1px solid var(--color-border-light);
	border-radius: var(--border-radius);
	padding: var(--spacing-md);
}

.edd-cart-item {
	border-bottom: 1px solid var(--color-border-light);
	display: flex;
	justify-content: space-between;
	padding: var(--spacing-sm) 0;
}

.edd-cart-item:last-child {
	border-bottom: none;
}

.edd-remove-from-cart {
	color: var(--color-error);
	cursor: pointer;
	font-weight: 600;
	text-decoration: none;
	transition: opacity var(--transition-speed);
}

.edd-remove-from-cart:hover {
	opacity: 0.7;
}

.edd-loading {
	display: none;
	position: relative;
	right: -3px;
	top: 3px;
}

/* ========================================
   FORM GRID LAYOUTS
   ======================================== */

/* Two Column Form Layout */
.form-row {
	display: grid;
	gap: var(--spacing-md);
	grid-template-columns: 1fr 1fr;
	margin-bottom: var(--spacing-md);
}

.form-row.single {
	grid-template-columns: 1fr;
}

.form-row.three-columns {
	grid-template-columns: 1fr 1fr 1fr;
}

.form-field {
	display: flex;
	flex-direction: column;
}

/* ========================================
   VALIDATION STATES
   ======================================== */

/* Success State */
.form-field.success input,
.form-field.success textarea,
.form-field.success select {
	background-color: rgba(0, 128, 0, 0.05);
	border-color: var(--color-success);
}

.form-field.success .field-message {
	color: var(--color-success);
}

/* Error State */
.form-field.error input,
.form-field.error textarea,
.form-field.error select {
	background-color: rgba(204, 0, 0, 0.05);
	border-color: var(--color-error);
}

.form-field.error .field-message {
	color: var(--color-error);
}

/* Warning State */
.form-field.warning input,
.form-field.warning textarea,
.form-field.warning select {
	background-color: rgba(204, 119, 0, 0.05);
	border-color: var(--color-warning);
}

.form-field.warning .field-message {
	color: var(--color-warning);
}

/* Field Messages */
.field-message {
	display: block;
	font-size: 0.875rem;
	font-weight: 500;
	margin-top: 0.25rem;
}

/* ========================================
   CUSTOM FORM ELEMENTS
   ======================================== */

/* Custom Checkbox */
.custom-checkbox {
	align-items: center;
	cursor: pointer;
	display: flex;
	margin-bottom: var(--spacing-sm);
	position: relative;
	user-select: none;
}

.custom-checkbox input {
	cursor: pointer;
	opacity: 0;
	position: absolute;
}

.checkmark {
	background-color: var(--color-surface-elevated);
	border: 2px solid var(--color-border);
	border-radius: 4px;
	height: 24px;
	margin-right: var(--spacing-sm);
	position: relative;
	transition: all var(--transition-speed);
	width: 24px;
}

.custom-checkbox:hover input~.checkmark {
	border-color: var(--color-primary);
}

.custom-checkbox input:checked~.checkmark {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
}

.checkmark:after {
	border: solid white;
	border-width: 0 2px 2px 0;
	content: "";
	display: none;
	height: 10px;
	left: 7px;
	position: absolute;
	top: 3px;
	transform: rotate(45deg);
	width: 6px;
}

.custom-checkbox input:checked~.checkmark:after {
	display: block;
}

/* Custom Radio Button */
.custom-radio {
	align-items: center;
	cursor: pointer;
	display: flex;
	margin-bottom: var(--spacing-sm);
	position: relative;
	user-select: none;
}

.custom-radio input {
	cursor: pointer;
	opacity: 0;
	position: absolute;
}

.radio-mark {
	background-color: var(--color-surface-elevated);
	border: 2px solid var(--color-border);
	border-radius: 50%;
	height: 24px;
	margin-right: var(--spacing-sm);
	position: relative;
	transition: all var(--transition-speed);
	width: 24px;
}

.custom-radio:hover input~.radio-mark {
	border-color: var(--color-primary);
}

.custom-radio input:checked~.radio-mark {
	background-color: var(--color-primary);
	border-color: var(--color-primary);
}

.radio-mark:after {
	background: white;
	border-radius: 50%;
	content: "";
	display: none;
	height: 8px;
	left: 6px;
	position: absolute;
	top: 6px;
	width: 8px;
}

.custom-radio input:checked~.radio-mark:after {
	display: block;
}

/* ========================================
   RESPONSIVE STYLES
   ======================================== */

@media (max-width: 768px) {

	.form-row,
	.form-row.three-columns {
		grid-template-columns: 1fr;
	}

	.wpcf7-form {
		padding: var(--spacing-md);
	}

	#edd_checkout_form_wrap {
		padding: var(--spacing-md);
	}

	.wpcf7-form input[type="submit"],
	.wpcf7-submit,
	#edd-purchase-button,
	.edd-submit,
	.edd-add-to-cart {
		min-width: auto;
		width: 100%;
	}

	#edd-discount-code {
		margin-bottom: var(--spacing-sm);
		margin-right: 0;
		width: 100%;
	}

	#edd-apply-discount {
		width: 100%;
	}
}

/* ========================================
   DARK MODE ADJUSTMENTS
   ======================================== */

[data-theme="dark"] select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%2366b3ff' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
}

/* ========================================
   PRINT STYLES
   ======================================== */

@media print {

	.wpcf7-spinner,
	.edd-loading {
		display: none;
	}
}

fieldset {
	padding: var(--spacing-md);
}

fieldset fieldset legend {
	padding: var(--spacing-sm) 0 0 0 !important;
}

legend {
	font-size: 1rem;
	text-transform: uppercase;
}

.edd-payment-icons {
	text-align: center;
	margin: var(--spacing-md) 0;
}

#edd_checkout_cart th {
	background-color: var(--color-surface);
	color: var(--color-text);
	text-align: left;
}

.edd_cart_footer_row+.edd_cart_footer_row {
	display: none;
}

#edd_checkout_cart {
	background-color: transparent;
	width: 100%;
}

fieldset#edd_sl_renewal_fields,
fieldset#edd_purchase_submit {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

#edd-payment-mode-wrap {
	display: flex;
	gap: 1rem;
}

span.edd-description {
	font-size: 0.725rem;
}

#edd_checkout_cart {
	padding: 0;
}

#edd_purchase_submit label {
	width: auto;
}

.wpcf7-form label {
	width: 100%;
}
