/* לוח המודעות (includes/board.php): the board page, the cards, a notice's page, the community page, the form window.
 * Buttons: assets/buttons.css (.sc-btn); fields: the theme's one field style; the member card: assets/member.css. */

/* ---- the board page ---- */
.sc-board { margin: 0 0 3rem; }
.sc-board-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin: 0 0 1.2rem; }
.sc-board-intro { flex: 1 1 320px; margin: 0; opacity: .8; }
/* filter chips: the catalog's filter-button look (.sc-drop-btn), as links */
.sc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.sc-chips--areas { margin-bottom: 2.6rem; } /* air between the filter and the cards (user, 2026-10-01) */
.sc-chips--areas .sc-chip { height: 34px; padding: 0 12px; font-size: var(--sc-fs-small); }
.sc-chip { display: inline-flex; align-items: center; height: 40px; margin: 0; padding: 0 16px; border: 1px solid var(--sc-c-line); border-radius: 999px; background: var(--sc-c-card); color: var(--sc-c-ink); font: inherit; font-weight: 500; text-decoration: none; cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease; }
.sc-chip:hover { border-color: color-mix(in srgb, var(--sc-c-ink) 35%, transparent); }
.sc-chip.is-on { background: var(--sc-c-btn, #3d7a66); border-color: var(--sc-c-btn, #3d7a66); color: #fff; }
.sc-board-empty { padding: 2rem 0; text-align: center; color: var(--sc-c-muted, #5F6660); }
.sc-board-more { margin: 1.6rem 0 0; text-align: center; }

/* ---- the cards ---- */
.sc-notices { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
/* a notice is text first: the photo (if any) is a small square at the side, so every card has the same calm shape —
 * not a big picture on top of some and none on others (2026-10-01) */
.sc-notice-card { position: relative; cursor: pointer; display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; border: 1px solid var(--sc-c-line); border-radius: 18px; background: var(--sc-c-card); transition: border-color .2s ease, transform .2s ease; }
.sc-notice-card:hover { border-color: var(--sc-c-btn, #3d7a66); transform: translateY(-2px); }
.sc-notice-card[hidden], .sc-board-empty[hidden], .sc-board-more[hidden] { display: none; } /* the filter (board.js): display:flex above would beat the browser's [hidden] */
.sc-notice-photo { flex: none; order: 2; display: block; width: 92px; height: 92px; border-radius: 14px; overflow: hidden; }
.sc-notice-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sc-notice-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; align-self: stretch; }
.sc-notice-top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; font-size: var(--sc-fs-tiny); }
/* the topic's mark: ONE colour for every topic — "our brown", the buttons' colour at rest (user, 2026-10-01: a colour
   per topic didn't belong to the site) */
.sc-notice-topic { display: inline-block; padding: 3px 10px; border-radius: 999px; font-weight: 600; color: var(--sc-c-ink); background: var(--sc-c-soft); }
.sc-notice-area, .sc-notice-when { opacity: .65; }
.sc-notice-off { padding: 3px 10px; border-radius: 999px; font-weight: 600; color: #8a6d1f; background: #fff6d8; } /* "פקעה" on the writer's own list */
.sc-notices .sc-notice-card .sc-notice-title { margin: 2px 0 0; font-size: inherit; line-height: 1.3; } /* three classes: above the theme's heading margins in content */
/* the whole card is the link: the title's link is stretched over it, and nothing in the card is underlined */
.sc-notices .sc-notice-card .sc-notice-link { color: inherit; text-decoration: none; }
.sc-notice-link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.sc-notice-link:focus-visible { outline: 0; }
.sc-notice-link:focus-visible::after { outline: 2px solid var(--sc-c-accent); outline-offset: 2px; border-radius: 18px; }
.sc-notices .sc-notice-card .sc-notice-text { margin: 0; font-size: var(--sc-fs-small); line-height: 1.55; opacity: .85; }
.sc-notice-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: auto 0 0; padding-top: 6px; font-size: var(--sc-fs-tiny); }
.sc-notice-replies { margin-inline-start: auto; color: var(--sc-c-btn, #3d7a66); font-weight: 600; }

/* ---- a notice's page: the title, then ONE card (like a big card of the board), then the replies — all in the
 * article's reading frame, at its full width, like an article (user, 2026-10-01) ---- */
.sc-notice-content, .sc-notice-card { overflow-wrap: anywhere; }
.sc-notice-expired { margin: 0 0 12px; padding: 12px 16px; border-radius: 12px; background: #fff6d8; font-weight: 600; }
body.dark-mode .sc-notice-expired { background: rgba(201, 162, 39, .12); }
/* no frame around the notice, like the profile's parts (user, 2026-10-01): thin lines part its top, its text and its bottom row */
.sc-notice-box { margin: 0; }
/* the top: who wrote it + when at the start, the topic and the notice's area at the end */
.sc-notice-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0 0 16px; padding-bottom: 14px; border-bottom: 1px solid var(--sc-c-line); }
.sc-notice-by { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.sc-notice-by .sc-notice-when { font-size: var(--sc-fs-small); }
.sc-notice-by .sc-member { gap: 12px; }
.sc-notice-by .sc-member-name { font-size: inherit; }
.sc-notice-box .sc-notice-top { margin: 0; font-size: var(--sc-fs-small); }
.sc-notice-main { display: flex; align-items: flex-start; gap: 20px; }
.sc-notice-content { flex: 1; min-width: 0; } /* the article's own text size and line height */
/* the photo: a modest picture beside the text; a click opens it full size (the site's viewer) */
.sc-notice-figure { flex: none; width: 260px; margin: 0; }
.sc-notice-figure a { display: block; }
.sc-notice-figure img { display: block; width: 100%; height: 260px; object-fit: cover; border-radius: 14px; }
.sc-notice-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--sc-c-line); }
.sc-notice-until { font-size: var(--sc-fs-small); opacity: .65; }
.sc-notice-tools { display: flex; flex-wrap: wrap; gap: 18px; margin: 0; } /* 18px: room for the buttons' ring */
@media (max-width: 600px) {
	.sc-notice-main { flex-direction: column-reverse; }
	.sc-notice-figure { width: 100%; }
	.sc-notice-figure img { height: auto; max-height: 320px; }
}

/* ---- the community page ---- */
.sc-community-page { display: grid; gap: 2.4rem; margin: 0 0 3rem; }
.sc-community-part > h2 { margin: 0 0 1rem; } /* size: the theme's .entry-content h2 */
.sc-community-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; margin: 1.6rem 0 0; } /* 18px: room for the buttons' ring */

/* ---- the form window (the login window's frame, assets/login.css) ---- */
.sc-notice-form { width: min(560px, calc(100vw - 32px)); text-align: start; }
.sc-notice-form h2 { text-align: center; }
.sc-notice-fields { display: grid; gap: 14px; }
.sc-notice-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sc-notice-fields .sc-profile-field { display: grid; gap: 6px; }
.sc-notice-fields .sc-profile-field > span { font-weight: 600; font-size: var(--sc-fs-small); }
.sc-notice-fields textarea { min-height: 7em; resize: vertical; }
.sc-notice-fields .sc-profile-count { font-size: var(--sc-fs-tiny); opacity: .6; }
.sc-notice-photo-field { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.sc-notice-preview { width: 56px; height: 56px; border-radius: 10px; object-fit: cover; }
.sc-notice-photo-x { padding: 0; border: 0; background: none; font: inherit; font-size: var(--sc-fs-tiny); color: #a2504a; cursor: pointer; }
.sc-notice-rules { margin: 0; font-size: var(--sc-fs-tiny); opacity: .7; }
.sc-notice-form .sc-login-soon { margin: 0; color: #a2504a; font-weight: 600; }
@media (max-width: 520px) { .sc-notice-row { grid-template-columns: 1fr; } }