/* From Freelancer bootstrap*/

:root,
[data-bs-theme=light] {
--bs-teal: #1abc9c;
  --bs-primary: #1abc9c;	
  --bs-secondary: #2c3e50;
   --bs-primary-rgb: 26, 188, 156;	
  --bs-secondary-rgb: 44, 62, 80;
    --bs-body-color-rgb: 33, 37, 41;	
  --bs-body-bg-rgb: 255, 255, 255;	
  --bs-font-sans-serif: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

.masthead .masthead-heading
 {
	 font-size: 3rem !important; 
}

.right-text {
    direction: rtl;
}

.reverse-order {
    display: flex;
    flex-direction: column-reverse;
}

.reverse-order > div {
    display: flex;
    flex-direction: column-reverse;
}

.reverse-order > div > div {
    display: flex;
    flex-direction: column-reverse;
}

.reverse-order > div > div > div {
    display: flex;
    flex-direction: column-reverse;
}

.reverse-order > div > div > div > div {
    display: flex;
    flex-direction: column-reverse;
}

[data-theme="dark"] {
  background-color: #111 !important;
  color: #eee;
}

[data-theme="dark"] .bg-black {
  background-color: #fff !important;
}

[data-theme="dark"] .bg-dark {
  background-color: #eee !important;
}

[data-theme="dark"] .bg-light {
  background-color: #222 !important;
}

[data-theme="dark"] .bg-white {
  background-color: #000 !important;
}

[data-theme="dark"] .bg-primary {
    background-color: #136857  !important;
	}

[data-theme="dark"] .btn-primary {
    background-color: #025242;
    border-color: #5a6a67;
}

[data-theme="dark"] .modal-content {
    background-color: #000;
}

[data-theme="dark"] container a {
    color: #09967a;
}

[data-theme="dark"] .searchinputdiv input {
    background: #e4e4e4;
    border-color: #6e6969;
}

.menu-icon {
  font-size: 2em; 
}

[data-theme="light"] .menu-icon {
  color: var(--bs-primary); 
}

[data-theme="dark"] .menu-icon  {
  color: #136857 ;
}

.regular-star {
  /* bunch of pretty styles, oh wow */
  &::after {
    content: url('/assets/svg/regular-star.svg');
  }
}

.solid-star {
  /* bunch of pretty styles, oh wow */
  &::after {
    content: url('/assets/svg/solid-star.svg');

  }
}

.tooltip-inner {
    text-align: left;
}


.ref {
display: none;  
}
.common-size-icon {
  margin-top: 3px; 
  height: 24px;
  width: 30px;
}

#countdown, #pause, #resume, #refreshLink {
    display: inline-block;
    margin-right: 2px;
}

.countdown-icon {
  height: 22px; 
  width: 22px;
}
.common-size-icon3 {
  margin-top: 3px; 
  height: 22px; 
  width: 22px;
}

.gray-icon {
  color: #989898;
  fill: #989898;
}


#scrollToTopBtn {
    border-radius: 15px;
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 100;
  opacity: 0.6;
}


html.dark #scrollToTopBtn #arrowImg,
body.dark #scrollToTopBtn #arrowImg,
body[data-theme="dark"] #scrollToTopBtn #arrowImg {
  filter: invert(1);
}

.form-check-inline {
 margin-right: 0rem !important; 
}

.toggle-button {
	 margin-right: 0.5rem !important;
}



.svgarrow {
  color: #D5D5D5;
}

#arrowImg {
margin-top: -10px; 
  margin-left: -3px; 
  margin-right: -3px; 
  margin-bottom: -3px;
  width: 15px;
  color: #D5D6D5;
}

.table-home-icon {
  margin-top: -3px; 
  margin-left: -3px; 
  margin-right: -3px; 
  height: 16px;
  width: 21px;
}

.table-theme-icon {
  margin-top: -3px; 
  height: 15px;
  width: 15px;
}



.home-svg-icon::before {
  content: url('/assets/svg/home-icon.svg');
}

#darkSwitch {
  transform-origin: center;
transform: rotate(180deg);
}

.tooltip-inner {
  max-width: 400px; /* Максимальная ширина */
 }


	hr {	
  background-color: currentColor;	
}
hr:not([size]) {	
  height: 0.125rem;	
}	

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {	
 
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";	
  font-weight: 700;	
}

	abbr[title],	
