/* =========================================================================
   RettZV Dokumente – CI-Kachelansicht (Frontend)
   Nur Vorschaubild + „PDF öffnen"-Button, kein eingebetteter Reader.
   Farben aus dem Theme (Fallbacks gesetzt, falls Variable fehlt).
   ========================================================================= */

.rzdok{
	--rz-red:  var(--rz-red,  #fe0000);
	--rz-slate:var(--rz-slate,#5b6b7a);
	--rz-line: #e6e9ee;
	--rz-muted:#5b6b7a;
	margin: 1.2rem 0 2rem;
}

/* Breite Variante: nutzt mehr Platz links/rechts (Theme-Container). */
.rzdok--breit{ }
.rzdok--breit ~ *{}
body .rzdok--breit{ }
.rz-container:has(> .rzdok--breit),
.rz-container:has(.rzdok--breit){ max-width:1240px !important; }

/* Überschrift / Einleitung (optional über Shortcode-Attribute). */
.rzdok-h{
	margin: 0 0 .35rem;
	font-size: clamp(1.35rem, 1.1rem + 1vw, 1.9rem);
	line-height: 1.15;
}
.rzdok-lead{
	margin: 0 0 1.25rem;
	color: var(--rz-muted);
	max-width: 70ch;
}

/* Raster. */
.rzdok-grid{
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 18px;
	align-items: stretch;
}

/* Einzeldokument: Kachel behält Kachelgröße, statt volle Breite zu füllen. */
.rzdok--single .rzdok-grid{
	grid-template-columns: repeat(auto-fill, minmax(240px, 300px));
	justify-content: start;
}
/* Reader-Kachel darf auch als Einzeldokument die volle Breite nutzen. */
.rzdok--single .rzdok-grid:has(.rzdok-card--reader){
	grid-template-columns: 1fr;
}

/* Kachel. */
.rzdok-card{
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--rz-line);
	border-top: 3px solid var(--rz-red);
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(16,24,40,.04), 0 2px 10px rgba(16,24,40,.05);
	transition: transform .16s ease, box-shadow .16s ease;
}
.rzdok-card:hover{
	transform: translateY(-3px);
	box-shadow: 0 6px 20px rgba(16,24,40,.12);
}

/* Vorschaubild / Deckblatt. */
.rzdok-thumb{
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4 / 3;
	background: linear-gradient(180deg,#f7f9fb 0%,#eef2f6 100%);
	border-bottom: 1px solid var(--rz-line);
	overflow: hidden;
}
.rzdok-thumb img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.rzdok-thumb--nolink{ cursor: default; }

/* Neutrales CI-Deckblatt (SVG-Platzhalter, wenn kein Bild gesetzt). */
.rzdok-cover{
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .4rem;
	color: var(--rz-slate);
}
.rzdok-cover svg{ filter: drop-shadow(0 2px 4px rgba(16,24,40,.10)); }
.rzdok-cover-label{
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	color: var(--rz-red);
}

/* Textkörper. */
.rzdok-body{
	display: flex;
	flex-direction: column;
	gap: .3rem;
	padding: 14px 16px 4px;
	flex: 1 1 auto;
}
.rzdok-t{
	font-weight: 700;
	line-height: 1.25;
	color: #1f2933;
}
.rzdok-d{
	margin: 0;
	font-size: .9rem;
	line-height: 1.4;
	color: var(--rz-muted);
}

/* „PDF öffnen"-Button.
   NUR Positionierung/Layout in der Kachel – Farbe, Größe, Hover kommen entweder
   vom Theme (Standard) oder aus der Button-Einstellungsseite (Eigener CI-Stil).
   Bewusst keine Farb-/Hintergrund-Vorgaben hier, damit der Theme-Button greift. */
.rzdok-btn{
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	align-self: flex-start;
	margin: 10px 16px 16px;
	line-height: 1;
}
.rzdok-btn svg{ flex: 0 0 auto; }
.rzdok-btn-txt{ display: inline; }

/* -------------------------------------------------------------------------
   Reader-Modus: komplettes Dokument (dFlip oder eingebettetes PDF).
   Reader-Kacheln nehmen die volle Rasterbreite ein.
   ------------------------------------------------------------------------- */
.rzdok-card--reader{
	grid-column: 1 / -1;
}
.rzdok-card--reader .rzdok-body{
	padding: 16px 18px 8px;
}
.rzdok-reader{
	padding: 0 18px 4px;
}
.rzdok-reader .df-container,
.rzdok-reader ._df_book,
.rzdok-reader ._df_thumb{
	max-width: 100%;
}
.rzdok-embed{
	width: 100%;
	height: 70vh;
	min-height: 480px;
	border: 1px solid var(--rz-line);
	border-radius: 8px;
	background: #f7f9fb;
}

/* Leerzustand. */
.rzdok-empty{
	margin: 0;
	padding: 18px 20px;
	background: #f5f5f5;
	border: 1px dashed var(--rz-line);
	border-radius: 10px;
	color: var(--rz-muted);
}

/* Editor: Kachel-Vorschau nicht zu breit. */
.block-editor-block-list__layout .rzdok-grid{
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

/* Kleine Screens. */
@media (max-width: 480px){
	.rzdok-grid{ grid-template-columns: 1fr 1fr; gap: 12px; }
	.rzdok-t{ font-size: .95rem; }
}