/*!
Theme Name: LakEnd Theme
Theme URI: http://underscores.me/
Author: 8jorn
Author URI: http://lakend.ru
Description: main minimalist theme
Version: 1.3.1
Tested up to: 6.8
Requires PHP: 8.2
Requires mySQL: 8.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: lakend
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

LakEnd Theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* ===== FONTS ===== */
@font-face {
  font-family: "Raleway";
  src:
    url("/font/raleway.woff2") format("woff2"),
    url("/font/raleway.otf") format("opentype");
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

@font-face {
  font-family: "Jura";
  src:
    url("/font/jura.woff2") format("woff2"),
    url("/font/jura.otf") format("opentype");
  font-style: normal;
  font-weight: normal;
  text-rendering: optimizeLegibility;
}

/* ===== RESET & BASE ===== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background: #202123 url("/media/main-img/fon2.svg") no-repeat center / auto
    100%;
  color: #fff;
  font:
    1rem/1.5 "Raleway",
    sans-serif;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/* ===== LAYOUT ===== */
#page {
  flex: 1;
  display: flex;
  flex-direction: column;
}

header,
footer {
  flex: 0 0 auto;
  width: 95%;
  max-width: 1080px;
  margin: 0 auto;
  padding: 0;
}

main {
  flex: 0.75;

  width: 95%;
  max-width: 1080px;

  min-height: 75vh;
  max-height: 83vh;
  height: 85%;

  margin: 10px auto;
  padding: 0 10px;
  background-color: rgba(20, 21, 23, 0.66);
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  overflow-y: auto;
  overflow-x: hidden;
  /* Scrollbar styles */
  scrollbar-width: thin;
  scrollbar-color: #c1c1c1 transparent;
}

main::-webkit-scrollbar {
  width: 8px;
}

main::-webkit-scrollbar-track {
  background: transparent;
}

main::-webkit-scrollbar-thumb {
  background-color: #c1c1c1;
  border-radius: 4px;
}

aside {
  width: 95%;
  max-width: 1080px;
  margin: 0 auto;
}

.widget-area {
  flex-shrink: 0;
}

/* ===== TYPOGRAPHY ===== */
h1,
h2,
h3,
h4,
h5,
h6 {
  clear: both;
  margin: 0.67em 0;
}

h1 {
  font-size: 2em;
}

p {
  margin-bottom: 1.5em;
}

