/**
 * Component Spacing Overrides
 * Standardizes padding and margins across all EGR components
 * to reduce excessive whitespace between content sections
 */

/* Standard spacing values */
:root {
  --component-spacing-xs: 0.5rem;  /* 8px */
  --component-spacing-sm: 1rem;    /* 16px */
  --component-spacing-md: 1.5rem;  /* 24px */
  --component-spacing-lg: 2rem;    /* 32px */
  --component-spacing-xl: 2.5rem;  /* 40px */
  --component-spacing-xxl: 3rem;   /* 48px */
}

/* Global component spacing resets */
/* Double attribute selector for higher specificity (0,2,0) to override single class selectors */
[class*="egr-"][class*="egr-"] {
  /* Reset excessive margins between components */
  margin-top: 0;
  margin-bottom: 0;
}

/* Component-specific overrides */

/* EGR Layout - Reduce excessive padding options */
.egr-layout--padding-small {
  padding-top: var(--component-spacing-md) !important;
  padding-bottom: var(--component-spacing-md) !important;
}

.egr-layout--padding-medium {
  padding-top: var(--component-spacing-lg) !important;
  padding-bottom: var(--component-spacing-lg) !important;
}

.egr-layout--padding-large {
  padding-top: var(--component-spacing-xl) !important;
  padding-bottom: var(--component-spacing-xl) !important;
}

.egr-layout--padding-extra-large {
  padding-top: var(--component-spacing-xxl) !important;
  padding-bottom: var(--component-spacing-xxl) !important;
}

/* Components with background colors - Reduce from 4rem to 2rem */
.egr-aside[style*="background-color"],
.egr-counter[style*="background-color"],
.egr-hv-tabs[style*="background-color"],
.egr-text-ctas[style*="background-color"] {
  padding: var(--component-spacing-lg) 0 !important;
}

/* EGR Logos - Reduce padding options */
.egr-logos--padding-small {
  padding: var(--component-spacing-md) 0 !important;
}

.egr-logos--padding-medium {
  padding: var(--component-spacing-lg) 0 !important;
}

.egr-logos--padding-large {
  padding: var(--component-spacing-xl) 0 !important;
}

/* EGR Aside - Reduce margins */
.egr-aside {
  margin: var(--component-spacing-lg) 0 !important;
}

/* EGR HV Tabs - Reduce container margins */
.egr-hv-tabs .container,
.egr-hv-tabs .container-fluid {
  margin: var(--component-spacing-lg) 0 !important;
}

/* EGR Accordion - Adjust icon spacing */
.egr-accordion .accordion-button {
  padding-right: 60px !important; /* Reduced from 100px */
}

/* Component stacking - Add consistent spacing between components */
/* Removed margin-top between consecutive paragraphs
.paragraph + .paragraph {
  margin-top: var(--component-spacing-lg);
}
*/

/* Responsive adjustments for mobile */
@media (max-width: 767.98px) {
  /* Add left and right padding to main-section on mobile */
  #main-section {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  /* Further reduce spacing on mobile */
  .egr-layout--padding-small {
    padding-top: var(--component-spacing-sm) !important;
    padding-bottom: var(--component-spacing-sm) !important;
  }
  
  .egr-layout--padding-medium {
    padding-top: var(--component-spacing-md) !important;
    padding-bottom: var(--component-spacing-md) !important;
  }
  
  .egr-layout--padding-large {
    padding-top: var(--component-spacing-lg) !important;
    padding-bottom: var(--component-spacing-lg) !important;
  }
  
  .egr-layout--padding-extra-large {
    padding-top: var(--component-spacing-xl) !important;
    padding-bottom: var(--component-spacing-xl) !important;
  }
  
  /* Reduce background padding on mobile */
  .egr-aside[style*="background-color"],
  .egr-counter[style*="background-color"],
  .egr-hv-tabs[style*="background-color"],
  .egr-text-ctas[style*="background-color"] {
    padding: var(--component-spacing-md) 0 !important;
  }
  
  /* Reduce component stacking spacing on mobile */
  /* Removed margin-top between consecutive paragraphs
  .paragraph + .paragraph {
    margin-top: var(--component-spacing-md);
  }
  */
}

/* Specific component content spacing adjustments */