abbr[data-bs-original-title] {	
  -webkit-text-decoration: underline dotted;	
          text-decoration: underline dotted;	
  cursor: help;	
  -webkit-text-decoration-skip-ink: none;	
          text-decoration-skip-ink: none;	
}

	mark, .mark {	
  padding: 0.2em;	
  background-color: #fcf8e3;	
}

a.onmanin {
  color: #1abc9c;
  text-decoration: underline;
}

a.onmanin:hover {
  color: #15967d;
}
	pre,	
code,	
kbd,	
samp {	
  
  direction: ltr /* rtl:ignore */;	
  unicode-bidi: bidi-override;	
}

code {	
  color: #d63384;	
}

	kbd {	
  padding: 0.2rem 0.4rem;	
  color: #fff;	
  background-color: #212529;	
}	
kbd kbd {	
  font-weight: 700;	
}

caption {		
  color: #6c757d;	
}

	[list]::-webkit-calendar-picker-indicator {	
  display: none;	
}


/* star intead of checkbox for history*/
label {
            display: inline-block;
            position: relative;
            font-size: 20px;
            cursor: pointer;
        }

        label input[type="checkbox"] {
            display: none;
        }

        .custom-checkbox .glyphicon {
            color: gray;
            font-size: 1em;
            position: absolute;
            top: 0;
            left: 0;
        }

        .custom-checkbox input[type="checkbox"]:checked + .glyphicon {
            color: gold;
        }

/* star intead of checkbox for history end */


.img-thumbnail {	
  background-color: #fff;	
  border: 0.125rem solid #dee2e6;	
  border-radius: 0.5rem;	
}
	
.figure-caption {	
  color: #6c757d;	
}

	.container,	
.container-fluid,	
.container-xxl,	
.container-xl,	
.container-lg,	
.container-md,	
.container-sm {	
  padding-right: var(--bs-gutter-x, 0.75rem);	
  padding-left: var(--bs-gutter-x, 0.75rem);	
}

	.form-text {	

  color: #6c757d;	
}

.form-control {	
 /* color: #212529;	
  background-color: #fff;	
  border: 0.125rem solid #ced4da;	*/
  -webkit-appearance: none;	
     -moz-appearance: none;	
          appearance: none;	
  border-radius: 0.5rem;	
}

/*.toggle-switch {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 1000;
} */
#mainNav .navbar-brand {
  color: #fff;
}

#mainNav {
  padding-top: 1rem;
  padding-bottom: 1rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
}
#mainNav .navbar-brand {
  color: #fff;
}
#mainNav .navbar-nav {
  margin-top: 1rem;
}
#mainNav .navbar-nav li.nav-item a.nav-link {
  color: #fff;
}
#mainNav .navbar-nav li.nav-item a.nav-link:hover {
  color: #1abc9c;
}
#mainNav .navbar-nav li.nav-item a.nav-link:active, #mainNav .navbar-nav li.nav-item a.nav-link:focus {
  color: #fff;
}
#mainNav .navbar-nav li.nav-item a.nav-link.active {
  color: #1abc9c;
}
#mainNav .navbar-toggler {
  font-size: 80%;
  padding: 0.8rem;
}

/* Скрываем на мобильных */
@media (max-width: 1423px) {
    .hideOnMobile {
        display: none;
    }
    .hideOnMobile .divider-custom {
        display: none;
    }
}

@media (min-width: 1424px) {
  
    .hideOnMobile {
        display: block;
    }
    .hideOnMobile .divider-custom {
        display: block;
    }
}

@media (min-width: 992px) {
  

  #mainNav {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    transition: padding-top 0.3s, padding-bottom 0.3s;
  }
  #mainNav .navbar-brand {
    font-size: 1.75em;
    transition: font-size 0.3s;
  }
}
/*end of freelancer css */
 
.visually-hidden {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

#clearbtn {
  position: absolute;
  top: 53%;
  right: 3px;
  transform: translateY(-50%);
  font-size: 12px;
  transition: background-color 0.3s;
   /*   background-color: Transparent;
   color: blue;
  color: Transparent;
Добавляем плавный переход для изменения цвета фона */
}

#clearbtn .fas.fa-times {
  background: #254678;
background: linear-gradient(to top, #254678 0%, #3F74B8 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}


#clearbtn:hover .fas.fa-times {
  color: blue; /* Устанавливаем желаемый цвет иконки при наведении мыши */
}

