@CHARSET "UTF-8";
/* Css settings of user modul*/

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'],
[data-mod='c_rec_mod_user_list'] [data-aid='w_content_header']
{
	--i_width_s_shell_name: 1fr;
	--i_width_s_account_name: 1fr;
	--i_width_s_virtual_path: 1.5fr;
	--i_width_b_active_icon: 0.2fr;
	--i_width_b_disabled_icon: 0.2fr;
	--i_width_c_status_mfa_icon: 0.2fr;
	--i_width_i_time_login: 0.5fr;
	--i_width_i_num_session: 0.2fr;
	--i_width_s_oauth_clients: 0.6fr;

}
	
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr,
[data-mod='c_rec_mod_user_list'] [data-aid='w_content_header'] div.iui_content_tr
{
	display: grid;
    grid-template-columns: 
    	35px 
    	var(--i_width_s_shell_name) 
    	var(--i_width_s_account_name) 
		20px
    	var(--i_width_s_virtual_path)
		var(--i_width_b_active_icon)
    	var(--i_width_b_disabled_icon)
    	var(--i_width_c_status_mfa_icon)
    	var(--i_width_i_time_login)
   		var(--i_width_i_num_session)
   		var(--i_width_s_oauth_clients);
}

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr div
{
	background-position: center;
	background-repeat: no-repeat;

}

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr [data-aid='b_active_icon']
{
	background-size: 100%;
	height: 24px;
	width: 24px;
	justify-self: center;
}

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.iui_user_active [data-aid='b_active_icon']
{
	background-image: url('../icon/iui_user_active.svg');
}

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.iui_user_inactive [data-aid='b_active_icon']
{
	background-image: url('../icon/iui_user_inactive.svg');
}

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr [data-aid='b_disabled_icon']
{
	background-size: 100%;
	height: 24px;
	width: 24px;
	justify-self: center;
}
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.iui_user_disabled [data-aid='b_disabled_icon']
{
	background-image: url('../icon/iui_user_disabled.svg');
}
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.iui_user_enabled [data-aid='b_disabled_icon']
{
	background-image: url('../icon/iui_user_enabled.svg');
}
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.iui_user_logged_in [data-aid='i_num_session']
{
	color: red;
	font-weight: bold;
}

[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr [data-aid='c_status_mfa_icon']
{
	background-size: 100%;
	height: 24px;
	width: 24px;
	justify-self: center;
}
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.c_status_mfa_off [data-aid='c_status_mfa_icon']
{
	background-image: url('../icon/iui_status_mfa_off.svg');
}
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.c_status_mfa_init [data-aid='c_status_mfa_icon']
{
	background-image: url('../icon/iui_status_mfa_init.svg');
}
[data-mod='c_rec_mod_user_list'] [data-aid='w_content'] div.iui_content_tr.c_status_mfa_on [data-aid='c_status_mfa_icon']
{
	background-image: url('../icon/iui_status_mfa_on.svg');
}


[data-mod='c_rec_mod_user_list'] [data-aid='w_contentbar_left']
{
	width: 200px;
}

[data-mod='c_rec_mod_user_mfa']
{
	font-size: 13px;
}

[data-mod='c_rec_mod_user_mfa'] b
{
	font-weight: bold;
}


[data-mod='c_rec_mod_user_mfa'] [data-aid='wizard_content_2'] [data-aid='container']
{
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-auto-flow: column;
	grid-auto-rows: minmax(0, 230px);
	gap: 40px;
}


[data-mod='c_rec_mod_user_mfa'] [data-aid='wizard_content_2'] [data-aid='container'] div:nth-child(2n)
{
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}


/* Az AI-kapcsolatok fül a felhasználó módosító moduljában. A rácsot a fül saját burkolója kapja, nem a lapozó lapja
 * (tab_content_3), mert a lapozó a nem aktív lapokat elrejti, és egy feltétel nélküli display: grid a rejtett lapot is
 * megjelenítené. A kliensenkénti sorok rácsát a keretrendszer közös rácsa adja (iui_form_element_grid a snippetben). */
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connections']
{
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-content: start;
	row-gap: 8px;
}

/* A választók és a kapcsolatlista címsora, valamint a lista fejléce úgy néz ki, mint az űrlapelemek címkéje. */
[data-mod='c_rec_mod_user_modify'] [data-aid='oauth_client_label'],
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_label'],
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_header']
{
	font-size: calc(var(--i_font_main_size) - 2px);
	text-transform: uppercase;
	color: var(--color_font_aux);
}

/* A választó csak akkora, amekkorát a leghosszabb felirata kíván („5 kapcsolódás engedélyezve”), nem a sor teljes
 * szélessége (a megrendelő kérése, 2026-10-14): a keretrendszer minden iui_select-nek 100%-ot ad (design.css). Fix
 * szélesség, nem auto, mert az auto a kiválasztott felirathoz igazodna, és választáskor a doboz és mellette a jelzés
 * ugrálna. Em-ben, hogy a betűmérettel együtt nőjön; keskeny ablakban sem lóg ki. */
[data-mod='c_rec_mod_user_modify'] [data-aid='oauth_client_list'] div.iui_select
{
	width: 22em;
	max-width: 100%;
}

/* A „Csatlakozzon és lépjen be a kliensen!” jelzés a választó mellett, vele egy vonalban. Üresen nem foglal helyet: a
 * keretrendszer az üres span-t az űrlapelemben blokkszintűvé teszi, ami a választó alá egy üres sort tenne, és a címke
 * lecsúszna. A jelzést a modul kódja tölti és üríti (a_generate_ai_connection_list, n_refresh_ai_connection_list). */
[data-mod='c_rec_mod_user_modify'] [data-aid='oauth_client_list'] span.iui_caption
{
	display: inline-block;
	height: auto;
	vertical-align: middle;
	margin-left: 12px;
}

[data-mod='c_rec_mod_user_modify'] [data-aid='oauth_client_list'] span.iui_caption:empty
{
	display: none;
}

/* A kapcsolatlista címsora elválik a választóktól. */
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_label']
{
	margin-top: 12px;
}

/* A kapcsolatlista: egy rács, a fejléc és a sorok a közös oszlopait használják (subgrid), így az oszlopok a leghosszabb
 * cellához igazodnak. A kapcsolódás helye kapja a maradék helyet, mert ennek a hossza változik a legjobban; a többi oszlop a
 * tartalmához igazodik. Rács, mert a design-struktúrában a table elem tilos. */
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_grid']
{
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr) max-content max-content max-content;
	column-gap: 12px;
	align-content: start;
}

