@charset "UTF-8";
/*
Theme Name:        MSAI Base
Theme URI:         https://example.com/msai-base
Author:            Tahir Javed
Description:       Parent theme for the Multisite AI Builder stack. Provides the cross-vertical theme shell (header, footer, page, 404), shared runtime helpers like the [link:slug] permalink resolver, and a sensible default fallback for AI-rendered section templates. Each vertical (wp-electrician, wp-studio-for-sale, wp-dryer-repair, ...) is a thin child theme of this one — it ships only what makes it different (style.css, functions.php, ai-builder/templates/*.php, assets/).
Version:           2.0.0
Requires at least: 6.2
Requires PHP:      7.4
Text Domain:       msai-base
Tags:              multisite, ai, parent-theme
*/

/* ---------------------------------------------------------------
   Base reset (intentionally minimal — child themes ship their own
   design system; this just makes WP-injected admin bar etc. behave).
   --------------------------------------------------------------- */

:root {
	--white: #FFFFFF;
	--black: #000000;
	--gray: #6c757d;
	--gray-light: #f9fafb;
	--gray-dark: #343a40;
	--gray-100: #f8f9fa;
	--gray-200: #e9ecef;
	--gray-300: #dee2e6;
	--gray-400: #ced4da;
	--gray-500: #adb5bd;
	--gray-600: #6c757d;
	--gray-700: #495057;
	--gray-800: #343a40;
	--gray-900: #212529;
	--success: #198754;
	--error: #dc3545;
	--teal: #14b8a6;
}

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

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}

html { box-sizing: border-box; }
body { margin: 0; }
img, svg, video { max-width: 100%; height: auto; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
   font-weight: 500;
   line-height: 1.3;
   margin-top: 0;
   margin-bottom: 1rem;
   color: var(--primary);
}
ol,
ul {
  padding-left: 1rem;
}
ol,
ul{
  margin-top: 0;
  margin-bottom: 1rem;
}
ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0;
}
a {
    text-decoration: none;
    transition: color 0.3s ease;
}
/* Shared Bootstrap-style responsive containers. */
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
	--bs-gutter-x: 1.5rem;
	--bs-gutter-y: 0;

	width: 100%;
	padding-right: calc(var(--bs-gutter-x) * 0.5);
	padding-left: calc(var(--bs-gutter-x) * 0.5);
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 576px) {
	.container-sm,
	.container {
		max-width: 540px;
	}
}

@media (min-width: 768px) {
	.container-md,
	.container-sm,
	.container {
		max-width: 720px;
	}
}

@media (min-width: 992px) {
	.container-lg,
	.container-md,
	.container-sm,
	.container {
		max-width: 960px;
	}
}

@media (min-width: 1200px) {
	.container-xl,
	.container-lg,
	.container-md,
	.container-sm,
	.container {
		max-width: 1140px;
	}
}

@media (min-width: 1400px) {
	.container-xxl,
	.container-xl,
	.container-lg,
	.container-md,
	.container-sm,
	.container {
		max-width: 1320px;
	}
}

/* Screen-reader-only utility (used by header.php skip link). */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* Admin/edit overlays shipped by multisite-ai-builder. */
.msai-section-wrapper { position: relative; }

/* ---------------------------------------------------------------
   Utility classes — small, reusable replacements for the inline
   styles that designer HTML used to carry. The msai-cli markup
   guide (tools/msai-cli/docs/markup-guide.md) tells authors to
   reach for these instead of style="" attributes. Child themes can
   extend or override them in their own stylesheet.
   --------------------------------------------------------------- */
.u-flex { display: flex; }
.u-flex-wrap { flex-wrap: wrap; }
.u-gap-sm { gap: 8px; }
.u-gap-md { gap: 14px; }
.u-gap-lg { gap: 24px; }
.u-pad-md { padding: 24px; }
.u-pad-lg { padding: 40px; }
.u-mt-sm { margin-top: 12px; }
.u-hidden { display: none; visibility: hidden; }

/* Section heading emitted by the compiler's FAQ-group loop
   (replaces the old inline margin/color styles). Child themes set
   the actual color via their own design tokens. */
.msai-faq-group-title { margin-bottom: 24px; }
.msai-faq-group-title--spaced { margin: 40px 0 24px; }

/* ---------------------------------------------------------------
   Content tables — bare tables rendered through `the_content` are
   normalized to this wrapper by inc/content-tables.php. Selectors
   use :where() to keep specificity low so child themes can easily
   replace any part of the shared presentation.
   --------------------------------------------------------------- */
:where(.wp-block-table) {
	--msai-table-background: #fff;
	--msai-table-border-color: #d9e1e8;
	--msai-table-header-background: #eef2f6;
	--msai-table-row-alt-background: #f8fafc;
	--msai-table-row-hover-background: #edf3f8;
	--msai-table-caption-color: #5f6b7a;

	width: 100%;
	max-width: 100%;
	margin: 1.5rem 0;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--msai-table-border-color);
	border-radius: 8px;
	background: var(--msai-table-background);
	box-shadow: 0 3px 12px rgba(15, 23, 42, 0.07);
}

:where(.wp-block-table) > table {
	width: 100%;
	min-width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	border-spacing: 0;
	background: var(--msai-table-background);
	color: inherit;
	font-size: 0.95rem;
	line-height: 1.5;
}

:where(.wp-block-table) caption {
	padding: 0.75rem 1rem;
	color: var(--msai-table-caption-color);
	font-size: 0.875rem;
	font-weight: 500;
	text-align: left;
}

:where(.wp-block-table) th,
:where(.wp-block-table) td {
	padding: 0.8rem 1rem;
	border: 0;
	border-right: 1px solid var(--msai-table-border-color);
	border-bottom: 1px solid var(--msai-table-border-color);
	text-align: left;
	vertical-align: top;
}

:where(.wp-block-table) tr > :last-child {
	border-right: 0;
}

:where(.wp-block-table) > table > :last-child > tr:last-child > * {
	border-bottom: 0;
}

:where(.wp-block-table) thead th {
	background: var(--primary);
   color: var(--white);
	font-weight: 600;
}

:where(.wp-block-table) tbody tr:nth-child(even) {
	background: var(--msai-table-row-alt-background);
}

:where(.wp-block-table) tbody tr:hover {
	background: var(--msai-table-row-hover-background);
}

:where(.wp-block-table) tfoot {
	background: var(--msai-table-header-background);
	font-weight: 600;
}

:where(.wp-block-table) figcaption {
	margin: 0;
	padding: 0.75rem 1rem;
	border-top: 1px solid var(--msai-table-border-color);
	color: var(--msai-table-caption-color);
	font-size: 0.875rem;
	text-align: left;
}

@media (max-width: 48rem) {
	:where(.wp-block-table) th,
	:where(.wp-block-table) td {
		padding: 0.7rem 0.75rem;
	}
}