hr {
  background-color: #202123;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

pre,
code,
kbd,
samp {
  font-family: "Jura", monospace;
  font-size: 1em;
}

code {
  color: #aaa;
}

pre {
  background-color: rgba(20, 21, 23, 0.66) !important;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

/* ===== LINKS ===== */
a {
  color: #ddd;
  text-decoration: none;
  background-color: transparent;
}

a:visited {
  color: #eee;
}
a:hover,
a:focus,
a:active {
  color: #00ff00;
}
a:focus {
  outline: thin dotted;
}
a:hover,
a:active {
  outline: 0;
}

/* ===== IMAGES ===== */
img {
  border-style: none;
  height: auto;
  max-width: 100%;
  border-radius: 1%;
}

.menu-logo {
  width: 36px;
  margin: 0 6px;
}

.menu-logo:hover,
.menu-logo:focus,
.menu-logo:active {
  background-color: #00ff00;
  border-radius: 12px;
}

/* ===== FORMS ===== */
button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
input {
  overflow: visible;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  appearance: button;
  border: 1px solid;
  border-color: #ccc #ccc #bbb;
  border-radius: 3px;
  background: #e6e6e6;
  color: rgba(0, 0, 0, 0.8);
  line-height: 1;
  padding: 0.6em 1em 0.4em;
}

button:hover,
[type="button"]:hover,
[type="reset"]:hover,
[type="submit"]:hover {
  border-color: #ccc #bbb #aaa;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea {
  color: #666;
  /* border: 1px solid #ccc; */
  border-radius: 3px;
  padding: 3px;
  width: 100%;
}

input:focus,
textarea:focus {
  color: #eee;
}

/* ===== NAVIGATION ===== */
.main-navigation {
  display: block;
  width: 100%;
  font-size: 1em;
}

.main-navigation ul {
  display: flex;
  list-style: none;
  margin: 0;
  padding-left: 0;
}

.main-navigation li {
  position: relative;
  padding: 5px 15px;
  margin: auto 0;
}

.main-navigation a {
  display: block;
  text-decoration: none;
  font-weight: bold;
}

/* ===== UNIFIED SUB-MENU STYLES ===== */
.main-navigation ul ul,
.main-navigation ul ul .sub-menu {
  position: absolute;
  top: 100%;
  left: -999em;
  min-width: 200px;
  background-color: rgba(17, 17, 17, 0.9);
  backdrop-filter: blur(25px);
  border: 1px solid rgba(221, 221, 221, 0.2);
  border-radius: 10px;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.3);
  z-index: 99999;
  white-space: nowrap;
}

.main-navigation ul ul .sub-menu {
  transform: translateY(85%);
  top: 0;
}

.main-navigation ul ul li {
  width: 100%;
}

.main-navigation ul ul a {
  display: block;
  padding: 10px 15px;
  white-space: nowrap;
}

.main-navigation ul ul a:hover {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 10px;
}

/* Sub-menu interactions */
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul,
.main-navigation ul ul li:hover > ul,
.main-navigation ul ul li.focus > ul {
  left: auto;
  background-color: rgba(20, 21, 23, 0.9);
  backdrop-filter: blur(25px);
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}

/* Remove duplicate .sub-menu styles */
/* .sub-menu { */
/* Styles are now inherited from .main-navigation ul ul */
/* } */

/* ===== HEADER SEARCH ===== */
.header-right {
  display: flex;
  align-items: center;
  gap: 20px;
}

.header-search {
  display: flex;
  align-items: center;
}

.header-search .search-form {
  position: relative;
}

.header-search .search-field {
  padding: 8px 35px 8px 12px;
  border: 1px solid #3a3a3a;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  width: 180px;
  transition: all 0.3s ease;
}

.header-search .search-field:focus {
  width: 220px;
  background: rgba(255, 255, 255, 0.15);
  border-color: #0073aa;
}

.header-search .search-submit {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ddd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E")
    no-repeat center;
  background-size: 16px 16px;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 24px;
  height: 24px;
  display: block !important;
  text-indent: -9999px;
}

.header-search .search-submit:hover {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
}

/* ===== MOBILE MENU TOGGLE ===== */
.menu-toggle {
  display: none;
  background: none;
  border: 1px solid #ddd;
  padding: 8px 12px;
  cursor: pointer;
  color: #fff;
}

.menu-toggle-icon {
  display: inline-block;
  width: 20px;
  height: 2px;
  background: #fff;
  position: relative;
  margin-left: 5px;
}

.menu-toggle-icon::before,
.menu-toggle-icon::after {
  content: "";
  position: absolute;
  width: 20px;
  height: 2px;
  background: #fff;
  left: 0;
}

.menu-toggle-icon::before {
  top: -6px;
}
.menu-toggle-icon::after {
  bottom: -6px;
}

/* ===== CODE MIRROR ===== */
.cm-s-material.CodeMirror,
.CodeMirror {
  background-color: rgba(20, 21, 23, 0.66) !important;
  font-family: "Jura" !important;
}

.CodeMirror-panel .info-panel {
  height: 18px !important;
}

.CodeMirror-panel .info-panel .language {
  font-size: 12px !important;
  padding: 0 20px !important;
  border-radius: 10px;
}

.CodeMirror-panel .control-panel .maximize,
.CodeMirror-panel .control-panel .restore,
.CodeMirror-panel .control-panel .copy {
  height: 10px !important;
  width: 10px !important;
}

.CodeMirror-panel .control-panel .maximize:after,
.CodeMirror-panel .control-panel .copy:after {
  height: 8px !important;
  width: 8px !important;
}

/* ===== UTILITY CLASSES ===== */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  clip-path: none;
  color: #21759b;
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
}

.alignleft {
  float: left;
  margin: 0 1.5em 1.5em 0;
}
.alignright {
  float: right;
  margin: 0 0 1.5em 1.5em;
}
.aligncenter {
  display: block;
  margin: 0 auto 1.5em;
  clear: both;
}