.mainbutton {
  /*position: absolute; 
  right :35px; */
  z-index:999;
}

.searchinput {
  z-index: 9; 
  width: 100%;
}

.searchinputdiv {
	position: relative; 
	flex-grow: 1;
}

.searchbar {
  z-index:1;
}

/* .horiz-menu-item {
 color: #383838;
} */




    .level1 {
      margin-left: 0px;
      color: #3F424B;
    }

    .level2 {
      margin-left: 8px;
   /*  color: #3F424B; */
    }

    .level3 {
      margin-left: 13px;
      color: #3F424B;
    }

    .level4 {
      margin-left: 18px;
     /*  color: #3F424B;*/
    }

    .level5 {
      margin-left: 20px;
    }
	
	.btn-fixed-width {
  width: 30px; /* Замените на желаемую фиксированную ширину */
}

  .btn-rotate {
    transition: transform 0.3s ease;
  }

  .btn-rotate.rotate {
    transform: rotate(180deg);
  }

::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.9);
-webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,0.10),inset 0 -1px 0 rgba(0,0,0,0.07); }

.ui-autocomplete { 
max-height: 220px; 
min-height: 38px;
overflow-y: auto; 
overflow-x: hidden;
scrollbar-color: #5fbaa8 #10806A;
border-radius: 1rem;
max-width: 274px;
align-items: center;
}

.ui-autocomplete2 { 
max-height: 220px; 
min-height: 38px;
overflow-y: auto; 
overflow-x: hidden;
scrollbar-color: #5fbaa8 #10806A;
border-radius: 1rem;
max-width: 474px;
align-items: center;
}

.droponmain {
  height: 32px;
  padding: 3px 3px 3px 3px;
  background-color: #fff;
  background-clip: padding-box;
  border: 0.125rem solid #ced4da;
}


[data-theme="dark"] .droponmain {
    background: #e4e4e4;
    border-color: #6e6969; 
	border: 0.125rem solid #6e6969;
}

[data-theme="dark"] .border-primary {
    border-color: #6e6969 !important;
}


.roundedborder{
  position: absolute; 
  right :35px; 
  z-index:999999;
}
/*
.outlink {
  color:#0d6efd;
}
*/
/* Container holding the image and the text */
.imgcontainer {
  position: relative;
  text-align: center;
  color: white;
}

/* Centered text */
.centered {
  position: absolute;
  top: 15px;
  left: 15px;
  
}




.btn-primary {
  color: #fff;
  background-color: #16a085;
  border-color: #1abc9c;
}

	.form-check-input:active {
  filter: brightness(40%);
}

.form-check-input:focus {
  border-color: #8ddece;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(26, 188, 156, 0.25);
}

.form-check-input:checked {
  background-color: #16a085;
  border-color: #1abc9c; 
}


#mainNav .navbar-nav {
    margin-top: 0;
    text-align: center;
    white-space: nowrap;
}
 
.page-section {
    padding: 2rem 0 !important;
}

.masthead { 
	padding-bottom: 2rem;
	}

 @keyframes wheelHueColor {
    from, to { color: rgb(255,255,255); } 
    10%      { color: rgb(0,0,255); }
    35%      { color: rgb(255,255,0); }
    70%      { color: rgb(255,0,0); }
    90%      { color: rgb(255,255,255); }
}

.example:hover {
    color: rgb(255,255,255);
    animation: wheelHueColor 40s infinite;
    cursor: pointer;
    
}
.example {
  transition: 4s;
  transition: background-color 4s ease-out;
}
  
.lock:hover .icon-unlock,
.lock .icon-lock {
    display: none;
}
.lock:hover .icon-lock {
    display: inline;
}

.lock:hover .icon-lock .bigger {
   font-size: 200px;
}

.storeimg {
  width: 200px;
}


.imgonmain {
  width: 350px;  
/*    max-width: 95%; */
}

@media only screen and (max-width: 900px) {

#mainNav .navbar-toggler {
    margin-right: 2rem;  
}

#mainNav .navbar-nav {
	margin-top: 1.5rem;
	text-align: left;	
	}

.h5mobile {
	font-size: 0.8rem;	
}

    .masthead { 
    padding-top: calc(1rem + 20px);
	}
	


.divider-custom {
    margin: 0.5rem 0 1.2rem ;
}



.divider-custom {
    margin: 0.5rem 0 1.2rem ;
}

  
  .mobile-none {
	  display:none;	  
  }

