@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://use.typekit.net/evz7ghn.css');
/* latin */
:root {

--background: #A3C123;

--content: white;

--primary: #0D4556;

--color: #FFFFFF;

--secondryGray: #0F1610;

font-size: 16px !important;
  /* Set the desired font size - this is fix for the malin theme */

  /* The Malin design tokens */

--the-malin-yellow: #FFE000;

--the-malin-light-yellow: #FFFFFF;

--the-malin-purple: #0D4556;
  /* I am under the impression that Figma colors for buttons aren't aligned with the WP version - tbc*/

--the-malin-dark-teal: #07272D;
  /* Confusion caused by updated colors */

--the-malin-deep-green: #3B593C;

--the-malin-dark-green: #3B593C;

--the-malin-green-shade-1: #28494D;

--the-malin-green-shade-2: #6E9093;

--the-malin-grey: #DBDBDB;

--the-malin-ivory: #3B593C;

--the-malin-font-family: "athena",sans-serif;

--the-malin-font-family-light: "athena",sans-serif;
  /* todo: this font isn't enqueued in the theme */

--the-malin-font-family-bold: "athena",sans-serif;

--primary-font-family: var(--the-malin-font-family);

--secondary-font-family: "Jost", sans-serif;


  /* t9s-button */

--t9s-button-medium-height: 46px;

--t9s-button-primary-font-family: var(--the-malin-font-family-bold);

--t9s-button-primary-color: var(--the-malin-dark-teal);

--t9s-button-primary-border-radius: 5px;
  /* todo: replace this magic number with a variable */

--t9s-button-primary-bg: var(--the-malin-yellow);

--t9s-button-primary-border-color: var(--the-malin-yellow);

--t9s-button-primary-font-size: 22px;

--t9s-button-primary-hover-bg: var(--the-malin-light-yellow);

--t9s-button-primary-hover-color: var(--the-malin-dark-teal);

--t9s-button-primary-text-transform: uppercase !important;
  /* not working */
  /* missing: text transform (to uppercase) */

  /* t9s-button--secondary */

--t9s-button-secondary-font-family: "Jost", sans-serif;

--t9s-button-secondary-color: var(--the-malin-dark-green);

--t9s-button-secondary-border-radius: 5px;
  /* todo: replace this magic number with a variable */

--t9s-button-secondary-bg: transparent;

--t9s-button-secondary-border: 1px solid var(--the-malin-dark-green);

--t9s-button-secondary-font-size: 22px;

--t9s-button-secondary-hover-bg: var(--the-malin-yellow);

--t9s-button-secondary-hover-color: var(--the-malin-dark-green);

--t9s-button-secondary-hover-border: 1px solid var(--the-malin-yellow);

--t9s-button-secondary-text-transform: uppercase !important;
  /* not working */

  /* t9s-input */

--t9s-input-border-radius: 5px;

--t9s-input-padding: 10px 20px 10px 20px;

--t9s-input-form-control-label-font-family: var(--the-malin-font-family-light);

--t9s-input-form-control-label-font-size: 16px;

--t9s-input-form-control-label-margin-bottom: 6px;

--t9s-input-border: none;

--t9s-input-medium-height: 46px;

--t9s-input-border-width: 0;

--t9s-input-font-family: var(--wp--preset--font-family--primary);

--t9s-input-font-size: 15px;

--t9s-input-color: #0D4556;

--t9s-input-placeholder-color: #0D4556;

--sl-input-color: #0D4556;
--sl-input-color-hover: #0D4556;

  /* t9s-link */

--t9s-link-color: var(--the-malin-yellow);

--t9s-link-font-family: var(--the-malin-font-family-light);

--t9s-link-font-size: 20px;

  /* t9s-checkbox */

--t9s-checkbox-border: 1px solid #f4f4f4;

--t9s-checkbox-font-family: var(--the-malin-font-family-light);

--t9s-checkbox-font-size: 16px;

--t9s-checkbox-border-radius: 3px;

--t9s-checkbox-checked-bg: var(--the-malin-green-shade-1);


  /* t9s-modal */

--t9s-modal-container-bg: rgba(0, 0, 0, 0.6);

--t9s-modal-container-border-radius: 0;

--t9s-modal-container-box-shadow: none;

--t9s-modal-container-padding: 0px;

--t9s-modal-container-max-width: 913px;

--t9s-modal-container-min-width: 870px;

--t9s-modal-container-max-height: 90%;
--t9s-date-picker-header-color: #0F1610;
--dp-text-color: #0F1610;

--t9s-modal-content-bg: transparent;

  /* t9s-date-picker */

--t9s-date-picker-border-radius: 5px;

--t9s-date-picker-border: none;

--t9s-date-picker-padding: 11px;

--t9s-date-picker-font-family: var(--secondary-font-family);

--t9s-date-picker-font-size: 15px;

--t9s-date-picker-color: var(--primary);

--t9s-date-picker-cell-size: 30px;

--t9s-date-picker-cell-border-radius: 50%;

--t9s-date-picker-cell-background: #fff;

--t9s-date-picker-cell-font-weight: 400;

--t9s-date-picker-cell-font-family: var(--secondary-font-family);

--t9s-date-picker-cell-font-size: 12px;

--t9s-date-picker-active-background: var(--background);

--t9s-date-picker-active-color: var(--color);

--t9s-date-picker-active-border-radius: 50%;

--t9s-date-picker-active-border-width: 0px;

--t9s-date-picker-active-border-style: solid;

--t9s-date-picker-active-border-color: var(--the-malin-yellow);

--t9s-date-picker-header-separator-height: 0px;

--t9s-date-picker-header-item-font-family: var(--secondary-font-family);

--t9s-date-picker-hover-background: var(--the-malin-purple);

--t9s-date-picker-hover-color: #fff;

--t9s-date-picker-offset-cell-background: unset;

--t9s-date-picker-font-weight: 400;

--t9s-date-picker-header-gap: 6px;

--t9s-date-picker-month-button-font-family: var(--secondary-font-family);

--t9s-date-picker-month-button-font-size: 16px;

--t9s-date-picker-row-gap: 6px;

--t9s-date-picker-calendar-background: #ffffff;

--t9s-date-picker-menu-padding: 0;

--t9s-date-picker-menu-border-width: 0px;

--t9s-date-picker-menu-border-style: solid;

--t9s-date-picker-menu-border-color: var(--the-malin-dark-green);

--t9s-date-picker-menu-border-radius: 5px;

--t9s-date-picker-menu-focus-border-width: 0px;

--t9s-date-picker-menu-focus-border-style: solid;

--t9s-date-picker-menu-focus-border-color: var(--the-malin-dark-green);

--t9s-date-picker-menu-focus-border-radius: 5px;

--t9s-date-picker-month-year-background: #FFF;

--t9s-date-picker-arrow-top-display: none;

--t9s-date-picker-month-year-row-height: 45px;

--t9s-date-picker-month-year-row-margin-bottom: 10px;

--t9s-date-picker-calendar-icon-top: unset;

--t9s-date-picker-calendar-icon-transform: none;

--t9s-date-picker-calendar-icon-bottom: 0;

--t9s-date-picker-calendar-icon-padding: 11px 12px 11px 30px;

--t9s-date-picker-calendar-icon-right: 0;

--t9s-date-picker-calendar-icon-left: unset;

--t9s-date-picker-calendar-icon-width: 24px;

--t9s-date-picker-calendar-icon-height: 24px;

--t9s-date-picker-calendar-icon-padding-left: 20px;

--t9s-date-picker-calendar-icon-padding-right: 35px;

--t9s-date-picker-label-font-family: var(--the-malin-font-family-light);

--t9s-date-picker-label-font-size: 16px;

--t9s-date-picker-label-margin-bottom: 6px;

--t9s-date-picker-clear-icon-width: 16px;

--t9s-date-picker-clear-icon-height: 16px;

--t9s-date-picker-clear-icon-bottom: unset;

--t9s-date-picker-clear-icon-padding: 12px;

--t9s-date-picker-clear-icon-top: 48%;

--t9s-date-picker-clear-icon-transform: translateY(-50%);

--dp-secondary-color: #A9A9A9;

  /* t9s-time-picker */

--t9s-time-picker-border-radius: 5px;

--t9s-time-picker-padding: 11px;

--t9s-time-picker-border: none;

--t9s-time-picker-font-family: var(--the-malin-font-family-light);

--t9s-time-picker-font-size: 16px;

--t9s-time-picker-color: var(--the-malin-dark-green);

--t9s-time-picker-label-font-family: var(--t9s-select-font-family);

--t9s-time-picker-label-font-size: 16px;

--t9s-time-picker-label-margin-bottom: 6px;

--t9s-time-picker-overlay-background: #F8F7F2;

--t9s-time-picker-menu-border: 1px solid var(--the-malin-dark-green);

--t9s-time-picker-menu-border-radius: 5px;

--t9s-time-picker-menu-focus-border: 1px solid var(--the-malin-dark-green);

--t9s-time-picker-menu-focus-border-radius: 5px;

--t9s-time-picker-arrow-top-display: none;

--t9s-time-picker-arrow-top-display: none;

--t9s-time-picker-time-font-family: var(--the-malin-font-family-bold);

--t9s-time-picker-time-font-size: 40px;

--t9s-time-picker-arrow-hover-background: var(--the-malin-purple);

--t9s-time-picker-arrow-hover-color: #fff;

--t9s-time-picker-calendar-icon-top: unset;

--t9s-time-picker-calendar-icon-transform: none;

--t9s-time-picker-calendar-icon-bottom: 0;

--t9s-time-picker-calendar-icon-padding: 11px 12px 11px 30px;

--t9s-time-picker-calendar-icon-right: 0;

--t9s-time-picker-calendar-icon-left: unset;

--t9s-time-picker-calendar-icon-width: 24px;

--t9s-time-picker-calendar-icon-height: 24px;

--t9s-time-picker-clear-icon-width: 16px;

--t9s-time-picker-clear-icon-height: 16px;

--t9s-time-picker-clear-icon-bottom: 0;

--t9s-time-picker-clear-icon-padding: 15px 12px 15px 30px;

--t9s-time-picker-clear-icon-top: unset;

--t9s-time-picker-clear-icon-transform: none;

--t9s-time-picker-calendar-icon-padding-left: 10px;

--t9s-time-picker-calendar-icon-padding-right: 35px;

  /* t9s-select */

--t9s-select-medium-height: 46px;

--t9s-select-focus-border-color: #ddd;

--t9s-select-border-radius: 5px;

--t9s-select-border: #d9d9d9;

--t9s-select-box-shadow: none;

--t9s-select-font-family: var(--wp--preset--font-family--primary);

--t9s-select-font-size: 15px;

--t9s-select-text-transform: none;

--t9s-select-padding-inline: 20px 11px;

--t9s-select-listbox-border-radius: 5px;

--t9s-select-listbox-border: none;

--t9s-select-listbox-padding: 0px;

--t9s-select-listbox-box-shadow: none;

--t9s-select-option-background-color: #fff;

--t9s-select-option-padding: 10px;

--t9s-select-option-color: #0D4556;

--t9s-select-option-hover-background-color: var(--the-malin-purple);

--t9s-select-option-hover-color: white;

--t9s-select-option-selected-color: white;

--t9s-select-option-selected-background-color: var(--primary);

--t9s-select-option-font-family: var(--secondary-font-family);

--t9s-select-option-font-size: 16px;

--t9s-select-label-font-family: var(--the-malin-font-family-light);

--t9s-select-label-font-size: 16px;

--t9s-select-label-margin-bottom: 6px;

--t9s-select-expand-icon-font-size: 24px;

  /* t9s-radio-button */

--t9s-radio-group-button-border-radius: 9999px;

--t9s-radio-group-button-font-family: var(--secondary-font-family);

--t9s-radio-group-button-font-size: 16px;

--t9s-radio-group-button-border: none;

--t9s-radio-group-button-background: var(--the-malin-grey);

--t9s-radio-group-button-padding: 8px 18px;

--t9s-radio-group-button-line-height: 1;

--t9s-radio-group-button-color: var(black);

--t9s-radio-group-button-hover-background: #A3C123;

--t9s-radio-group-button-hover-border: none;

--t9s-radio-group-button-hover-color: #fff;

--t9s-radio-group-button-spacing: 11px;

--t9s-radio-group-button-checked-background: #A3C123;

--t9s-radio-group-button-checked-border: none;

--t9s-radio-group-button-checked-color: var(--content);

  /* t9s-tag */

--t9s-tag-border-radius-large: 999px;

--t9s-tag-border-radius-medium: 999px;

--t9s-tag-border-radius-small: 999px;

--t9s-tag-primary-color: white;

--t9s-tag-primary-bg: #ea5435;

--t9s-button-tag-border: none;

--t9s-tag-primary-font-family: var(--the-malin-font-family-light);

--t9s-tag-primary-font-size: 16px;

--t9s-tag-success-color: white;

--t9s-tag-success-bg: #7a7a7a;

--t9s-tag-success-border: none;

--t9s-tag-success-font-family: var(--the-malin-font-family-light);

--t9s-tag-success-font-size: 16px;

--t9s-tag-neutral-color: var(--the-malin-dark-green);

--t9s-tag-neutral-bg: #F8F7F2;

--t9s-tag-neutral-border: none;

--t9s-tag-neutral-font-family: var(--the-malin-font-family-light);

--t9s-tag-neutral-font-size: 16px;

--t9s-tag-warning-color: white;

--t9s-tag-warning-bg: #7a7a7a;

--t9s-tag-warning-border: none;

--t9s-tag-warning-font-family: var(--the-malin-font-family-light);

--t9s-tag-warning-font-size: 0.9rem;

--t9s-tag-danger-color: white;

--t9s-tag-danger-bg: #7a7a7a;

--t9s-tag-danger-border: none;

--t9s-tag-danger-font-family: var(--the-malin-font-family-light);

--t9s-tag-danger-font-size: 16px;

  /* textarea */

--t9s-textarea-border-radius: 5px;

--t9s-textarea-border: none;

--t9s-textarea-font-family: var(--the-malin-font-family-light);

--t9s-textarea-font-size: 16px;

  /* modal close button */

--t9s-close-button-primary-color: #fff;

--t9s-close-button-primary-hover-color: var(--t9s-tag-danger-bg);

--t9s-close-button-primary-active-color: var(--t9s-tag-danger-bg);

  /* t9s spinner */

--t9s-spinner-color-primary: var(--the-malin-dark-teal);

  /* td 202403270138 - Swiper styles for meeting rooms carousels */

--swiper-pagination-bullet-inactive-color: var(--the-malin-dark-teal);

--swiper-pagination-bullet-horizontal-gap: 12px;

--swiper-pagination-bullet-inactive-opacity: 1.0;

--swiper-pagination-color: var(--the-malin-yellow);

--swiper-pagination-bottom: 0px;
}

t9s-modal[modal-id=login] {
  --t9s-modal-container-max-width: 1003px;
}


/* grid system */

.grid-row {
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + (var(--paddingVGR) * 2));
  margin: var(--marginVGR);
}

sl-select::part(combobox){
  border: 1px solid #000;
}

/* to do remove */
t9s-button {
  --sl-input-height-medium: 46px;
}

t9s-input {
  /* todo remove */
  --sl-input-border-width: 0;
}

@media only screen and (max-width: 870px) {
  :root {
    --t9s-modal-container-min-width: auto;
  }

 
}

@media (min-width: 992px) {
  t9s-modal[modal-id="inquiry"] {
    --t9s-modal-container-max-width: 800px;
    --t9s-modal-container-min-width: 800px;
  }
}

sl-input::part(input)::placeholder{
  color: var(--t9s-input-placeholder-color, #7a7a7a);
}

body.kt-modal-open {
  overflow: hidden !important;
}

