/* - - - - - - - - - - - - - - - - - - - - -

 Title : Fiona McKay Jewelry Cognito Forms Custom Stylesheet
 Author : Fiona McKay Jewelry
 URL : https://fm.crazygooddigital.com/css/cognito-forms.css

 Last Updated : January 20, 2026

- - - - - - - - - - - - - - - - - - - - - */

/* Global Cognito form styling */
.cog-cognito,
.cog-cognito * {
	font-family: 'Roboto', sans-serif !important;
}

/* Form container */
.cog-cognito.cog-form {
	background-color: transparent !important;
	padding: 0 !important;
}

.cog-form__container {
	background-color: transparent !important;
}

/* Field labels and legends */
.cog-label,
.cog-field legend.cog-label {
	color: #976637 !important;
	font-weight: 400 !important;
	font-size: 14px !important;
	margin-bottom: 0.25rem !important;
	display: block !important;
}

/* Required field asterisks */
.cog-asterisk {
	color: #976637 !important;
}

/* Input fields - using actual Cognito classes */
.el-input__inner,
.el-textarea__inner {
	background-color: #f5f5f5 !important;
	border: 1px solid #ddd !important;
	border-radius: 3px !important;
	padding: 10px 12px !important;
	font-size: 14px !important;
	color: #333 !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

/* Input field focus state */
.el-input__inner:focus,
.el-textarea__inner:focus {
	border-color: #976637 !important;
	outline: none !important;
	box-shadow: 0 0 0 2px rgba(151, 102, 55, 0.1) !important;
}

/* Placeholder text */
.el-input__inner::placeholder,
.el-textarea__inner::placeholder {
	color: #999 !important;
	opacity: 1 !important;
}

/* Textarea */
.el-textarea__inner {
	min-height: 120px !important;
	resize: vertical !important;
}

/* Name field inputs */
.cog-name__first .el-input__inner,
.cog-name__last .el-input__inner {
	background-color: #f5f5f5 !important;
}

/* Phone field */
.cog-phone .el-input__inner {
	background-color: #f5f5f5 !important;
}

/* Submit button - using actual Cognito button classes */
.cog-button--submit.el-button,
button.cog-button--submit {
	background-color: #976637 !important;
	border: 1px solid #976637 !important;
	color: #fff !important;
	padding: 12px 30px !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	border-radius: 3px !important;
	cursor: pointer !important;
	transition: all 0.3s ease !important;
	float: right !important;
	margin-top: 10px !important;
}

.cog-button--submit.el-button:hover,
button.cog-button--submit:hover {
	background-color: #7d5530 !important;
	border-color: #7d5530 !important;
	transform: translateY(-1px) !important;
	box-shadow: 0 2px 4px rgba(0,0,0,0.2) !important;
}

.cog-button--submit.el-button:active,
button.cog-button--submit:active {
	transform: translateY(0) !important;
}

/* Button text */
.cog-button__text {
	color: #fff !important;
}

/* Field containers */
.cog-field {
	margin-bottom: 0.5rem !important;
}

.cog-row {
	margin-bottom: 0.25rem !important;
}

/* Error messages */
.cog-error,
.cog-field__error {
	color: #E60001 !important;
	font-size: 13px !important;
	margin-top: 0.25rem !important;
}

/* Success messages */
.cog-success {
	background-color: #d4edda !important;
	border: 1px solid #c3e6cb !important;
	color: #155724 !important;
	padding: 15px !important;
	border-radius: 3px !important;
	margin: 10px 0 !important;
}

/* Help text */
.cog-field__description {
	color: #666 !important;
	font-size: 12px !important;
	margin-top: 0.25rem !important;
	font-style: italic !important;
}

/* Fieldset styling */
.cog-field fieldset {
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Radio and checkbox styling */
input[type="radio"],
input[type="checkbox"] {
	margin-right: 6px !important;
	accent-color: #976637 !important;
}

.cog-choice-label,
.cog-checkbox label,
.cog-radio label,
.el-checkbox__label,
.cog-choice__value {
	color: #333 !important;
	font-size: 16px !important;
	display: inline-flex !important;
	align-items: center !important;
}

/* Hide placeholder divs that Cognito uses for spacing */
.cog-field__placeholder {
	display: none !important;
}

/* Page navigation area */
.cog-page__navigation {
	margin-top: 0.75rem !important;
	display: flex !important;
	justify-content: flex-end !important;
}

/* Offscreen text for accessibility */
.cog-offscreen {
	position: absolute !important;
	left: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}

/* Responsive adjustments */
@media only screen and (max-width: 767px) {
	.cog-button--submit.el-button,
	button.cog-button--submit {
		width: 100% !important;
		float: none !important;
	}
	
	.cog-page__navigation {
		justify-content: stretch !important;
	}
}

/* Modal-specific adjustments */
.modal__content .cog-cognito {
	margin-top: 1rem !important;
}

.modal__content .cog-form {
	max-width: 100% !important;
}

/* Remove any default background colors */
.cog-body,
.cog-page,
.cog-wrapper {
	background-color: transparent !important;
}