LAGOON - ForumSpark theme by Pixel Point
https://pixel-point.net/
========================================

A clean, professional theme. Two crisp white header bars, cool grey paper
with faint ripples and a soft teal glow,
category names sitting straight on the page above white forum cards, and a
single teal accent that brightens in dark mode.


INSTALLING
----------
1. Upload lagoon.theme.json to ForumSpark as a theme package.
2. Activate it under Admin > Appearance > Themes.

Updating from an older version? Re-uploading keeps your saved colours and
font. To get a new version's colours, remove the theme and upload it again.
Any edits you've made will need redoing, so copy them somewhere first.


EDITING THE LOGO
----------------
The header shows your board's name as a bold wordmark, finished with a
small teal full stop.

1. Go to Admin > Appearance > Themes and open Lagoon in Theme Studio.
2. Open the Custom CSS section.
3. Near the top you'll find the block marked "LOGO TEXT":

     body.b2 {
         --lg-logo-text: "Your Board";
         --lg-logo-size: 1.3rem;
         ...
     }

4. Change the words between the quotes, then save.

     --lg-logo-text      Your board's name.
     --lg-logo-size      How big the name is (e.g. 1.1rem or 1.5rem).
     --lg-logo-stop      Set to none to hide the teal full stop.


USING AN IMAGE LOGO INSTEAD
---------------------------
1. Upload your logo in Theme Studio > Logo and images.
2. In the same LOGO TEXT block, change these two lines:

     --lg-logo-mode-text: none;
     --lg-logo-mode-image: block;

3. Save.

The header is white by day and charcoal at night, so a logo that reads on
both works best.


CHANGING THE COLOURS
--------------------
In Theme Studio > Colors, set Light for day and Dark for night:

- Panel title from / to      The accent and its hover: icons, markers,
                             the active menu bar, focus rings.
- Header from                Both header bars.
- User menu colour           The wordmark.
- Nav active colour          The active menu item's text.
- Body background            The paper behind the cards.
- Panel section bg           Search field, stat tiles, subforum chips.
- Forum link colour          Titles and numbers.
- Buttons                    Flat; "from" is the resting colour and "to"
                             is the hover colour.


MORE SETTINGS
-------------
Add any of these inside a body.b2 { } block in Custom CSS:

     --lg-max-width: 1280px;              Board width (default 1440px).
     --lg-sidebar-width: 320px;           Sidebar width.
     --lg-search-width: 20rem;            Search bar width (default 17rem).
     --lg-forum-names: var(--lg-accent);  Teal forum names instead of dark.
     --lg-glow: none;                     No teal glow under the header.
     --lg-ripple: none;                   Plain paper, no ripples.
     --lg-tip-bg / --lg-tip-ink           Hover tooltip colours.

To change something in dark mode only, put it in a body.b2.dark { } block
instead.


Tips
- Keep the quotes and the semicolon at the end of each line.
- Short board names look best in the header.
- Edit the values already in the block rather than adding new lines above it.
- On phones the header folds into one bar, and on smaller screens the
  search becomes an icon that opens the field.
