/* Shared by "Rreth RTSH" and "Programi i transparencës" (layout itself comes from style.css .rreth-rtsh-container). */
.rreth-rtsh-container .tab-page-content > :first-child { margin-top: 0; }
.rreth-rtsh-container .tab-page-content h2,
.rreth-rtsh-container .tab-page-content h3 { margin-top: 0; }

.rtsh-doc-list .rtsh-doc-title { color: #333; text-decoration: none; }
.rtsh-doc-list .rtsh-doc-title:hover { color: #cb1212; text-decoration: underline; }
.rtsh-doc-list .rtsh-doc-meta { color: #666; font-size: 12px; }

.rtsh-doc-years { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.rtsh-doc-years button {
	border: 1px solid #ddd; background: #f5f5f5; color: #333; border-radius: 999px;
	padding: 4px 12px; font-size: 13px; font-weight: 600; cursor: pointer;
}
.rtsh-doc-years button:hover { border-color: #cb1212; color: #cb1212; }
.rtsh-doc-years button.is-active { background: #cb1212; border-color: #cb1212; color: #fff; }

.rtsh-doc-more {
	display: block; margin: 8px auto 0; padding: 9px 18px; border: 1px solid #cb1212; border-radius: 4px;
	background: #fff; color: #cb1212; font-weight: 700; cursor: pointer;
}
.rtsh-doc-more:hover { background: #cb1212; color: #fff; }
.rtsh-doc-more[hidden], .vendimet-list-item[hidden] { display: none !important; }

html.rtsh-dark .rtsh-doc-list .rtsh-doc-title { color: #e6e6e8 !important; }
html.rtsh-dark .rtsh-doc-years button { background: #1c1e23; border-color: #3a3d44; color: #e6e6e8; }
html.rtsh-dark .rtsh-doc-years button.is-active { background: #cb1212; border-color: #cb1212; color: #fff; }
html.rtsh-dark .rtsh-doc-more { background: transparent; color: #ff6b6b; border-color: #ff6b6b; }

/* Tables on small screens (Rreth RTSH + all transparency skins). Gutenberg's "has-fixed-layout"
   squeezed every column into the screen width; let them take their natural width and scroll. */
.rtsh-tab-table-scroll { position: relative; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.rtsh-tab-table-scroll table.rtsh-table { border-collapse: collapse; }
.rtsh-tab-table-scroll table.rtsh-table td,
.rtsh-tab-table-scroll table.rtsh-table th { border: 1px solid #ddd; padding: 6px 8px; }
html.rtsh-dark .rtsh-tab-table-scroll table.rtsh-table td,
html.rtsh-dark .rtsh-tab-table-scroll table.rtsh-table th { border-color: #3a3d44; }
@media (max-width: 767px) {
	.rtsh-tab-table-scroll table.rtsh-table,
	.wp-block-table .rtsh-tab-table-scroll table.has-fixed-layout {
		table-layout: auto !important;
		width: auto !important;
		min-width: 100%;
		display: table !important;
		font-size: 14px;
		line-height: 1.4;
	}
	.rtsh-tab-table-scroll table.rtsh-table td,
	.rtsh-tab-table-scroll table.rtsh-table th {
		padding: 8px 10px;
		word-break: normal !important;
		overflow-wrap: normal !important;
		vertical-align: top;
	}
	.rtsh-tab-table-scroll table.rtsh-table--wide td,
	.rtsh-tab-table-scroll table.rtsh-table--wide th { white-space: nowrap; }
	.rtsh-tab-table-scroll table.rtsh-table--wide tr > :first-child {
		position: sticky;
		left: 0;
		z-index: 1;
		background: #fff;
		font-weight: 700;
		box-shadow: 1px 0 0 #ddd, 4px 0 6px -4px rgba(0, 0, 0, .25);
	}
	.myContentsDiv .rtsh-tab-table-scroll table.rtsh-table--wide tr > :first-child { background: #f5f5f5; }
	/* Edge shadows: there is more to scroll. */
	.rtsh-tab-table-scroll.has-more-right { box-shadow: inset -14px 0 12px -12px rgba(0, 0, 0, .35); }
	.rtsh-tab-table-scroll.has-more-left.has-more-right { box-shadow: inset -14px 0 12px -12px rgba(0, 0, 0, .35), inset 14px 0 12px -12px rgba(0, 0, 0, .2); }
	html.rtsh-dark .rtsh-tab-table-scroll table.rtsh-table--wide tr > :first-child { background: #1c1e23; }
}

/* Desktop: the tab layout always uses the full width. .blok-body is a flex container without a
   width for its .row, so with short titles (e.g. "Vendim nr.49 …") the whole block shrank. */
@media (min-width: 768px) {
	.rreth-rtsh-container .blok-body > .row { flex: 1 1 100%; width: 100%; min-width: 0; }
	.rreth-rtsh-container .tab-content { flex: 1 1 0%; min-width: 0; }
}


/* PDF preview that expands under the document (desktop) */
.rtsh-pdf-inline { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .25s ease, margin .25s ease; margin: 0; }
.rtsh-pdf-inline.is-open { grid-template-rows: 1fr; margin: 12px 0 4px; }
.rtsh-pdf-inline-inner { overflow: hidden; min-height: 0; border-radius: 10px; }
.rtsh-pdf-inline.is-open .rtsh-pdf-inline-inner { border: 1px solid #ddd; box-shadow: 0 6px 20px rgba(0, 0, 0, .08); }
.rtsh-pdf-inline-bar { display: flex; justify-content: flex-end; gap: 8px; padding: 8px 10px; background: #f5f5f5; border-bottom: 1px solid #e6e6e8; }
.rtsh-pdf-inline-bar a, .rtsh-pdf-inline-bar button {
	display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border: 1px solid #ccc; border-radius: 6px;
	background: #fff; color: #333 !important; font: inherit; font-size: 13px; font-weight: 600; text-decoration: none !important; cursor: pointer;
}
.rtsh-pdf-inline-bar a:hover, .rtsh-pdf-inline-bar button:hover { border-color: #cb1212; color: #cb1212 !important; }
.rtsh-pdf-inline-bar .rtsh-pdf-close { background: #cb1212; border-color: #cb1212; color: #fff !important; }
.rtsh-pdf-inline-bar .rtsh-pdf-close:hover { background: #a50f0f; color: #fff !important; }
.rtsh-pdf-inline-frame { display: block; width: 100%; height: 75vh; min-height: 480px; border: 0; background: #525659; }
.rtsh-pdf-is-open { background: #fff8f8; }
.rtsh-pdf-is-open .rtsh-doc-title { color: #cb1212 !important; font-weight: 600; }
html.rtsh-dark .rtsh-pdf-inline-bar { background: #22252b; border-color: #2c2f36; }
html.rtsh-dark .rtsh-pdf-inline-bar a, html.rtsh-dark .rtsh-pdf-inline-bar button:not(.rtsh-pdf-close) { background: #1c1e23; border-color: #3a3d44; color: #e6e6e8 !important; }
html.rtsh-dark .rtsh-pdf-is-open { background: #2a1d1f; }
@media (prefers-reduced-motion: reduce) { .rtsh-pdf-inline { transition: none; } }

/* Mobile tabs: horizontal list that clearly shows there is more (fades, arrows, position bar). */
.rtsh-tabs-arrow, .rtsh-tabs-progress { display: none; }
@media (min-width: 768px) {
	/* On desktop the wrapper simply takes the menu's place in the layout. */
	.rreth-rtsh-container .rtsh-tabs-scroller { flex: 0 0 280px; max-width: 280px; }
	.rreth-rtsh-container .rtsh-tabs-scroller .tab-menu { max-width: 100%; }
}
@media (max-width: 767px) {
	.rtsh-tabs-scroller { position: relative; flex: 0 0 100%; width: 100%; min-width: 0; margin: 0 0 18px; }
	.rtsh-tabs-scroller .tab-menu {
		margin: 0 !important;
		padding: 2px 0 12px !important;
		scrollbar-width: none !important;
		scroll-snap-type: x proximity;
		scroll-padding: 0 48px;
	}
	.rtsh-tabs-scroller .tab-menu::-webkit-scrollbar { display: none !important; }
	.rtsh-tabs-scroller .tab-menu li { scroll-snap-align: start; }
	.rtsh-tabs-scroller .tab-menu li a { border-radius: 999px; padding: 9px 16px; box-shadow: inset 0 0 0 1px #e3e3e6; }
	.rtsh-tabs-scroller .tab-menu li.active a { box-shadow: 0 4px 12px rgba(203, 18, 18, .28); }

	/* Edge fades: the next tab stays half visible under them. */
	.rtsh-tabs-scroller::before,
	.rtsh-tabs-scroller::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 12px;
		width: 64px;
		pointer-events: none;
		opacity: 0;
		transition: opacity .25s;
		z-index: 1;
	}
	.rtsh-tabs-scroller::before { left: 0; background: linear-gradient(to right, #fff 30%, rgba(255, 255, 255, 0)); }
	.rtsh-tabs-scroller::after { right: 0; background: linear-gradient(to left, #fff 30%, rgba(255, 255, 255, 0)); }
	.rtsh-tabs-scroller.has-more-left::before,
	.rtsh-tabs-scroller.has-more-right::after { opacity: 1; }

	/* Arrows: white round buttons with a red chevron. */
	.rtsh-tabs-arrow {
		position: absolute;
		top: calc(50% - 6px); /* centred on the tabs (the 12px below are the position bar) */
		z-index: 2;
		display: grid;
		place-items: center;
		width: 32px;
		height: 32px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: rgba(255, 255, 255, .9);
		color: rgba(203, 18, 18, .75);
		box-shadow: 0 1px 6px rgba(0, 0, 0, .1), 0 0 0 1px rgba(0, 0, 0, .05);
		cursor: pointer;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-50%) scale(.85);
		transition: opacity .2s, visibility .2s, transform .2s, color .2s;
	}
	.rtsh-tabs-arrow:active { transform: translateY(-50%) scale(.92); color: #cb1212; }
	.rtsh-tabs-arrow--prev { left: 0; }
	.rtsh-tabs-arrow--next { right: 0; }
	.rtsh-tabs-scroller.has-more-left .rtsh-tabs-arrow--prev,
	.rtsh-tabs-scroller.has-more-right .rtsh-tabs-arrow--next { opacity: .85; visibility: visible; transform: translateY(-50%); }

	/* Position bar: how long the list is and where you are in it. */
	.rtsh-tabs-scroller.is-scrollable .rtsh-tabs-progress {
		display: block;
		position: absolute;
		left: 0;
		right: 0;
		bottom: 2px;
		height: 3px;
		border-radius: 3px;
		background: #ececee;
		overflow: hidden;
	}
	.rtsh-tabs-progress span { position: absolute; top: 0; bottom: 0; border-radius: 3px; background: #cb1212; transition: left .12s linear, width .12s linear; }

	html.rtsh-dark .rtsh-tabs-scroller::before { background: linear-gradient(to right, #121418 30%, rgba(18, 20, 24, 0)); }
	html.rtsh-dark .rtsh-tabs-scroller::after { background: linear-gradient(to left, #121418 30%, rgba(18, 20, 24, 0)); }
	html.rtsh-dark .rtsh-tabs-arrow { background: #1c1e23; color: #ff6b6b; }
	html.rtsh-dark .rtsh-tabs-progress { background: #2c2f36 !important; }
	html.rtsh-dark .rtsh-tabs-scroller .tab-menu li a { box-shadow: inset 0 0 0 1px #2c2f36; }
}
