/*
 * Joomla 4 / 5 / 6 compatibility rules (added with the port of the template to Joomla 4.4 - 6.x).
 * Loaded after template.css. Nothing in here changes the look of the Joomla 3 markup - it only maps
 * the markup that newer Joomla versions output to the design of styles.css.
 */

/* Bootstrap 5 helper that Joomla 4+ uses for screen reader only texts (Joomla 3: .element-invisible) */
.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Joomla 5+ adds a submenu toggle button to every parent item of the menu. The main menu of this template opens
   its submenus on hover (see #nav ul li:hover ul) and the responsive menu (slicknav) has its own toggles. */
.mod-menu__toggle-sub {
	display: none !important;
}

/* Menus in the sidebars: Joomla 3 rendered <ul class="menu">, Joomla 4+ renders <ul class="mod-menu"> */
#sidebar .module ul.mod-menu{margin:5px 0 0 0; padding:0;list-style:none; padding:0; list-style-type:none;}
#sidebar .module ul.mod-menu li{ list-style:none; list-style-type:none;margin:0; padding:0; }
#sidebar .module ul.mod-menu li a {background-color:#f1f1f1;border-bottom: 1px solid #FFFFFF;color: #575757;display: block;padding: 3px 15px 3px 5px;text-decoration: none; text-align: left;}
#sidebar .module ul.mod-menu li a:hover { color: #575757; background: url(../images/sidehover.jpg) 100% -50px no-repeat #fff;}
#sidebar .module ul.mod-menu li.active a{color:#058CA1;}
#sidebar .module ul.mod-menu li ul {margin:0;}
#sidebar .module ul.mod-menu li ul li {background:none; border:none; margin: 0 0 0 15px;   }
#sidebar .module ul.mod-menu li ul li a{ border: 0; color:#999; background:none;text-align:left; padding-left: 11px;}
#sidebar .module ul.mod-menu li ul li a:hover{color: #575757; background: url(../images/sidehover.jpg) 100% -50px no-repeat #fff; }
#sidebar .module ul.mod-menu li.active ul li a{color: #6e99c2;}
#sidebar .module ul.mod-menu li ul li.active a, #sidebar .module ul.mod-menu li.active ul li a:hover{color:#134E8B;}

/* Joomla 6 hides closed submenus with display:none (mod_menu css + script) and opens them with the toggle button.
   This template has no toggle button: the main menu opens its submenus on hover (left:-999em / ":hover", see
   #nav ul li ul in styles.css) and menus in the sidebars show their submenus expanded (like in Joomla 3). */
.mod-menu__sub {
	display: block;
}

/* Edit buttons for logged-in editors (article "Edit" link, module/menu edit buttons of the front-end editing).
   Joomla 4+ adds a hidden tooltip text (<div role="tooltip">) behind every edit link - without these rules
   (taken from the Cassiopeia template) the tooltip text would be printed as normal text. */
[role="tooltip"]:not(.show) {
	z-index: 1070;
	color: #000;
	text-align: start;
	background: #fff;
	border: 1px solid #6d757e;
	border-radius: .25rem;
	max-width: 100%;
	margin: .5em;
	padding: .5em;
	display: none;
	right: 5em;
	box-shadow: 0 0 .5rem rgba(0, 0, 0, .8);
	font-size: 12px;
}
[role="tooltip"]:not(.show)[id^="editarticle-"],
[role="tooltip"]:not(.show)[id^="editcontact-"] {
	margin-inline-start: -10em;
	right: auto;
}
:focus + [role="tooltip"],
:hover + [role="tooltip"] {
	display: block;
	position: absolute;
}
.btn.jmodedit {
	position: absolute;
	top: 0;
	right: 0;
	left: auto;
	z-index: 900;
	color: #2a69b8;
	background-color: rgba(255, 255, 255, .5);
	border: 1px solid #58595a;
	border-radius: .25rem;
	padding: 0 4px;
}
.module,
.moduletable {
	position: relative; /* anchor of the absolutely positioned .jmodedit button */
}