/* -------------------------------------------
   GENERAL UTILITIES
-------------------------------------------- */

/* Utility: hide elements */
.no-display {
  display: none;
}

/* -------------------------------------------
   NODE & VIEW MODE OVERRIDES
-------------------------------------------- */

.node--type-vfrc-clinic-contact.node--view-mode-preview 
  .field--name-title {
  display: none;
}

/* -------------------------------------------
   FORM ELEMENT BASICS
-------------------------------------------- */

/* Form field labels */
.field__label {
  margin: 0.25rem 0;
}

/* Form field items */
.field__item {
  margin-bottom: 0.25rem;
}

/* Hide Country field inside Address component 
   (country is always predefined) */
div[data-drupal-selector*="field-address-0-address-country-code"] {
  visibility: hidden;
  width: 0;
  height: 0;
  margin: 0;
}

/* Boolean group elements */
.form-boolean-group * {
  margin: 3px !important;
}

/* Inline label + value spacing */
.field--label-inline .field__item {
  line-height: 28px;
}

/* -------------------------------------------
   WIDTH UTILITY CLASSES 
   (for Claro subtheme form layouts)
-------------------------------------------- */

.form-item.w-25  { width: 25%; }
.form-item.w-30  { width: 30%; }
.form-item.w-35  { width: 35%; }
.form-item.w-40  { width: 40%; }
.form-item.w-45  { width: 45%; }
.form-item.w-50  { width: 49%; }
.form-item.w-55  { width: 55%; }
.form-item.w-60  { width: 60%; }
.form-item.w-65  { width: 65%; }
.form-item.w-70  { width: 70%; }
.form-item.w-75  { width: 75%; }
.form-item.w-80  { width: 80%; }
.form-item.w-85  { width: 85%; }
.form-item.w-90  { width: 90%; }
.form-item.w-95  { width: 95%; }
.form-item.w-100 { width: 100%; }

/* -------------------------------------------
   FLEX-ENABLED FORM LAYOUTS
-------------------------------------------- */

/* Make Claro's wrapper flex-capable */
.claro-container-flex .claro-details__wrapper > .claro-details__content,
.claro-container-flex > .claro-details__wrapper,
.claro-container-flex > .fieldset__wrapper {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
}

/* Form items behave as flex children */
.claro-container-flex .form-item {
  box-sizing: border-box;
  flex: 1 1 auto; 
}



/** all rendered (referenced) entities **/
.entities-list .rendered-entity,
.claro-details__wrapper.details-wrapper .node,
.claro-details__wrapper.details-wrapper .paragraph {
  margin: 10px;
  padding: 1rem;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.entities-list .rendered-entity .node-title,
.claro-details__wrapper.details-wrapper .node .node-title {
  font-size: 2rem;
  font-weight: bold;
}
.field--name-field-contact-phone-numbers {
  width: 100%;
}



/** details **/
.claro-details__description {
  width: 100%;
}