/*
 * App Global CSS
 * ----------------------------------------------------------------------------
 * Put style rules here that you want to apply globally. These styles are for
 * the entire app and not just one component. Additionally, this file can be
 * used as an entry point to import other CSS/Sass files to be included in the
 * output CSS.
 * For more information on global stylesheets, visit the documentation:
 * https://ionicframework.com/docs/layout/global-stylesheets
 */

/* Core CSS required for Ionic components to work properly */
@import "~@ionic/angular/css/core.css";

/* Basic CSS for apps built with Ionic */
@import "~@ionic/angular/css/normalize.css";
@import "~@ionic/angular/css/structure.css";
@import "~@ionic/angular/css/typography.css";
@import "~@ionic/angular/css/display.css";

/* Optional CSS utils that can be commented out */
@import "~@ionic/angular/css/padding.css";
@import "~@ionic/angular/css/float-elements.css";
@import "~@ionic/angular/css/text-alignment.css";
@import "~@ionic/angular/css/text-transformation.css";
@import "~@ionic/angular/css/flex-utils.css";

@font-face {
  font-family: "Kanit";
  font-style: normal;
  font-weight: 300;
  src: url("./assets/fonts/Kanit-Light.ttf");
}

@font-face {
  font-family: "Kanit";
  font-style: normal;
  font-weight: 400;
  src: url("./assets/fonts/Kanit-Regular.ttf");
}

@font-face {
  font-family: "Kanit";
  font-style: normal;
  font-weight: 500;
  src: url("./assets/fonts/Kanit-Medium.ttf");
}

@font-face {
  font-family: "Kanit";
  font-style: normal;
  font-weight: 500;
  src: url("./assets/fonts/Kanit-Medium.ttf");
}

@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 300;
  src: url("./assets/fonts/IBMPlexSansThai-Light.ttf");
}

@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  src: url("./assets/fonts/IBMPlexSansThai-Regular.ttf");
}

@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  src: url("./assets/fonts/IBMPlexSansThai-SemiBold.ttf");
}

* {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
}

.hcs {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 5px;
  padding-top: 5px;
}

.new-background-color {
    --background: rgb(4,128,55);
    --background: linear-gradient(90deg, rgba(4,128,55,1) 0%, rgba(94,246,93,1) 89%, rgba(182,247,194,1) 100%);
    --color:#fff;
}

// ion-content {
//   --background: linear-gradient(
//     to bottom,
//     #a7e9ff,
//     #8fd8fd,
//     #7ec7fb,
//     #78b4f6,
//     #7c9fee
//   );
// }

ion-title {
  font-family: "Kanit", sans-serif !important;
  font-weight: 500;
}

.txt-content {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 400;
}

.txt-lead {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 600;
}

.txt-place-title {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 600;
  line-height: 1.2;
  font-size: 22px;
  margin-top: 5px;
  margin-bottom: 5px;
}

h1 {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 600;
}

ion-label {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
}

ion-button {
  font-family: "IBM Plex Sans Thai", sans-serif !important;
  font-weight: 600;
}

.break-line {
  border-bottom: 1px rgb(31, 31, 31) solid;
}

a {
  text-decoration: none;
}

.image-page-cover {
  height: 200px;
}
.ios ion-fab-button {
  position: absolute;
  bottom: 25px;
}
