html {
  scrollbar-width: thin;
  scroll-behavior: smooth;
}

:root {
  --btns-header-svg: #e8b54f;
  --body-color: #1b1f2f;
  --color-menu-bar: #e8b54f;
  --color-text-content: #B68E59;
  --box-color: #22273b;
  --color-R: #d83749;
  --color-G: #e8b54f;
  --room-G: #22263a;
  --sidenav-G: #39435c;
  --header-table-color: #22273b;
  --tab-acordien: #14141e;
  --color-text-btn: #000;
  --color-text-menu: #fff;
  --content-G: #39435c;
  --color-text-acordien: #fff;
  --color-D-B-2: #22273b;
  --field-bg: #22273b;

  --sidenav-width: 390px;
}

body.default {
  --btns-header-svg: #e8b54f;
  --body-color: #1b1f2f;
  --color-R: #d83749;
  --color-G: #e8b54f;
  --box-color: #22273b;
  --room-G: #22263a;
  --content-G: #39435c;
  --color-text-btn: #000;
  --color-text-content: #B68E59;
  --color-text-menu: #B68E59;
  --color-menu-bar: #e8b54f;
  --sidenav-G: #39435c;
  --tab-acordien: #14141e;
  --header-table-color: #22273b;
  --color-text-acordien: #fff;
  --field-bg: #22273b;
}

body.semon {
  --btns-header-svg: #000;
  --body-color: #fff;
  --color-R: #f5cbbc;
  --room-G: #f5cbbc;
  --color-menu-bar: #000;
  --color-text-content: #000;
  --color-text-menu: #fff;
  --color-G: #e8b54f;
  --box-color: #f5cbbc;
  --color-text-btn: #000;
  --content-G: #fff;
  --field-bg: #f5cbbc;
  --sidenav-G: #f5cbbc;
  --header-table-color: #f5cbbc;
  --tab-acordien: #fff;
  --color-text-acordien: #000;
}

body.green-color {
  --btns-header-svg: #000;
  --body-color: #fff;
  --color-R: #abd1b9;
  --color-menu-bar: #000;
  --color-G: #e8b54f;
  --room-G: #abd1b9;
  --box-color: #abd1b9;
  --content-G: #fff;
  --color-text-btn: #000;
  --color-text-content: #000;
  --color-text-menu: #fff;
  --sidenav-G: #abd1b9;
  --header-table-color: #abd1b9;
  --tab-acordien: #fff;
  --field-bg: #abd1b9;
  --color-text-acordien: #000;
}

body.bin {
  --btns-header-svg: #000;
  --body-color: #fff;
  --color-R: #bcd3e5;
  --color-menu-bar: #000;
  --room-G: #bcd3e5;
  --color-G: #e8b54f;
  --box-color: #bcd3e5;
  --color-text-btn: #000;
  --color-text-content: #000;
  --color-text-menu: #fff;
  --content-G: #fff;
  --color-text-content: #000;
  --sidenav-G: #bcd3e5;
  --tab-acordien: #fff;
  --field-bg: #bcd3e5;
  --header-table-color: #bcd3e5;
  --color-text-acordien: #000;
}

body .accordion {
  --bs-accordion-btn-active-icon: url("../img/icons/icon-collapse.svg");
  --bs-accordion-btn-icon: url("../img/icons/icon-collapse.svg");
}

body {
 /*   direction: rtl;*/
  text-align: start;
  background-color: var(--body-color);
  -webkit-font-smoothing: antialiased;
  -webkit-tap-highlight-color: transparent;
  text-rendering: optimizeLegibility;
  margin: 0;
  height: 100%;
  overflow-x: hidden;
}
a {
  text-decoration: none;
  color: inherit;

  &:focus {
    box-shadow: none !important;
  }
}

[dir="rtl"] {
  * {
    letter-spacing: normal !important;
  }
}

input::-webkit-input-placeholder {
  color: inherit;
}

input::placeholder {
  color: inherit;
}

iframe {
  border: none;
}

img {
  max-width: 100%;
  height: auto;
}

textarea {
  resize: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
  overflow-wrap: break-word;
  hyphens: auto;
}
p {
  margin: 0;
  padding: 0;
  line-height: 1.5;
  overflow-wrap: break-word;
  hyphens: auto;
}

ul {
  list-style: none;
  margin-block: 0;
  padding-inline-start: 0;
}