.mobile-center {
  margin-left: auto;
  margin-right: auto;
  width: 50%;
  
}

video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }


.sidebar-social {
    margin: 0;
    padding: 0;
}

.sidebar-social ul {
    margin: 0;
    padding: 5px;
}

.sidebar-social li {
	  text-align: center;
    width: 31.9%;
    margin-bottom: 3px!important;
    background-color: #fff;
    border: 1px solid #eee;
    display: inline-block;
    font-size: 10px;
    padding:0;
}

.sidebar-social i {
  display: block;
  margin: 0 auto 10px auto;
	width: 32px;
    height: 32px;
    margin: 10px auto 0;
    line-height: 32px;
    text-align: center;
    font-size: 20px;
    color: #444444;
  margin-top:0;
  padding-top:5px;
}
.sidebar-social a{
  text-decoration:none;
  width:100%;
  height:100%;
  display:block;
  margin:0;
  padding:0;
}

.sidebar-social a span{
  color:black;
  font-size:10px;
  padding:5px 0 10px 0;
  display:block;
  text-transform:uppercase;
  font-family:'Josefin Sans';
  letter-spacing:1px;
}

}

@media (max-width: 768px) {
 
     .hideOnMobile {
        display: none;
    }
    .hideOnMobile .divider-custom {
        display: none;
    }
 
 
.imgonmain {
    max-width: 95%;
  }
   
   
       .level2 {
      margin-left: 0px;

    }
     .level3 {
      margin-left: 4px;

    }

    .level4 {
      margin-left: 8px;
     /* color: #3F424B;*/
    }

    .level5 {
      margin-left: 0px;
    }
	  
   
   
}


#pali p span {
  word-break: break-word;
        overflow-wrap: break-word;
}

.resultheader {
  word-break: break-word;
  overflow-wrap: break-word;
}



.fdgLink {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

.fdgLink::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -2px;
    bottom: -2px;
    background-color: transparent;
    transition: 
        background-color 0.5s ease-out,
        box-shadow 0.5s ease-out,
        opacity 0.5s ease-out,
        top 0.3s ease-out,
        bottom 0.3s ease-out,
        left 0.3s ease-out,
        right 0.3s ease-out;
    border-radius: 3px;
    opacity: 0;
    pointer-events: none;
}

/* Для десктопов - hover */
@media (hover: hover) {
    .fdgLink:hover::after {
        background-color: rgba(218, 66, 14, 0.6); /* Полупрозрачный вариант */
        top: -3px;
        bottom: -3px;
        left: -3px;
        right: -3px;
        box-shadow: 0 0 4px rgba(218, 66, 14, 0.6);
        opacity: 1;
    }
}

/* Яркое подтверждение при касании */
.fdgLink:active::after {
    background-color: rgba(218, 66, 14, 0.8); /* Полностью непрозрачный */
    box-shadow: 0 0 8px rgba(218, 66, 14, 0.9); /* Ярче свечение */
    top: -4px;
    bottom: -4px;
    left: -4px;
    right: -4px;
    opacity: 1;
    transition: 
        background-color 0.1s ease-out,
        box-shadow 0.1s ease-out,
        top 0.1s ease-out,
        bottom 0.1s ease-out,
        left 0.1s ease-out,
        right 0.1s ease-out; /* Очень быстрое появление */
}

/* Для тач-устройств - фокус после касания */
.fdgLink:focus::after {
    background-color: rgba(218, 66, 14, 0.3);
    top: -3px;
    bottom: -3px;
    left: -3px;
    right: -3px;
    box-shadow: 0 0 4px rgba(218, 66, 14, 0.3);
    opacity: 1;
    outline: none;
    transition-duration: 0.5s; /* Медленное затухание */
}

/* Убираем фокус для мыши */
@media (hover: hover) {
    .fdgLink:focus::after {
        background-color: transparent;
        box-shadow: none;
        opacity: 0;
    }
}


   .bubble-notification {
      position: fixed;
      bottom: 8%;
      left: 50%;
  /*  outline: 2px solid white; */
    box-shadow: 0 0 5px black;
      background: #136857;
      color: white;
      padding: 12px 20px;
      border-radius: 24px;
      font-size: 14px;
      opacity: 0;
      transform: translate(-50%, 20px);
      transition: all 0.3s ease;
      z-index: 100000;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
      display: flex;
      align-items: center;
      gap: 8px;
      pointer-events: none;
      max-width: 80%;
      text-align: center;
      white-space: nowrap;
    }
    
    .bubble-notification.show {
      opacity: 1;
      transform: translate(-50%, 0);
    }
    
    .bubble-notification::before {
      content: "";
      font-size: 16px;
    }



