﻿/* --- Layout Section Styling --- */

.layout--twocol-section {
  display: flex;
  flex-wrap: wrap;
  flex-shrink: 1;
}

/* Default layout behavior for regions */
.layout-.layout--twocol-section > .layout__region {
  flex: 0 1 100%;
}

/* 50-50 layout */
.layout--twocol-section.layout--twocol-section--50-50 > .layout__region--first,
.layout--twocol-section.layout--twocol-section--50-50 > .layout__region--second {
  flex: 0 1 100%;
}

/* 33-67 and 67-33 layouts */
.layout--twocol-section.layout--twocol-section--33-67 > .layout__region--first,
.layout--twocol-section.layout--twocol-section--67-33 > .layout__region--second {
  flex: 0 1 100%;
}

.layout--twocol-section.layout--twocol-section--33-67 > .layout__region--second,
.layout--twocol-section.layout--twocol-section--67-33 > .layout__region--first {
  flex: 0 1 100%;
}

/* 25-75 and 75-25 layouts */
.layout--twocol-section.layout--twocol-section--25-75 > .layout__region--first,
.layout--twocol-section.layout--twocol-section--75-25 > .layout__region--second {
  flex: 0 1 100%;
}

.layout--twocol-section.layout--twocol-section--25-75 > .layout__region--second,
.layout--twocol-section.layout--twocol-section--75-25 > .layout__region--first {
  flex: 0 1 100%;
}

/* --- Responsive Layout Adjustments --- */

@media (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }
}

@media screen and (min-width: 769px) {
  .layout--twocol-section .layout__region--first {
    padding-right: 20px;
  }

  .layout--twocol-section .layout__region--second {
    padding-left: 20px;
  }

  /* Responsive flex settings for different layouts */
  .layout--twocol-section.layout--twocol-section--50-50 > .layout__region--first,
  .layout--twocol-section.layout--twocol-section--50-50 > .layout__region--second {
    flex: 0 1 50%;
  }

  .layout--twocol-section.layout--twocol-section--33-67 > .layout__region--first,
  .layout--twocol-section.layout--twocol-section--67-33 > .layout__region--second {
    flex: 0 1 33%;
  }

  .layout--twocol-section.layout--twocol-section--33-67 > .layout__region--second,
  .layout--twocol-section.layout--twocol-section--67-33 > .layout__region--first {
    flex: 0 1 67%;
  }

  .layout--twocol-section.layout--twocol-section--25-75 > .layout__region--first,
  .layout--twocol-section.layout--twocol-section--75-25 > .layout__region--second {
    flex: 0 1 25%;
  }

  .layout--twocol-section.layout--twocol-section--25-75 > .layout__region--second,
  .layout--twocol-section.layout--twocol-section--75-25 > .layout__region--first {
    flex: 0 1 75%;
  }
}

/* --- Layout Builder and Modal Styling --- */

.layout-bg-row > * {
  min-height: unset;
}

#layout-builder {
  padding: 0;
  border: none;
}

#layout-builder .container {
  width: 100%;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.layout-builder__message .container .row .col {
  padding-right: 0;
  padding-left: 0;
}

ul.chosen-results {
  clear: both;
  margin: 0 !important;
}

#layout-builder-modal .chosen-container a {
  color: inherit;
}

/* Hero section styling within layout builder */
#layout-builder .hero {
  position: relative;
}

#layout-builder .hero h1, 
#layout-builder .hero h2, 
#layout-builder .hero h3, 
#layout-builder .hero h4, 
#layout-builder .hero h5, 
#layout-builder .hero p, 
#layout-builder .hero a {
  color: #000;
}

#layout-builder h2::before, 
#layout-builder h3::before, 
#layout-builder h4::before, 
#layout-builder h5::before, 
#layout-builder h6::before {
  display: none;
}

/* --- Off-Canvas and Dialog Styling --- */

#drupal-off-canvas .form-item .description {
  background-color: #444;
  color: #999;
  border: none;
  box-shadow: none;
}

.layout-builder-block {
  color: black !important;
}

.layout-builder__link {
  color: #686868 !important;
}

.ui-dialog-off-canvas.ui-resizable .ui-resizable-handle:after {
  width: 52px;
  height: 34px;
}

.layout-builder__message--overrides .messages,
.layout-builder__message--defaults .messages {
  background-image: none;
}

body #layout-builder-modal,
body #drupal-modal {
  background-color: #FFF;
  color: black;
}

/* --- Dialog Styling --- */

.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-dialog-buttons {
  padding: 0;
  max-width: 100% !important;
  width: 94% !important;
  height: auto;
  max-height: 90%;
  top: 5% !important;
  left: 3% !important;
  box-shadow: 0 0 7px 2px rgba(125, 125, 125, 0.3);
  border: 1px solid #2d2d2d;
  overflow-y: scroll;
}

.ui-dialog .ui-dialog-titlebar {
  padding: 1em;
  color: #fff;
  border: 0;
  border-bottom: 1px solid #000;
  border-radius: 0;
  background: #2d2d2d;
  font-weight: normal;
}

.ui-dialog .ui-dialog-titlebar-close {
  position: absolute;
  top: calc(50% - 6px);
  right: 1em;
  width: 30px;
  height: 30px;
  transition: all 0.5s ease;
  border: 3px solid transparent;
  background-color: transparent;
  background-image: url(/core/misc/icons/bebebe/ex.svg);
  background-repeat: no-repeat;
  background-position: center center;
}

.ui-dialog .ui-dialog-buttonpane {
  background-color: #2d2d2d;
  margin-top: 0;
}

.ui-dialog .ui-dialog-buttonpane button {
  border: 1px solid #FFF;
}

/* Dialog close button hover effect */
.ui-dialog .ui-dialog-titlebar-close:hover,
.ui-dialog .ui-dialog-titlebar-close:focus {
  border: 3px solid #fff;
  background-image: url(/core/misc/icons/ffffff/ex.svg);
}

#layout-builder-modal .chosen-container,
#drupal-modal .chosen-container {
  max-width: 350px !important;
}

.ui-widget-overlay {
  opacity: 0.7;
  background-color: #666;
}

/* --- Alumni Node Styling --- */

.node--type-alumni .field--name-field-degree-program p {
  margin: 0;
}

/* --- Enquire Button Styling --- */

#enquire-button-block {
  position: relative;
}

#enquire-button-block .close-btn {
  position: absolute;
  top: 5px;
  right: 5px;
  cursor: pointer;
}

/* Slide-up animation for enquire button */
.enquire-slide-up {
  position: fixed;
  bottom: 0;
  width: 100%;
  max-height: 190px;
  transition: max-height 0.5s;
  box-shadow: 0px -6px 65px -18px rgba(0, 0, 0, 0.4);
  z-index: 105;
}

.enquire-slide-up-hidden {
  position: fixed;
  bottom: 0;
  width: 100%;
  max-height: 0;
  transition: max-height 0.5s;
  z-index: 105;
}

/* --- Miscellaneous --- */

/* Full width for export code field */
#edit-export-code {
  width: 100%;
}
