/* Forums Admin: utility shims + form styling
   Add these to the stylesheet returned by Minisites::Theme::get_css_href()
*/
body {
	font-family: sans-serif;
}
/* Layout */
.container { max-width: 1400px; margin: 0 auto; padding: 0 1rem; }

/* Simple grid with responsive columns */
.grid { display: grid; }
.grid-cols-1 { grid-template-columns: 1fr; }
.grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
.grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
.md\:grid-cols-2 { grid-template-columns: 1fr; }
.md\:grid-cols-3 { grid-template-columns: 1fr; }
.md\:grid-cols-4 { grid-template-columns: 1fr; }
@media (min-width: 768px) {
	.md\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
	.md\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
	.md\:grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
}

/* Spacing */
.p-3 { padding: 0.75rem; }
.p-4 { padding: 1rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.my-4 { margin-top: 1rem; margin-bottom: 1rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }

/* Cards and borders */
.rounded-xl { border-radius: 0.75rem; }
.rounded-2xl { border-radius: 1rem; }
.border { border: 1px solid #e5e7eb; }
.shadow { box-shadow: 0 1px 2px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.1); }
.bg-white { background: #fff; }

/* Typography */
h2, h3 { margin: 0; font-weight: 600; color: #111827; }
h2.text-xl { font-size: 1.25rem; line-height: 1.5rem; }
h3.text-lg { font-size: 1.125rem; line-height: 1.5rem; }

.text-xs { font-size: 0.875rem; line-height: 1rem; }
.text-sm { font-size: 0.895rem; line-height: 1.25rem; }
.text-gray-600 { color: #4b5563; }
.text-gray-700 { color: #374151; }

/* Forms */
form label { display: block; font-size: 0.875rem; color: #374151; margin: 0 0 0.25rem; }
input[type="text"],
input[type="number"],
select,
button,
.details-textarea,
textarea {
	display: block;
	width: 100%;
	padding: 0.5rem 0.625rem;
	border: 1px solid #d1d5db;
	border-radius: 0.5rem;
	background: #f3f4f6;
	font: 400 14px/1.4 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
	color: #111827;
	box-sizing: border-box;
}
input[type="text"]:focus,
input[type="number"]:focus,
select:focus,
textarea:focus {
	outline: none;
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba(37,99,235,0.15);
}

/* Buttons */
button {
	width: auto;
	cursor: pointer;
	background: #2563eb;
	color: #fff;
	font-weight: 600;
}
button:hover { background: #1e40af; }
button:disabled { opacity: 0.6; cursor: not-allowed; }

/* Details/summary blocks used for full body/excerpt previews */
details {
	border: 1px dashed #e5e7eb;
	border-radius: 0.5rem;
	background: #fafafa;
	padding: 0.25rem 0.5rem 0.5rem;
}
details > summary {
	cursor: pointer;
	list-style: none;
	font-size: 0.875rem;
	color: #1f2937;
	margin: 0.25rem 0 0.5rem;
}
details > summary::-webkit-details-marker { display: none; }
details pre {
	white-space: pre-wrap;      /* readable in narrow columns */
	word-wrap: break-word;
	margin: 0;
	font-size: 0.875rem;
	color: #111827;
}

/* Inline forms in cards */
form .w-full { width: 100%; }

/* Little helpers to keep the small preview lines tidy */
.text-clip {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;      /* clamp to 2 lines */
	-webkit-box-orient: vertical;
}

/* Links in the persona cards */
a { color: #2563eb; text-decoration: none; }
a:hover { text-decoration: underline; }

/* Admin page body baseline */
body.admin-forums {
	background: #f3f4f6;
	color: #111827;
}

/* Optional: a header band if render_header() is minimal */
.admin-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.75rem 0;
	border-bottom: 1px solid #e5e7eb;
}

/* Optional: make the two columns scroll independently on tall pages */
@media (min-width: 768px) {
	.admin-col {
		max-height: calc(100vh - 260px);
		overflow: auto;
	}
}

/* Subtle pill status look if you render status text anywhere */
.status-pill {
	display: inline-block;
	padding: 0.15rem 0.5rem;
	border-radius: 999px;
	font-size: 0.75rem;
	border: 1px solid #e5e7eb;
	background: #fff;
}
.status-pending { border-color: #f59e0b; color: #92400e; background: #fffbeb; }
.status-approved { border-color: #10b981; color: #065f46; background: #ecfdf5; }
.status-held { border-color: #6b7280; color: #374151; background: #f3f4f6; }
.status-cancelled { border-color: #ef4444; color: #7f1d1d; background: #fef2f2; }
.status-posted { border-color: #3b82f6; color: #1e3a8a; background: #eff6ff; }

/* ------------------------------------------------------------------
   Lightweight Tailwind-style utilities for Minisites admin
   ------------------------------------------------------------------ */

/* Layout */
.flex {
	display: flex;
}
.flex-wrap {
	flex-wrap: wrap;
}
.inline-block {
	display: inline-block;
}
.block {
	display: block;
}
.grid {
	display: grid;
}
.grid-cols-1 {
	grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* Simple responsive breakpoint for "md:" (>=768px) */
@media (min-width: 768px) {
	.md\:grid-cols-1 {
		grid-template-columns: repeat(1, minmax(0, 1fr));
	}
	.md\:grid-cols-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.md\:grid-cols-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.md\:grid-cols-4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* Spacing: padding */
.p-2 {
	padding: 0.5rem;
}
.p-3 {
	padding: 0.75rem;
}
.p-4 {
	padding: 1rem;
}
.px-1 {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}
.px-2 {
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}
.px-3 {
	padding-left: 0.75rem;
	padding-right: 0.75rem;
}
.px-4 {
	padding-left: 1rem;
	padding-right: 1rem;
}
.py-1 {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
}
.py-2 {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}
.py-3 {
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}
.py-4 {
	padding-top: 1rem;
	padding-bottom: 1rem;
}

/* Spacing: margin & gaps */
.m-0 {
	margin: 0;
}
.mt-1 {
	margin-top: 0.25rem;
}
.mt-2 {
	margin-top: 0.5rem;
}
.mt-4 {
	margin-top: 1rem;
}
.mb-1 {
	margin-bottom: 0.25rem;
}
.mb-2 {
	margin-bottom: 0.5rem;
}
.mb-4 {
	margin-bottom: 1rem;
}
.ml-1 {
	margin-left: 0.25rem;
}
.ml-2 {
	margin-left: 0.5rem;
}
.gap-2 {
	gap: 0.5rem;
}
.gap-4 {
	gap: 1rem;
}

/* Borders & radius */
.border {
	border-width: 1px;
	border-style: solid;
	border-color: #e5e7eb; /* light gray */
}
.rounded {
	border-radius: 0.25rem;
}
.rounded-xl {
	border-radius: 0.75rem;
}
.rounded-2xl {
	border-radius: 1rem;
}

/* Shadows */
.shadow {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

/* Background colours */
.bg-white {
	background: #ffffff;
}
.bg-gray-50 {
	background: #f9fafb;
}
.bg-gray-100 {
	background: #f3f4f6;
}
.bg-emerald-50 {
	background: #ecfdf5;
}
.bg-emerald-100 {
	background: #d1fae5;
}
.bg-black {
	background: #000000;
}

/* Text colours & sizes */
.text-xs {
	font-size: 0.75rem;
	line-height: 1rem;
}
.text-sm {
	font-size: 0.875rem;
	line-height: 1.25rem;
}
.text-lg {
	font-size: 1.125rem;
	line-height: 1.75rem;
}
.text-2xl {
	font-size: 1.5rem;
	line-height: 2rem;
}

.text-gray-600 {
	color: #4b5563;
}
.text-emerald-800 {
	color: #065f46;
}
.text-white {
	color: #ffffff;
}
.font-semibold {
	font-weight: 600;
}

/* Width / overflow helpers */
.w-full {
	width: 100%;
}
/* Fixed-width box for persona IDs (34 digits) */
.w-10 {
	width: 3ch;          /* enough space for 34 digit numbers */
}
.overflow-x-auto {
	overflow-x: auto;
}

/* Misc */
.whitespace-nowrap {
	white-space: nowrap;
}
.text-center {
	text-align: center;
}
.text-left {
	text-align: left;
}
.inline-flex {
	display: inline-flex;
	align-items: center;
}
.rounded-full {
	border-radius: 9999px;
}

/* ------------------------------------------------------------------
   Additional utilities + admin-specific components
   ------------------------------------------------------------------ */

/* Backgrounds not yet covered */
.bg-amber-100 {
	background-color: #fef3c7;
}
.bg-green-50 {
	background-color: #ecfdf3;
}

/* Text colours not yet covered */
.text-gray-500 {
	color: #6b7280;
}
.text-gray-700 {
	color: #374151;
}
.text-green-700 {
	color: #047857;
}
.text-red-700 {
	color: #b91c1c;
}

/* Extra text size */
.text-xl {
	font-size: 1.25rem;
	line-height: 1.75rem;
}

/* Font family */
.font-mono {
	font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}

/* Border helpers */
.border-b {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e5e7eb;
}
.border-collapse {
	border-collapse: collapse;
}

/* Alignment & list helpers */
.align-top {
	vertical-align: top;
}
.text-right {
	text-align: right;
}
.items-center {
	align-items: center;
}
.items-start {
	align-items: flex-start;
}
.list-disc {
	list-style-type: disc;
	padding-left: 1.5rem;
}

/* Extra spacing helpers */
.gap-3 {
	gap: 0.75rem;
}
.mr-3 {
	margin-right: 0.75rem;
}
.mt-3 {
	margin-top: 0.75rem;
}
.mt-8 {
	margin-top: 2rem;
}
.mx-auto {
	margin-left: auto;
	margin-right: auto;
}
.my-4 {
	margin-top: 1rem;
	margin-bottom: 1rem;
}
.pl-2 {
	padding-left: 0.5rem;
}
.pr-2 {
	padding-right: 0.5rem;
}

/* Width helpers */
.w-1/3 {
	width: 33.333333%;
}

/* White-space helpers */
.whitespace-pre-wrap {
	white-space: pre-wrap;
}

/* Underline */
.underline {
	text-decoration: underline;
}

/* ------------------------------------------------------------------
   Admin alert + panel styles
   ------------------------------------------------------------------ */

.admin-alert {
	border-radius: 0.5rem;
	padding: 0.75rem 1rem;
	margin-bottom: 1rem;
	font-size: 0.875rem;
	line-height: 1.25rem;
	border-width: 1px;
	border-style: solid;
}

.admin-alert-warning {
	background-color: #fffbeb;   /* pale amber */
	border-color: #fbbf24;       /* amber-400 */
	color: #92400e;              /* amber-800 */
}

/* Generic panel block */
.panel {
	border-radius: 0.75rem;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	padding: 0.75rem 1rem;
	margin-bottom: 1rem;
}

.panel--warning {
	background-color: #fffbeb;
	border-color: #fbbf24;
}

/* Badges (used for counts/status tags) */
.badge {
	display: inline-block;
	border-radius: 9999px;
	padding: 0.125rem 0.5rem;
	font-size: 0.75rem;
	line-height: 1rem;
	border: 1px solid #e5e7eb;
	background-color: #f9fafb;
	color: #374151;
}

.badge-alerts {
	background-color: #fee2e2;  /* red-100 */
	border-color: #fecaca;      /* red-200 */
	color: #b91c1c;             /* red-700 */
}

/* Header / sub-nav links in forums admin */
.admin-nav-link {
	font-size: 0.875rem;          /* similar to .text-sm */
	color: #374151;               /* similar to .text-gray-700 */
	text-decoration: none;
	margin-left: 1.5rem;         /* similar to .ml-3 */
	margin-bottom: 0.75rem;
}

.admin-nav-link:hover {
	text-decoration: underline;
	color: #111827;               /* a bit darker on hover */
}

/* ------------------------------------------------------------------
   BlackjackTables.co.uk front-end theme (non-admin pages)
   ------------------------------------------------------------------ */

/* Dark, casino-style baseline for the public minisite */
body:not(.admin-forums) {
	background-color: #020617;      /* near-black */
	color: #e5e7eb;                 /* light grey text */
	font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

/* Make headings pop on the dark background */
body:not(.admin-forums) h1,
body:not(.admin-forums) h2,
body:not(.admin-forums) h3,
body:not(.admin-forums) h4 {
	color: #f9fafb;                 /* almost white */
	font-weight: 700;
}

/* Container for front-end pages  a bit narrower and padded */
body:not(.admin-forums) .container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 1.5rem 1rem;
}

/* Links on the minisite use a green/gold accent rather than blue */
body:not(.admin-forums) a {
	color: #22c55e;                 /* emerald-500 */
	text-decoration: none;
}
body:not(.admin-forums) a:hover {
	color: #a3e635;                 /* lime-400 */
	text-decoration: underline;
}

/* Primary CTA button (if not overridden by existing button styles) */
body:not(.admin-forums) .btn-primary,
body:not(.admin-forums) .btn,
body:not(.admin-forums) .product__cta,
body:not(.admin-forums) .cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.4rem;
    border-radius: 9999px;
    font-weight: 600;
    font-size: 0.95rem;
    border: 1px solid #facc15;      /* gold */
    background: radial-gradient(circle at top, #15803d 0%, #052e16 55%, #020617 100%);
    color: #fefce8;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.45);
    cursor: pointer;
}

body:not(.admin-forums) .btn-primary:hover,
body:not(.admin-forums) .btn:hover,
body:not(.admin-forums) .product__cta:hover,
body:not(.admin-forums) .cta-button:hover {
    background: radial-gradient(circle at top, #16a34a 0%, #047857 45%, #022c22 100%);
    border-color: #f59e0b;
}


/* Hero block for the blackjack table minisite */
.bj-hero {
	border-radius: 1.5rem;
	padding: 2rem 1.75rem;
	margin-bottom: 2rem;
	background:
		radial-gradient(circle at top left, rgba(34,197,94,0.40), transparent 55%),
		radial-gradient(circle at top right, rgba(239,68,68,0.35), transparent 55%),
		radial-gradient(circle at center, #065f46, #022c22 60%, #020617 100%);
	box-shadow: 0 20px 45px rgba(0,0,0,0.65);
	color: #ecfdf5;
}
.bj-hero-title {
	font-size: 1.9rem;
	line-height: 2.3rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	margin-bottom: 0.25rem;
}
.bj-hero-subtitle {
	font-size: 0.95rem;
	line-height: 1.5rem;
	color: #d1fae5;
	max-width: 34rem;
}
.bj-hero-meta {
	margin-top: 0.75rem;
	font-size: 0.8rem;
	color: #a7f3d0;
}

/* Chip-style category pills */
.bj-chip-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 1rem;
}
.bj-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.25rem 0.8rem;
	border-radius: 9999px;
	font-size: 0.8rem;
	font-weight: 600;
	background: radial-gradient(circle at center, #0f172a 0%, #020617 60%);
	border: 1px solid rgba(148,163,184,0.7);
	color: #e5e7eb;
	box-shadow: 0 4px 10px rgba(0,0,0,0.55);
}
.bj-chip--green {
	border-color: #22c55e;
	color: #bbf7d0;
}
.bj-chip--red {
	border-color: #f97373;
	color: #fee2e2;
}

/* Section wrapper used for grid of tables, guides, etc. */
.bj-section {
	margin-top: 2rem;
}
.bj-section-header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 0.85rem;
}
.bj-section-title {
	font-size: 1.25rem;
	font-weight: 700;
	color: #f9fafb;
}
.bj-section-subtitle {
	font-size: 0.85rem;
	color: #9ca3af;
}

/* Product / table cards */
.card {
	border-radius: 1.25rem;
	background: radial-gradient(circle at top, #0b1120 0%, #020617 65%);
	border: 1px solid rgba(148,163,184,0.5);
	box-shadow: 0 12px 30px rgba(0,0,0,0.6);
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
/* Product card images on BlackjackTables – constrain size & round corners */
body:not(.admin-forums) .card img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0.75rem;
	object-fit: contain;
}
.bj-card-title {
	font-size: 0.95rem;
	font-weight: 600;
	color: #e5e7eb;
}
.bj-card-meta {
	font-size: 0.8rem;
	color: #9ca3af;
}
.bj-card-price {
	font-size: 1rem;
	font-weight: 700;
	color: #facc15;                /* gold price */
}

/* Small "tag" labels for things like table type, felt colour, dealer style */
.bj-tag-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}
.bj-tag {
	display: inline-flex;
	align-items: center;
	padding: 0.15rem 0.55rem;
	border-radius: 9999px;
	font-size: 0.75rem;
	font-weight: 500;
	background: rgba(15,23,42,0.9);
	border: 1px solid rgba(148,163,184,0.7);
	color: #e5e7eb;
}

/* Subtle divider section on dark background */
.bj-divider {
	height: 1px;
	border: 0;
	margin: 1.5rem 0;
	background: linear-gradient(
		to right,
		transparent,
		rgba(148,163,184,0.5),
		transparent
	);
}

/* Primary navigation  BlackjackTables header */
body:not(.admin-forums) .primary-nav {
	margin-top: 1rem;
}

body:not(.admin-forums) .primary-nav__list {
	list-style: none;           /* remove bullets */
	margin: 0;
	padding: 0;
	display: flex;              /* horizontal */
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: flex-end;  /* move pills to top-right */	
}

body:not(.admin-forums) .primary-nav__item {
	margin: 0;
	padding: 0;
}

body:not(.admin-forums) .primary-nav__link {
	display: inline-flex;
	align-items: center;
	padding: 0.35rem 0.9rem;
	border-radius: 9999px;
	font-size: 0.9rem;
	font-weight: 500;
	color: #F2F2F2;             /* same as header text */
	text-decoration: none;
	background-color: rgba(15,23,42,0.35); /* subtle dark pill */
	border: 1px solid rgba(148,163,184,0.7);
}

body:not(.admin-forums) .primary-nav__link:hover {
	background-color: rgba(15,23,42,0.9);
	border-color: #D4AF37;      /* gold accent on hover */
	color: #FDE68A;
}

/* Breadcrumb bar just under the header */
body:not(.admin-forums) .site-header__meta {
	background-color: #020617;          /* near-black */
	color: #B7C5B0;
	border-bottom: 1px solid rgba(148,163,184,0.4);
}

body:not(.admin-forums) .breadcrumb {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0.5rem 1rem;
	font-size: 0.8rem;
}

body:not(.admin-forums) .breadcrumb__list {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0;
	padding: 0;
}

body:not(.admin-forums) .breadcrumb__item {
	color: #9CA3AF;
}

body:not(.admin-forums) .breadcrumb__item a {
	color: #B7C5B0;
	text-decoration: none;
}

body:not(.admin-forums) .breadcrumb__item a:hover {
	color: #F2F2F2;
	text-decoration: underline;
}

/* separator chevron, except after the last crumb */
body:not(.admin-forums) .breadcrumb__item::after {
	content: ">";
	margin-left: 0.25rem;
	color: #4B5563;
}
body:not(.admin-forums) .breadcrumb__item:last-child::after {
	content: "";
}

/* current page crumb */
body:not(.admin-forums) .breadcrumb__item--current {
	color: #D4AF37;        /* gold */
	font-weight: 600;
}

/* Search bar  align with breadcrumbs and theme colours */
body:not(.admin-forums) .search {
	max-width: 480px;
	margin: 0.75rem 1rem 1.5rem auto; /* right-align under nav */
	padding: 0 1rem 0 0;              /* optional: remove left padding if you prefer */
	display: flex;
	gap: 0.5rem;
}
body:not(.admin-forums) .search input[type="search"] {
	flex: 1;
	border-radius: 9999px;
	border: 1px solid #4B5563;
	background-color: #020617;
	color: #E5E7EB;
	padding: 0.45rem 0.9rem;
	font-size: 0.9rem;
}

body:not(.admin-forums) .search input[type="search"]::placeholder {
	color: #6B7280;
}

body:not(.admin-forums) .search button[type="submit"] {
	border-radius: 9999px;
	border: 1px solid #FACC15;        /* gold */
	background: radial-gradient(circle at top, #15803D 0%, #052E16 55%, #020617 100%);
	color: #FEFCE8;
	padding: 0.45rem 1.1rem;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	box-shadow: 0 8px 20px rgba(0,0,0,0.5);
}

body:not(.admin-forums) .search button[type="submit"]:hover {
	background: radial-gradient(circle at top, #16A34A 0%, #047857 45%, #022C22 100%);
	border-color: #F59E0B;
}
/* BlackjackTables header layout: title + tagline + breadcrumbs left, nav + search right */
body:not(.admin-forums) .header-layout {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
}

body:not(.admin-forums) .header-layout__left {
	max-width: 60%;
}

body:not(.admin-forums) .header-layout__right {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.75rem;
}

/* Override previous centering on the search form now it's in header-layout__right */
body:not(.admin-forums) .search {
	max-width: 320px;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 0.5rem;
}

@media (max-width: 768px) {
	body:not(.admin-forums) .header-layout {
		flex-direction: column;
		align-items: flex-start;
	}

	body:not(.admin-forums) .header-layout__left,
	body:not(.admin-forums) .header-layout__right {
		max-width: 100%;
		align-items: flex-start;
	}

	body:not(.admin-forums) .search {
		max-width: 100%;
	}
}

/* BlackjackTables casino-style hero
   -------------------------------------------------- */
body:not(.admin-forums) .bt-hero {
	background: radial-gradient(circle at top left, #145c42 0%, #0c3d2e 45%, #05241a 100%);
	padding: 2.5rem 1.25rem 2.75rem 1.25rem;
	color: #f2f2f2;
}

body:not(.admin-forums) .bt-hero__inner {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2.5rem;
}

body:not(.admin-forums) .bt-hero__content {
	max-width: 620px;
}

body:not(.admin-forums) .bt-hero__title {
	font-size: 2.25rem;
	line-height: 1.15;
	font-weight: 700;
	color: #d4af37;
	margin: 0 0 0.75rem 0;
}

body:not(.admin-forums) .bt-hero__subtitle {
	font-size: 1.05rem;
	line-height: 1.6;
	color: #dce6d7;
	margin: 0 0 1.25rem 0;
}

body:not(.admin-forums) .bt-hero__bullets {
	list-style: none;
	margin: 0 0 1.5rem 0;
	padding: 0;
}

body:not(.admin-forums) .bt-hero__bullets li {
	position: relative;
	padding-left: 1.4rem;
	font-size: 0.98rem;
	line-height: 1.5;
	margin-bottom: 0.4rem;
	color: #eef3eb;
}

body:not(.admin-forums) .bt-hero__bullets li::before {
	content: "?";
	position: absolute;
	left: 0;
	top: 0.12rem;
	font-size: 0.75rem;
	color: #d4af37;
}

body:not(.admin-forums) .bt-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

body:not(.admin-forums) .bt-hero__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.65rem 1.4rem;
	border-radius: 999px;
	font-size: 0.95rem;
	font-weight: 600;
	text-decoration: none;
	border: 1px solid transparent;
	transition: transform 0.12s ease, box-shadow 0.12s ease, background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
	white-space: nowrap;
}

body:not(.admin-forums) .bt-hero__btn--primary {
	background: linear-gradient(135deg, #d4af37, #f5d05b);
	color: #1a1a1a;
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35);
}

body:not(.admin-forums) .bt-hero__btn--primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
}

body:not(.admin-forums) .bt-hero__btn--ghost {
	background: rgba(7, 37, 26, 0.7);
	color: #f2f2f2;
	border-color: rgba(212, 175, 55, 0.5);
}

body:not(.admin-forums) .bt-hero__btn--ghost:hover {
	background: rgba(12, 61, 46, 0.9);
	border-color: #d4af37;
}

/* Visual side: felt table, chips, cards */
body:not(.admin-forums) .bt-hero__visual {
	flex: 0 0 340px;
	display: flex;
	justify-content: center;
}

body:not(.admin-forums) .bt-hero__table {
	position: relative;
	width: 100%;
	max-width: 340px;
	aspect-ratio: 4 / 3;
	border-radius: 1.75rem;
	background: radial-gradient(circle at 30% 0%, #1a7b58 0%, #0c3d2e 55%, #05241a 100%);
	box-shadow:
		0 22px 40px rgba(0, 0, 0, 0.55),
		inset 0 0 0 3px rgba(10, 20, 14, 0.7);
	overflow: hidden;
}

/* soft highlight ring on the felt */
body:not(.admin-forums) .bt-hero__felt-ring {
	position: absolute;
	inset: 16%;
	border-radius: 999px;
	border: 2px dashed rgba(235, 241, 232, 0.25);
}

/* Chip stacks */
body:not(.admin-forums) .bt-hero__chip-stack {
	position: absolute;
	display: flex;
	flex-direction: column;
	gap: 0.18rem;
}

body:not(.admin-forums) .bt-hero__chip-stack--left {
	left: 10%;
	bottom: 12%;
}

body:not(.admin-forums) .bt-hero__chip-stack--right {
	right: 12%;
	bottom: 18%;
}

body:not(.admin-forums) .bt-hero__chip {
	width: 30px;
	height: 30px;
	border-radius: 999px;
	box-shadow:
		0 4px 8px rgba(0, 0, 0, 0.45),
		inset 0 0 0 3px rgba(255, 255, 255, 0.35);
	border: 2px solid rgba(0, 0, 0, 0.55);
}

body:not(.admin-forums) .bt-hero__chip--red {
	background: radial-gradient(circle at 30% 30%, #ffdddd 0%, #b7171b 55%, #7b0508 100%);
}

body:not(.admin-forums) .bt-hero__chip--blue {
	background: radial-gradient(circle at 30% 30%, #dde9ff 0%, #2459c7 55%, #163578 100%);
}

body:not(.admin-forums) .bt-hero__chip--gold {
	background: radial-gradient(circle at 30% 30%, #fff5cf 0%, #d4af37 55%, #8b6e11 100%);
}

body:not(.admin-forums) .bt-hero__chip--green {
	background: radial-gradient(circle at 30% 30%, #e3ffdf 0%, #1c7c46 55%, #0e4a28 100%);
}

body:not(.admin-forums) .bt-hero__chip--white {
	background: radial-gradient(circle at 30% 30%, #ffffff 0%, #cccccc 55%, #9c9c9c 100%);
}

/* Cards */
body:not(.admin-forums) .bt-hero__cards {
	position: absolute;
	right: 18%;
	top: 14%;
	width: 110px;
	height: 90px;
}

body:not(.admin-forums) .bt-hero__card {
	position: absolute;
	width: 70px;
	height: 100px;
	border-radius: 0.6rem;
	background: #f8fafc;
	box-shadow: 0 12px 20px rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 1.4rem;
}

body:not(.admin-forums) .bt-hero__card--front {
	right: 0;
	top: 6px;
	transform: rotate(10deg);
	color: #b7171b;
}

body:not(.admin-forums) .bt-hero__card--back {
	right: 30px;
	top: 0;
	transform: rotate(-8deg);
	color: #111827;
}

/* Responsive */
@media (max-width: 900px) {
	body:not(.admin-forums) .bt-hero__inner {
		flex-direction: column;
		align-items: flex-start;
	}

	body:not(.admin-forums) .bt-hero__visual {
		align-self: center;
	}

	body:not(.admin-forums) .bt-hero__content {
		max-width: 100%;
	}
}

@media (max-width: 600px) {
	body:not(.admin-forums) .bt-hero {
		padding: 1.75rem 1rem 2rem 1rem;
	}

	body:not(.admin-forums) .bt-hero__title {
		font-size: 1.7rem;
	}

	body:not(.admin-forums) .bt-hero__table {
		max-width: 280px;
	}
}

/* Make FAQ answers readable inside <details> */
details > div {
	color: #111827;   /* or another dark colour that matches your theme */
}

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* BlackjackTables category pills row (.cats) */
body:not(.admin-forums) .cats {
	margin: 1.5rem 0 1rem 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	justify-content: center; /* centre the pills */
}

body:not(.admin-forums) .cats li {
	margin: 0;
	padding: 0;
}

body:not(.admin-forums) .cats a {
	display: inline-flex;
	align-items: center;
	padding: 0.35rem 0.95rem;
	border-radius: 9999px;
	font-size: 0.9rem;
	font-weight: 500;
	background-color: rgba(15,23,42,0.75);         /* dark pill */
	border: 1px solid rgba(148,163,184,0.75);      /* slate border */
	color: #E5E7EB;                                /* light text */
	text-decoration: none;
	white-space: nowrap;
}

body:not(.admin-forums) .cats a:hover {
	background-color: rgba(15,23,42,0.95);
	border-color: #D4AF37;                         /* gold accent */
	color: #FDE68A;
}


/* BlackjackTables product grids on any main .grid (e.g. category pages) */
body:not(.admin-forums) main .grid {
	display: grid;
	gap: 1.5rem;
}

/* On tablet/desktop, force 3 columns so 1-2 products never fill full width */
@media (min-width: 768px) {
	body:not(.admin-forums) main .grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		justify-content: center; /* center the columns when there are gaps */
	}
}

/* Default product card styling for any .card inside those grids */
body:not(.admin-forums) main .grid .card {
	border-radius: 1.25rem;
	background: radial-gradient(circle at top, #0b1120 0%, #020617 65%);
	border: 1px solid rgba(148,163,184,0.5);
	box-shadow: 0 12px 30px rgba(0,0,0,0.6);
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
	max-width: 100%;
}

/* Constrain and round images in those generic cards */
body:not(.admin-forums) main .grid .card img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0.75rem;
	object-fit: contain;
}

/* BlackjackTables product grids: cards under category pills (.cats) */
body:not(.admin-forums) .cats + .grid {
	display: grid;
	gap: 1.5rem;
}

/* Fallback: constrain any product images inside .card on BlackjackTables */
body:not(.admin-forums) .card img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 0.75rem;
	object-fit: contain;
}

/* One column on small screens */
@media (max-width: 767px) {
	body:not(.admin-forums) .cats + .grid {
		grid-template-columns: 1fr;
	}
}

/* Three columns on tablet/desktop, so cards never go full width */
@media (min-width: 768px) {
	body:not(.admin-forums) .cats + .grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Style the product cards themselves (only in product grids) */
body:not(.admin-forums) .cats + .grid .card {
	border-radius: 1.25rem;
	background: radial-gradient(circle at top, #0b1120 0%, #020617 65%);
	border: 1px solid rgba(148,163,184,0.5);
	box-shadow: 0 12px 30px rgba(0,0,0,0.6);
	padding: 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}

/* Constrain and round the images inside those cards */
body:not(.admin-forums) .cats + .grid .card img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0.75rem;
	object-fit: contain;
}

/* Keep the buybox pinned to the bottom of the card */
body:not(.admin-forums) .cats + .grid .card .outer_buybox {
	margin-top: auto;
}

/* Product page – clamp main product image width */
.product__image {
	text-align: center;              /* centre the image within the figure */
}

.product__image img {
	width: 95%;
	max-width: 95%;
	height: auto;
	margin: 0 auto 1.5rem;
}

/* Optionally: on small screens, let it go full-width */
@media (max-width: 767.98px) {
	.product__image img {
		width: 100%;
		max-width: 100%;
	}
}

/* Product page – two-column layout on larger screens */
@media (min-width: 880px) {
	/* Keep normal block flow overall */
	.product__info {
		display: block;
	}

	/* Float the image block to the left */
	.product__media {
		float: left;
		width: 40%;
		max-width: 420px;
		margin: 0 2rem 1.5rem 0;
	}

	/* No extra margin on the figure when floated */
	.product__image {
		margin: 0;
	}

	/* Make the “Prices from retailers” section full width below the float */
	.product__info h2,
	.product__info .offers {
		clear: both;
	}
}
.admin-page-with-margin {
	margin-left: 20px;
}