/*
Firefox - критично относится, когда SVG пишут большими буквами, поэтому везде маленькими!
*/

:root {
  --yellow:       #ffdd33;
  --yellow_hl:    #ffee66;
  --shadow:       0 0 5px rgba(0,0,0,0.2);   
  --a_dark:        #5A5FD5;     /*Основной темный фон*/
  --fsz:          13px;
}


/******************** RAT *******************************/
.RT_RESIZE_W
{
  width: 10px;
  margin-left: -5px;
  margin-right: -5px;
  flex-shrink: 0;
  position: relative;
  z-index: 10;
  cursor: ew-resize; /*col-resize*/
  background: transparent;
}

.RT_RESIZE_W:hover
{
  xbackground: rgba(0,0,0,.08);
}

/******************** КНОПКИ **********************************/

.A_BTN, DIV.Z_FORM_BTN        
{
  text-align:center;
  width:100%;
  padding:7px 0 7px 0;
  font-size: 16px;
  font-weight:400;
  border-radius: 4px;
  background: var(--yellow);
  cursor:pointer;
  box-sizing: border-box;
  display:block;
  color:black;
}

DIV.A_BTN_TINY
{
  width:auto;
  padding:3px 5px 3px 5px;
}

.A_BTN:hover      {background: var(--yellow_hl);}

.A_BTN_MARGIN_TOP {margin-top:10px;}


.Z_FORM_BTN {margin-top:10px;}
.Z_FORM_BTN:hover {background: var(--yellow_hl);}



DIV.A_BTN_GREY
{
  background:#DDD;
}




DIV.A_BTN_CANCEL
{
  width:200px;
  background:#DDD;
}

DIV.A_BTN_CANCEL:hover
{
  background:#EEE;
}


DIV.A_BTNS_MID_V /*Кнопки по вертикали*/
{
  width:300px;
  margin:0px auto 0px auto;
}

DIV.A_BTNS_MID_V .A_BTN
{
  margin:10px 0 10px 0;
}

DIV.A_BTNS_FORM_BOT
{
  display: flex;
  justify-content: right;
  gap:20px;
}

DIV.A_BTNS_FORM_BOT .A_BTN
{
  width: auto;
  padding: 5px 15px 5px 15px;
}


/******************** ПОЛЕЗНОСТИ/ОФРМЛЕНИЕ **********************************/

.A_GREY
{
  opacity:0.3;
}

.A_GREY:hover
{
  opacity:0.8;
}

DIV.A_HOV_SHOW_EL   /*Чтобы показывать при наведении на родителя*/
{
  display:none;
}
DIV.A_HOV_SHOW_CONT:hover DIV.A_HOV_SHOW_EL
{
  display: block;
}

DIV.A_MID_TINY
{
  max-width:400px;
  margin:30px auto 30px auto;
}

DIV.A_DOTS
{
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}


DIV.A_POINTER:hover
{
  cursor:pointer;
}

DIV.A_FLEX_FULL
{
  width: 100%;                /* основной способ */
  flex: 1 1 100%;             /* если flex-direction: row и нужен перенос */
}


DIV.A_MSG
{
  text-align:center;
  padding:8px 0px 8px 0px;
  color:#444;
}

.A_MSG_CENTER
{
  display:flex;
  justify-content:center;
}

.A_MSG_CENTER .A_MSG
{
  padding:20px;
  background:white;
  border-radius:5px;
  box-shadow: var(--shadow);
}


.A_TINY
{
  font-size:11px;
  color:#444;
}

DIV.A_BLOCK_SHADOW
{
  margin:10px 5px 10px 5px;
  padding:5px;
  border-radius:4px;
  box-shadow: var(--shadow);
}


DIV.A_LEFT_IMAGE_SMALL
{
  min-width:120px;
  min-height:120px;
  padding-right:20px;
}

DIV.A_LEFT_IMAGE
{
  min-width:200px;
  padding-right:20px;
}

DIV.A_IMAGE_W100 IMG
{
  width:100%;
}