/* Базовые стили баннера */
.pwa-install {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 12px;
  border-radius: 12px;
  padding: 12px 16px;
  z-index: 1000;
  max-width: calc(100% - 32px);
  min-width: 280px;
  width: auto;
  /*  box-sizing: border-box;
  
 Светлая тема по умолчанию */
  background-color: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  
  transition: all 0.3s ease;
  will-change: transform, opacity;
  touch-action: none;
}

/* Темная тема */
.dark-mode .pwa-install,
.bg-dark .pwa-install,
[data-bs-theme="dark"] .pwa-install {
  background-color: var(--bs-secondary);
  border-color: var(--bs-border-color-translucent);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* Скрытое состояние */
.pwa-install.hidden {
  opacity: 0;
  visibility: hidden;
  transform: translateX(-50%) translateY(20px);
}

/* Основной контент */
.pwa-install-content {
  display: flex;
  align-items: center;
  flex-grow: 1;
  min-width: 0;
  gap: 12px;
  overflow: hidden;
}

/* Иконка приложения */
.pwa-install .icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  background-color: var(--bs-tertiary-bg);
  flex-shrink: 0;
  background-size: cover;
  background-position: center;
}

/* Текстовый блок */
.pwa-install .text {
  min-width: 0;
  flex-grow: 1;
}

.pwa-install .text h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--bs-heading-color);
 
}

.pwa-install .text p {
  margin: 2px 0 0;
  font-size: 13px;
  color: var(--bs-secondary-color);
 
}

/* Контейнер кнопок действий */
.pwa-install .actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  align-items: center;
}

/* Общие стили кнопок */
.pwa-install button {
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  border-radius: 20px;
  cursor: pointer;
  border: none;
  transition: all 0.2s ease;
  outline: none;
  line-height: 1.2;
}

/* Кнопка установки */
#installBtn {
  background: var(--bs-secondary);
  color: var(--bs-white);
}

#installBtn:hover {
  background: var(--bs-primary);
}

#installBtn:active,
#installBtn:focus {
  background: var(--bs-primary);
  box-shadow: 0 0 0 3px rgba(var(--bs-secondary-rgb), 0.3);
}

/* Кнопка закрытия */
#closePwaBanner {
  background: transparent;
  color: var(--bs-secondary-color);
  padding: 6px;
  font-size: 16px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s ease;
}

#closePwaBanner:hover {
  color: var(--bs-emphasis-color);
  background: var(--bs-tertiary-bg);
}

#closePwaBanner:active,
#closePwaBanner:focus {
  box-shadow: 0 0 0 3px rgba(var(--bs-secondary-color-rgb), 0.2);
}

/* Темная тема для кнопок */
.dark-mode #installBtn,
.bg-dark #installBtn,
[data-bs-theme="dark"] #installBtn {
  background: #136857;
}

.dark-mode #installBtn:hover,
.bg-dark #installBtn:hover,
[data-bs-theme="dark"] #installBtn:hover {
  background: var(--bs-primary);
}

.dark-mode #closePwaBanner,
.bg-dark #closePwaBanner,
[data-bs-theme="dark"] #closePwaBanner {
  color: var(--bs-secondary-color-dark);
}

.dark-mode #closePwaBanner:hover,
.bg-dark #closePwaBanner:hover,
[data-bs-theme="dark"] #closePwaBanner:hover {
  color: var(--bs-emphasis-color-dark);
  background: var(--bs-tertiary-bg-dark);
}

/* Адаптация для мобильных устройств */
@media (max-width: 400px) {
  .pwa-install {
    flex-wrap: wrap;
    padding-bottom: 12px;
  }
  
  .pwa-install-content {
    width: 100%;
    margin-right: 0;
  }
  
  .pwa-install .actions {
    width: 100%;
    justify-content: flex-end;
    order: 2;
  }
  
  #closePwaBanner {
    position: absolute;
    top: 8px;
    right: 8px;
  }
  
  .pwa-install .text h2,
  .pwa-install .text p {
    padding-right: 24px; /* Чтобы текст не заходил под кнопку закрытия */
  }
}

