/*
Theme Name:        La-Winn Base
Theme URI:         https://onlinecreatives.co.ke/lawinn-base
Author:            Online Creatives Kenya
Author URI:        https://onlinecreatives.co.ke
Description:       A lightweight, distraction-free "canvas" theme in the spirit of Hello Elementor — built to get out of the way of Elementor and to work hand-in-glove with the La-Winn ERP Portal plugin. It ships almost no opinionated styling so Elementor (and the ERP portal's own UI) can render exactly as designed, while still fulfilling every WordPress theme requirement for a stable, reviewable, translation-ready theme.
Version:           1.0.0
Requires at least: 6.0
Tested up to:       6.6
Requires PHP:       7.4
License:            GNU General Public License v2 or later
License URI:        https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:        lawinn-base
Tags:               blog, e-commerce, one-column, custom-menu, featured-images, full-width-template, threaded-comments, translation-ready, block-styles, wide-blocks
*/

/* ==========================================================================
   La-Winn Base — Minimal Reset & Base Styles
   Deliberately sparse: Elementor and the La-Winn ERP Portal plugin provide
   their own complete design systems. This stylesheet only supplies the
   baseline WordPress needs (box-sizing, typography fallback, basic link/
   focus states, and the handful of default classes WP core expects a
   theme to style: alignleft/alignright/aligncenter, screen-reader-text,
   sticky, gallery-caption, etc.) so the theme remains stable and
   accessible even on pages where neither Elementor nor the ERP portal
   is present (e.g. a plain blog post).
   ========================================================================== */

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

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.6;
  color: #1e1e1e;
  background: #fff;
}

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

a {
  color: #0c3bd6;
  text-decoration: underline;
}

a:hover,
a:focus {
  color: #011f3b;
}

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
  outline: 2px solid #0c3bd6;
  outline-offset: 2px;
}

/* ── Layout container (fallback pages only — Elementor/ERP override this) ── */
.site {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.site-content {
  flex: 1 0 auto;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px;
}

.site-header,
.site-footer {
  width: 100%;
}

.site-header {
  border-bottom: 1px solid #e5e7eb;
}

.site-header .header-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.site-branding .site-title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 800;
}

.site-branding .site-title a {
  color: inherit;
  text-decoration: none;
}

.site-branding .site-description {
  margin: 2px 0 0;
  font-size: 0.8rem;
  color: #6b7280;
}

.main-navigation ul {
  list-style: none;
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0;
  flex-wrap: wrap;
}

.main-navigation a {
  text-decoration: none;
  font-size: 0.95rem;
  color: #1e1e1e;
}

.main-navigation a:hover {
  color: #0c3bd6;
}

.menu-toggle {
  display: none;
  background: none;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 8px 12px;
  cursor: pointer;
}

@media (max-width: 700px) {
  .menu-toggle {
    display: inline-block;
  }
  .main-navigation ul {
    display: none;
    flex-direction: column;
    width: 100%;
    gap: 8px;
    padding-top: 12px;
  }
  .main-navigation.toggled ul {
    display: flex;
  }
}

.site-footer .footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px;
  font-size: 0.85rem;
  color: #6b7280;
  text-align: center;
}

/* ── WordPress core alignment classes (required for stability) ───────────── */
.alignleft {
  float: left;
  margin: 0 24px 16px 0;
}

.alignright {
  float: right;
  margin: 0 0 16px 24px;
}

.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.alignwide {
  max-width: 1400px;
}

.alignfull {
  max-width: none;
  width: 100vw;
  margin-left: calc(50% - 50vw);
}

/* ── Accessibility ─────────────────────────────────────────────────────── */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 4px;
  clip: auto !important;
  clip-path: none;
  color: #1e1e1e;
  display: block;
  font-size: 0.9rem;
  height: auto;
  left: 8px;
  line-height: normal;
  padding: 12px 16px;
  text-decoration: none;
  top: 8px;
  width: auto;
  z-index: 100000;
}

.skip-link {
  left: -9999px;
  position: absolute;
  top: -9999px;
  z-index: 999999;
}

.skip-link:focus {
  left: 8px;
  top: 8px;
}

/* ── Standard WP figure/gallery/caption support ───────────────────────── */
.wp-caption,
figure.wp-block-image {
  max-width: 100%;
}

.wp-caption-text,
figcaption {
  font-size: 0.85rem;
  color: #6b7280;
  text-align: center;
  margin-top: 6px;
}

.gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.gallery-item {
  margin: 0;
}

/* ── Sticky posts / comment list (core expects these classes styled) ─── */
.sticky {
  border-left: 4px solid #0c3bd6;
  padding-left: 12px;
}

.comment-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.comment-list .comment {
  border-bottom: 1px solid #e5e7eb;
  padding: 16px 0;
}

/* ==========================================================================
   La-Winn ERP Portal compatibility
   When a page contains the [lawinn_portal] shortcode, functions.php adds the
   `lawinn-portal-canvas` body class and this theme intentionally hides its
   own header/footer chrome (see header.php / footer.php), so the plugin's
   full-screen SPA UI renders truly edge-to-edge with zero theme interference.
   These few rules simply guarantee no scrollbars/margins leak in on that
   specific page type, even if a caching layer serves stale markup.
   ========================================================================== */
body.lawinn-portal-canvas {
  margin: 0;
  padding: 0;
}

body.lawinn-portal-canvas .site-content {
  max-width: none;
  padding: 0;
  margin: 0;
}