/*
| The customer portal's stylesheet.
|
| ⚠ It is the office's, imported rather than copied. The two panels are drawn
| from ONE token set (`00 Tokenlar`) and one component catalogue
| (`01 Form Elemanlari`); a second copy of the fonts, the tokens and the base
| layer would be a second place for a colour to drift, and the drift would only
| ever be visible on one side.
|
| ⛔ What is NOT shared is the page glob (`portal.js`). The stylesheet is a
| vocabulary; the bundle is a set of screens, and a customer's browser has no
| business downloading the office's.
*/
@import './office.css';


/*
| `@source` is relative to the file it appears in, and the import above already
| scans every `.vue` in `resources/js`. The portal's pages live there too, so
| nothing further is needed here — this note exists so the next person does not
| add a second scan and wonder why the class list doubled.
*/


/*
| The reading pane's bottom fade (design `18:158`).
|
| ⛔ A class rather than a Tailwind gradient utility, and the arch test is the
| reason it is worth saying out loud: `bg-gradient-to-b` names no token, so the
| sweep that keeps a second palette from forming cannot tell it from an invented
| colour. Written here, the gradient ends on `--color-surface` — the same white
| the card is painted with — and there is exactly one place to change it.
|
| ⚠ It only says "there is more below". It must never swallow a click on the
| line beneath it, which is what `pointer-events: none` is for.
*/
.pane-fade {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 3rem;
    pointer-events: none;
    background: linear-gradient(180deg, transparent 0%, var(--color-surface) 78%);
}