/* ===== WORDPRESS SPECIFIC ===== */
.entry-footer .cat-links,
.entry-footer .tags-links {
  padding: 5px;
}
.entry-footer .edit-link {
  float: right;
  padding-right: 5px;
}

.sticky {
  display: block;
}
.post,
.page {
  margin: 0 0 1.5em;
}

.widget {
  margin: 0 0 1.5em;
}
.widget select {
  max-width: 100%;
}

#footer-credits-wrapper {
  text-align: center;
}

.site-footer .block-social-icon ul {
  list-style-type: none;
  list-style-image: none;
  margin-bottom: -15px;
}
.site-footer .block-social-icon li {
  width: 32px;
  height: 32px;
  float: right;
  margin-left: 5px;
}
.site-footer .social-icon a {
  font-family: "SocialLogosColor" !important;
  font-size: 32px;
  font-style: normal;
  margin-top: -8px;
  margin-right: 0;
  float: right;
}

#site-footer {
  font-size: 1.5vw;
}

/* ===== Настройка страницы 403 Доступ запрещен ===== */
.error-403 .page-header h1 {
  font-family: "Jura", monospace;
  font-size: 256px;
  text-align: center;
  font-weight: bolder;
  margin: -10% 0;
}

.error-403 .page-header h2 {
  font-family: "Jura", monospace;
  font-size: 48px;
  text-align: center;
  font-weight: bold;
}

.error-403 .page-content ul {
  font-family: "Raleway", sans-serif;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
  margin: 3% 32%;
  list-style-type: circle;
}

.error-403 .page-content .protocol {
  font-family: "Raleway", sans-serif;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
  margin: 3% 32%;
  list-style-type: square;
  text-decoration: underline;
  text-decoration-thickness: 2px; /* толщина линии */
}

.error-403 .page-content .protocol li {
  font-size: 18px;
  font-weight: lighter;
  text-decoration: none;
  text-decoration-thickness: 0px; /* толщина линии */
}

.error-403 .page-content ol {
  font-family: "Raleway", sans-serif;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
  margin: 0 32%;
  text-decoration: underline;
  text-decoration-thickness: 2px; /* толщина линии */
}

.error-403 .page-content ol li {
  font-size: 18px;
  font-weight: lighter;
  text-decoration: none;
  text-decoration-thickness: 0px; /* толщина линии */
}

/* ===== Настройка страницы 404 Доступ запрещен ===== */
.error-404 .page-header h1 {
  font-family: "Jura", monospace;
  font-size: 256px;
  text-align: center;
  font-weight: bolder;
  margin: -10% 0;
}

.error-404 .page-header h2 {
  font-family: "Jura", monospace;
  font-size: 48px;
  text-align: center;
  font-weight: bold;
}

.error-404 .page-content ul {
  font-family: "Raleway", sans-serif;
  font-size: 24px;
  text-align: center;
  font-weight: bold;
  margin: 3% 30%;
  /* list-style-type: circle; */
  list-style: none;
}

.error-404 .page-content .diagnose {
  font-family: "Raleway", sans-serif;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  margin: 3% 37%;
  text-decoration: underline;
  text-decoration-thickness: 2px; /* толщина линии */
}

.error-404 .page-content .diagnose li {
  font-size: 14px;
  font-weight: lighter;
  text-decoration: none;
  text-decoration-thickness: 0px; /* толщина линии */
}

.error-404 .page-content .diagnose {
  list-style: none;
  padding-left: 0;
}

.error-404 .page-content .diagnose li {
  position: relative;
  padding-left: 6px;
  margin-bottom: 2px;
}

.error-404 .page-content .diagnose li::before {
  content: "✔︎"; /* или "‣", "➢", "●", "→", "★" */
  position: absolute;
  left: 0;
}

.error-404 .page-content .security_protocol {
  font-family: "Raleway", sans-serif;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  margin: 3% 34%;
  list-style-type: square;
  text-decoration: underline;
  text-decoration-thickness: 2px; /* толщина линии */
}

.error-404 .page-content .security_protocol li {
  font-size: 14px;
  font-weight: lighter;
  text-decoration: none;
  text-decoration-thickness: 0px; /* толщина линии */
}

.error-404 .page-content ol {
  font-family: "Raleway", sans-serif;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
  margin: 0 32%;
  text-decoration: underline;
  text-decoration-thickness: 2px; /* толщина линии */
}

