/* Add your css code here */
/*
Variable Definitions:
  --r-bg: Region background color. Sets the overall background color of the region wrapper.
  --r-tx: Region text color. Sets the default text color for all paragraph and inline text within the region.
  --r-h1: Region heading color. Specifically sets the color for headings (h1, h2, h3) within the region, allowing heading color control independently from body text.
  --r-lk: Region link color. Sets the color for anchor (<a>) links within the region in their normal (non-hover) state.
  --r-lk-h: Region link hover color. Sets the color of links within the region when hovered or focused, providing clear interactive feedback.
  --r-br: Region border color. Sets the border color for the region, useful for visual separation of sections.
  --r-bg-fr: Form background color within the region. Sets the background color specifically for input forms (e.g., login forms, search bars) within the region, enabling clear visual separation of form areas.
  --r-tx-lk: Menu link text color within the region. Sets the text color for menu links in navigation blocks or region-based menus, ensuring consistency with your theme’s navigation design.
  --r-tx-lk-h: Menu link hover text color within the region. Sets the hover or focus color for menu link text, aiding in clear navigation feedback for users.
  --r-bg-lk: Menu link background color within the region. Sets the background color of menu links in their normal state within the region for better menu styling control.
  --r-bg-lk-h: Menu link background hover color within the region. Sets the background color for menu links on hover/focus, ensuring clear user interaction indication.
  --r-tx-bt:  Button text color within the region. Sets the text color for buttons within the region (e.g., call-to-action buttons, form submit buttons).
  --r-tx-bt-h: Button text hover color within the region. Sets the text color for buttons when hovered/focused, providing interactive feedback.
  --r-bg-bt: Button background color within the region. Sets the background color for buttons in their normal state, aligning them visually with your design system.
  --r-bg-bt-h:  Button background hover color within the region. Sets the background color for buttons on hover/focus, improving interactivity and user experience.
*/

/*
Regions Names, each region has an ID and a Class with the same name.
You can use .page-wrapper or #page-wrapper
#page-wrapper {}
#primary-sidebar-menu {}
#fixed-search-block {}
#popup-login-block {}
#header {}
#primary-menu {}
#welcome-text {}

#top-container {}
#top-box-first {}
#top-box-second {}
#top-box-third {}

#system-messages {}
#breadcrumb {}
#page-title {}

#main-container {}
#sidebar-box-first {}
#sidebar-box-main {}
#sidebar-box-second {}

#bottom-container {}
#bottom-box-first {}
#bottom-box-second {}
#bottom-box-third {}
#bottom-box-fourth {}

#footer-container {}
#footer-box-first {}
#footer-box-second {}
#footer-box-third {}

#footer-menu {}
#copyright {}

Examples:

#page-wrapper {
  background-color: var(--r-bg);
  color: var(--r-tx);
  border-color: var(--r-br);
}

h1, h2, h3 {
  color: var(--r-h1);
}

a:not(li.nav__menu-item a) {
  color: var(--r-lk);
  color: var(--r-lk-h);
}

input:not(.button) {
  background-color: var(--r-bg-fr);
}

li.nav__menu-item a {
  color: var(--r-tx-lk);
  background-color: var(--r-bg-lk);
}

li.nav__menu-item a:hover {
  color: var(--r-tx-lk-h);
  background-color: var(--r-bg-lk-h);
}

button:not(li.nav__menu-item button) {
  color: var(--r-tx-bt);
  background-color: var(--r-bg-bt);
}

button:not(li.nav__menu-item button):hover {
  color: var(--r-tx-bt-h);
  background-color: var(--r-bg-bt-h);
}
https://www.drupal.org/docs/extending-drupal/themes/contributed-themes/solo/instructions-for-developers-on-using-colors-in-solo-theme
*/

/* Статьи */
.articles007{ display: grid; padding: 1em; gap: 0px 14px; }
.articles007 .views-field-field-foto{ grid-column: 1 / 2; grid-row: 1 / 8; }
.articles007 .views-field-title{ grid-column: 2 / 8; grid-row: 1 / 2; }
.articles007 .views-field-field-avtor{ grid-column: 2 / 8; grid-row: 2 / 3; }
.articles007 .views-field-body{ grid-column: 2 / 8; grid-row: 3 / 4;     text-align: justify;}
.articles007 .views-field-body p, .articles007 .views-field-field-avtor p{margin-top: 0!important; margin-bottom: 0!important; }
.articles007 .views-field-title h4{ margin-bottom: 0!important;}

@media (max-width: 61.9988rem) {
.articles007 .views-field-field-foto{ grid-column: 1 / 2; grid-row: 1 / 3; }
.articles007 .views-field-title{ grid-column: 2 / 3; grid-row: 1 / 2; }
.articles007 .views-field-field-avtor{ grid-column: 2 / 3; grid-row: 2 / 3; }
.articles007 .views-field-body{ grid-column: 1 / 3; grid-row: 3 / 4;}	 

}