DIV.A_FILES_SMALL
{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

DIV.A_FILES_SMALL .Z_FILE {margin:0px;}


DIV.A_FILES_SMALL .ZZP_FILE
{
  height:50px;
}

#mx_lbtns DIV.A_USER_PIC
{
  text-align: center;
  margin-top: 5px;
}

#mx_lbtns DIV.A_USER_PIC img
{
  width:28px;
  height:28px;
}

DIV.A_USER_PIC
{
  overflow: hidden;
}

DIV.A_USER_PIC IMG
{
  object-fit: cover;
  border-radius: 50%;
  width:100%;
  height:100%;
}

TABLE.A_PADDING TD, TH
{
  padding:1px 5px 1px 1px;
}

/********************  POPUP  **********************************/



DIV.A_MENU_GROUP /*Рзаделитель пунктов в попап меню*/
{
  text-align:center;
  padding:8px 10px 0px 10px;
  margin:0 2px 0 2px;
  font-size:12px;
  color:#999;
  border-bottom:1px solid #DDD;
}




DIV.A_POPUP_ICON IMG, DIV.A_POPUP_ICON svg
{
  height:20px;
  width:20px;
}

DIV.A_POPUP_BOT_TEXT
{
  border-top:1px solid #CCC;
  margin-top:15px;
  padding:5px 0 5px 0;
}


DIV.POP_INTSCROLL_CONT  /*Конда есть блоки фикс снизу и сверху*/
{
  display:flex;flex-direction:column;height:100%;min-height:0;
}
DIV.POP_INTSCROLL_BODY
{
  flex-grow:1;
  min-height:0;
  overflow-y:scroll;
}


/********************  Редактор чего-либо  **********************************/



DIV.AE_TOP
{
  font-size:14px;align-items:center;display:flex;gap:15px;
  border-bottom:1px solid #CCC;
  padding:2px 0px 4px 0px;
  margin:0px 0px 5px 0px
}

DIV.AE_CONT
{
  display:flex;
  align-items: stretch;
}

DIV.AE_LEFT /*Слева меню или список*/
{
  width:250px;
  min-width:50px;
  max-width:50px;
  padding:5px;
}

DIV.AE_SIZE_W
{
  cursor: ew-resize; 
  width: 20px; min-width: 20px; max-width: 20px; 
  background: linear-gradient(#CCC, #CCC) no-repeat center/1px 100%;
}

DIV.AE_MAIN
{
  flex-grow:1;
}

DIV.AE_TITLE 
{
  font-size: 14px;
  text-align: center;
  padding:5px 0 5px 0;
}

DIV.AE_BOT_BTNS 
{
  margin-top:10px;
}



/******************** ХАКИ **********************************/

/*Чтобы DIV по всему td растягивать...*/
TD.A_FULL_DIV
{
  padding:0px;position:relative;
}

TD.A_FULL_DIV > DIV
{
  position:absolute;
  top:0;right:0;bottom:0;left:0;
  display:flex;
  align-items:center;
  justify-content:center;
}


/*zx Checks - выбора в с трочку big_cls:'A_CHECKS_LINE'*/
DIV.A_CHECKS_LINE
{
  display:flex;
  gap:0px 10px;
  flex-wrap:wrap;
}

DIV.A_CHECKS_LINE DIV.ZX_CHECKS
{
  xbackground:#EEE;
  border-radius:2px;
  padding:2px 5px 2px 0px;
}




/******************** Скроллбары **********************************/

.A_VSCROLL_H 
{
  overflow-y:hidden;    
}

.A_VSCROLL_H:hover 
{
  overflow-y: scroll;
  
  xbackground:Red;
}

.A_VSCROLL
{
  scrollbar-gutter: stable;
}


.A_VSCROLL::-webkit-scrollbar 
{
  width: 8px;
}

.A_VSCROLL::-webkit-scrollbar-track 
{
  xbackground: #ffffff;
  background: transparent;
}

.A_VSCROLL::-webkit-scrollbar-thumb 
{
  background-color: rgba(0,0,0,0.4);
  border-radius: 5px;
  xborder: 1px solid rgba(0,0,0,0.5);
}



.A_HSCROLL_H {
  overflow-x: hidden;
}

.A_HSCROLL_H:hover {
  overflow-x: scroll;
  /* background: red; */   /* если нужен тестовый фон при наведении */
}

.A_HSCROLL {
  scrollbar-gutter: stable;   /* или просто stable — зависит от желаемого поведения */
}

/* Для WebKit-браузеров (Chrome, Safari, новые Edge) */
.A_HSCROLL::-webkit-scrollbar {
  height: 8px;              /* ← высота горизонтального скроллбара */
}

.A_HSCROLL::-webkit-scrollbar-track {
  background: transparent;
  /* background: #ffffff; */
}

.A_HSCROLL::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 5px;
  /* border: 1px solid rgba(0,0,0,0.5); */
}

/* Опционально: чтобы при наведении на контейнер скроллбар становился чуть ярче */
.A_HSCROLL:hover::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.6);
}



/******************** Списки **********************************/

DIV.A_LIST_ITEM
{
  display:flex;
  align-items: center;
  padding:2px 2px 0px 2px;
  flex-grow:1;
}


DIV.A_LIST_ITEM_BIG
{
  display:flex;
  padding:5px 5px 3px 5px;
  overflow:hidden;
}


DIV.A_LIST_ITEM_SEL
{
  background:#EEE;
  border-radius:3px;
}

DIV.A_LIST_ICON 
{
  xdisplay:table-cell; 
  xvertical-align:middle; 
  margin-right:3px;
}

DIV.A_LIST_ICON_GREY
{
  opacity:0.5;
}

DIV.A_LIST_ICON IMG, DIV.A_LIST_ICON svg
{
  width:16px;
  height:16px;
  border-radius:4px;
}


DIV.A_LIST_ICON_BIG
{
  xdisplay:table-cell; 
  xvertical-align:middle; 
  margin-right:8px;
}

DIV.A_LIST_ITEM:hover DIV.A_LIST_ICON_GREY
{
  opacity:1;
}


DIV.A_LIST_ITEM_BIG DIV.A_LIST_ICON IMG, DIV.A_LIST_ITEM_BIG DIV.A_LIST_ICON svg
{
  width:32px;
  height:32px;
  border-radius:4px;
}

DIV.A_LIST_MAIN
{
  flex-grow:grow;
  min-width:0;
}

DIV.A_LIST_MAIN DIV.A_TINY
{
  margin-top:2px;
}

DIV.A_LIST_GROUP
{
  text-align:center;
  padding: 10px 0px 5px 0px;
  color:#666;
}



/******************** Странное **********************************/

 .A_PADDING_LEFT
 {
   padding-left:10px;
 }


DIV.F_PAN_LEFT
{
  min-width:200px;
  width:200px;
  display:flex;
  flex-direction:column;
  min-height:200px;
  padding:5px;
  border-right:1px solid #CCC;
  margin-right:10px;
}