/**
======================================================================================
======================================================================================

    Собираем здесь все важные стили

======================================================================================
======================================================================================

 */

/**
	Скрывает баннер "Powered by CKEditor";
*/
.ck-powered-by {
    display: none;
}

/**
    Чтобы в редакторе ширина таблиц всегда была 100%
 */
.ck-content .table {
    width: 100%;
}


/* можно пользовать вместо three-fields*/
.na-union-fields {
    display: flex;
    gap: 0rem;
    align-items: center;
}

.na-union-fields span:not(:first-child):not(:last-child) > input {
    border-radius: 0;
    border-left-style: hidden;
    border-right-style: hidden;
}

.na-union-fields span:first-child > input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.na-union-fields span:last-child > input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}



/**
  ====================================================================
     Плашка с результатами для отображения в dataView или dataTable
  ====================================================================
 */
.na-card {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    border-radius: var(--default-radiuz);
    color: black;
    padding: 1rem;
    background: white;
}

.na-colored-card {
    background: var(--secondary-color) !important;
}

/**
    Заголовок плашки с результатами поиска.
    Без переноса на другую строку
 */
.na-card-row {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: nowrap;
}

.na-card-row-wrap {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
    align-items: center;
    flex-wrap: wrap;
}

/**
    Все элементы внутри na-card-row по умолчанию не должны уменьшаться по ширине
 */
.na-card-row * {
    flex-shrink: 0;
}

.na-card-row-wrap * {
    flex-shrink: 0;
}

/**
    Если нужно, чтобы блок был на всю ширину flex, берите это
    (при этом он будет уменьшаться по ширине, если нужно)
 */
.na-flex-full-width {
    flex-grow: 1;
    flex-shrink: unset;
}

/**
    Содержимое вкладки
 */
.na-card-grid-2-cols {
    display: grid;
    grid-template-columns: 1fr 15rem;
    gap: 0.5rem;
}

.na-card-column {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/**
    Свой стиль кнопок плашки
 */
.na-card-column .ui-button {
    width: 100%;
    border: 1px solid #DCDCDC;
    border-radius: var(--default-radiuz);
    font-style: normal;
    font-size: 0.9rem;
    color: #000000;
    background: transparent;
}

/**
    Блок шифра
 */

.na-card-cipher {
    display: flex;
    padding: 0.5rem;
    gap: 0.2rem;
    border-radius: var(--default-radiuz);
    background: #ECF1FD;
    align-items: center;
    color: var(--primary-color);
}

/**
    Кнопка изменения размеров
 */
.na-range-toggle-btn,
.na-range-toggle-btn .ui-state-hover,
.na-range-toggle-btn .ui-state-active {
    background: transparent !important;
    color: var(--gray-text) !important;
    border: none !important;
    margin-left: -0.75rem !important;
}


/**
    Стиль для всего, что помещено в блок шифра
 */
.na-card .na-card-cipher * {
    font-size: 0.875rem;
    color: var(--primary-color);
}

/**
    Блок заголовка фонда-опис-дела
 */
.na-card .na-card-title {
    font-size: 1.25rem;
}

/**
    Поведение всех коммандлинков в пределах карточки
 */
.na-card .ui-commandlink {
    color: inherit !important;
    /*text-decoration: none !important;*/
}

.na-card .ui-commandlink:hover {
    color: inherit !important;
}

.na-card .ui-menu {
    width: 15vw;
}
.na-card .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-menuitem-text {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.31rem;
    text-align: left;
    color: #000000;
}


/**
    Стиль для всех dataView
 */
.ui-dataview .ui-dataview-header {
    display: none;
}


body .ui-dataview .ui-dataview-content {
    background: transparent !important;
}

.ui-dataview .ui-dataview-list-container {
    background: transparent !important;
}

.ui-dataview .ui-paginator .ui-paginator-bottom {
    background: none;
    padding-top: 1rem;
    border: none;
}

.ui-dataview .ui-dataview-row {
    border: none !important;
    padding-bottom: 0.5rem;
}

/**
    Оформление заголовков и подписей в плитках
 */







/**
    ======================================================================================
    Здесь пока собираем стили из разрозненных CSS, потом их торжественно грохнем
    ======================================================================================
 */


.noBorder > tbody > tr > .ui-panelgrid-cell	{
	border: none !important;
}


.companyHeaderGrid .ui-panelgrid .ui-panelgrid-cell {
    padding: 2px;
    border: none;
}

.companyHeaderGrid.ui-panelgrid>*>tr,
.companyHeaderGrid.ui-panelgrid .ui-panelgrid-cell {
    border: none;
}

/**
    caption-panel со всеми делами
 */

/* Caption-panel */
.caption-panel {
    display: grid;
    grid-template-rows: auto 1fr;
    border: solid 1px #DBDBDB;
    border-radius: 0.75rem;
    padding: 0.5rem;
    background-color: white;
}

.caption-panel .caption {
    font-size: 0.75rem;
    line-height: 0.75rem;
    color: #8A8A8A;
    text-align: left !important;
}

.caption-panel .ui-inputfield, .caption-panel .ui-selectonemenu, .caption-panel .ui-selectcheckboxmenu  {
    border: none;
    width: 100%;
}

.caption-panel .ui-inputfield.ui-state-focus, .caption-panel .ui-selectonemenu.ui-state-focus, .caption-panel .ui-selectcheckboxmenu.ui-state-focus {
    box-shadow: none;
}

/* все caption внутри определённой ширины и выравнивания */
.right-aligned-captions .caption {
    width: 13rem;
    text-align: right;
}

/* первый уровень div с минимальной шириной */
.right-aligned-captions > div {
    min-width: 32rem;
}