/**
 * Reports & Documents Library — front-end styles.
 * Har value CSS variable se aati hai jo Design panel generate karta hai;
 * fallback values plugin ke defaults hain.
 */

/* ---------------------------------------------------------- wrapper */
.rdl-wrap {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--rdl-container, none);
	margin: var(--rdl-section-margin, 0);
	padding: var(--rdl-section-pad, 0);
	font-family: var(--rdl-base-font, inherit);
	font-size: var(--rdl-base-size, 15px);
	color: inherit;
}
.rdl-wrap *,
.rdl-wrap *::before,
.rdl-wrap *::after { box-sizing: border-box; }

/* Overflow guards — grid/flex items ko container se bahar jane se rokte hain.
   `min-width:0` zaroori hai: grid aur flex items ka default `min-width:auto`
   unhe apne content se chhota hone nahi deta, jis se page side me scroll ho jata hai. */
.rdl-bar,
.rdl-head,
.rdl-row,
.rdl-pagination { max-width: 100%; }

.rdl-tabs,
.rdl-search,
.rdl-cell,
.rdl-head > span { min-width: 0; }

.rdl-col-title > * { min-width: 0; }

.rdl-head > span,
.rdl-name,
.rdl-col-type,
.rdl-col-year { overflow-wrap: anywhere; word-break: break-word; }

/* ------------------------------------------------------- filter bar */
.rdl-bar {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var(--rdl-bar-gap, 26px);
}

.rdl-tabs-wrap {
	position: relative;
	flex: 1 1 auto;
	min-width: 0;
	max-width: 100%;
}

.rdl-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--rdl-tab-gap, 6px);
	justify-content: var(--rdl-tabs-align, flex-start);
	flex: 1 1 auto;
	scroll-behavior: smooth;
}

