/* ============================================================================
   Brand review — neutralising theme rules that reach into the template.

   Separate from brand-review.css on purpose: that file is generated from the
   design source (src/build.py) and is replaced wholesale whenever the design is
   regenerated. Anything written here is about THIS theme, not about the design,
   and must survive that replacement. Printed immediately after brand-review.css
   by inc/brand-review.php.

   Every rule below names the theme rule it cancels. Nothing else belongs here —
   real design changes go back to the design source.
   ========================================================================== */

/* news-template.css:815 — `h1 { float:left; width:100% }`, inherited from the
   reference ghanaweb news stylesheet, where the article H1 sits in a float
   layout. Our H1 is a normal block at the top of a normal flow: floated, it left
   the offer card no room and pushed it to x≈1231 — outside the 1215px column,
   where `overflow: clip` on #mainbody cut it off. The page looked empty below
   the H1 while every element was present and "visible". */
.brv .brv-h1 {
	float: none;
	width: auto;
	clear: both;
}

/* Same rule family for the section headings, so a future theme change to h2/h3
   cannot repeat the same trick inside our sections. */
.brv .brv-h2,
.brv h2,
.brv h3 {
	float: none;
	width: auto;
}

/* header-news.php, mobile block — the rules on
   `.page-content-area table:not(.card-table):not(.cover-table)` and on its td/th.
   They exist so a pasted content table sizes itself sensibly inside a column that
   scrolls, and they are right for those. Our bonus and payment tables are the
   opposite case: the design sizes them itself — `width: auto; min-width: 520px`
   inside .brv-table-wrap, which scrolls on the X axis — so the columns keep their
   meaning and their own compact padding.

   Two things have to be cancelled, and both come from that block:
     `width: 100%` on the table — squashes the columns into each other
       ("Üdvözlő bónus100% / 200 000 Ft35x" in one cell);
     `min-width: 110px` on td/th — six columns then demand 660px against the
       design's 520 and the table outgrows its own wrapper.

   Only tables inside .brv-table-wrap are exempted — a table pasted into a WYSIWYG
   field still gets the theme's behaviour.

   The theme's selectors score 0,3,1; loading later does not beat an equal score,
   so the selectors below add classes and an element to reach 0,4,1 and 0,4,2.
   The !important on width is kept: the theme rule has carried one before and may
   again, and losing this one silently squashes the table. */
@media screen and (max-width: 768px) {
	.brv .brv-table-wrap table.brv-table:not(.card-table) {
		table-layout: auto;
		width: auto !important;
		max-width: none;
		min-width: 520px;
	}

	.brv .brv-table-wrap table.brv-table:not(.card-table) td,
	.brv .brv-table-wrap table.brv-table:not(.card-table) th {
		min-width: 0;
	}
}

/* "Bonus terms" is a <button> now, not a link: while the page is attached to a
   match table the click has to go through the plugin's redirect, and the plugin
   only renders buttons. Styled back to look like the link it replaced. */
.brv .brv-terms__btn {
	appearance: none;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	font: inherit;
	/* Same colour the link had before (brand-review.css: .brv-terms a), so the
	   switch from <a> to <button> is invisible. */
	color: #100E0E;
	text-decoration: underline;
	cursor: pointer;
}
