/*
 * com_pmevents – Layout aguilar
 * ----------------------------------------------------------------
 * Diese Datei gehört zur Website, NICHT zur Komponente.
 * Ort: media/templates/site/panmusic/css/com_pmevents/site.css
 * Sie ersetzt das Standard-CSS der Komponente und wird bei einem
 * Update der Komponente nicht überschrieben.
 */
.pmevents {
	--pmev-text: #666;
	--pmev-heading: #444;
	--pmev-link: #444;
	--pmev-link-hover: #222;
	--pmev-accent: #666;
	--pmev-accent-hover: #444;
	--pmev-border: #ddd;
	--pmev-row-alt: #f5f5f5;
	--pmev-row-hover: #f1f1f1;
	--pmev-box-bg: #f7f7f7;
	--pmev-box-border: #ccc;
	--pmev-input-bg: #f7f7f7;
	--pmev-input-border: #e0e0e0;
	--pmev-font-bold: inherit;
}

/* ---------- Liste ---------- */
.pmevents .pmev-heading { margin: 0 0 1rem; }
.pmev-table { width: 100%; border-collapse: collapse; }
.pmev-table td { padding: .7em .6em; border-bottom: 1px solid var(--pmev-border); vertical-align: top; text-align: left; }
.pmev-table tr:nth-child(even) td { background: var(--pmev-row-alt); }
.pmev-table tr:hover td { background: var(--pmev-row-hover); }
.pmev-date, .pmev-time { white-space: nowrap; color: var(--pmev-text); }
.pmev-time { min-width: 7.5em; }
.pmev-title a { font-family: var(--pmev-font-bold); color: var(--pmev-link); text-decoration: none; }
.pmev-title a:hover { color: var(--pmev-link-hover); }
.pmev-location { color: var(--pmev-text); }
.pmev-edit { margin-left: .4em; font-size: .85em; opacity: .5; }
.pmev-edit:hover { opacity: 1; }
.pmev-empty { color: var(--pmev-text); }
.pmev-pagination { margin-top: 1rem; }

@media (max-width: 700px) {
	.pmev-table, .pmev-table tbody, .pmev-table tr, .pmev-table td { display: block; width: 100%; }
	.pmev-table tr { padding: .6em .4em; border-bottom: 1px solid var(--pmev-border); }
	.pmev-table tr:nth-child(even) { background: var(--pmev-row-alt); }
	.pmev-table td { border: 0; padding: .1em 0; background: none !important; }
	.pmev-table .pmev-date, .pmev-table .pmev-time { display: inline-block; width: auto; margin-right: .8em; }
	.pmev-table .pmev-time:empty { display: none; }
}