.error-404 .page-content ol li {
  font-size: 14px;
  font-weight: bold;
  text-decoration: none;
  text-decoration-thickness: 0px; /* толщина линии */
  width: 66%;
  margin: 0 auto;
}

.error-404 .page-content ol ul li {
  width: 76%;
  margin: 0 auto;
}

.error-404 .page-content .protocol_solution {
  font-family: "Raleway", sans-serif;
  font-size: 18px;
  text-align: center;
  font-weight: bolder;
  margin: 3% 5%;
  list-style-type: square;
  text-decoration: underline;
  text-decoration-thickness: 2px; /* толщина линии */
}

.error-404 .page-content .protocol_solution li {
  font-size: 14px;
  font-weight: lighter;
  text-decoration: none;
  text-decoration-thickness: 0px; /* толщина линии */
}

.error-404 .page-content .protocol_solution {
  list-style: none;
  padding-left: 0;
  font-weight: lighter;
}

.error-404 .page-content .protocol_solution li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 10px;
  font-weight: lighter;
}

.error-404 .page-content .protocol_solution li::before {
  content: "-"; /* или "‣", "➢", "●", "→", "★" */
  position: absolute;
  left: 0;
  font-weight: lighter;
}

/* Стили для красивой формы поиска */
.beautiful-search-form {
  margin: 20px 0;
}

.search-input-wrapper {
  display: flex;
  max-width: 600px;
  margin: 0 auto;
  border-radius: 50px;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  border: 2px solid transparent;
  background:
    linear-gradient(135deg, #202123, #2d2e32) padding-box,
    linear-gradient(135deg, #9b3bde, #1369b7) border-box;
}

.search-input-wrapper:focus-within {
  box-shadow: 0 4px 20px rgba(155, 59, 222, 0.3);
}

.search-field {
  flex: 1;
  padding: 15px 20px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 16px;
  font-family: "Raleway", sans-serif;
  outline: none;
}

.search-field::placeholder {
  color: rgba(255, 255, 255, 0.6);
}

.search-submit {
  padding: 15px 25px;
  border: none;
  background: linear-gradient(135deg, #9b3bde 0%, #1369b7 100%);
  color: white;
  cursor: pointer;
  font-family: "Raleway", sans-serif;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.3s ease;
}

.search-submit:hover {
  background: linear-gradient(135deg, #8a2bc9 0%, #115a9e 100%);
  transform: translateY(-1px);
}

.search-icon {
  font-size: 18px;
}

.search-text {
  display: inline;
}

/* Большая форма для страницы поиска */
.beautiful-search-form.large-search-form .search-input-wrapper {
  max-width: 800px;
}

.beautiful-search-form.large-search-form .search-field {
  padding: 20px 25px;
  font-size: 18px;
}

.beautiful-search-form.large-search-form .search-submit {
  padding: 20px 30px;
  font-size: 16px;
}

/* Стили для страницы поиска */
.site-search-page {
  padding: 40px 20px;
  max-width: 1200px;
  margin: 0 auto;
}

.search-page-header {
  text-align: center;
  margin-bottom: 50px;
}

.search-title {
  font-size: 2.5em;
  margin-bottom: 30px;
  color: #fff;
  font-family: "Raleway", sans-serif;
}

.search-form-container {
  margin-bottom: 30px;
}

/* Результаты поиска */
.search-info {
  margin-bottom: 30px;
  text-align: center;
}

.results-count {
  font-size: 1.1em;
  color: rgba(255, 255, 255, 0.8);
}

.search-results {
  display: grid;
  gap: 25px;
  /* max-width: 800px; */
  margin: 0 auto;
}

.search-result-item {
  background: rgba(32, 33, 35, 0.6);
  backdrop-filter: blur(10px);
  padding: 25px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}

.search-result-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}

.result-title {
  margin: 0 0 15px 0;
  font-size: 1.4em;
}

.result-title a {
  color: #fff;
  text-decoration: none;
}

.result-title a:hover {
  color: #00ff00;
}

.result-excerpt {
  color: rgba(255, 255, 255, 0.8);
  line-height: 1.6;
  margin-bottom: 15px;
}

.result-excerpt mark {
  background: linear-gradient(135deg, #9b3bde, #1369b7);
  color: white;
  padding: 2px 4px;
  border-radius: 3px;
}

.result-meta {
  display: flex;
  gap: 15px;
  font-size: 0.9em;
  color: rgba(255, 255, 255, 0.6);
}

.result-date::after {
  content: "•";
  margin-left: 15px;
}

/* Пагинация */
.search-pagination {
  text-align: center;
  margin-top: 40px;
}

.search-pagination .page-numbers {
  display: inline-flex;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.search-pagination a,
.search-pagination span {
  padding: 8px 16px;
  background: rgba(32, 33, 35, 0.6);
  color: #fff;
  text-decoration: none;
  border-radius: 5px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.search-pagination a:hover {
  background: linear-gradient(135deg, #9b3bde, #1369b7);
}

.search-pagination .current {
  background: linear-gradient(135deg, #9b3bde, #1369b7);
}

/* Состояния без результатов */
.no-results,
.empty-search {
  text-align: center;
  padding: 60px 20px;
  color: rgba(255, 255, 255, 0.8);
}

.suggestions {
  margin-top: 30px;
}

.suggestions h4 {
  margin-bottom: 15px;
  color: #fff;
}

.suggestions ul {
  list-style: none;
  padding: 0;
  display: inline-flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: center;
}

.suggestions a {
  color: #00ff00;
  text-decoration: none;
}

.suggestions a:hover {
  text-decoration: underline;
}

/* для страницы Контакты */
/* Стили для страницы контактов */
#primary .contacts-page {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 20px;
  color: #fff;
}

#primary .contacts-page h1 {
  text-align: center;
  font-size: 2.5em;
  margin-bottom: 20px;
  color: #fff;
}

#primary .contacts-page h2 {
  border-bottom: 2px solid #00ff00;
  padding-bottom: 10px;
  margin-top: 40px;
  color: #fff;
}

#primary .contacts-page a {
  color: #00ff00;
  text-decoration: none;
}

#primary .contacts-page a:hover {
  text-decoration: underline;
}

/* Стили для социальных иконок */
#primary .block-social-icon {
  margin: 12px 0;
  height: 76px;
}

#primary .social-icon {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
}

#primary .social-icon li {
  margin: 0;
  width: 20%;
}

