/*
 Theme Name:   DermaGuidance Custom Theme
 Theme URI:    https://capindev.tech/
 Description:  A custom child theme that adds DG-specific enhancements.
 Author:       Obaid ur Rehman
 Author URI:   https://capindev.tech/author/obaid/
 Template:     bricks
 Version:      1.0
 Text Domain:  bricks
*/

.fa, .fa a{
	font-family:-apple-system,"system-ui",Segoe UI,roboto,helvetica,arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
}

/* Body gradient */
.bg-gradient {
    background: linear-gradient(180deg, #227881 50%, #3A5260 100%);
    min-height: 100vh;
    margin: 0;
    position: relative;
}

/* Fixed white logo */
.bg-gradient::before {
    content: "";
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
    background-image: url('/dermaguidance/wp-content/uploads/2026/03/DG-Icon-No-BG-1.png');
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    
    /* Size */
    width: min(70vw, 500px);
    height: min(70vw, 500px);
    
    /* Transparency */
    opacity: 0.1;
    
    /* Stacking */
    z-index: -10;
    
    filter: brightness(0) invert(1);
	-webkit-filter: brightness(0) invert(1); /* Chrome, Safari */
	-moz-filter: brightness(0) invert(1);    /* Firefox */
	-o-filter: brightness(0) invert(1);      /* Opera */
	-ms-filter: brightness(0) invert(1);     /* Internet Explorer */
}

/* Style the actual icon elements */
.menu-item i, 
.menu-item .fa-solid,
.menu-item .fa-regular,
.menu-item .fa-light,
.menu-item .fa-thin,
.menu-item .fa-duotone {
    font-size: 2.5rem;
    display: block;
    text-align: center;
}

/* Make sure the anchor tag properly contains and centers its children */
.menu-item > a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    width: 100%;
    height: 100%;
}

/* Adjust the icon position relative to text */
.menu-item i {
    order: -1; /* Ensures icon stays above text */
}

/* Keep your existing styles for current menu items */
.current-menu-item {
    color: #5B6FBD;
    font-family: -apple-system, "system-ui", Segoe UI, roboto, helvetica, arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
}

.current-menu-item a {
    font-size: var(--text-m);
}

.menu-item:has(.btn-nav-submit) {
    background-color: rgba(61, 212, 228, 0.1);
    border-radius: 1.5rem;
	padding: 10px;
}

.menu-item {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    font-family: -apple-system, "system-ui", Segoe UI, roboto, helvetica, arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol !important;
    font-weight: normal !important;
}

/* Optional: Add hover effect for better user experience */
.menu-item:hover i {
    transform: scale(1.1);
    transition: transform 0.2s ease;
}

/* Gravity Forms - unified styling for multistep form */

.gform-theme--framework .gf_step_completed .gf_step_number {
  --gf-local-bg-color: #369590 !important;
  --gf-local-border-color: #369590 !important;
  background-color: #369590 !important; 
  border-color: var(--primary) !important;
}

.gform-theme--framework .gf_step_completed .gf_step_number::after{
	background-color: #369590 !important;
	border-color: var(--primary) !important;
}

.gform-theme--foundation .gf_page_steps {
	justify-content: unset;
}

@media screen and (max-width: 589px) {
  .gform-theme--foundation .gf_page_steps {
    justify-content: unset;
  }
}

.gform-theme--foundation .gform_page_footer{
	justify-content: space-between;
}

/* Base styles for all buttons */
.gform_button,
.gform_next_button,
.gform_previous_button {
  padding-right: var(--space-l) !important;
  padding-left: var(--space-l) !important;
  width: 100% !important;
  justify-content: space-between !important;
  border: 1px solid var(--primary) !important;
  max-width: 400px !important;
  
  /* Base button styles */
  display: inline-block;
  text-align: center;
  line-height: normal;
  cursor: pointer;
  border-radius: 50px !important;
  color: #ffffff !important;
  font-weight: 500;
  padding-top: 12px;
  padding-bottom: 12px;
  transition: all 0.3s ease;
  font-size: 16px;
  text-decoration: none;
  box-shadow: none;
}

/* Previous button - light teal */
.gform_previous_button {
  background-color: #72a8b0 !important;
}

/* Next button - medium teal-green */
.gform_next_button {
  background-color: #369590 !important;
}

/* Submit button - your specified deep teal-blue */
.gform_button {
  background-color: #335d69 !important;
}

/* Hover state for Previous button */
.gform_previous_button:hover {
  background-color: #5f8f97 !important;
  border-color: #1d4e5c !important;
  color: #ffffff !important;
}

/* Hover state for Next button */
.gform_next_button:hover {
  background-color: #2b7a76 !important; /* Darker shade of #369590 */
  border-color: #1d4e5c !important;
  color: #ffffff !important;
}

/* Hover state for Submit button */
.gform_button:hover {
  background-color: #254a54 !important; /* Darker shade of #335d69 */
  border-color: #1d4e5c !important;
  color: #ffffff !important;
}

/* Focus state for accessibility */
.gform_button:focus,
.gform_next_button:focus,
.gform_previous_button:focus {
  outline: 2px solid #1d4e5c;
  outline-offset: 2px;
}

/* Form footer layout */
.gform_footer,
.gform_page_footer {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center;
  margin: 30px auto 0;
  max-width: 400px;
}

/* For multi-page forms with both Previous and Next */
.gform_page_footer {
  flex-direction: row;
}

.gform_page_footer .gform_previous_button,
.gform_page_footer .gform_next_button {
  flex: 1;
  min-width: 120px;
}

/* Mobile adjustments */
@media (max-width: 480px) {
  .gform_page_footer {
    flex-direction: column;
    gap: 10px;
  }
  
  .gform_page_footer .gform_previous_button,
  .gform_page_footer .gform_next_button,
  .gform_button {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
}

.gfield_consent_description{
	border: none !important;
	padding: 0 !important;
	color: #000 !important;
}