/* ---------- Detail ---------- */
.pmev-box { background: var(--pmev-box-bg); border: 1px solid var(--pmev-box-border); border-radius: 4px; padding: 1.6em 2.2em; }
.pmev-box .pmev-title { margin: 0 0 .8em; font-family: var(--pmev-font-bold); font-size: 1.35em; color: var(--pmev-heading); font-weight: normal; }
.pmev-when { margin: 0 0 1em; color: var(--pmev-text); }
.pmev-when .pmev-time { margin-left: .5em; }
.pmev-description { margin-bottom: 1em; }
.pmev-field { margin: 0 0 .5em; }
.pmev-label { font-family: var(--pmev-font-bold); margin-right: .3em; }
.pmev-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: .6em; margin: 1.5em 0; }
.pmev-delete { margin: 0; }
.pmev-back { background: linear-gradient(#fff, #e9e9e9); border: 1px solid #aaa; border-radius: 4px; color: var(--pmev-link) !important; padding: .45em 1.4em; }
@media (max-width: 700px) { .pmev-box { padding: 1em 1.1em; } }

/* ---------- Eingabemaske ---------- */
.pmevents-form .pmev-toolbar { display: flex; flex-wrap: wrap; gap: .5em; margin-bottom: 1.5em; }
.pmev-btn, .pmevents-form .pmev-btn { background: var(--pmev-accent); border: 0; border-radius: 0; color: #fff !important; padding: .55em 1em; font-size: 1em; cursor: pointer; }
.pmev-btn:hover { background: var(--pmev-accent-hover); }
.pmev-btn-delete { background: #b64933; }
.pmevents-form input[type=text], .pmevents-form input[type=time], .pmevents-form input[type=number],
.pmevents-form input[type=url], .pmevents-form select, .pmevents-form textarea {
	background: var(--pmev-input-bg); border: 1px solid var(--pmev-input-border); border-radius: 0; padding: .5em .7em; max-width: 100%;
}
.pmevents-form .control-group { display: flex; flex-wrap: wrap; align-items: flex-start; margin-bottom: 1em; }
.pmevents-form .control-label { flex: 0 0 13em; padding-top: .45em; font-family: var(--pmev-font-bold); }
.pmevents-form .controls { flex: 1 1 18em; min-width: 0; }
.pmevents-form .pmev-cattitle { display: inline-block; padding-top: .45em; }
.pmevents-form #jform_title { width: 100%; }
.pmevents-form select, .pmevents-form #jform_location, .pmevents-form #jform_url, .pmevents-form #jform_extra_info { width: 100%; max-width: 32em; }

.pmev-fieldset { border: 1px solid var(--pmev-input-border); border-radius: 3px; background: var(--pmev-box-bg); padding: 1em 1.5em; margin: 0 0 1.5em; }
.pmev-fieldset legend { float: none; width: auto; padding: 0 .5em; margin: 0; font-family: var(--pmev-font-bold); font-size: 1.05em; }
.pmev-when .control-label { flex-basis: 15em; }
.pmev-pair { display: flex; flex-wrap: wrap; gap: 0 2em; }
.pmev-pair .control-group { display: block; }
.pmev-pair .control-label { padding-top: 0; }

/* Kalenderknopf */
.pmevents-form .field-calendar .input-group { display: flex; }
.pmevents-form .field-calendar .btn { background: var(--pmev-accent); color: #fff; border: 0; border-radius: 0; padding: .5em .9em; }

/* Reiter */
.pmevents-form joomla-tab > [role=tablist] button,
.pmevents-form joomla-tab button[role=tab] { background: none; border: 0; border-bottom: 2px solid transparent; padding: .5em 1.3em; font-size: 1.05em; color: #999; }
.pmevents-form joomla-tab button[aria-expanded=true],
.pmevents-form joomla-tab button[aria-selected=true] { color: #333; border-bottom-color: var(--pmev-accent); }
.pmevents-form joomla-tab-element { padding: 1.5em 0 0; }

@media (max-width: 700px) {
	.pmevents-form .control-label { flex-basis: 100%; padding-top: 0; margin-bottom: .2em; }
	.pmev-fieldset { padding: .8em; }
}
.pmevents .pmev-title a, .pmev-label { font-weight: 600; }

/* ---------- Blätterleiste ---------- */
.pmev-pagination { margin: 1.5em 0; text-align: center; }
.pmev-pagination .pagination { display: inline-flex; flex-wrap: wrap; gap: .25em; list-style: none; margin: 0; padding: 0; }
.pmev-pagination .page-item { margin: 0; padding: 0; background: none; }
.pmev-pagination .page-link { display: block; min-width: 2.3em; padding: .4em .7em; border: 1px solid var(--pmev-border); background: #fff; color: var(--pmev-link); text-decoration: none; line-height: 1.2; }
.pmev-pagination a.page-link:hover { background: var(--pmev-row-hover); color: var(--pmev-link-hover); }
.pmev-pagination .page-item.active .page-link { background: var(--pmev-accent); border-color: var(--pmev-accent); color: #fff; }
.pmev-pagination .page-item.disabled .page-link { color: #bbb; background: #fafafa; }
.pmev-pagination .pmev-counter { margin: .6em 0 0; font-size: .9em; color: var(--pmev-text); }

/* Felder, die Joomla ausblendet (Ganztägig / Keine spezifische Endzeit) */
.pmevents-form .control-group.hidden { display: none !important; }

/* ================================================================
   aguilar – Layout wie das frühere jEvents (Blöcke, Bild rechts)
   ================================================================ */
.pmevents { --pmev-text: #666; --pmev-heading: #555; --pmev-link: #333; --pmev-link-hover: #000; --pmev-accent: #888; --pmev-accent-hover: #666; }
.pmevents-list { padding-top: 20px; }
.pmev-cols { display: flex; justify-content: space-between; align-items: flex-start; gap: 2em; }
.pmev-entries, .pmev-main { flex: 1 1 auto; min-width: 0; }
.pmev-image { flex: 0 0 auto; padding-top: 10px; }
.pmev-image img { display: block; max-width: 100%; height: auto; }

/* Liste */
.pmev-entry { margin: 0 0 1.7em; }
.pmev-entry p { margin: 0 0 .35em; }
.pmev-entry .pmev-date { white-space: normal; color: var(--pmev-text); font-weight: 300; }
.pmev-entry .pmev-title a { display: inline-flex; align-items: center; gap: .45em; font-family: inherit; font-weight: 600; color: var(--pmev-link); }
.pmev-entry .pmev-title a:not(.pmev-edit)::before { content: ""; width: .95em; height: .95em; flex: 0 0 auto; background: no-repeat center / contain
	url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpath d='M15 3h6v6M10 14L21 3'/%3E%3C/svg%3E"); }
.pmev-entry .pmev-title a:hover { color: var(--pmev-link-hover); }
.pmev-entry .pmev-location { color: var(--pmev-text); font-weight: 300; }

/* Detail */
.pmevents-detail { padding-top: 20px; }
.pmevents-detail .pmev-title { margin: 0 0 .6em; font-family: inherit; font-size: 28px; font-weight: 300; color: var(--pmev-heading); line-height: 1.3; }
.pmevents-detail .pmev-when { margin: 0 0 1.8em; color: var(--pmev-text); font-weight: 300; line-height: 1.6; }
.pmevents-detail .pmev-when .pmev-time { margin: 0; }
.pmevents-detail .pmev-field { margin: 0 0 .4em; font-weight: 300; }
.pmevents-detail .pmev-label { font-family: inherit; font-weight: 600; color: var(--pmev-heading); }
.pmevents-detail .pmev-url a { color: var(--pmev-text); }
.pmevents-detail .pmev-url a:hover { color: var(--pmev-link-hover); }

/* Knöpfe Detail */
.pmev-buttons .btn, .pmev-buttons .btn:hover, .pmev-buttons .btn:focus, .pmev-buttons .btn:active {
	background-repeat: no-repeat !important; background-position: 0 0 !important; background-size: 100% 100% !important; transition: none !important; box-shadow: none; }
.pmev-back, .pmev-buttons .pmev-btn { background: linear-gradient(#fff, #e9e9e9); border: 1px solid #aaa; border-radius: 4px; color: #555 !important; padding: .35em 1.3em; font-size: 1em; font-weight: 300; text-shadow: none; }
.pmev-buttons .pmev-btn:hover, .pmev-back:hover { background: linear-gradient(#fff, #ddd); }
.pmev-buttons .pmev-btn-delete { color: #b64933 !important; }

/* Auswahl «Anzeige» und Blätterleiste */
.pmev-limitbox { display: flex; justify-content: center; align-items: center; gap: .8em; margin: 2em 0 0; color: var(--pmev-text); font-weight: 300; }
.pmev-limitbox label { margin: 0; font-weight: 300; }
.pmev-limitbox select { width: auto; min-width: 5em; height: auto; padding: .2em 1.8em .2em .4em; border: 1px solid #aaa; border-radius: 0; background-color: #fff; color: #555; font-size: 1em; }
.pmev-pagination { margin: 1em 0 1.5em; padding: 0; text-align: center; }
.pmev-pagination .pagination { display: inline-flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 0; padding: 0; border: 0; box-shadow: none; }
.pmev-pagination .page-item { margin: 0 0 0 -1px; padding: 0; background: none; }
.pmev-pagination .page-item:first-child { margin-left: 0; }
.pmev-pagination .page-link { display: flex; align-items: center; justify-content: center; min-width: 2.1em; height: 2.1em; padding: 0 .6em; font-size: .9em;
	border: 1px solid #ddd; border-radius: 0; background: #fff; color: #666; text-decoration: none; line-height: 1; box-shadow: none; }
.pmev-pagination .page-item:first-child .page-link { border-radius: 4px 0 0 4px; }
.pmev-pagination .page-item:last-child .page-link { border-radius: 0 4px 4px 0; }
.pmev-pagination a.page-link:hover { background: #f5f5f5; color: #333; }
.pmev-pagination .page-item.active .page-link { background: #f5f5f5; color: #999; }
.pmev-pagination .page-item.disabled .page-link { background: #f5f5f5; color: #aaa; }
.pmev-pagination .pmev-counter { display: none; }

/* Handy: Bild unter den Inhalt */
@media (max-width: 768px) {
	.pmev-cols { flex-direction: column; }
	.pmev-image { align-self: center; max-width: 60%; }
	.pmevents-detail .pmev-title { font-size: 24px; }
}

/* Feinschliff Liste */
.pmev-entry .pmev-date { padding-top: 4px; }
.pmev-entry .pmev-title { margin-bottom: 0; }
.pmev-entry .pmev-location { margin-top: 0; }
/* Blätterleiste: kleinere, quadratische Felder, aktive Seite ohne zusätzliche Linie */
.pmev-pagination .page-link { width: 1.9em; min-width: 1.9em; height: 1.9em; padding: 0; font-size: .85em; }
.pmev-pagination .page-item.active .page-link,
.pmev-pagination .page-link:focus { border-color: #ddd !important; outline: 0 !important; box-shadow: none !important; z-index: auto; }
.pmev-entry p { line-height: 1.35; margin-bottom: .2em; }
.pmev-limitbox select { min-width: 0; width: 4.2em; padding-right: 1.4em; }
.pmev-entry { margin-bottom: 1.1em; }

/* Alle fetten Teile in #666 */
.pmev-entry .pmev-title a, .pmevents .pmev-label,
.pmevents-form .control-label, .pmevents-form .control-label label, .pmev-fieldset legend { color: #666; }
.pmev-entry .pmev-title a:hover { color: #333; }

/* Titel Detailseite (Vorgabe Pat) */
.pmevents-detail .pmev-title { font-size: 23px; padding-top: 4px; padding-bottom: 8px; letter-spacing: 0.5px; }
@media (max-width: 768px) { .pmevents-detail .pmev-title { font-size: 23px; } }
.pmevents-detail { padding-top: 6px; }
.pmevents-detail .pmev-title { padding-top: 10px; }
.pmevents-detail .pmev-title { margin-bottom: .2em; }