/* ---------------------------------------------- scroll hint (fade) */
/* JS `.can-left` / `.can-right` lagata hai jab tabs waqai scroll ho sakti hain. */
.rdl-tabs-wrap::before,
.rdl-tabs-wrap::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: var(--rdl-hint-w, 44px);
	pointer-events: none;
	opacity: 0;
	transition: opacity var(--rdl-speed, 220ms) ease;
	z-index: 2;
}
.rdl-tabs-wrap::before {
	left: 0;
	background: linear-gradient(to right, var(--rdl-hint-bg, #fff) 15%, transparent 100%);
}
.rdl-tabs-wrap::after {
	right: 0;
	background: linear-gradient(to left, var(--rdl-hint-bg, #fff) 15%, transparent 100%);
}
.rdl-tabs-wrap[data-hint="both"].can-left::before,
.rdl-tabs-wrap[data-hint="fade"].can-left::before { opacity: 1; }
.rdl-tabs-wrap[data-hint="both"].can-right::after,
.rdl-tabs-wrap[data-hint="fade"].can-right::after { opacity: 1; }

/* -------------------------------------------- scroll hint (arrows) */
.rdl-wrap .rdl-tabs-nav {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--rdl-arrow-size, 30px);
	height: var(--rdl-arrow-size, 30px);
	margin: 0;
	padding: 0;
	transform: translateY(-50%);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	appearance: none;
	-webkit-appearance: none;
	text-shadow: none !important;
	color: var(--rdl-arrow-color, #12284c) !important;
	background: var(--rdl-arrow-bg, #fff) !important;
	background-image: none !important;
	border-style: solid !important;
	border-width: var(--rdl-arrow-bw, 1px) !important;
	border-color: var(--rdl-arrow-border, #e2e6ec) !important;
	border-radius: var(--rdl-arrow-radius, 50px) !important;
	box-shadow: var(--rdl-arrow-shadow, 0 2px 8px rgba(16, 24, 40, .08)) !important;
	transition: opacity var(--rdl-speed, 220ms) ease, background var(--rdl-speed, 220ms) ease, color var(--rdl-speed, 220ms) ease, transform var(--rdl-speed, 220ms) ease;
}
.rdl-wrap .rdl-tabs-nav svg { width: var(--rdl-arrow-icon, 15px); height: var(--rdl-arrow-icon, 15px); display: block; }
.rdl-wrap .rdl-tabs-nav:hover {
	color: var(--rdl-arrow-hcolor, #fff) !important;
	background: var(--rdl-arrow-hbg, #12284c) !important;
	transform: translateY(-50%) scale(1.06);
}
.rdl-tabs-prev { left: 0; }
.rdl-tabs-next { right: 0; }

.rdl-tabs-wrap[data-hint="both"].can-left .rdl-tabs-prev,
.rdl-tabs-wrap[data-hint="arrows"].can-left .rdl-tabs-prev,
.rdl-tabs-wrap[data-hint="both"].can-right .rdl-tabs-next,
.rdl-tabs-wrap[data-hint="arrows"].can-right .rdl-tabs-next { opacity: 1; visibility: visible; }

/* Jagah sirf us taraf chhoreain jahan arrow waqai dikh raha ho, warna pehle
   tab ke aage khali space reh jati hai. */
.rdl-tabs-wrap[data-hint="both"] .rdl-tabs,
.rdl-tabs-wrap[data-hint="arrows"] .rdl-tabs {
	transition: padding var(--rdl-speed, 220ms) ease;
}
.rdl-tabs-wrap[data-hint="both"].can-left .rdl-tabs,
.rdl-tabs-wrap[data-hint="arrows"].can-left .rdl-tabs {
	padding-left: calc(var(--rdl-arrow-size, 30px) + 6px);
}
.rdl-tabs-wrap[data-hint="both"].can-right .rdl-tabs,
.rdl-tabs-wrap[data-hint="arrows"].can-right .rdl-tabs {
	padding-right: calc(var(--rdl-arrow-size, 30px) + 6px);
}

/* Theme button styles ko rokne ke liye specificity + !important. */
.rdl-wrap .rdl-tab {
	position: relative;
	display: inline-block;
	appearance: none;
	-webkit-appearance: none;
	margin: 0;
	width: auto;
	min-height: 0;
	line-height: 1.4;
	cursor: pointer;
	text-decoration: none !important;
	text-shadow: none !important;
	background: var(--rdl-tab-bg, transparent) !important;
	background-image: none !important;
	color: var(--rdl-tab-color, #5b6472) !important;
	border-style: solid !important;
	border-width: var(--rdl-tab-bw, 1px) !important;
	border-color: var(--rdl-tab-border, transparent) !important;
	border-radius: var(--rdl-tab-radius, 4px) !important;
	padding: var(--rdl-tab-pad, 9px 18px) !important;
	box-shadow: none !important;
	font-family: var(--rdl-tab-font, inherit);
	font-size: var(--rdl-tab-size, 13px);
	font-weight: var(--rdl-tab-weight, 400);
	letter-spacing: var(--rdl-tab-ls, 0);
	text-transform: var(--rdl-tab-tt, none);
	transition: all var(--rdl-speed, 220ms) cubic-bezier(.2, .7, .3, 1);
}
.rdl-wrap .rdl-tab:focus { outline: none; }
.rdl-wrap .rdl-tab:focus-visible { outline: 2px solid var(--rdl-tab-acolor, #12284c); outline-offset: 2px; }

.rdl-wrap .rdl-tab:hover {
	background: var(--rdl-tab-hbg, var(--rdl-tab-bg, transparent)) !important;
	color: var(--rdl-tab-hcolor, #12284c) !important;
	border-color: var(--rdl-tab-hborder, var(--rdl-tab-border, transparent)) !important;
}

.rdl-wrap .rdl-tab.is-active {
	background: var(--rdl-tab-abg, transparent) !important;
	color: var(--rdl-tab-acolor, #12284c) !important;
	border-color: var(--rdl-tab-aborder, #e2e6ec) !important;
	font-weight: var(--rdl-tab-aweight, 600);
}

/* tab hover effects */
.rdl-wrap[data-tab-fx="lift"]  .rdl-tab:hover { transform: translateY(-2px); }
.rdl-wrap[data-tab-fx="push"]  .rdl-tab:hover { transform: translateY(2px); }
.rdl-wrap[data-tab-fx="scale"] .rdl-tab:hover { transform: scale(1.06); }
.rdl-wrap[data-tab-fx="glow"]  .rdl-tab:hover { box-shadow: 0 6px 20px rgba(16, 24, 40, .16) !important; }
.rdl-wrap[data-tab-fx="underline"] .rdl-tab::after {
	content: "";
	position: absolute;
	left: 50%; right: 50%; bottom: 3px;
	height: 2px;
	background: currentColor;
	transition: left var(--rdl-speed, 220ms) ease, right var(--rdl-speed, 220ms) ease;
}
.rdl-wrap[data-tab-fx="underline"] .rdl-tab:hover::after,
.rdl-wrap[data-tab-fx="underline"] .rdl-tab.is-active::after { left: 18%; right: 18%; }

/* ------------------------------------------------------- search box */
.rdl-search { position: relative; display: flex; align-items: center; flex: 0 0 auto; }

.rdl-wrap .rdl-search input[type="search"] {
	width: auto;
	min-width: var(--rdl-search-width, 230px);
	max-width: 100%;
	margin: 0;
	font-family: var(--rdl-search-font, inherit);
	font-size: var(--rdl-search-size, 13px);
	line-height: 1.4;
	color: var(--rdl-search-color, #12284c) !important;
	background: var(--rdl-search-bg, #fff) !important;
	background-image: none !important;
	border-style: solid !important;
	border-width: var(--rdl-search-bw, 1px) !important;
	border-color: var(--rdl-search-border, #e2e6ec) !important;
	border-radius: var(--rdl-search-radius, 4px) !important;
	padding: var(--rdl-search-pad, 9px 38px 9px 14px) !important;
	box-shadow: var(--rdl-search-shadow, none) !important;
	transition: border-color var(--rdl-speed, 220ms) ease, box-shadow var(--rdl-speed, 220ms) ease;
}
.rdl-wrap .rdl-search input[type="search"]:focus {
	outline: none;
	border-color: var(--rdl-search-fborder, #12284c) !important;
}
.rdl-wrap .rdl-search input::placeholder { color: var(--rdl-search-ph, #8a93a0); opacity: 1; }
.rdl-search svg { position: absolute; right: 12px; color: var(--rdl-search-icon, #12284c); pointer-events: none; }

/* ----------------------------------------------------- table header */
.rdl-head,
.rdl-row {
	display: grid;
	grid-template-columns: var(--rdl-cols, minmax(220px, 2fr) 1fr 1fr 170px);
	gap: var(--rdl-col-gap, 20px);
	align-items: center;
}

.rdl-head {
	background: var(--rdl-head-bg, transparent);
	padding: var(--rdl-head-pad, 0 0 12px 0);
	border-bottom: var(--rdl-head-bw, 1px) solid var(--rdl-head-border, #e2e6ec);
	font-family: var(--rdl-head-font, inherit);
	font-size: var(--rdl-head-size, 13px);
	font-weight: var(--rdl-head-weight, 600);
	letter-spacing: var(--rdl-head-ls, 0);
	text-transform: var(--rdl-head-tt, none);
	color: var(--rdl-head-color, #12284c);
}

/* ------------------------------------------------------------ rows */
.rdl-row {
	padding: var(--rdl-row-pad, 22px 0);
	border-bottom: var(--rdl-row-bw, 1px) solid var(--rdl-row-border, #e2e6ec);
	border-radius: var(--rdl-row-radius, 0);
	transition: background var(--rdl-speed, 220ms) ease;
}
.rdl-row:hover { background: var(--rdl-row-hbg, transparent); }

.rdl-col-title { display: block; }

.rdl-thumb {
	display: block;
	overflow: hidden;
	width: 100%;
	max-width: var(--rdl-thumb-w, 190px);
	border-style: solid;
	border-width: var(--rdl-thumb-bw, 0);
	border-color: var(--rdl-thumb-border, transparent);
	border-radius: var(--rdl-thumb-radius, 2px);
	box-shadow: var(--rdl-thumb-shadow, none);
	transition: transform var(--rdl-speed, 220ms) ease, box-shadow var(--rdl-speed, 220ms) ease;
}
.rdl-thumb img { display: block; width: 100%; height: auto; transition: transform .5s ease, opacity var(--rdl-speed, 220ms) ease, filter var(--rdl-speed, 220ms) ease; }
.rdl-noimg { display: block; width: 100%; aspect-ratio: 16 / 9; background: #eef1f5; }

.rdl-wrap[data-thumb-fx="zoom"] .rdl-row:hover .rdl-thumb img { transform: scale(1.07); }
.rdl-wrap[data-thumb-fx="fade"] .rdl-row:hover .rdl-thumb img { opacity: .78; }
.rdl-wrap[data-thumb-fx="lift"] .rdl-row:hover .rdl-thumb { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(16, 24, 40, .16); }
.rdl-wrap[data-thumb-fx="grayscale"] .rdl-thumb img { filter: grayscale(1); }
.rdl-wrap[data-thumb-fx="grayscale"] .rdl-row:hover .rdl-thumb img { filter: grayscale(0); }

.rdl-wrap .rdl-name {
	display: block;
	margin-top: var(--rdl-title-mt, 10px);
	font-family: var(--rdl-title-font, inherit);
	font-size: var(--rdl-title-size, 13px);
	font-weight: var(--rdl-title-weight, 400);
	letter-spacing: var(--rdl-title-ls, 0);
	text-transform: var(--rdl-title-tt, none);
	color: var(--rdl-title-color, #12284c);
	text-decoration: none;
	transition: color var(--rdl-speed, 220ms) ease;
}
.rdl-wrap a.rdl-name:hover { color: var(--rdl-title-hcolor, #e8491f); }

.rdl-col-type {
	font-family: var(--rdl-meta-font, inherit);
	font-size: var(--rdl-type-size, 13px);
	font-weight: var(--rdl-type-weight, 400);
	color: var(--rdl-type-color, #5b6472);
}
.rdl-col-year {
	font-family: var(--rdl-meta-font, inherit);
	font-size: var(--rdl-year-size, 13px);
	font-weight: var(--rdl-year-weight, 400);
	color: var(--rdl-year-color, #5b6472);
}

/* -------------------------------------------------- download button */
.rdl-col-btn { display: flex; justify-content: var(--rdl-btn-align, flex-start); }

.rdl-wrap .rdl-btn {
	position: relative;
	display: inline-block;
	overflow: hidden;
	max-width: 100%;
	margin: 0;
	line-height: 1.3;
	text-decoration: none !important;
	text-shadow: none !important;
	color: var(--rdl-btn-color, #fff) !important;
	background: var(--rdl-btn-bg, #e8491f) !important;
	background-image: none !important;
	border-style: solid !important;
	border-width: var(--rdl-btn-bw, 0) !important;
	border-color: var(--rdl-btn-border, transparent) !important;
	border-radius: var(--rdl-btn-radius, 3px) !important;
	padding: var(--rdl-btn-pad, 12px 26px) !important;
	box-shadow: var(--rdl-btn-shadow, none) !important;
	font-family: var(--rdl-btn-font, inherit);
	font-size: var(--rdl-btn-size, 11px);
	font-weight: var(--rdl-btn-weight, 600);
	letter-spacing: var(--rdl-btn-ls, 1.3px);
	text-transform: var(--rdl-btn-tt, uppercase);
	transition: all var(--rdl-speed, 220ms) cubic-bezier(.2, .7, .3, 1);
}
.rdl-wrap .rdl-btn > span { position: relative; z-index: 2; }

.rdl-wrap .rdl-btn:hover {
	color: var(--rdl-btn-hcolor, #fff) !important;
	background: var(--rdl-btn-hbg, #c73a14) !important;
	border-color: var(--rdl-btn-hborder, var(--rdl-btn-border, transparent)) !important;
}
.rdl-wrap .rdl-btn.is-disabled { background: #c9ced6 !important; cursor: not-allowed; opacity: .8; }
.rdl-wrap .rdl-btn.is-disabled:hover { transform: none !important; }

.rdl-wrap[data-btn-fx="lift"]   .rdl-btn:hover { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(16, 24, 40, .22) !important; }
.rdl-wrap[data-btn-fx="scale"]  .rdl-btn:hover { transform: scale(1.05); }
.rdl-wrap[data-btn-fx="shadow"] .rdl-btn:hover { box-shadow: 0 14px 30px rgba(16, 24, 40, .26) !important; }

.rdl-wrap[data-btn-fx="shine"] .rdl-btn::before {
	content: "";
	position: absolute;
	top: 0; left: 0; width: 100%; height: 100%;
	background: linear-gradient(120deg, transparent 30%, rgba(255, 255, 255, .38) 50%, transparent 70%);
	transform: translateX(-120%);
	transition: transform .65s ease;
	z-index: 1;
}
.rdl-wrap[data-btn-fx="shine"] .rdl-btn:hover::before { transform: translateX(120%); }

.rdl-wrap[data-btn-fx="slide"] .rdl-btn::before {
	content: "";
	position: absolute;
	top: 0; left: 0; width: 100%; height: 100%;
	background: var(--rdl-btn-hbg, #c73a14);
	transform: translateY(100%);
	transition: transform var(--rdl-speed, 220ms) cubic-bezier(.2, .7, .3, 1);
	z-index: 1;
}
.rdl-wrap[data-btn-fx="slide"] .rdl-btn:hover::before { transform: translateY(0); }

/* ------------------------------------------------------ pagination */
.rdl-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--rdl-pg-align, center);
	gap: var(--rdl-pg-gap, 6px);
	margin-top: var(--rdl-pg-mt, 34px);
}

.rdl-wrap .rdl-pg {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--rdl-pg-box, 30px);
	height: var(--rdl-pg-box, 30px);
	margin: 0;
	padding: 0 6px;
	cursor: pointer;
	text-shadow: none !important;
	box-shadow: none !important;
	background: var(--rdl-pg-bg, transparent) !important;
	background-image: none !important;
	color: var(--rdl-pg-color, #12284c) !important;
	border-style: solid !important;
	border-width: var(--rdl-pg-bw, 0) !important;
	border-color: var(--rdl-pg-border, transparent) !important;
	border-radius: var(--rdl-pg-radius, 3px) !important;
	font-family: var(--rdl-pg-font, inherit);
	font-size: var(--rdl-pg-size, 14px);
	font-weight: var(--rdl-pg-weight, 400);
	line-height: 1;
	transition: all var(--rdl-speed, 220ms) ease;
}
.rdl-wrap .rdl-pg:hover:not(:disabled):not(.is-current) {
	color: var(--rdl-pg-hcolor, #e8491f) !important;
	background: var(--rdl-pg-hbg, transparent) !important;
	border-color: var(--rdl-pg-hborder, var(--rdl-pg-border, transparent)) !important;
}
.rdl-wrap .rdl-pg:disabled { opacity: .3; cursor: default; }
.rdl-wrap .rdl-pg.is-current {
	color: var(--rdl-pg-acolor, #e8491f) !important;
	background: var(--rdl-pg-abg, transparent) !important;
	border-color: var(--rdl-pg-aborder, var(--rdl-pg-border, transparent)) !important;
	font-weight: var(--rdl-pg-aweight, 700);
}
.rdl-dots { color: var(--rdl-pg-dots, #5b6472); padding: 0 4px; }

/* ----------------------------------------------------------- misc */
.rdl-empty { padding: 40px 0; text-align: center; color: var(--rdl-empty-color, #5b6472); }
.rdl-results { transition: opacity var(--rdl-speed, 220ms) ease; }
.rdl-results.is-loading { opacity: var(--rdl-loading-op, .35); pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
	.rdl-wrap * { transition: none !important; animation: none !important; }
	.rdl-wrap .rdl-btn:hover,
	.rdl-wrap .rdl-tab:hover { transform: none !important; }
}