#primary .social-icon a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 76px;
  height: 76px;
  background: rgba(32, 33, 35, 0.8);
  border-radius: 50%;
  border: 2px solid transparent;
  transition: all 0.3s ease;
}

#primary .social-icon a:hover {
  background: linear-gradient(135deg, #9b3bde, #1369b7);
  transform: translateY(-3px);
  box-shadow: 0 5px 15px rgba(155, 59, 222, 0.3);
}

/* Стили для карты */
#primary .map-container {
  margin: 30px 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

/* Стили для FAQ */
#primary .contacts-page ul {
  padding-left: 20px;
}

#primary .contacts-page li {
  margin-bottom: 10px;
  line-height: 1.6;
}

/* Оформление почтовых иконок на странице */
/* Стили с градиентным оформлением */
.email-addresses {
  margin: 10px 0;
}

.ul-mail {
  list-style: none;
  padding: 0;
  margin: 0;
}

.li-mail {
  display: flex;
  align-items: center;
  padding: 3px 12px;
  background: linear-gradient(
    135deg,
    rgba(32, 33, 35, 0.8),
    rgba(20, 21, 23, 0.9)
  );
  backdrop-filter: blur(15px);
  border-radius: 12px;
  border: 1px solid rgba(155, 59, 222, 0.2);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  float: left;
  margin: 3px;
}

.breakable-link {
  word-break: break-all;
  word-wrap: break-word;
  white-space: normal;
  margin-left: 20px; /* вместо      */
  display: inline-block;
  max-width: 50%; /* или нужная вам ширина */
}

