/* Pariteit met live (2026-09-30): pagina. */

/* ---- Inhoudspagina's met dealszijbalk (template-parts/page-sidebar.php) ----
   Live (/contact, /informatie-over-ons, /privacy-en-cookieverklaring): het blok
   "Vergelijk toestellen en abonnementen" staat onder de tekst in de hoofdkolom
   (3 per rij, .col-sm-4), niet in de zijbalk. De zijbalk toont alleen de deals
   met twee tabs (geen "Abonnementen zonder toestel") en de drie knoppen.
   Specificiteit hoger dan article.css, dat na dit bestand laadt. */
.page-met-zijbalk .sidebar-deals .vergelijkerBlokSider,
.page-met-zijbalk .sidebar-deals #siderBlokNav3 { display: none; }
/* Lange pagina's tonen live de zijbalkvariant wél, maar alleen vanaf 992px
   (hidden-xs hidden-sm). Zie page-sidebar.php. */
@media (min-width: 992px) {
	.page-met-zijbalk.met-zijbalk-vergelijker .sidebar-deals .vergelijkerBlokSider { display: block; }
}

.page-met-zijbalk .pagina-vergelijker .row { display: block; }
.page-met-zijbalk .pagina-vergelijker .row::after { content: ' '; display: table; clear: both; }
.page-met-zijbalk .pagina-vergelijker .pagina-vergelijker-rij { margin-top: 20px; }
.page-met-zijbalk .pagina-vergelijker .vergelijkerBlokSiderItem { width: auto; padding: 0 15px; font-size: inherit; }
.page-met-zijbalk .pagina-vergelijker .vergelijkerBlokSiderItem::after { display: none; }
@media (min-width: 768px) {
	.page-met-zijbalk .pagina-vergelijker .vergelijkerBlokSiderItem.col-sm-4 { float: left; width: 33.33333333%; }
}
.page-met-zijbalk .pagina-vergelijker .vergelijkerBlokSiderItem .fa-mobile { float: left; font-size: 80px; line-height: 1; color: #333; }
.page-met-zijbalk .pagina-vergelijker .vergelijkerBlokSiderHead { margin-left: 50px; font-weight: 600; font-size: 15px; }
.page-met-zijbalk .pagina-vergelijker .vergelijkerBlokSiderContent { margin-left: 40px; }
.page-met-zijbalk .pagina-vergelijker hr { margin: 20px 0; border: 0; border-top: 1px solid #eee; }

/* Live: div.divider.divider-dotted — 10px hoge gestippelde balk. */
.page-met-zijbalk div.divider.divider-dotted {
	margin: 20px 0;
	height: 10px;
	border: 0;
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKAQMAAAC3/F3+AAAABlBMVEX///+QkJApn3LQAAAAAnRSTlMAgJsrThgAAAAOSURBVHheYwCCUAdcJAAnnALqo5TBzAAAAABJRU5ErkJggg==') repeat-x center;
}

/* Tweede (mobiele) vergelijkerblok onder in de zijbalk: live is dat een kale
   div in .col-md-4, zonder extra zijpadding. */
.page-met-zijbalk .col-md-4 #homeVergelijkerWrap { padding-left: 0; padding-right: 0; }

/* ---- Tabellen in paginatekst ----
   Bootstrap 3 .table/.table-striped zoals live (lokaal ontbrak deze basis). */
.page-content .table { width: 100%; max-width: 100%; margin-bottom: 20px; border-collapse: collapse; border-spacing: 0; }
.page-content .table > thead > tr > th,
.page-content .table > thead > tr > td,
.page-content .table > tbody > tr > th,
.page-content .table > tbody > tr > td {
	padding: 8px;
	line-height: 1.42857143;
	vertical-align: top;
	border-top: 1px solid #ddd;
	text-align: left;
}
.page-content .table > thead > tr > th { vertical-align: bottom; }
.page-content .table > thead:first-child > tr:first-child > th { border-top: 0; }
.page-content .table-striped > tbody > tr:nth-of-type(odd) { background-color: #f9f9f9; }
/* Live: .table>thead>tr>th { border-bottom:1px solid #ddd; font-size:13px;
   font-weight:600; text-transform:uppercase; color:#666 } en #cookieTable. */
.page-content .table > thead > tr > th {
	border-bottom: 1px solid #ddd;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	color: #666;
}
.page-content #cookieTable thead tr th { text-align: left; }
.page-content #cookieTable tbody tr td { padding-left: 15px; padding-right: 15px; }

/* ---- /overzicht-alle-apple-iphones-vergelijken ----
   Live staat de modeltabel in <div id="tableAlleModellenVergelijken"
   class="table-responsive"> met td{min-width:190px}: horizontaal scrollbaar,
   ~5 modellen in beeld. Die wrapper (en de hidden-xs/visible-xs-intro's) ging
   bij de import verloren; de tabel zelf is herkenbaar aan de modelcellen. */
.page-content table.table:has(td.i13) {
	display: block;
	overflow-x: auto;
	min-height: .01%;
}
.page-content table.table:has(td.i13) > tbody > tr > td { min-width: 190px; }
/* Modelfoto's hebben alleen height="137"; main.css' img{height:auto} negeerde dat. */
.page-content table.table:has(td.i13) img[height="137"]:not([width]) { height: 137px; width: auto; max-width: none; }
@media (max-width: 767px) {
	.page-content table.table:has(td.i13) { border: 1px solid #ddd; margin-bottom: 15px; }
}
@media (max-width: 350px) {
	.page-content table.table:has(td.i13) > tbody > tr > td { font-size: 12px; }
}
/* Live toont van de twee intro's er één per schermbreedte (hidden-xs /
   visible-xs); zonder die wrappers staan ze nu direct voor de tabel. */
@media (min-width: 768px) {
	.page-content > p:has(+ table.table td.i13) { display: none; }
}
@media (max-width: 767px) {
	.page-content > p:has(+ p + table.table td.i13) { display: none; }
}