/*
Theme Name: PPLS (Weebly port)
Theme URI: https://www.penangproperties.com/
Description: Faithful port of the original Weebly "Edison" theme used by
    penangproperties.com, so the WordPress rebuild launches looking identical
    to the site it replaces. Wraps the original main_style.css unchanged and
    reproduces the header/footer markup its selectors expect. Fonts are
    self-hosted — the originals loaded from cdn2.editmysite.com over plain http.
Version: 0.1.5
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
License: GPL-2.0-or-later
Text Domain: ppls
*/

/* Intentionally almost empty: the real styling is assets/main_style.css,
   enqueued from functions.php and kept byte-identical to the Weebly original
   so it can be re-synced. Put overrides below, never in that file. */

/* WordPress core markup that Weebly's stylesheet knows nothing about. */
.wp-caption { max-width: 100%; }
.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}
.ppls-admin-note {
	background: #fffbe6;
	border-left: 4px solid #f0b429;
	margin: 0 0 1em;
	padding: 12px 16px;
}

/* --- Buttons -------------------------------------------------------------
   main_style.css:207 gives .wsite-button padding, box-sizing and line-height
   but never a display mode, so an <a> falls back to `display: inline` — where
   vertical padding paints without reserving line space. The blue button
   therefore overlapped whatever followed it by 10-13px: "Contact Us" clipped
   the "Enquiry click" line under it, "Back to top" clipped the disclaimer, on
   all 526 pages.

   The rule was never in the export. The archived pages pulled it from
   cdn11.editmysite.com/css/sites.css, Weebly's base stylesheet, which the
   scraper did not capture and which died with the account — the same live-CDN
   dependency that took the fancybox lightbox with it. The only `display`
   main_style.css sets for this class is line 330, scoped to the ecommerce
   checkout wrapper, which never matches here.

   Lives here rather than in main_style.css, which stays byte-identical. */

.wsite-button {
	display: inline-block;
	vertical-align: middle;
}

/* --- Theme-generated listings (search, archives, 404) --------------------
   header.php opens .content-wrap but no .container, and every template emits
   #wsite-content straight into it. That is right for imported pages, which
   bring their own Weebly wrappers and inline column widths — but index.php
   builds its own markup, so its text ran flush to both viewport edges.

   Reuses main_style.css's own container metrics (max-width 1100px, 15px
   gutters) rather than inventing a value, so results sit on the same measure
   as the rest of the site instead of stretching the full window. */

.ppls-index {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 15px;
	box-sizing: border-box;
}

/* --- WordPress admin bar -------------------------------------------------
   main_style.css pins .edison-header with `position: fixed; top: 0` at every
   width (body.header-sticky, which header.php always sets). Fixed elements are
   positioned against the viewport, so they ignore the
   `html { margin-top: 32px !important }` bump core injects to make room for the
   admin bar. The header therefore stays at viewport top 0 and the bar paints
   over it — z-index 99999 against the header's 15 — hiding its top 32px and
   leaving only the lower strip of #2aa5eb showing. That is the two-tone topbar:
   admin-bar grey above, clipped header blue below.

   .mobile-nav is fixed at top:50px so it sits flush under the header, so it has
   to shift by exactly the same amount or it detaches from it.

   All of this is scoped to body.admin-bar, so logged-out visitors render the
   original theme untouched. */

body.admin-bar .edison-header { top: 32px; }
body.admin-bar .mobile-nav {
	top: 82px;                      /* 32 bar + 50 header */
	max-height: calc(100% - 82px);
}

@media screen and (max-width: 782px) {
	/* Core grows the bar to 46px here and bumps html to match. */
	body.admin-bar .edison-header { top: 46px; }
	body.admin-bar .mobile-nav {
		top: 96px;                  /* 46 bar + 50 header */
		max-height: calc(100% - 96px);
	}
}

@media screen and (max-width: 600px) {
	/* Core drops #wpadminbar to position:absolute below 600px so it scrolls
	   away with the page. That fights a sticky header both ways: anchor the
	   header at 46px and a 46px gap opens once the bar scrolls off, anchor it
	   at 0 and the bar is covered for good — unreachable on a phone. Holding
	   the bar fixed keeps the 46px offset above correct at every width.
	   Specificity (1,1,1) beats core's (1,0,0), so load order does not matter. */
	body.admin-bar #wpadminbar { position: fixed; }
}