/* Особый случай для очень узких экранов */
@media (max-width: 300px) {
  .pwa-install {
    min-width: auto;
    width: calc(100% - 32px);
  }
  
  .pwa-install .actions {
    flex-direction: column;
    width: 100%;
  }
  
  #installBtn {
    width: 100%;
  }
}






select.text-center {
    text-align: center;          /* Центрирует текст по умолчанию */
    text-align-last: center;     /* Центрирует только выбранный элемент */
}

select.text-center option {
    text-align: left;            /* Опции при раскрытии — по левому краю */
}


.cta-img {
  max-width: 200px !important;
}


/* Основной скроллбар */
::-webkit-scrollbar {
  width: 8px; /* Толщина скроллбара */
  height: 8px; /* Для горизонтального (если нужно) */
}


[data-bs-theme="dark"]
::-webkit-scrollbar {
  background: rgb(38, 38, 38, 0,9); /* Полупрозрачный серый */
  width: 8px; /* Толщина скроллбара */
  height: 8px; /* Для горизонтального (если нужно) */
}


/* Ползунок (thumb) */
::-webkit-scrollbar-thumb {
  background: rgba(100, 100, 100, 0.9); /* Полупрозрачный серый */
  border-radius: 4px; /* Закругление углов */
  transition: background 0.2s ease; /* Плавное изменение цвета */
}

/* Ползунок при наведении */
::-webkit-scrollbar-thumb:hover {
  background: rgba(100, 100, 100, 0.7); /* Становится темнее */
}

/* Ползунок при наведении - темная тема */
[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(220, 220, 220, 0.7); /* Ярче при наведении */
}

/* Дорожка (track) */
::-webkit-scrollbar-track {
  background: rgba(240, 240, 240, 0.5); /* Светлая подложка */
  border-radius: 4px; /* Закругление углов */
}

/* Угол скроллбара (если есть горизонтальный и вертикальный) */
::-webkit-scrollbar-corner {
  background: transparent; /* Прозрачный угол */
}


html {
  scrollbar-width: thin; /* "auto" | "thin" | "none" */
  scrollbar-color: rgba(100, 100, 100, 0.5) rgba(240, 240, 240, 0.5); /* thumb track */
}

[data-bs-theme="dark"] html {
  scrollbar-width: thin; /* "auto" | "thin" | "none" */
  scrollbar-color: rgba(38, 38, 38, 0.5) rgba(240, 240, 240, 0.5); /* thumb track */
}


/* Для WebKit (Chrome, Safari, Edge) */
[data-bs-theme="dark"] ::-webkit-scrollbar {
  width: 12px !important;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
  background: #555 !important;
  border-radius: 6px !important;
  border: 2px solid #333 !important;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-track {
  background: #222 !important;
  border-radius: 6px !important;
}

[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #666 !important;
}

/* Для Firefox */
[data-bs-theme="dark"] {
  scrollbar-width: thin !important;
  scrollbar-color: #555 #222 !important;
}

 input.searchinput-read {
  min-width: 230px !important;
}

@media (max-width: 768px) {
  input.searchinput-read {
    max-width: 230px !important;
  }
}



/* Делаем родительские элементы контекстом для позиционирования */
.pli-lang, .rus-lang, .eng-lang, .variant {
  position: relative;
}

p .quoteLink,
p .quoteLink-start {
    font-size: 1.2em; /* или другой желаемый размер */
}

a.quoteLink::before,
a.quoteLink-start::before {
  content: '✦';
}


.quoteLink {
      opacity: 0;
}

.quoteLink-start {
    position: absolute;
    top: -0.2em;
    left: -1.0em;

    color: inherit;
    opacity: 0;
    text-decoration: none;
    cursor: pointer;
    transition: opacity 0.3s ease;
}
.quoteLink:hover,
.quoteLink:focus,
.quoteLink-start:hover,
.quoteLink-start:focus {
    opacity: 0.9;
}

#pali td {
    white-space: normal;
    word-break: break-word;
}

#pali tr:not(.child) td:first-child {
    white-space: nowrap;
}

#pali tr:not(.child) td:nth-child(2) {
    white-space: normal !important;
}

/*
#pali td:first-child {
    white-space: nowrap;
}


#pali > tbody > tr > td:first-child:last-child {
  white-space: normal;
}
*/