/* =================================================================
   STYLES.CSS — главный файл, подключает все остальные
   Переменные цветов — ТОЛЬКО в colors.css
   ================================================================= */
@import url('colors.css');
@import url('topbar.css');
@import url('footer.css');
@import url('content.css');
@import url('forum.css');


/* ─── Размерные переменные шрифта ─── */
:root {
  --font-size-xs:   .75rem;
  --font-size-sm:   .86rem;
  --font-size-base: .9rem;
  --font-size-lg:   1rem;
}
@media (min-width:1400px) and (min-resolution:2dppx){
  :root{
    --font-size-xs:   clamp(.75rem,calc(1.05vw - .21rem),1.05rem);
    --font-size-sm:   clamp(.86rem,calc(1.05vw - .10rem),1.16rem);
    --font-size-base: clamp(.9rem, calc(1.05vw - .06rem),1.2rem);
    --font-size-lg:   clamp(1rem,  calc(1.05vw + .04rem), 1.3rem);
  }
}

/* ─── Подключение шрифта ─── */
@import url('../fonts/font.css');

/* ─── Сброс ─── */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
article,aside,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
html,html a{-webkit-font-smoothing:antialiased}

/* ─── Базовые стили ─── */
body,select,input,textarea,button{
  font-family: 'Roboto', system-ui, -apple-system, sans-serif;
  font-size: var(--font-size-base);
  line-height: 1.5;
  color: var(--c-text);
  outline: none;
}
body { background: var(--c-bg); }

a { color: var(--c-link); text-decoration: none; outline: none; }
a:hover { color: var(--c-link-hover); text-decoration: none; }
a img { border: none; }
a > img { vertical-align: bottom; }

h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4,.h5{
  margin: 1.5em 0 .6em;
  line-height: 1.3;
  font-weight: 700;
  color: var(--c-heading);
  text-rendering: optimizeLegibility;
}
h1,.h1{font-size:1.8em}
h2,.h2{font-size:1.5em}
h3,.h3{font-size:1.25em}
h4,.h4{font-size:1.1em}
h5,.h5{font-size:1em}

strong,b{font-weight:700}
em,cite,i{font-style:italic}
small,.small{font-size:.9em}
sup{vertical-align:super;font-size:smaller}
hr{border:none;border-top:1px solid var(--c-border);margin:16px 0}

ul{padding-left:1.8em;list-style:disc outside;margin:1em 0}
ol{padding-left:1.8em;list-style:decimal outside;margin:1em 0}

p{margin-block-start:0;margin-block-end:.7em}
p:last-child{margin-bottom:0}
.text ul,.text ol{margin-top:0;margin-bottom:.7em}

/* ─── Утилиты ─── */
.clr{clear:both}
.clrfix:after{clear:both;content:"";display:table}
.hide{display:none}
.title_hide{left:-9999px;position:absolute;top:-9999px;overflow:hidden;width:0;height:0}
.grey{color:var(--c-text-muted)}
.grey a{color:inherit}
.grey a:hover{color:var(--c-link-hover)}
.green{color:var(--c-accent)}
.right{float:right}
.left{float:left}
.center{text-align:center}
.cover{background-position:50% 50%;background-repeat:no-repeat;background-size:cover}
.over{display:inline-block;vertical-align:middle;max-width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}