[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_header'],
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_row']
{
	display: grid;
	grid-template-columns: subgrid;
	grid-column: 1 / -1;
	align-items: center;
	padding: 4px 0px;
	border-bottom: 1px solid var(--color_border);
}

/* A hosszú hely nem tolja szét a rácsot: a cellán belül törik. */
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_row'] [data-aid='connected_from']
{
	overflow-wrap: anywhere;
}

/* A letiltott kliens kapcsolatai és a korláton túli kapcsolatok mentéskor megszűnnek: áthúzva, halványan (a gomb
 * kivételével, mert az továbbra is használható). Az osztályt a modul kliens-oldali kódja teszi fel és veszi le
 * (s_get_ai_connection_strike_js). */
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_row'].iui_ai_connection_pending > div:not([data-aid='action'])
{
	text-decoration: line-through;
	color: var(--color_font_aux);
}

/* Kapcsolat nélkül a lista helyén álló szöveg. */
[data-mod='c_rec_mod_user_modify'] [data-aid='ai_connection_empty']
{
	color: var(--color_font_aux);
}

/* A jóváhagyó ablak (c_rec_mod_oauth_consent) tagolt tartalma (+c_rec_mod_oauth_consent_content.html), a megrendelő vázlata
 * szerint (2026-10-14). Félkövér nincs, mert a felület betűtípusából csak a normál vastagság töltődik be; a kiemelés a
 * betűméret, a piros figyelmeztetés és a kék, kattintható szöveg. A címsoroknak és a felsorolásoknak a keretrendszerben nincs
 * közös stílusa, ezért itt, az ablak tartalmára szűkítve állnak. */
.iui_oauth_consent h1
{
	font-size: calc(var(--i_font_main_size) + 11px);
	font-weight: normal;
	line-height: 1.25;
	margin: 0px 0px 10px 0px;
}

.iui_oauth_consent h2
{
	font-size: calc(var(--i_font_main_size) + 4px);
	font-weight: normal;
	margin: 18px 0px 6px 0px;
}

.iui_oauth_consent p
{
	line-height: 1.55;
	margin: 0px 0px 10px 0px;
}

.iui_oauth_consent ul
{
	list-style: disc;
	line-height: 1.55;
	margin: 0px;
	padding-left: 22px;
}

.iui_oauth_consent ul.iui_oauth_consent_details > li
{
	margin-bottom: 10px;
}

/* A felhasználó magyarázata közvetlenül a felhasználó sora alatt; normál betűvel (a megrendelő kérése, 2026-10-14: a dőlt
 * kivéve). */
.iui_oauth_consent .iui_oauth_consent_note
{
	margin: 4px 0px 0px 0px;
}

/* A csatlakozás részletei gondolatjeles felsorolásban; a jel a sor elé kerül, hogy a törő sorok a szöveghez igazodjanak. */
.iui_oauth_consent ul.iui_oauth_consent_dash
{
	list-style: none;
	padding-left: 18px;
	margin-top: 4px;
}

.iui_oauth_consent ul.iui_oauth_consent_dash > li
{
	position: relative;
}

.iui_oauth_consent ul.iui_oauth_consent_dash > li::before
{
	content: "–";
	position: absolute;
	left: -16px;
}

/* A kapcsolatszám sorának jele piros, ha az engedélyezéssel egy kapcsolat megszűnik (a modul teszi fel az osztályt). */
.iui_oauth_consent ul.iui_oauth_consent_dash > li.iui_oauth_consent_warning_row::before
{
	color: #cc0000;
}

/* Figyelemfelkeltő szöveg a jóváhagyó ablakban: a „Csak akkor engedélyezze…” mondat és a megszűnő kapcsolat. A szín a
 * keretrendszer piros címkéjéé (.c_rec_lt_tag_red). Az osztályt a nyelvi szöveg (s_label_oauth_consent_warning), illetve a
 * sablon adja. */
.iui_oauth_consent_warning
{
	color: #cc0000;
}

/* Kattintható szöveg a jóváhagyó ablakban (az „elutasítás” és a „Másik felhasználóra válthat”): a keretrendszerben nincs
 * link-stílus, ezért a szín a kérdőjel-ikon kékje (iui_window_dialog_question.svg), mutató kurzorral, rámutatásra aláhúzva.
 * Az osztályt a nyelvi szöveg adja. */
.iui_oauth_consent_link
{
	color: #0067cf;
	cursor: pointer;
}

.iui_oauth_consent_link:hover
{
	text-decoration: underline;
}