/* ===========================================================================
   League of Provinces of the Philippines - archive stylesheet
   Keeps the original visual identity (navy #003366 frame, white content panel,
   orange #FF9900 sidebar links, orange/maroon headings) but replaces the old
   gmc.css, which relied on invalid properties (font-color, float:center) and a
   .text wrapper that no longer exists in the markup.
   =========================================================================== */

:root {
	--navy:        #003366;
	--orange:      #ff9900;
	--orange-dim:  #cc7a00;
	--maroon:      #800000;
	--ink:         #22262b;
	--ink-soft:    #4a5160;
	--rule:        #d8dde5;
	--panel:       #ffffff;
}

*, *::before, *::after { box-sizing: border-box; }

body {
	margin: 0;
	background: var(--navy);
	color: var(--ink);
	font: 400 15px/1.65 Arial, Helvetica, sans-serif;
	-webkit-text-size-adjust: 100%;
}

/* --- layout shell ------------------------------------------------------- */
#wrapper {
	max-width: 1060px;
	margin: 0 auto;
	padding: 0 16px 32px;
	display: grid;
	grid-template-columns: 210px minmax(0, 1fr);
	grid-template-areas:
		"header header"
		"nav    main"
		"footer footer";
	column-gap: 22px;
}

#header  { grid-area: header; }
.left    { grid-area: nav; }
.right   { grid-area: main; min-width: 0; }
#footer  { grid-area: footer; }

/* --- site header -------------------------------------------------------- */
#header {
	padding: 22px 0 16px;
	border-bottom: 3px solid var(--orange);
	margin-bottom: 22px;
}

h1#site-title {
	margin: 0;
	font-size: 26px;
	line-height: 1.25;
	letter-spacing: .01em;
}

h1#site-title a {
	color: #fff;
	text-decoration: none;
}

h1#site-title a:hover,
h1#site-title a:focus-visible { color: var(--orange); }

/* --- sidebar ------------------------------------------------------------ */
.left {
	font-size: 13px;
	color: #dfe6f0;
}

.left .widget + .widget { margin-top: 20px; }

.left h4 {
	margin: 0 0 8px;
	padding-bottom: 5px;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--orange);
	border-bottom: 1px solid rgba(255, 153, 0, .35);
}

.left ul {
	margin: 0 0 18px;
	padding: 0;
	list-style: none;
}

.left li {
	margin: 0;
	padding: 4px 0;
	border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.left li:last-child { border-bottom: 0; }

.left a {
	color: var(--orange);
	text-decoration: none;
}

.left a:hover,
.left a:focus-visible {
	color: #fff;
	text-decoration: underline;
}

/* current page marker */
.left li[aria-current="page"] > span {
	color: #fff;
	font-weight: 700;
	border-left: 3px solid var(--orange);
	padding-left: 7px;
	display: block;
	margin-left: -10px;
}

.left p { color: #c4cede; }

.site-nav-links {
	margin-top: 18px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, .15);
	font-size: 12px;
	line-height: 1.8;
}

/* --- main content panel ------------------------------------------------- */
.right {
	background: var(--panel);
	padding: 26px 32px 32px;
	border-radius: 3px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .28);
}

.right h2 {
	margin: 0 0 18px;
	padding-bottom: 10px;
	font-size: 25px;
	line-height: 1.25;
	color: var(--maroon);
	border-bottom: 1px solid var(--rule);
}

.right h3 {
	margin: 26px 0 10px;
	font-size: 18px;
	color: var(--orange-dim);
}

.right h4 { margin: 20px 0 8px; font-size: 15px; color: var(--ink); }

.right p { margin: 0 0 14px; }

.right a { color: #14509b; }
.right a:hover, .right a:focus-visible { color: var(--maroon); }

.entry-content ul, .entry-content ol { margin: 0 0 16px; padding-left: 24px; }
.entry-content li { margin-bottom: 6px; }

/* sitemap: filename hint that separates same-titled archive pages */
.slug { color: var(--ink-soft); font-size: .86em; }

.entry-content img { max-width: 100%; height: auto; }

/* wide legacy tables must scroll inside the panel, never widen the page */
.entry-content { overflow-x: auto; }

.entry-content table { max-width: 100%; border-collapse: collapse; }

.entry-content td, .entry-content th {
	padding: 6px 9px;
	border: 1px solid var(--rule);
	vertical-align: top;
}

blockquote {
	margin: 0 0 16px;
	padding: 2px 0 2px 16px;
	border-left: 3px solid var(--orange);
	color: var(--ink-soft);
}

hr { border: 0; border-top: 1px solid var(--rule); margin: 22px 0; }

/* --- footer ------------------------------------------------------------- */
#footer {
	margin-top: 26px;
	padding-top: 14px;
	border-top: 1px solid rgba(255, 255, 255, .2);
	color: #b9c4d6;
	font-size: 12px;
}

#footer p { margin: 0; }
#footer a { color: var(--orange); }

/* --- legacy selectors kept for the few pages that still use them -------- */
.right .text, .text { background: var(--panel); padding: 0; }
.right .text h3 { font-size: 18px; color: var(--orange-dim); }
.right .text h2 { font-size: 25px; color: var(--maroon); padding-left: 0; }
.right h1      { font-size: 25px; color: var(--maroon); padding-left: 0; }

.clearer { clear: both; }

.siteleft { padding-left: 0; }
.siteleft h4 { font-family: Arial, Helvetica, sans-serif; color: var(--maroon); }
.siteleft a { color: #14509b; text-decoration: none; }
.siteleft a:hover { color: var(--maroon); text-decoration: underline; }

/* --- accessibility ------------------------------------------------------ */
:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }

/* --- responsive --------------------------------------------------------- */
@media (max-width: 820px) {
	#wrapper {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas:
			"header"
			"main"
			"nav"
			"footer";
		row-gap: 20px;
	}

	.right { padding: 20px 18px 24px; }

	/* archived inline padding-left:60px wastes most of a phone screen */
	.entry-content p[style] { padding-left: 0 !important; }

	.left { padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .2); }

	h1#site-title { font-size: 21px; }
	.right h2, .right .text h2, .right h1 { font-size: 21px; }
}

@media print {
	body { background: #fff; color: #000; }
	#wrapper { display: block; max-width: none; }
	.left, #footer { display: none; }
	.right { box-shadow: none; padding: 0; }
}