/* ─── Кнопки ─── */
.btn,.bbcodes{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  height:36px;
  padding:0 18px;
  border-radius:18px;
  border:none;
  background:var(--c-accent-dark);
  color:#fff !important;
  font-size:.85rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
  cursor:pointer;
  text-decoration:none !important;
  transition:background .18s;
  box-sizing:border-box;
}
.btn:hover,.bbcodes:hover{background:var(--c-accent)}
.btn:active,.bbcodes:active{background:var(--c-accent-dark)}
.btn>.icon{fill:#fff}
.bbcodes.cancelchanges{background:#555}
.bbcodes.cancelchanges:hover{background:#666}

/* ─── Поля ввода (глобально) ─── */
select,textarea,
input[type="text"],input[type="password"],input[type="email"],
input[type="search"],input[type="url"],input[type="number"],
input[type="tel"],input[type="date"],input[type="time"],
input[type="file"]{
  display:inline-block;
  width:100%;
  padding:.45em .75em;
  border-radius:6px;
  background:var(--c-bg-input);
  border:1px solid var(--c-border);
  color:var(--c-text);
  font-size:var(--font-size-base);
  transition:border-color .2s;
  box-sizing:border-box;
}
input::placeholder,textarea::placeholder{color:var(--c-text-dim);opacity:1}
input:focus,textarea:focus,select:focus{border-color:var(--c-border-light);outline:none;background:var(--c-bg-hover)}
input[type="file"],input[type="submit"],input[type="button"],input[type="reset"]{width:auto}
textarea{resize:vertical;min-height:100px}
select{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23aaa' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat:no-repeat;
  background-position:right .75rem center;
  background-size:14px 10px;
  padding-right:2.5rem;
  appearance:none;
  width:auto;
}
select[multiple]{padding-right:.75rem;background-image:none}
.wide{width:100% !important}

/* ─── Форм-группы ─── */
ul.ui-form{list-style:none;padding:0;margin:0}
ul.ui-form>li,.form-group{margin-bottom:16px}
ul.ui-form>li:last-child{margin-bottom:0}
.form-group>label{display:block;margin-bottom:.35em;font-size:.85rem;color:var(--c-text-muted)}
.form-group.imp>label:after{content:"*";margin-left:6px;color:#e85319}
.form-sep{border-top:1px solid var(--c-border)}
.form_submit{margin-top:16px}

/* ─── Чекбокс/радио ─── */
.form-check-input{
  width:1.1em;height:1.1em;
  margin:-.15em .55em 0 0;
  vertical-align:middle;
  appearance:none;
  background-color:transparent;
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  border:1px solid var(--c-border-light);
  flex-shrink:0;
  cursor:pointer;
}
.form-check-input[type=checkbox]{border-radius:.2em}
.form-check-input[type=radio]{border-radius:50%}
.form-check-input:checked[type=checkbox]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23418af4' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}
.form-check-input:checked[type=radio]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23418af4'/%3e%3c/svg%3e")}
.form-check-label{cursor:pointer}

/* ─── Иконки SVG ─── */
.icon{display:inline-block;width:20px;height:20px;fill:var(--c-text-muted);vertical-align:middle}
.icon-logo{width:28px;height:28px}

/* ─── Цитаты, код, спойлеры ─── */
.quote,blockquote{
  padding:4px 16px;margin:1em 0;
  border-left:3px solid var(--c-accent);
  color:var(--c-text-muted);font-style:italic;
}
.title_quote{padding:8px 16px;background:var(--c-bg-hover);border:1px solid var(--c-border);font-weight:700;margin-top:2px}
.text_spoiler,.title_spoiler{padding:8px 16px;background:var(--c-bg-hover);border:1px solid var(--c-border)}
.text_spoiler{border-top:none}
.scriptcode{padding:8px 16px;background:var(--c-bg-hover);border:1px solid var(--c-border);color:#8bba40;font-family:monospace}
.hide{background:var(--c-bg-hover);padding:5px;color:var(--c-accent);margin:0 0 1em}

/* ─── Story (fullstory, static, forms) ─── */
.story{
  background:var(--c-bg-block);
  border:1px solid var(--c-border);
  border-radius:var(--c-radius);
  padding:24px;margin-bottom:12px;
  position:relative;color:var(--c-text);
}
.story .title{color:var(--c-heading);margin:.2em 0 .6em}
.story .title a{color:inherit !important;text-decoration:none !important}
.story .title a:hover{color:var(--c-accent) !important}
.story_top{margin-bottom:1em;font-size:.82rem;color:var(--c-text-dim)}
.story>.category{margin:1em 0;font-size:.82rem}
.story>.category a{color:var(--c-text-muted) !important}
.story>.category a:hover{color:var(--c-accent) !important}
.story>.category .icon{fill:var(--c-accent);width:14px;height:8px;margin-right:5px}
.fixed_label{background:rgba(65,138,244,.15);color:var(--c-accent);border-radius:3px;padding:2px 6px;font-size:.72rem;font-weight:700;text-transform:uppercase;margin-right:.8em}
.story>.text img{max-width:100%;height:auto;border-radius:4px}

/* ─── Story tools (глобальный стиль — для shortstory и прочих) ─── */
.story_tools{margin-top:1em;position:relative;font-size:.85rem}
.story_tools:after{content:"";display:block;clear:both}
/* .story_tools_in — контейнер кнопок с декоративной обводкой */
.story_tools_in{
  float:left;
  display:inline-flex;
  align-items:center;
  position:relative;
}
/*
  Строка ~244: обводка-псевдоэлемент.
  ИСПРАВЛЕНО: top:50% + transform:translateY(-50%) вместо top:0 + height:36px жёстко.
  Теперь рамка центрируется по реальной высоте содержимого и не наезжает на элементы.
  pointer-events:none — чтобы не перехватывала клики.
*/
.story_tools_in:before{
  content:"";
  position:absolute;
  left:0; top:50%; right:0;
  transform:translateY(-50%);
  border-radius:18px;
  height:36px;
  border:1px solid var(--c-border);
  z-index:0;
  pointer-events:none;
}
.story_tools_in>.btn,
.story_tools_in>.rate{
  position:relative;
  z-index:1;
  float:left;
}
.story_tools>.meta{
  margin:8px 16px 0 0;
  float:right;
  z-index:1;
  position:relative;
}
.meta{list-style:none;padding:0;margin:0}
.meta>li{display:inline;margin-left:20px}
.meta>li:first-child{margin-left:0}
.meta>li .icon{width:14px;height:14px;margin-right:5px;fill:var(--c-text-muted)}

/* Рейтинг */
.rate_like>a{float:left;padding:.4em;color:var(--c-accent);text-decoration:none !important}
.rate_like .icon{fill:var(--c-accent);width:14px;height:14px;margin-right:4px}
.rate_like-dislike>a{display:inline-block;opacity:.6;text-align:center}
.rate_like-dislike>a:hover{opacity:1}
.ratingplus{color:var(--c-accent)}
.ratingminus{color:var(--c-rating-minus)}

/* Plus icon */
.plus_icon,.plus_icon>span{width:14px;height:14px}
.plus_icon{border:3px solid transparent;display:inline-block;vertical-align:middle;position:relative;cursor:pointer}
.plus_icon>span,.plus_icon>span:before,.plus_icon>span:after{overflow:hidden;text-indent:-9999px;white-space:nowrap;position:absolute;border-radius:1px}
.plus_icon>span:before,.plus_icon>span:after{background-color:var(--c-text-muted);content:""}
.plus_icon>span{left:0;top:0}
.plus_icon>span:after{left:0;top:0;width:100%;height:2px;margin-top:6px}
.plus_icon>span:before{left:0;top:0;width:2px;height:100%;margin-left:6px}
.plus_icon.minus>span:before{display:none}
.more_icon{height:4px;width:16px;margin-top:8px;display:flex;justify-content:space-between}
.more_icon>i{width:4px;height:4px;border-radius:50%;background:#fff;float:left}

/* Story icons (избранное, редактирование) */
.story_icons{float:right;list-style:none;padding:0;margin:0 0 0 12px}
.story_icons>li{text-align:center;margin-bottom:6px}
.fav_btn span,.edit_btn a{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;cursor:pointer;color:var(--c-text-muted);transition:background .15s,color .15s}
.fav_btn span:hover,.edit_btn a:hover{background:var(--c-bg-hover);color:var(--c-accent)}
.fav_btn .icon{fill:var(--c-text-muted);width:14px;height:14px}
.fav_btn .icon-fav_del{fill:#f5c518}

/* ─── Голосование (опросы) ─── */
.poll_block{background:var(--c-bg-hover);border-radius:var(--c-radius);padding:16px;margin:1em 0}
.poll_block_in{background:var(--c-bg-block);border-radius:6px;padding:20px;box-shadow:0 1px 4px rgba(0,0,0,.3)}
.voteprogress{background:var(--c-bg-input);height:5px;border-radius:3px;margin:4px 0 8px;overflow:hidden}
.voteprogress span{background:var(--c-accent);height:5px;display:block}
.vote_list .vote>input+label,.vote_list .pollanswer>input+label{color:var(--c-text);font-size:.88rem}
.vote_list .vote>input+label:before,.vote_list .pollanswer>input+label:before{border-color:var(--c-border-light)}
.vote_list .vote>input:checked+label:before,.vote_list .pollanswer>input:checked+label:before{border-color:var(--c-accent);background:rgba(65,138,244,.2)}
.vote_votes,.pollallvotes{color:var(--c-text-dim);font-size:.82rem}
.vote_result_btn{background:var(--c-bg-hover);border:1px solid var(--c-border)}
.vote_result_btn>span>i{background:var(--c-text-muted)}

/* ─── Статистика ─── */
.stats_head>ul{list-style:none;padding:0;margin:0}
.stats_head>ul>li{margin-top:12px;padding-left:24px;color:var(--c-text);font-size:.9rem}
.stats_head>ul>li:before{background:var(--c-accent);width:12px;height:12px;border-radius:50%;float:left;margin:3px 0 0 -24px;content:""}
.stats_head>ul>li.stats_d:before{background:#ffde27}
.stats_head>ul>li.stats_w:before{background:#3e99e7}
.stats_head>ul>li>b{display:block;font-size:.72rem;opacity:.5;font-weight:normal}
.stat_group{margin-bottom:20px}
.stat_group>h5{margin-top:0;margin-bottom:.8em;color:var(--c-heading)}
.stat_group>ul{list-style:none;padding:0;margin:0}
.stat_group>ul>li{padding:.5em 0;border-top:1px solid var(--c-border);font-size:.85rem}

/* ─── Поиск ─── */
.searchpage{background:var(--c-bg-block);border-radius:var(--c-radius);border:1px solid var(--c-border);padding:20px;margin-bottom:12px}
.search_head_line{border-bottom:1px solid var(--c-border);padding-bottom:20px;padding-top:20px;margin:0}
.search_result_num{color:var(--c-text-muted);font-size:.82rem;margin:16px 0 0}

/* ─── Хайлайт скрытого текста ─── */
.dleshowHidden{color:#7cb8f0;background:rgba(65,131,196,.1);border:1px solid rgba(65,131,196,.3);padding:.7em;border-radius:4px}

/* ─── DLE UI диалоги ─── */
.ui-dialog{background:var(--c-bg-block);border-color:var(--c-border);color:var(--c-text)}
.ui-dialog-titlebar{background:var(--c-bg-hover);border-bottom-color:var(--c-border)}
.ui-dialog-title{color:var(--c-heading)}
.ui-dialog label{color:var(--c-text-muted)}
.ui-dialog-content{border-color:transparent;background:var(--c-bg-block)}
.ui-dialog .ui-dialog-buttonpane{border-top-color:var(--c-border);background:var(--c-bg-block)}
.ui-widget-overlay{background:rgba(0,0,0,.7)}
.ui-state-error{background:rgba(205,10,10,.1) !important;border-color:#cd0a0a;color:#e57373}

/* ─── Speedbar ─── */
.speedbar{color:var(--c-text-muted);font-size:.82rem}
.speedbar a{color:var(--c-text-muted) !important;text-decoration:none}
.speedbar a:hover{color:var(--c-link-hover) !important}

/* ─── Attachment ─── */
.attachment>a{color:var(--c-text) !important}
.attachment>a>.icon{fill:var(--c-accent)}

/* ─── Emoji ─── */
.emoji{border:none;vertical-align:middle;width:20px;height:20px}

/* ─── Пагинация (разбивка новостей) ─── */
.splitnewsnavigation{border-color:var(--c-border);color:var(--c-text-muted);font-size:.82rem}
.splitnewsnavigation span{color:var(--c-accent)}
.static_pages a{color:var(--c-text-muted) !important}

/* ─── PM ─── */
.pm-box{background:var(--c-bg-hover);border-radius:var(--c-radius)}
#pm-menu{border-bottom-color:var(--c-border)}
#pm-menu>a{color:var(--c-text) !important}
#pm-menu>a:hover{background:var(--c-bg-block)}
.pm_status{padding:20px;font-size:.85rem;color:var(--c-text-muted)}
.pm_progress_bar{background:var(--c-bg-input);border-color:var(--c-border);border-radius:6px;overflow:hidden}
.pm_progress_bar span{background:var(--c-accent)}
.userstop td,.pm td.pm_list,.pm th.pm_head{border-color:var(--c-border);color:var(--c-text);font-size:.85rem}
.pm tbody>tr:hover{background:var(--c-bg-hover)}
.pm_navigation .navigation{background:var(--c-bg-hover);border-radius:4px}
.pm_navigation .navigation a{color:var(--c-text) !important}
.pm_navigation .navigation span{background:var(--c-accent-dark);color:#fff}

/* ─── Профиль ─── */
.userinfo_top{border-bottom-color:var(--c-border)}
.user_tab{border-color:var(--c-border)}
.user_tab>li>a{color:var(--c-text-muted);border-left-color:var(--c-border)}
.user_tab>li.active>a{color:var(--c-text)}
.usinf>li{border-top-color:var(--c-border);font-size:.88rem}
.ui-c1{color:var(--c-text-muted)}
.ui-c2{color:var(--c-text)}
.popup_userinfo_top{background:var(--c-bg-hover)}
.popup_userinfo .usinf{font-size:.85rem}

/* ─── Аватар ─── */
.avatar .cover{border-color:var(--c-border)}

/* ─── Инфо-блок ─── */
.alert{background:rgba(65,138,244,.08);border-radius:4px;border:1px solid rgba(65,138,244,.25);padding:14px 18px;color:var(--c-text)}

/* ─── Теги (облако) ─── */
.tag_list{display:flex;flex-wrap:wrap;gap:6px}
.tag_list>span>a{margin:0}

/* ─── DLE push уведомления ─── */
.DLEPush-notification.wrapper{background:var(--c-bg-block);color:var(--c-text);border:1px solid var(--c-border)}
.DLEPush-notification.wrapper.push-success{background:rgba(0,137,123,.15)}
.DLEPush-notification.wrapper.push-warning{background:rgba(255,152,0,.12)}
.DLEPush-notification.wrapper.push-error{background:rgba(255,87,34,.12)}

/* ─── Переключатель темы ─── */
.theme-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--c-text-muted);
  cursor: pointer;
  transition: background .15s, color .15s;
  flex-shrink: 0;
}
.theme-toggle:hover {
  background: var(--c-bg-hover);
  color: var(--c-text);
}
.theme-toggle svg { display: block; }
/* Иконка солнца — видна в тёмной теме */
.theme-toggle .icon-sun  { display: block; }
.theme-toggle .icon-moon { display: none;  }
html[data-theme="light"] .theme-toggle .icon-sun  { display: none;  }
html[data-theme="light"] .theme-toggle .icon-moon { display: block; }

/* ─── Попап выбора темы (первый визит) ─── */
.theme-welcome {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--c-bg-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn .25s ease;
}
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.theme-welcome__box {
  background: var(--c-bg-block);
  border: 1px solid var(--c-border);
  border-radius: 16px;
  padding: 32px;
  max-width: 380px;
  width: calc(100% - 40px);
  text-align: center;
  box-shadow: 0 8px 32px rgba(0,0,0,.4);
}
.theme-welcome__title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--c-heading);
  margin-bottom: 8px;
}
.theme-welcome__sub {
  font-size: .85rem;
  color: var(--c-text-muted);
  margin-bottom: 24px;
}
.theme-welcome__buttons {
  display: flex;
  gap: 12px;
  justify-content: center;
}
.theme-welcome__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 24px;
  border-radius: 12px;
  border: 2px solid var(--c-border);
  background: var(--c-bg-hover);
  color: var(--c-text);
  cursor: pointer;
  font-size: .88rem;
  font-weight: 600;
  transition: border-color .15s, background .15s;
  font-family: inherit;
}
.theme-welcome__btn:hover {
  border-color: var(--c-accent);
  background: var(--c-bg-input);
}
.theme-welcome__btn svg { flex-shrink: 0; }
/* ── Форма добавления комментария ───────────────────────────── */

.cm-compose {
  background: var(--c-bg-block);
  border: 1px solid var(--c-border);
  border-radius: var(--c-radius);
  padding: 0;
  margin-bottom: 12px;
}

.cm-compose > h4.title { display: none; }
.cm-compose > .box_in { padding: 0; }

.cm-compose__guest {
  display: flex;
  gap: 10px;
  padding: 14px 14px 0;
}

.cm-compose__guest-input {
  flex: 1;
  height: 36px;
  padding: 0 12px !important;
  background: var(--c-bg-input) !important;
  border: 1px solid var(--c-border) !important;
  border-radius: 6px;
  color: var(--c-text) !important;
  font-size: .88rem;
  box-sizing: border-box;
}

.cm-compose__wrap {
  padding: 12px 14px 14px;
}

/* Обёртка поля */
.cm-compose__field-box {
  background: var(--c-bg-input);
  border: 1px solid var(--c-border);
  border-radius: 12px;
  transition: border-color .2s, box-shadow .2s;
  overflow: hidden;
}

.cm-compose__field-box--focus {
  border-color: var(--c-accent);
  box-shadow: 0 0 0 2px rgba(65, 138, 244, .15);
}

/* Скрываем обёртку DLE и стилизуем textarea напрямую */
.cm-compose__field-box .bb-editor {
  background: transparent;
  border: none;
  padding: 0;
  margin: 0;
}

.cm-compose__field-box textarea {
  display: block;
  width: 100% !important;
  min-height: 44px;
  max-height: 300px;
  height: 44px !important;
  padding: 12px 14px 4px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  color: var(--c-text) !important;
  font-size: .9rem !important;
  line-height: 1.5;
  resize: none;
  outline: none !important;
  box-sizing: border-box;
  overflow-y: hidden;
  box-shadow: none !important;
}

.cm-compose__field-box textarea::placeholder {
  color: var(--c-text-dim);
}

/* Нижняя панель */
.cm-compose__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px 8px;
}

.cm-compose__tools {
  display: flex;
  align-items: center;
  gap: 4px;
}

.cm-compose__tool-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: none;
  background: transparent;
  color: var(--c-text-dim);
  cursor: pointer;
  transition: background .15s, color .15s;
  padding: 0;
  font-family: inherit;
}

.cm-compose__tool-btn:hover {
  background: var(--c-bg-hover);
  color: var(--c-text);
}

/* Кнопка отправки — скрыта по умолчанию */
.cm-compose__send-btn {
  display: none;
  align-items: center;
  height: 32px;
  padding: 0 16px;
  border-radius: 16px;
  border: none;
  background: var(--c-accent);
  color: #fff !important;
  font-size: .84rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background .15s;
  white-space: nowrap;
}

.cm-compose__send-btn--visible {
  display: inline-flex;
}

.cm-compose__send-btn:hover {
  background: var(--c-accent-hover);
}

/* Дополнительные блоки */
.cm-compose__subscribe,
.cm-compose__recaptcha,
.cm-compose__question,
.cm-compose__captcha {
  padding: 0 14px 14px;
  font-size: .85rem;
  color: var(--c-text-muted);
}

/* ── Нижняя панель ── */
.cm-compose__toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px 8px;
  gap: 8px;
}

.cm-compose__tools {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
  min-width: 0;
}

/* Кнопка отправки — всегда справа, не сжимается */
.cm-compose__send-btn {
  display: none;
  align-items: center;
  flex-shrink: 0;
  height: 32px;
  padding: 0 16px;
  border-radius: 16px;
  border: none;
  background: var(--c-accent);
  color: #fff !important;
  font-size: .84rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background .15s;
  white-space: nowrap;
}

.cm-compose__send-btn--visible {
  display: inline-flex;
}

.cm-compose__send-btn:hover {
  background: var(--c-accent-hover);
}