/* EGR CTA Mixed - Reduce content padding */
.egr-cta-mixed .content {
  padding: var(--component-spacing-md) !important;
}

@media (min-width: 768px) {
  .egr-cta-mixed .content {
    padding: var(--component-spacing-lg) !important;
  }
}

/* EGR Cards - Reduce card spacing */
.egr-cards .card {
  margin-bottom: var(--component-spacing-md) !important;
}

/* EGR Profile Cards - Reduce spacing */
.egr-profile-card {
  margin-bottom: var(--component-spacing-md) !important;
}

/* EGR Content Block - Standardize padding */
.egr-content-block {
  padding: var(--component-spacing-lg) 0 !important;
}

/* EGR Heading - Reduce margins */
.egr-heading {
  margin-bottom: var(--component-spacing-md) !important;
}

/* EGR Video - Reduce container padding */
.egr-video {
  padding: var(--component-spacing-lg) 0 !important;
}

/* EGR Media - Standardize spacing */
.egr-media {
  margin: var(--component-spacing-lg) 0 !important;
}

/* EGR Menu - Reduce section padding */
.egr-menu {
  padding: var(--component-spacing-md) 0 !important;
}

/* EGR Banner - Adjust min-height for less whitespace */
.egr-banner {
  min-height: 300px !important; /* Reduced default if too large */
}

@media (min-width: 768px) {
  .egr-banner {
    min-height: 400px !important;
  }
}

/* EGR Divider - Ensure consistent spacing */
.egr-divider {
  margin: var(--component-spacing-lg) 0 !important;
}

/* EGR Logos Marquee - Reduce gap between loops */
.egr-logos__marquee-content {
  padding-right: var(--component-spacing-lg) !important; /* Reduced from 4rem */
}

/* Remove double spacing when components are nested */
.paragraph .paragraph {
  margin-top: var(--component-spacing-md);
}

/* Special case: First and last components in a region */
.region > .paragraph:first-child,
.node__content > .paragraph:first-child,
.field--name-field-components > .field__item:first-child .paragraph {
  margin-top: 0 !important;
}

.region > .paragraph:last-child,
.node__content > .paragraph:last-child,
.field--name-field-components > .field__item:last-child .paragraph {
  margin-bottom: 0 !important;
}

/* Ensure consistent spacing between field items containing paragraphs */
.field--name-field-components > .field__item + .field__item {
  margin-top: var(--component-spacing-lg);
}

/* Remove any default field item margins */
.field--name-field-components > .field__item {
  margin: 0;
}

/* Remove any ::before pseudo-element from college-name */
.college-name::before {
  content: none !important;
  display: none !important;
}

/* Remove padding-left from p.college-name */
p.college-name {
  padding-left: 0 !important;
}

/* Remove padding from branding block columns */
.block-system-branding-block .col-auto,
.block-system-branding-block .col {
  padding-left: 0 !important;
}

/* Adjust spacing between logo and text */
.block-system-branding-block .col-auto {
  padding-right: 1rem;
}

/* Remove margin-left from row in branding block */
.block-system-branding-block .row.align-items-center.g-0 {
  margin-left: 0 !important;
}

/* Also remove any margin from the container if needed */
.block-system-branding-block .container {
  padding-left: 0 !important;
}

/* Remove margin-left from region-dept-header row */
.region-dept-header .row {
  margin-left: 0 !important;
}

/* Also ensure no padding on region-dept-header */
.region-dept-header {
  padding-left: 0 !important;
}

/* Add padding to directory view filter */
.dir-view-filter {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

/* Override green background on directory search input field */
form#views-exposed-form-directory-page-1 #edit-title,
form#views-exposed-form-directory-page-2 #edit-title {
  color: #333 !important;
  background-color: #fff !important;
  border: none !important;
}

/* Ensure same height for select and input fields in directory form */
.dir-view-filter .form-select,
.dir-view-filter .form-text {
  height: calc(2.5rem + 4px); /* Base height + border */
  box-sizing: border-box;
}

/* Make submit button same height and align with form inputs */
.dir-view-filter .btn-msu {
  height: calc(2.5rem + 4px); /* Same height as inputs */
  padding-top: 0;
  padding-bottom: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
}

/* Adjust padding-top for fs-btn */
.fs-btn {
  padding-top: 20px;
}