/* ==========================================================================
   ABB News — Profile pages (columnist, reporter) + single video
   ========================================================================== */

.abb-profile { padding-block: var(--abb-space-5) var(--abb-space-7); }
.abb-profile__pagetitle { text-align: center; font-size: var(--abb-fs-2xl); color: var(--abb-red); margin: 0 0 var(--abb-space-5); position: relative; }
.abb-profile__pagetitle::after { content: ""; display: block; width: 60px; height: 3px; background: var(--abb-red); margin: var(--abb-space-2) auto 0; }

/* ---- Header ---- */
.abb-profile__head {
	display: grid; grid-template-columns: 240px 1fr 280px; gap: var(--abb-space-6);
	background: #fff; border: 1px solid var(--abb-border); border-radius: var(--abb-radius);
	padding: var(--abb-space-6); margin-bottom: var(--abb-space-5); align-items: start;
}
.abb-profile__head--reporter { grid-template-columns: 240px 1fr 300px; }
.abb-profile__photo img { width: 100%; border-radius: var(--abb-radius); object-fit: cover; }
.abb-profile__label { display: inline-block; background: var(--abb-red); color: #fff; font-family: var(--abb-font-heading); font-size: var(--abb-fs-xs); padding: 0.2rem 0.7rem; border-radius: var(--abb-radius-sm); margin-bottom: var(--abb-space-2); }
.abb-profile__name { font-size: var(--abb-fs-3xl); margin: 0 0 var(--abb-space-2); display: flex; align-items: center; gap: var(--abb-space-2); }
.abb-profile__verified { display: inline-grid; place-items: center; width: 24px; height: 24px; background: var(--abb-success); color: #fff; border-radius: 50%; font-size: 0.8rem; }
.abb-profile__role { color: var(--abb-text-muted); font-size: var(--abb-fs-lg); margin: 0 0 var(--abb-space-3); }
.abb-profile__bio { color: var(--abb-text); line-height: 2.0; font-size: var(--abb-fs-md); }
.abb-profile__social { display: flex; gap: var(--abb-space-2); margin-top: var(--abb-space-4); }
.abb-profile__social a { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--abb-offwhite); border: 1px solid var(--abb-border); color: var(--abb-text-muted); font-family: var(--abb-font-latin); }
.abb-profile__social a:hover { background: var(--abb-red); color: #fff; border-color: var(--abb-red); }

/* Stats rail (columnist: vertical 3) */
.abb-profile__stats { display: flex; flex-direction: column; gap: var(--abb-space-3); }
.abb-stat { display: flex; align-items: center; justify-content: space-between; gap: var(--abb-space-3); padding: var(--abb-space-3) var(--abb-space-4); background: var(--abb-offwhite); border-radius: var(--abb-radius-sm); }
.abb-stat__label { font-family: var(--abb-font-heading); font-size: var(--abb-fs-sm); color: var(--abb-text-muted); }
.abb-stat__value { font-family: var(--abb-font-latin); font-weight: 800; font-size: var(--abb-fs-xl); color: var(--abb-red); }

/* Reporter about box (right rail) */
.abb-profile__aboutbox { background: var(--abb-offwhite); border-radius: var(--abb-radius); padding: var(--abb-space-4); }
.abb-profile__aboutbox-title { font-family: var(--abb-font-heading); font-size: var(--abb-fs-md); color: var(--abb-red); margin: 0 0 var(--abb-space-3); }
.abb-about__row { display: flex; justify-content: space-between; gap: var(--abb-space-3); padding: var(--abb-space-2) 0; border-bottom: 1px solid var(--abb-border-light); font-size: var(--abb-fs-sm); }
.abb-about__row:last-child { border-bottom: none; }
.abb-about__key { color: var(--abb-red); font-family: var(--abb-font-heading); flex: none; }
.abb-about__val { color: var(--abb-text-muted); text-align: start; }

/* Reporter 4-stat bar */
.abb-profile__statbar { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--abb-space-4); margin-bottom: var(--abb-space-5); }
.abb-profile__statbar .abb-stat { flex-direction: column; text-align: center; padding: var(--abb-space-4); border: 1px solid var(--abb-border); background: #fff; }
.abb-profile__statbar .abb-stat__value { font-size: var(--abb-fs-2xl); }

/* ---- Body grid ---- */
.abb-profile__grid { display: grid; grid-template-columns: 1fr 340px; gap: var(--abb-space-6); align-items: start; }
.abb-profile__main { background: #fff; border: 1px solid var(--abb-border); border-radius: var(--abb-radius); padding: var(--abb-space-5); }
.abb-profile__side { display: flex; flex-direction: column; gap: var(--abb-space-5); }
.abb-profile__list { display: flex; flex-direction: column; }

/* About box in columnist sidebar */
.abb-about__row + .abb-about__row { }

/* ---- Suggested columnists carousel ---- */
.abb-suggested { margin-top: var(--abb-space-6); background: #fff; border: 1px solid var(--abb-border); border-radius: var(--abb-radius); padding: var(--abb-space-5); }
.abb-suggested__title { text-align: center; margin-bottom: var(--abb-space-4); }
.abb-suggested__row { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--abb-space-4); }
.abb-suggested__card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: var(--abb-space-2); padding: var(--abb-space-4); border: 1px solid var(--abb-border-light); border-radius: var(--abb-radius); }
.abb-suggested__card:hover { border-color: var(--abb-red); }
.abb-suggested__photo img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.abb-suggested__name { font-family: var(--abb-font-heading); color: var(--abb-text); font-size: var(--abb-fs-md); }
.abb-suggested__role { font-size: var(--abb-fs-xs); color: var(--abb-text-soft); }
.abb-suggested__btn { margin-top: var(--abb-space-2); font-size: var(--abb-fs-xs); color: var(--abb-red); border: 1px solid var(--abb-red); border-radius: var(--abb-radius-sm); padding: 0.25rem 0.8rem; }

/* ==========================================================================
   Single video
   ========================================================================== */
.abb-video-single { padding-block: var(--abb-space-5) var(--abb-space-7); }
.abb-video-single__grid { display: grid; grid-template-columns: 1fr 340px; gap: var(--abb-space-6); align-items: start; }
.abb-video-single__main { background: #fff; border: 1px solid var(--abb-border); border-radius: var(--abb-radius); padding: var(--abb-space-5); }
.abb-video-player { position: relative; aspect-ratio: 16/9; background: #000; border-radius: var(--abb-radius); overflow: hidden; margin-bottom: var(--abb-space-4); }
.abb-video-player__embed, .abb-video-player__embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.abb-video-player__poster, .abb-video-player__link { display: block; width: 100%; height: 100%; }
.abb-video-player__poster img, .abb-video-player__link img { width: 100%; height: 100%; object-fit: cover; }
.abb-video-player__play { position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(50%,-50%); width: 68px; height: 68px; border-radius: 50%; background: rgba(131,4,11,0.9); }
.abb-video-player__play::after { content: ""; position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(-40%,-50%); border-left: 20px solid #fff; border-top: 12px solid transparent; border-bottom: 12px solid transparent; }
.abb-video-single__title { font-size: var(--abb-fs-2xl); margin: 0 0 var(--abb-space-2); }
.abb-video-single__meta { display: flex; gap: var(--abb-space-2); align-items: center; font-family: var(--abb-font-latin); font-size: var(--abb-fs-sm); color: var(--abb-text-soft); margin-bottom: var(--abb-space-3); }
.abb-video-single__desc { line-height: 2.0; color: var(--abb-text); margin-top: var(--abb-space-4); }

.abb-video-single__side { }
.abb-video-single__morelist { display: flex; flex-direction: column; gap: var(--abb-space-3); }
.abb-vminor { display: grid; grid-template-columns: 120px 1fr; gap: var(--abb-space-3); align-items: start; }
.abb-vminor__thumb { position: relative; aspect-ratio: 16/10; border-radius: var(--abb-radius-sm); overflow: hidden; background: var(--abb-border-light); }
.abb-vminor__thumb img { width: 100%; height: 100%; object-fit: cover; }
.abb-vminor__play { position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(50%,-50%); width: 30px; height: 30px; border-radius: 50%; background: rgba(131,4,11,0.85); }
.abb-vminor__play::after { content: ""; position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(-40%,-50%); border-left: 9px solid #fff; border-top: 5px solid transparent; border-bottom: 5px solid transparent; }
.abb-vminor__dur { position: absolute; bottom: 4px; inset-inline-end: 4px; background: rgba(0,0,0,0.8); color: #fff; font-size: 0.65rem; padding: 1px 4px; border-radius: 2px; }
.abb-vminor__title { font-family: var(--abb-font-heading); font-size: var(--abb-fs-sm); line-height: 1.7; color: var(--abb-text); }
.abb-vminor:hover .abb-vminor__title { color: var(--abb-red); }

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.abb-profile__head, .abb-profile__head--reporter { grid-template-columns: 200px 1fr; }
	.abb-profile__stats, .abb-profile__aboutbox { grid-column: 1 / -1; }
	.abb-profile__stats { flex-direction: row; }
	.abb-profile__grid, .abb-video-single__grid { grid-template-columns: 1fr; }
	.abb-suggested__row { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
	.abb-profile__head { grid-template-columns: 1fr; text-align: center; }
	.abb-profile__photo img { max-width: 200px; margin: 0 auto; }
	.abb-profile__social { justify-content: center; }
	.abb-profile__stats { flex-direction: column; }
	.abb-profile__statbar { grid-template-columns: 1fr 1fr; }
	.abb-suggested__row { grid-template-columns: 1fr 1fr; }
	.abb-vminor { grid-template-columns: 100px 1fr; }
}

/* ==========================================================================
   Video archive (/video/) — listing grid
   ========================================================================== */
.abb-videos { padding-block: var(--abb-space-5) var(--abb-space-7); }
.abb-videos__head { border-bottom: 3px solid var(--abb-red); padding-bottom: var(--abb-space-4); margin-bottom: var(--abb-space-5); }
.abb-videos__title { font-size: var(--abb-fs-3xl); color: var(--abb-red); margin: 0 0 var(--abb-space-2); }
.abb-videos__sub { color: var(--abb-text-muted); font-size: var(--abb-fs-md); }

/* Featured */
.abb-videos__featured { display: grid; grid-template-columns: 2fr 1fr; gap: var(--abb-space-5); margin-bottom: var(--abb-space-6); }
.abb-videos__feat-main { display: block; background: #fff; border: 1px solid var(--abb-border); border-radius: var(--abb-radius); overflow: hidden; }
.abb-videos__feat-thumb { position: relative; display: block; aspect-ratio: 16/9; background: #000; }
.abb-videos__feat-thumb img { width: 100%; height: 100%; object-fit: cover; }
.abb-videos__feat-badge { position: absolute; top: var(--abb-space-3); inset-inline-start: var(--abb-space-3); background: var(--abb-red); color: #fff; font-family: var(--abb-font-heading); font-size: var(--abb-fs-xs); padding: 0.25rem 0.7rem; border-radius: var(--abb-radius-sm); }
.abb-videos__feat-body { padding: var(--abb-space-5); }
.abb-videos__feat-title { display: block; font-family: var(--abb-font-heading); font-size: var(--abb-fs-2xl); line-height: 1.7; color: var(--abb-text); margin-bottom: var(--abb-space-2); }
.abb-videos__feat-main:hover .abb-videos__feat-title { color: var(--abb-red); }
.abb-videos__feat-excerpt { display: block; color: var(--abb-text-muted); font-size: var(--abb-fs-md); line-height: 1.9; margin-bottom: var(--abb-space-2); }
.abb-videos__feat-meta { display: block; font-family: var(--abb-font-latin); font-size: var(--abb-fs-sm); color: var(--abb-text-soft); }
.abb-videos__feat-side { display: flex; flex-direction: column; gap: var(--abb-space-3); justify-content: space-between; }
.abb-videos__feat-side .abb-vminor { flex: 1; align-items: center; }

/* Play buttons */
.abb-vtile__play, .abb-vtile__play--lg { position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(50%,-50%); width: 48px; height: 48px; border-radius: 50%; background: rgba(131,4,11,0.9); }
.abb-vtile__play--lg { width: 68px; height: 68px; }
.abb-vtile__play::after, .abb-vtile__play--lg::after { content: ""; position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(-40%,-50%); border-left: 15px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.abb-vtile__play--lg::after { border-left: 20px solid #fff; border-top: 12px solid transparent; border-bottom: 12px solid transparent; }
.abb-vtile__dur { position: absolute; bottom: 6px; inset-inline-end: 6px; background: rgba(0,0,0,0.8); color: #fff; font-size: 0.7rem; padding: 2px 5px; border-radius: 2px; }

/* Latest grid */
.abb-videos__section { margin-bottom: var(--abb-space-6); }
.abb-videos__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--abb-space-4); margin-top: var(--abb-space-4); }
.abb-vtile { display: block; }
.abb-vtile__thumb { position: relative; display: block; aspect-ratio: 16/10; border-radius: var(--abb-radius-sm); overflow: hidden; background: var(--abb-border-light); margin-bottom: var(--abb-space-2); }
.abb-vtile__thumb img { width: 100%; height: 100%; object-fit: cover; }
.abb-vtile__title { display: block; font-family: var(--abb-font-heading); font-size: var(--abb-fs-base); line-height: 1.7; color: var(--abb-text); }
.abb-vtile:hover .abb-vtile__title { color: var(--abb-red); }
.abb-vtile__meta { display: block; font-family: var(--abb-font-latin); font-size: var(--abb-fs-xs); color: var(--abb-text-soft); margin-top: var(--abb-space-1); }

/* Programs */
.abb-videos__programs { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--abb-space-4); margin-top: var(--abb-space-4); }
.abb-program { display: block; }
.abb-program__thumb { position: relative; display: block; aspect-ratio: 4/3; border-radius: var(--abb-radius-sm); overflow: hidden; background: var(--abb-navy); margin-bottom: var(--abb-space-2); }
.abb-program__thumb img { width: 100%; height: 100%; object-fit: cover; opacity: 0.65; }
.abb-program__eps { position: absolute; top: 6px; inset-inline-start: 6px; background: var(--abb-red); color: #fff; font-size: 0.7rem; padding: 2px 6px; border-radius: var(--abb-radius-sm); }
.abb-program__overlay { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: var(--abb-space-3); color: #fff; font-family: var(--abb-font-heading); font-size: var(--abb-fs-lg); line-height: 1.6; }
.abb-program__cta { font-size: var(--abb-fs-xs); color: var(--abb-red); }

@media (max-width: 1024px) {
	.abb-videos__featured { grid-template-columns: 1fr; }
	.abb-videos__grid { grid-template-columns: repeat(3, 1fr); }
	.abb-videos__programs { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
	.abb-videos__grid, .abb-videos__programs { grid-template-columns: 1fr 1fr; }
}

/* Dense video list (archive "تازہ ترین ویڈیوز") */
.abb-videos__list { display: flex; flex-direction: column; margin-top: var(--abb-space-4); }
.abb-vrow { display: grid; grid-template-columns: 180px 1fr; gap: var(--abb-space-4); padding: var(--abb-space-4) 0; border-bottom: 1px solid var(--abb-border-light); }
.abb-vrow:first-child { padding-top: 0; }
.abb-vrow:last-child { border-bottom: none; }
.abb-vrow__thumb { position: relative; aspect-ratio: 16/10; border-radius: var(--abb-radius-sm); overflow: hidden; background: var(--abb-border-light); }
.abb-vrow__thumb img { width: 100%; height: 100%; object-fit: cover; }
.abb-vrow__play { position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(50%,-50%); width: 40px; height: 40px; border-radius: 50%; background: rgba(131,4,11,0.9); }
.abb-vrow__play::after { content: ""; position: absolute; top: 50%; inset-inline-start: 50%; transform: translate(-40%,-50%); border-left: 13px solid #fff; border-top: 8px solid transparent; border-bottom: 8px solid transparent; }
.abb-vrow__dur { position: absolute; bottom: 5px; inset-inline-end: 5px; background: rgba(0,0,0,0.8); color: #fff; font-size: 0.7rem; padding: 1px 5px; border-radius: 2px; }
.abb-vrow__body { min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.abb-vrow__title { font-family: var(--abb-font-heading); font-size: var(--abb-fs-lg); line-height: 1.7; color: var(--abb-text); margin-bottom: var(--abb-space-2); }
.abb-vrow:hover .abb-vrow__title { color: var(--abb-red); }
.abb-vrow__meta { font-family: var(--abb-font-latin); font-size: var(--abb-fs-xs); color: var(--abb-text-soft); }
@media (max-width: 640px) { .abb-vrow { grid-template-columns: 130px 1fr; gap: var(--abb-space-3); } .abb-vrow__title { font-size: var(--abb-fs-base); } }
