/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/* General Custom CSS */
/*
Gravity Form Theme overides
*/
.gform_wrapper {
  margin-top:2rem;
}
#top .main_color .gform-theme--foundation .gfield .ginput_password, 
#top .main_color .gform-theme--foundation .gfield input, 
#top .main_color .gform-theme--foundation .gfield select{
  -webkit-appearance: var(--gf-local-appearance);
  -moz-appearance: var(--gf-local-appearance);
  appearance: var(--gf-local-appearance);
  background-color: var(--gf-local-bg-color);
  block-size: var(--gf-local-height);
  border-block-end: var(--gf-local-border-block-end);
  border-block-start: var(--gf-local-border-block-start);
  border-inline-end: var(--gf-local-border-inline-end);
  border-inline-start: var(--gf-local-border-inline-start);
  border-radius: var(--gf-local-radius);
  box-shadow: var(--gf-local-shadow);
  color: var(--gf-local-color);
  display: var(--gf-local-display);
  font-family: var(--gf-local-font-family);
  font-size: var(--gf-local-font-size);
  font-style: var(--gf-local-font-style);
  font-weight: var(--gf-local-font-weight);
  inline-size: var(--gf-local-width);
  letter-spacing: var(--gf-local-letter-spacing);
  /* line-height: var(--gf-local-line-height); */
  margin-block: 0;
  /* background: unset; */
}


.gform_wrapper input.custom-card-field {
  font-family: "Courier New", Courier, monospace;
  font-size: 16px;
  letter-spacing: 1px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #fff;
}

.gform-theme--framework:where(:not(.gform_editor)) .gfield--type-section,
.gform-theme--framework .gppt-has-page-transitions .gf_progressbar_wrapper{
  background-color: #eeeeee;
    padding: 2.5rem 2rem 3rem 4rem!important;
    border-radius: 10px;
}
/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {
  /* Add your Desktop Styles here */

}



/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */

}


/* ============================================================================
   CLASSES PAGES DESIGN & LAYOUT STYLES
   ============================================================================

   Branch: classes-layout-redesign
   Purpose: Custom styles for all class listing pages (NY, LA, Online)

   This section contains design and layout customizations for:
   - /ny-classes/ (NY classes listing page - content_type 201)
   - /la-classes/ (LA classes listing page - content_type 203)
   - /online-classes/ (Online classes page - content_type 1096)
   - Class sliders on homepage and account pages
   - Individual class cards and grid layouts

   IMPORTANT NOTES:
   - These styles load AFTER the main app.css (SASS-compiled file)
   - DO NOT modify dahlia-includes/themes/OneOnOneCustom/sass/ files
     (no local SASS compilation setup)
   - These styles will override any existing class card/grid styles
   - Styles apply to both server-rendered page content and AJAX-loaded content

   RELATED FILES:
   - dahlia-local/ooo/modules/class_slider/index.php (has embedded <style> tags)
   - dahlia-local/ooo/modules/page_content/index.php (renders class content)
   - dahlia-includes/themes/OneOnOneCustom/css/sections/class.css (compiled from SASS)

   EXISTING CLASSES TO OVERRIDE:
   - .one-event-card (individual class card)
   - .one-event-grid (grid container - currently 3 cols desktop, 2 tablet, 1 mobile)
   - .one-event-info (class info container)
   - Breakpoints: 1024px (desktop), 540px (tablet/mobile)

   DATABASE CONFIGURATION:
   - Outline templates control HTML structure (dahlia_outlines table)
   - Default outline ID for sliders: 13
   - Page layouts: Layout 12 (No Sidebar), Layout 14 (Class Listing with filters)

   ============================================================================ */

/* -------------------------------------------
   Classes Page Layout & Grid Styles
   ------------------------------------------- */

/* Add your classes page grid/card layout styles here */


/* -------------------------------------------
   Typography & Text Styling
   ------------------------------------------- */

/* Add your classes page typography customizations here */


/* -------------------------------------------
   Responsive Breakpoints
   ------------------------------------------- */

/* Desktop styles (1024px and up) */
@media only screen and (min-width: 1024px) {
  /* Add your desktop-specific classes page styles here */

}

/* Tablet styles (541px to 1023px) */
@media only screen and (min-width: 541px) and (max-width: 1023px) {
  /* Add your tablet-specific classes page styles here */

}

/* Mobile styles (540px and below) */
@media only screen and (max-width: 540px) {
  /* Add your mobile-specific classes page styles here */

}