.li-mail::before {
  content: "";
  position: absolute;
  left: -6px;
  top: -6px;
  bottom: -6px;
  width: 10px;
  background: linear-gradient(135deg, #9b3bde, #1369b7);
}

.li-mail::after {
  font-size: 28px;
  margin: 0 auto;
  z-index: 1;
  padding-bottom: 8px;
}

.li-mail:first-child::after {
  content: "✉️";
}

.li-mail:last-child::after {
  content: "💼";
}

.li-mail:hover {
  transform: translateX(8px);
  border-color: rgba(0, 255, 0, 0.4);
  box-shadow: 0 8px 25px rgba(155, 59, 222, 0.2);
  z-index: 1;
}

.li-mail p {
  padding: 0px;
  margin: 0px;
}

.li-mail a {
  color: #00ff00;
  text-decoration: none;
  font-weight: 600;
  font-family: "Raleway", sans-serif;
  z-index: 1;
  word-wrap: break-word;
  word-break: break-all;
  white-space: normal;
  display: inline-block;
  max-width: 100%;
}

.li-mail a:hover {
  color: #9b3bde;
  text-decoration: none;
}

.li-mail strong {
  color: #fff;
  font-weight: 700;
  margin-right: 8px;
  z-index: 1;
}

/* === СТИЛИ ДЛЯ ДИАЛОГА === */

/* Стили для постов */
vopros.DeepSeek {
  display: block;
  max-width: 80%;
  margin: 20px 0 20px auto;
  padding: 14px 18px;
  background-color: #444;
  color: #bbb;
  border: 1px solid #777;
  border-radius: 16px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  font-family: -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
  font-size: 1em;
  line-height: 1.5;
  word-wrap: break-word;
  border-right: 4px solid #1369b7;
}

/* Плавное появление */
vopros {
  animation: messageAppear 0.3s ease-out;
}

@keyframes messageAppear {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Базовый стиль для blockquote (оставляем стандартный) */
blockquote {
  font-style: italic;
  margin: 20px 0;
  padding: 0 20px;
  border-left: 4px solid #ccc;
}

/* Специальный стиль для blockquote, который идет ПРЯМО после vopros */
vopros.DeepSeek + blockquote {
  display: block;
  max-width: 85%;
  margin: 10px 0 20px 0;
  margin-right: auto;
  padding: 12px 18px;
  background-color: #222;
  color: #eee;
  border-radius: 18px 18px 18px 4px;
  border-left: 4px solid rgba(155, 59, 222, 0.3);
  font-style: normal;
  font-size: 1em;
  line-height: 1.5;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
  position: relative;
  animation: messageAppear 0.3s ease-out;
}

/* Заголовок "DeepSeek" */
vopros.DeepSeek + blockquote::after {
  content: "DeepSeek";
  position: absolute;
  top: -18px;
  left: 10px;
  font-size: 0.75em;
  color: #eee;
  font-weight: bolder;
  background-color: #000;
  padding: 2px 6px;
  border-radius: 10px;
}

/* Стили для Markdown внутри ответа */
vopros.DeepSeek + blockquote strong {
  font-weight: 600;
  color: #eee;
}

vopros.DeepSeek + blockquote em {
  font-style: italic;
  color: #2d3748;
}

vopros.DeepSeek + blockquote code {
  background: rgba(0, 0, 0, 0.1);
  padding: 2px 6px;
  border-radius: 4px;
  font-family: "Monaco", "Menlo", "Ubuntu Mono", monospace;
  font-size: 0.9em;
}

vopros.DeepSeek + blockquote a {
  color: #3182ce;
  text-decoration: underline;
}

vopros.DeepSeek + blockquote ul,
vopros.DeepSeek + blockquote ol {
  margin: 10px 0;
  padding-left: 20px;
}

vopros.DeepSeek + blockquote li {
  margin: 5px 0;
}

/* Анимация */
@keyframes messageAppear {
  from {
    opacity: 0;
    transform: translateY(10px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Таблицы в постах */
.entry-content table {
  width: 100%;
  border-collapse: collapse;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
  font-family: Jura;
  font-size: 10px;
}

.entry-content table th {
  background: rgba(255, 255, 255, 0.15);
  padding: 15px;
  text-align: left;
  color: #ffffff;
  font-weight: 600;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: Jura;
  font-size: 10px;
}

.entry-content table td {
  padding: 15px;
  color: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  transition: all 0.3s ease;
  font-family: Jura;
  font-size: 10px;
}

.entry-content table tr:hover td {
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  transform: translateX(5px);
  font-family: Jura;
  font-size: 10px;
}