/* =============================================================================
   Bogdanbor Child — Legal pages (Impresszum, ÁSZF, Adatkezelési tájékoztató)
   Shared template: page-legal.php
   ============================================================================= */

/* Design tokens (--font-serif, --font-ui, --color-*, --text-*, --header-height)
   are defined in typography.css. */

/* -----------------------------------------------------------------------------
   Page wrapper
   ----------------------------------------------------------------------------- */
.page-legal {
	padding-top:    var( --header-height, 80px );
	padding-bottom: 6rem;
	background:     var( --color-warm, #faf9f7 );

	/* Local tokens — light mode defaults */
	--legal-text:        var( --color-ink,    #1a1a1a );
	--legal-muted:       var( --color-muted,  #666 );
	--legal-border:      var( --color-border, rgba(0, 0, 0, 0.06) );
	--legal-table-head:  #f0ede8;
	--legal-table-row:   #faf9f7;
	--legal-table-alt:   #f5f2ee;
	--legal-code-bg:     #f0ede8;
	--legal-hr:          rgba(0, 0, 0, 0.10);
}

/* -----------------------------------------------------------------------------
   Dark mode overrides
   ----------------------------------------------------------------------------- */
@media (prefers-color-scheme: dark) {
	.page-legal {
		background:         #121212;
		--legal-text:       #e6dfd6;
		--legal-muted:      #8a8278;
		--legal-border:     rgba(255, 255, 255, 0.07);
		--legal-table-head: #1e1b18;
		--legal-table-row:  #181512;
		--legal-table-alt:  #1b1916;
		--legal-code-bg:    #1e1b18;
		--legal-hr:         rgba(255, 255, 255, 0.10);
	}
}

/* -----------------------------------------------------------------------------
   Page header
   ----------------------------------------------------------------------------- */
.legal-header {
	padding:       4rem 0 2.5rem;
	border-bottom: 1px solid var( --legal-border );
	margin-bottom: 3rem;
}

.legal-header__title {
	font-family:    var( --font-serif );
	font-size:      var( --text-2xl );
	font-weight:    400;
	letter-spacing: var( --tracking-wide );
	line-height:    var( --leading-snug );
	color:          var( --legal-text );
	margin:         0;
}

/* -----------------------------------------------------------------------------
   Content wrapper — narrow prose column
   ----------------------------------------------------------------------------- */
.legal-body {
	max-width:   680px;
	color:       var( --legal-text );
}

/* -----------------------------------------------------------------------------
   Headings
   ----------------------------------------------------------------------------- */
.legal-body h2 {
	font-family:    var( --font-serif );
	font-size:      var( --text-xl );
	font-weight:    400;
	letter-spacing: var( --tracking-normal );
	line-height:    var( --leading-snug );
	color:          var( --legal-text );
	margin:         2.75rem 0 0.75rem;
	padding-top:    2.75rem;
	border-top:     1px solid var( --legal-border );
}

.legal-body h2:first-child {
	margin-top:  0;
	padding-top: 0;
	border-top:  none;
}

.legal-body h3 {
	font-family:    var( --font-ui );
	font-size:      var( --text-sm );
	font-weight:    400;
	letter-spacing: var( --tracking-widest );
	text-transform: uppercase;
	color:          var( --legal-muted );
	margin:         2rem 0 0.75rem;
}

/* -----------------------------------------------------------------------------
   Body text
   ----------------------------------------------------------------------------- */
.legal-body p {
	font-size:   var( --text-base );
	line-height: var( --leading-loose );
	margin:      0 0 1.25rem;
	color:       var( --legal-text );
}

.legal-body a {
	color:                  var( --color-accent, #7b3b2f );
	text-underline-offset:  3px;
	text-decoration-thickness: 1px;
}

.legal-body a:hover,
.legal-body a:focus-visible {
	text-decoration: none;
	outline: none;
}

/* -----------------------------------------------------------------------------
   Lists
   ----------------------------------------------------------------------------- */
.legal-body ul,
.legal-body ol {
	margin:      0 0 1.25rem;
	padding-left: 1.5rem;
}

.legal-body li {
	font-size:   var( --text-base );
	line-height: var( --leading-loose );
	margin-bottom: 0.375rem;
	color:       var( --legal-text );
}

/* -----------------------------------------------------------------------------
   Tables — GDPR jogalap / cookie táblázatok
   ----------------------------------------------------------------------------- */
.legal-body table {
	width:           100%;
	border-collapse: collapse;
	font-size:       0.9375rem;
	line-height:     var( --leading-normal );
	margin:          1.25rem 0 1.75rem;
}

.legal-body th {
	background:    var( --legal-table-head );
	font-family:   var( --font-ui );
	font-size:     0.6875rem;
	font-weight:   400;
	letter-spacing: var( --tracking-widest );
	text-transform: uppercase;
	color:         var( --legal-muted );
	padding:       0.625rem 0.875rem;
	text-align:    left;
	border-bottom: 1px solid var( --legal-border );
}

.legal-body td {
	padding:    0.625rem 0.875rem;
	border-bottom: 1px solid var( --legal-border );
	color:      var( --legal-text );
	vertical-align: top;
}

.legal-body tr:nth-child(odd) td {
	background: var( --legal-table-alt );
}

.legal-body tr:nth-child(even) td {
	background: var( --legal-table-row );
}

/* cookie names */
.legal-body td code,
.legal-body li code {
	font-family:     ui-monospace, 'Cascadia Code', 'Fira Mono', monospace;
	font-size:       0.8125rem;
	background:      var( --legal-code-bg );
	padding:         0.1em 0.4em;
	border-radius:   3px;
	letter-spacing:  0;
	color:           var( --legal-text );
}

/* -----------------------------------------------------------------------------
   Horizontal rule — visual section separator
   ----------------------------------------------------------------------------- */
.legal-body hr {
	border: none;
	border-top: 1px solid var( --legal-hr );
	margin: 3rem 0;
}

/* -----------------------------------------------------------------------------
   Strong / bold
   ----------------------------------------------------------------------------- */
.legal-body strong {
	font-weight: 600;
	color:       var( --legal-text );
}

/* -----------------------------------------------------------------------------
   Mobile
   ----------------------------------------------------------------------------- */
@media (max-width: 600px) {
	.legal-header {
		padding-top: 2.5rem;
	}

	.legal-header__title {
		font-size: var( --text-xl );
	}

	/* Horizontal scroll for wide tables on small screens */
	.legal-body table {
		display:    block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
}