.actualnoe007{ display: grid; padding: 1em; gap: 10px; grid-template-columns: repeat(5, 1fr);}
.actualnoe007 .views-field-field-foto-1{ grid-column: 1 / 2; grid-row: 1 / 5; }
.actualnoe007 .views-field-field-sobesednik{ grid-column: 2 / 6; grid-row: 1 / 2; }
.actualnoe007 .views-field-field-tema{ grid-column: 2 / 6; grid-row: 2 / 3; }

.views-field-field-ikonka img{ float: left; margin-right: 5px; margin-top: 0px; margin-bottom: 10px;}
.view-rubrikator .views-field-name{ margin-top: 5px; }



.page-wrapper .login-button-open, .page-wrapper .hamburger-icon button, .page-wrapper .main-navigation-wrapper, .page-wrapper .main-navigation-wrapper ul, .page-wrapper .main-navigation-wrapper li, .page-wrapper .header li.nav__menu-item>a, .page-wrapper .main-navigation-wrapper li>a, .page-wrapper .header li.nav__menu-item>button, .page-wrapper .main-navigation-wrapper li>button {
    --r-br: #316347;
    --r-bg: #3b7a57;
    --r-tx: #040705;
}

.page-wrapper a:not(.nav__menu-link, .button, .site-name-link, .site-logo, h1 a, h2 a, h3 a) {
    color: #153a82;
}
.page-wrapper a:hover:not(.nav__menu-link, .button, .site-name-link, .site-logo, h1 a, h2 a, h3 a) {
    --r-tx: #7686bb;
}
header.header, div.page-title.lone {
    --r-tx: #fff;
    --r-bg: linear-gradient(180deg, #153683, #153b81);
    background: var(--r-bg);
}
.page-wrapper h1:not(.page-title-text), .page-wrapper h2, .page-wrapper h3, .page-wrapper h1 a, .page-wrapper h2 a, .page-wrapper h3 a, .page-wrapper h1 a span, .page-wrapper h2 a span, .page-wrapper h3 a span, .page-wrapper .site-name, .page-wrapper .site-slogan, .page-wrapper .site-name-link {
    --r-tx: #ef7f1a;
}

.page-wrapper li.nav__menu-item > a, .page-wrapper li.nav__menu-item > button, .page-wrapper .login-button-open, .page-wrapper .hamburger-icon button, .block-user-login-block form + .item-list ul li a {
      border-color: transparent;
    color: #fff;
    background-color: transparent;
}

.page-wrapper .login-button-open:hover, .page-wrapper .hamburger-icon button:hover, .page-wrapper .header ul li.nav__menu-item>*:hover, .page-wrapper .main-navigation-wrapper li>*:hover{
	--r-tx: #142a1e;
    --r-bg: #fff;
}
h1.page-title-text {
    font-size: calc(2 * var(--solo-px16));
    line-height: calc(2 * var(--solo-px22));
}
#page-wrapper .animate-solo-solar-flare, #header.animate-site-solar-flare a.site-name-link, #page-wrapper.animate-title-solar-flare .page-title-text, #page-wrapper.animate-title-solar-flare .page-title-text span {
    background: linear-gradient(45deg, #fad717, #fa8901, #e36f06, #fa8901, #fad717);
}

/*          Статьи           */
.views-field-field-avtor {font-size: var(--solo-px15); font-style: italic;}
.views-field-title h4{font-weight: bold; margin-top: 0;}
.views-field-field-foto {margin-top: 10px;}

/*                           */
/*      Автор                */
.node--type-avtor .node__content{display: grid; padding: 0 1em; gap: 0px 14px; grid-template-columns: repeat(8, 1fr);}
.node--type-avtor .field--name-field-foto{grid-column: 1 / 2;margin-block-end: 0;}
.node--type-avtor .contentbody2{grid-column: 2 / 8;}
.node--type-avtor .contentbody2	h4{color: #ef7f1a;/*var(--r-lk, var(--r-tx)); font-weight: 600;*/}
.node--type-avtor .contentbody2 p{line-height: var(--solo-px10);}
/*                           */
.breadcrumb, .copyright{
	    background: #ffffff;
}


.node--type-article table tr td, .node--type-article table {border: 1px solid hsl(0deg 0.79% 78.57%)!important; ;}
 .node--type-article table {width:100%!important;}
 .node--type-article table td li {   list-style: auto!important;}
 .node--type-article .field--name-body p{text-indent: 35px;}
  .node--type-article li p, .field--name-field-avtor p{text-indent: 0px!important;}
 
 
.field--name-field-avtor .node__content{
	align-items: center;
}
 
 .top-container .top-box-inner {
   /* --r-bg: linear-gradient(180deg, #f9cba3, #f9cb9f);
    background: transparent;*/
	    --r-bg: linear-gradient(180deg, #c8d3f1, #c8d3f1);
    background: var(--r-bg);
}
.view-tema-nomera .views-label-field-tema-nomera, .view-tema-nomera .views-label-field-tema-sleduyushchego-nomera{font-weight: bold; color: #153a82;} 
.view-tema-nomera .views-field-name{font-weight: bold; color: #153a82; font-size: 20px;}
#block-solo-subtheme-views-block-tema-nomera-block-1{margin: 1em 0;} 
#footer-container{background: none;}
.bottom-container .bottom-box-inner, .footer-container .footer-box-inner { 
	    --r-bg: linear-gradient(180deg, #c8d3f1, #b9c7eb); /*--r-bg: linear-gradient(180deg, #f9cba2, #f9cba1);*/
    background: var(--r-bg);
}
#footer-container-inner p{text-align: center; margin: 0;} 
#footer-container-inner p a{text-transform: uppercase;}
#footer-container.solo-outer .region-inner	{padding: var(--solo-gap)!important;}
 
 #header-inner{
	background-image: url(/themes/contrib/solo/images/liniya1.png);
    background-position: 50px 116px;
    background-origin: border-box;
    background-repeat: repeat-x;
    /* border-left: 0px solid transparent; */
    background-clip: content-box;
 }
 
 #sidebar-button-open{display:none;}
 @media (max-width: 61.9988rem) {
	 #header-inner{background-position: 50px 194px;!important}
	 #sidebar-button-open{display:block!important;}
	 #block-solo-subtheme-main-menu{display:none;}
 }
.page-wrapper .login-button-open, .page-wrapper .hamburger-icon button, .page-wrapper .main-navigation-wrapper, .page-wrapper .main-navigation-wrapper ul, .page-wrapper .main-navigation-wrapper li, .page-wrapper .header li.nav__menu-item>a, .page-wrapper .main-navigation-wrapper li>a, .page-wrapper .header li.nav__menu-item>button, .page-wrapper .main-navigation-wrapper li>button{--r-br: #154b9b; --r-bg: #153a82; --r-tx: #040705;} 
 /****   Верхние блоки  ****/
#top-container-inner{  padding-top: 0;}
.solo-outer .region-inner{padding-top: 0;}
#block-solo-subtheme-views-block-tema-nomera-block-2, #block-solo-subtheme-vyborchitateley, #block-solo-subtheme-vyborredakcii{
	background: #c8d3f1;
    
 }
 #block-solo-subtheme-vyborchitateley p, #block-solo-subtheme-vyborredakcii p{ margin: 0; }
#block-solo-subtheme-views-block-222-materialy-nomera-block-2, #block-solo-subtheme-views-block-tema-nomera-block-1, #block-solo-subtheme-views-block-tema-nomera-block-3{background: #c8d3f1/*#d1d0e7var(--r-bg)*/;}
#block-solo-subtheme-views-block-222-materialy-nomera-block-2  .articles007{  padding-top: 0; padding-bottom: 0; font-style: italic; }
 /****               *******/
 #block-solo-subtheme-views-block-rubrikator-block-1{
	position: sticky;
    top: 0;
    right: 0; 
 }
#block-solo-subtheme-views-block-tema-nomera-block-1 b{    color: #153a82;}
 #block-solo-subtheme-views-block-222-materialy-nomera-block-2 span{float: right; color: #153882;}

#top-box-first .region-inner {padding: var(--solo-gap);}
 
.vvjs .slide-indicators > button, .vvjs .nav-dots-numbers > button{
	background: rgb(21 56 131);
} 
.vvjs .vvjs-items > .vvjs-item p::before {
  content: "\1F4D1";
  left: -25px;
  top: -20px ;
}
 .vvjs-item-inner p::after {
  bottom: -16px;
  content: "\00BB";
  right: -25px;
}
.vvjs-item-inner p::before,
.vvjs-item-inner p::after {
  display: block;
  color: #8A0000;
  font-size: 50px;
  position: absolute;
}
 ul li p{    margin: 0;}
html, body{line-height: var(--solo-px26);}

/*  Кнопки справа */
 a.glossy-button{color: #fff!important; text-transform: uppercase;}
#footer-container.solo-outer .region-inner{padding: 0!important }
.bottom-container .bottom-box-inner, .footer-container .footer-box-inner{background: transparent;}
 
 .glossy-button {
  /* Важно для ссылок: превращаем в блочный элемент */
  display: inline-block;
  text-align: center;
  text-decoration: none; /* Убираем подчеркивание ссылки */
  position: relative;
  padding: 18px 60px;
  font-weight: bold;
  color: white;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  overflow: hidden;
  width: 100%;
 background: #f2953e;
  /* background: linear-gradient(to bottom, #ef7f1a 0%, #ffa94d 100%); box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.3), 0 8px 20px rgba(255, 146, 43, 0.2);*/
   transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.glossy-button2 {
  /* Важно для ссылок: превращаем в блочный элемент */
  display: inline-block;
  text-align: center;
  text-decoration: none; /* Убираем подчеркивание ссылки */
  position: relative;
  padding: 18px 60px;
 
  color: white;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  overflow: hidden;
  width: 100%;
 background: #bfcced;
  /* background: linear-gradient(to bottom, #ef7f1a 0%, #ffa94d 100%); box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.3), 0 8px 20px rgba(255, 146, 43, 0.2);*/
   transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Оставляем все эффекты ::before и ::after из предыдущего шага */
.glossy-button::after, .glossy-button2::after{
  content: "";
  position: absolute;
  top: 5px;
  left: 15px;
  width: 40px;
  height: 10px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  filter: blur(2px);
  pointer-events: none;
}

.glossy-button::before, .glossy-button2::before {
  content: "";
  position: absolute;
  top: 0;
  left: -150%;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    120deg, 
    transparent, 
    rgba(255, 255, 255, 0.5), 
    transparent
  );
  transform: skewX(-30deg);
  transition: none;
}

.glossy-button:hover::before, .glossy-button2:hover::before {
  left: 150%;
  transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}

.glossy-button:hover{
  transform: translateY(-3px) scale(1.02);
  filter: brightness(1.2);
  color: white; /* Чтобы цвет текста не менялся при наведении (для некоторых браузеров) */
}
 .glossy-button2:hover {
  transform: translateY(-3px) scale(1.02);
  filter: brightness(1.0);
  color: white; /* Чтобы цвет текста не менялся при наведении (для некоторых браузеров) */
}
.glossy-button:active, .glossy-button2:active {
  transform: translateY(1px);
  filter: brightness(0.9);
}

 
#block-solo-subtheme-main-menu, #search-button-open {    margin-top: 2.3em;}
.page-wrapper .header ul li.nav__menu-item>*:hover{--r-tx: #fff;     --r-bg: transparent;     border-bottom: 2px solid #fff;} 
 .solo-inner ul.navigation__menubar li.is-active>a{border-bottom: 2px solid #fff;}
 
 .page-wrapper blockquote{border-color: #e57b1f; padding: 0;}
 .vvjs .nav-dots-numbers{    margin-block-start: 0;}
 
 
 
 
.field--name-body img{
	display: inline-block;
    height: 250px;
    width: auto;
    text-align: center;
	margin: 0 0.5rem;
}

/* Полосатый список */
/ul.striped-list li:nth-child(odd) { background-color: rgba(0,0,0,0.05); }
ul.striped-list li { padding: 5px 10px; list-style-position: inside; }
ul.striped-list {
  list-style: none;
  padding: 0;
  margin: 1em 0;
 /* border: 1px solid #e0e0e0;  Тонкая рамка вокруг всего списка */
}

/* Стили для всех строк списка */
ul.striped-list li {
  padding: 10px 15px; /* Внутренние отступы строк */
  margin: 0;
  border-bottom: 1px solid #eee; /* Разделитель между строками */
}

/* Убираем границу у последней строки */
ul.striped-list li:last-child {
  border-bottom: none;
}

/* Раскрашиваем нечетные строки (полоски) */
ul.striped-list li:nth-child(odd) {
  background-color: #f9f9f9; /* Светло-серый цвет */
}

/* Раскрашиваем четные строки (по желанию) */
ul.striped-list li:nth-child(even) {
  background-color: #ffffff; /* Белый цвет */
}

/* Эффект при наведении (опционально) */
ul.striped-list li:hover {
  background-color: #f0f7ff; /* Подсветка при наведении мыши */
}
/* Список с галочками */
/*ul.check-list { list-style: none; padding-left: 0; }
ul.check-list li::before { content: "✔ "; color: #28a745; font-weight: bold; margin-right: 8px; }*/

 /* Убираем кружочки и обнуляем стандартные отступы */
ul.no-markers {   list-style: none;}
 
.bottom-container, .footer-container, .footer-menu{    --r-tx: #fff;
    --r-bg: linear-gradient(180deg, #153683, #153b81);
    background: var(--r-bg);} 
#block-solo-subtheme-podval .field--name-body p{color:#ffffff;}
#block-solo-subtheme-podval .field--name-body a{color:#ffffff; text-decoration: underline;}
.page-wrapper p{    --r-tx: #0f1e16; color: var(--r-tx, var(--r-tx-dark));} 
#footer-menu-inner, #block-solo-subtheme-podval{padding-top:0; margin-top:0;} 
#footer-container{--r-bg: linear-gradient(90deg, #d7ddf1, #e7eff2); background: var(--r-bg);}