/* GDPR Enforcement in Europe.
   Sits on the site's dark template. Diagrams are HTML lists rather than SVG so that
   they wrap and stay legible at phone width; only the tile map is SVG.
   Map colours are the fine calculator's validated set plus a blue, a purple and an
   amber, each chosen so the label on it clears 4.5:1 (amber carries dark text). */

.ge { max-width: 1200px; margin: 0 auto; width: 100%; }
.ge-intro { font-size: 1.05em; line-height: 1.7; }
.ge-status { font-size: 0.88em; opacity: 0.85; padding: 0.9em 1.1em; border-left: 3px solid #7fb2e5; background: rgba(255,255,255,0.05); border-radius: 6px; }
.ge-block { margin: 0 0 3em 0; }
.ge-block h2 { margin-bottom: 0.4em; }
.ge-block h3 { margin: 1.6em 0 0.6em 0; font-size: 1.05em; }
.ge-lead { font-size: 0.95em; opacity: 0.88; margin-bottom: 1.2em; line-height: 1.65; }
.ge-note { font-size: 0.9em; opacity: 0.85; line-height: 1.6; }
.ge-box { padding: 18px 22px; background: rgba(255,255,255,0.06); border-left: 3px solid #b07cd8; border-radius: 6px; margin-top: 1.5em; }
.ge-box h3 { margin-top: 0; }
.ge-box ul li, .ge-quirks li, .ge-stats li { margin-bottom: 0.5em; line-height: 1.55; font-size: 0.92em; }
#ge-short, #ge-authority, #ge-cross, #ge-courts, #ge-private, #ge-map, #ge-compare, #ge-countries, #ge-cjeu, #ge-limits, .ge-country { scroll-margin-top: 6rem; }

/* ------------------------------------------------------------------ flows --- */
.ge-tracks { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 20px; margin-bottom: 1em; }
.ge-track { padding: 16px 18px; border-radius: 8px; background: rgba(255,255,255,0.05); border-top: 4px solid #4f8fd6; min-width: 0; }
.ge-track-private { border-top-color: #199e70; }
.ge-track h3 { margin: 0 0 0.2em 0; }
.ge-track > p { font-size: 0.88em; opacity: 0.8; margin-bottom: 0.8em; }
.ge-flow { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
.ge-node { position: relative; list-style: none; margin: 0 0 22px 0; padding: 10px 12px 10px 44px; border-radius: 8px; background: rgba(13,20,30,0.45); border: 1px solid rgba(255,255,255,0.14); font-size: 0.88em; line-height: 1.45; }
.ge-node:last-child { margin-bottom: 0; }
.ge-node::after { content: ""; position: absolute; left: 22px; bottom: -20px; width: 2px; height: 18px; background: rgba(255,255,255,0.35); }
.ge-node::before { content: ""; position: absolute; left: 17px; bottom: -22px; border: 6px solid transparent; border-top-color: rgba(255,255,255,0.55); border-bottom: 0; }
.ge-node:last-child::after, .ge-node:last-child::before { display: none; }
.ge-node strong { display: block; color: #fff; }
.ge-node span:not(.ge-node-n) { display: block; opacity: 0.82; }
.ge-node-n { position: absolute; left: 10px; top: 10px; width: 24px; height: 24px; border-radius: 50%; background: #4f8fd6; color: #fff; font-size: 0.8em; font-weight: bold; text-align: center; line-height: 24px; }
.ge-flow-private .ge-node-n { background: #199e70; }
.ge-flow-cross .ge-node-n { background: #b07cd8; }
.ge-flow-cross { max-width: 760px; margin-bottom: 1.4em; }

.ge-models { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ge-model { padding: 14px 18px; border-radius: 8px; background: rgba(255,255,255,0.05); border-top: 4px solid #4f8fd6; min-width: 0; }
.ge-model h3 { margin: 0 0 0.4em 0; font-size: 1em; }
.ge-model p { font-size: 0.88em; line-height: 1.55; margin: 0 0 0.5em 0; }
.ge-model-ex { opacity: 0.85; }
@media screen and (max-width: 736px) { .ge-models { grid-template-columns: minmax(0, 1fr); } }
.ge-steps { margin: 0 0 1em 0; padding-left: 1.4em; }
.ge-steps li { list-style: decimal; margin-bottom: 0.8em; line-height: 1.6; font-size: 0.93em; }

/* ----------------------------------------------------------------- tables --- */
.ge-tablewrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1em; }
.ge-table { width: 100%; border-collapse: collapse; font-size: 0.86em; }
.ge-table th, .ge-table td { text-align: left; vertical-align: top; padding: 0.6em 0.7em; border-bottom: 1px solid rgba(255,255,255,0.12); line-height: 1.5; }
.ge-table thead th { font-size: 0.85em; text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.75; border-bottom: 2px solid rgba(255,255,255,0.25); }
.ge-table tbody th { font-weight: bold; min-width: 9em; }
.ge-compare td, .ge-compare th { white-space: normal; }
.ge-table tbody tr:hover { background: rgba(255,255,255,0.04); }
.ge-year { font-weight: normal; opacity: 0.7; font-size: 0.92em; }
.ge-src { font-size: 0.82em; opacity: 0.75; }

.ge-chip { display: inline-block; padding: 0.15em 0.6em; border-radius: 999px; font-size: 0.82em; line-height: 1.5; font-weight: bold; margin: 0 0.35em 0.35em 0; white-space: normal; }
.ge-chips { margin: 0.6em 0 1em 0; }

/* -------------------------------------------------------------- buttons --- */
.ge-btn { height: auto !important; line-height: 1.3 !important; min-width: 0; width: auto; max-width: none; padding: 0.55em 0.9em !important; font-size: 0.72em !important; letter-spacing: 0.04em !important; white-space: normal !important; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(255,255,255,0.3) !important; background: transparent; cursor: pointer; margin: 0 0.4em 0.4em 0; }
.ge-btn.is-on { background: rgba(127,178,229,0.25) !important; box-shadow: inset 0 0 0 1px #7fb2e5 !important; }
.ge-views { display: flex; flex-wrap: wrap; margin-bottom: 0.6em; }

/* -------------------------------------------------------------- tile map --- */
.ge-mapwrap { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.ge-tiles { width: 100%; max-width: 560px; height: auto; flex: 1 1 340px; min-width: 0; }
.ge-tile rect { stroke: rgba(13,20,30,0.6); stroke-width: 1; transition: opacity 0.15s ease; }
.ge-tile text { font-size: 15px; font-weight: bold; text-anchor: middle; pointer-events: none; font-family: inherit; }
.ge-tile:hover rect, .ge-tile:focus rect { stroke: #fff; stroke-width: 2.5; }
.ge-tile:focus { outline: none; }
.ge-legends { flex: 0 1 260px; min-width: 0; }
.ge-legend { list-style: none; margin: 0; padding: 0; display: block; }
.ge-legend[hidden] { display: none; }
.ge-tile-out rect { stroke-dasharray: 4 3; stroke: #7fb2e5; stroke-width: 1.5; }
.ge-legend li { list-style: none; display: flex; align-items: flex-start; gap: 0.6em; margin-bottom: 0.55em; font-size: 0.88em; line-height: 1.4; }
.ge-legend i { flex: 0 0 auto; width: 1.1em; height: 1.1em; border-radius: 4px; margin-top: 0.1em; }

/* ------------------------------------------------------------- countries --- */
.ge-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4em 1em; margin-bottom: 1em; }
.ge-filters input[type="text"] { flex: 1 1 260px; max-width: 420px; min-width: 0; }
.ge-count { width: 100%; font-size: 0.85em; opacity: 0.75; margin: 0; }
.ge-country { border: 1px solid rgba(255,255,255,0.14); border-radius: 8px; margin-bottom: 0.7em; background: rgba(255,255,255,0.03); }
.ge-country[open] { background: rgba(255,255,255,0.05); }
.ge-country > summary { cursor: pointer; padding: 0.8em 1em; display: flex; flex-wrap: wrap; align-items: center; gap: 0.3em 0.9em; list-style: none; }
.ge-country > summary::-webkit-details-marker { display: none; }
.ge-country > summary::before { content: "\25B8"; font-size: 0.9em; opacity: 0.7; transition: transform 0.15s ease; }
.ge-country[open] > summary::before { transform: rotate(90deg); }
.ge-cname { font-weight: bold; font-size: 1.05em; color: #fff; }
.ge-cabbr { font-size: 0.85em; opacity: 0.8; }
.ge-cmem { font-size: 0.78em; opacity: 0.6; }
.ge-cdots { margin-left: auto; display: inline-flex; gap: 5px; }
.ge-cdots i { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.ge-cbody { padding: 0 1.2em 1.1em 1.2em; }
.ge-cbody h4 { font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.8; margin: 1.2em 0 0.5em 0; }
.ge-plain { margin-top: 0.4em; padding: 12px 16px; background: rgba(25,158,112,0.12); border-left: 3px solid #199e70; border-radius: 6px; }
.ge-plain h4 { margin-top: 0; }
.ge-plain p { margin: 0; line-height: 1.65; }
.ge-route { list-style: none; margin: 0 0 0.4em 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; }
.ge-route li { list-style: none; display: inline-flex; align-items: center; font-size: 0.85em; }
.ge-route li::before { content: "\2192"; margin: 0 0.5em; opacity: 0.6; }
.ge-route li:first-child::before { content: none; }
.ge-route li span { display: inline-block; padding: 0.25em 0.7em; border-radius: 6px; background: rgba(79,143,214,0.22); border: 1px solid rgba(127,178,229,0.45); line-height: 1.35; }
.ge-route li:first-child span { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.3); }
.ge-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; }
.ge-grid section { min-width: 0; }
.ge-dl { margin: 0; font-size: 0.88em; }
.ge-dl dt { font-weight: bold; opacity: 0.85; margin: 0.7em 0 0 0; }
.ge-dl dd { margin: 0.1em 0 0 0; padding: 0; line-height: 1.55; }
.ge-stages { margin: 0 0 0.4em 0; padding-left: 1.3em; font-size: 0.88em; }
.ge-stages li { list-style: decimal; margin-bottom: 0.35em; line-height: 1.5; }
.ge-cases, .ge-quirks { margin: 0; padding-left: 1.2em; }
.ge-cases li, .ge-quirks li { list-style: disc; margin-bottom: 0.6em; line-height: 1.55; font-size: 0.9em; }
.ge-sources { margin-top: 1em; font-size: 0.85em; }
.ge-sources summary { cursor: pointer; opacity: 0.85; }
.ge-sources ul { margin: 0.5em 0 0 0; padding-left: 1.2em; }
.ge-sources li { list-style: disc; margin-bottom: 0.3em; word-break: break-word; }
.ge-conf { margin-left: 0.6em; padding: 0.05em 0.5em; border-radius: 999px; font-size: 0.85em; background: rgba(255,255,255,0.1); }
.ge-conf-high { background: rgba(25,158,112,0.35); }
.ge-conf-low, .ge-conf-low-to-medium, .ge-conf-medium-low { background: rgba(217,89,38,0.35); }
.ge-country a, .ge-table a, .ge-note a, .ge-box a, .ge-stats a { word-break: break-word; }

@media screen and (max-width: 980px) {
	.ge-tracks { grid-template-columns: minmax(0, 1fr); }
	.ge-grid { grid-template-columns: minmax(0, 1fr); }
}
@media screen and (max-width: 736px) {
	.ge-compare td:nth-of-type(4)::before { content: "Public bodies: "; opacity: 0.7; font-size: 0.85em; }
	.ge-compare td:nth-of-type(5)::before { content: "During appeal: "; opacity: 0.7; font-size: 0.85em; }
	.ge-cbody { padding: 0 0.8em 0.9em 0.8em; }
	.ge-country > summary { padding: 0.7em 0.8em; }
	.ge-cdots { margin-left: 0; }
	.ge-table { font-size: 0.8em; }
	.ge-stack thead { display: none; }
	.ge-stack tr { display: block; padding: 0.6em 0; border-bottom: 1px solid rgba(255,255,255,0.15); }
	.ge-stack th, .ge-stack td { display: block; border: 0; padding: 0.15em 0; }
	.ge-stack td::before { content: attr(data-label); display: block; opacity: 0.65; font-size: 0.8em; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 0.4em; }
	.ge-compare thead { display: none; }
	.ge-compare tr { display: block; padding: 0.6em 0; border-bottom: 1px solid rgba(255,255,255,0.15); }
	.ge-compare th, .ge-compare td { display: block; border: 0; padding: 0.15em 0; }
	.ge-compare td:nth-of-type(1)::before { content: "Authority: "; opacity: 0.7; }
	.ge-compare td:nth-of-type(3)::before { content: "First court: "; opacity: 0.7; }
}

/* -------------------------------------------------------------- the rail --- */
.ge-rail { position: fixed; right: 0.55em; top: 50%; transform: translateY(-50%); z-index: 1150; display: flex; flex-direction: column; gap: 0; padding: 0.2em 0.25em; border-radius: 0.9em; border: solid 1px transparent; background: transparent; transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease; }
.ge-rail:hover, .ge-rail:focus-within, .ge-rail.is-open { border-color: rgba(255,255,255,0.12); background: rgba(13,20,30,0.82); box-shadow: 0 0.3em 1em rgba(0,0,0,0.35); }
.ge-rail[hidden] { display: none; }
.ge-rail a { display: flex; align-items: center; gap: 0.6em; height: 1.15em; padding: 0 0.2em; border: 0; border-radius: 0.6em; color: rgba(255,255,255,0.75); text-decoration: none; white-space: nowrap; }
.ge-rail a i { flex: 0 0 auto; width: 0.34em; height: 0.34em; border-radius: 50%; background: rgba(255,255,255,0.35); transition: background 0.15s ease, transform 0.15s ease; }
.ge-rail:hover a i, .ge-rail:focus-within a i, .ge-rail.is-open a i { background: rgba(255,255,255,0.45); }
.ge-rail a span { max-width: 0; overflow: hidden; opacity: 0; font-size: 0.78em; letter-spacing: 0.01em; transition: max-width 0.24s ease, opacity 0.18s ease; }
.ge-rail:hover a span, .ge-rail:focus-within a span, .ge-rail.is-open a span { max-width: 26em; opacity: 1; }
.ge-rail a:hover, .ge-rail a:focus-visible { color: #fff; background: rgba(127,178,229,0.12); }
.ge-rail a:hover i, .ge-rail a:focus-visible i { background: #7fb2e5; }
.ge-rail a.is-on { color: #fff; }
.ge-rail a.is-on i { background: #7fb2e5; transform: scale(1.5); }
@media (hover: none) { .ge-rail { padding: 0.25em 0.35em; } .ge-rail a { height: 2.1em; } .ge-rail a i { width: 0.4em; height: 0.4em; } }

@media print {
	.ge-rail, .ge-filters, .ge-views { display: none !important; }
	.ge-country .ge-cbody { display: block; }
}
