/*
Theme Name: FootModelCentral
Theme URI: https://footmodelcentral.com
Description: Dark, sleek block theme with a rainbow glowing title, a slow-motion latest-posts carousel, card grid listings, a models directory, and custom comments with an admin badge.
Author: FootModelCentral
Version: 2.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: footmodelcentral
*/

:root { --fmc-line:#2E2838; --fmc-surface:#1C1824; --fmc-accent:#E8567A; }

body { -webkit-font-smoothing: antialiased; }
a { text-underline-offset: .2em; }
:focus-visible { outline: 2px solid var(--fmc-accent); outline-offset: 3px; }

/* Header */
.site-header { border-bottom: 1px solid var(--fmc-line); padding-block: 1rem 1.25rem; }
.site-header .wp-block-site-tagline { color: #9C95AA; font-size: .875rem; margin: 0; }
.site-header .wp-block-search { margin-top: 1rem; }
.wp-block-search__input { background: var(--fmc-surface); color: #ECE8F1; border: 1px solid var(--fmc-line); border-radius: 6px; padding: .7rem .9rem; }
.wp-block-search__button { background: var(--fmc-accent); color: #121016; border: 0; border-radius: 6px; padding: .7rem 1rem; }

/* Card grid */
.fmc-grid .wp-block-post-template { gap: 1.5rem; }
.fmc-card { background: var(--fmc-surface); border: 1px solid var(--fmc-line); border-radius: 10px; overflow: hidden; height: 100%; transition: border-color .2s ease; }
.fmc-card:hover { border-color: var(--fmc-accent); }
.fmc-card .wp-block-post-featured-image { margin: 0; }
.fmc-card .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fmc-card .fmc-card-body { padding: 1rem 1.1rem 1.2rem; }
.fmc-card .wp-block-post-title { font-size: 1.15rem; margin: 0 0 .4rem; }
.fmc-card .wp-block-post-title a { text-decoration: none; }
.fmc-card .wp-block-post-terms { font-size: .85rem; color: #9C95AA; }
.fmc-card .wp-block-post-terms a { color: #9C95AA; text-decoration: none; }
.fmc-card .wp-block-post-terms a:hover { color: var(--fmc-accent); }
.fmc-models .fmc-card .wp-block-post-featured-image { aspect-ratio: 3/4; }

/* Pagination */
.wp-block-query-pagination { margin-top: 2rem; gap: 1rem; }
.wp-block-query-pagination a { text-decoration: none; }

/* Single post */
.wp-block-post-content .wp-block-button__link { text-decoration: none; padding: .8rem 1.6rem; }
.fmc-meta { color: #9C95AA; font-size: .9rem; }

/* Footer */
.site-footer { border-top: 1px solid var(--fmc-line); margin-top: 4rem; padding-block: 2rem; color: #9C95AA; font-size: .875rem; }
.site-footer a { color: #ECE8F1; }

@media (max-width: 781px) { .fmc-card .wp-block-post-title { font-size: 1.05rem; } }

/* =========================================================
   Rainbow glowing site title
   ========================================================= */
:root { --fmc-rainbow: linear-gradient(90deg,#ff2d55,#ff8a00,#ffe600,#2bff88,#00d4ff,#7a5cff,#ff3df0,#ff2d55); }

.wp-block-site-title { font-weight: 900; letter-spacing: -.01em; font-size: clamp(1.75rem, 1.2rem + 2.4vw, 2.75rem); line-height: 1.1; margin: 0; }
.wp-block-site-title a,
.wp-block-site-title:not(:has(a)) {
	text-decoration: none;
	background: var(--fmc-rainbow);
	background-size: 200% auto;
	-webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: transparent;
	animation: fmc-rainbow-shift 5s linear infinite, fmc-rainbow-glow 5s linear infinite;
}
.wp-block-site-title a:hover { -webkit-text-fill-color: transparent; color: transparent; }

@keyframes fmc-rainbow-shift { to { background-position: 200% center; } }
@keyframes fmc-rainbow-glow {
	0%, 100% { filter: drop-shadow(0 0 6px rgba(255,45,85,.85))  drop-shadow(0 0 18px rgba(255,45,85,.45)); }
	16%      { filter: drop-shadow(0 0 6px rgba(255,138,0,.85))  drop-shadow(0 0 18px rgba(255,138,0,.45)); }
	33%      { filter: drop-shadow(0 0 6px rgba(255,230,0,.85))  drop-shadow(0 0 18px rgba(255,230,0,.45)); }
	50%      { filter: drop-shadow(0 0 6px rgba(43,255,136,.85)) drop-shadow(0 0 18px rgba(43,255,136,.45)); }
	66%      { filter: drop-shadow(0 0 6px rgba(0,212,255,.85))  drop-shadow(0 0 18px rgba(0,212,255,.45)); }
	83%      { filter: drop-shadow(0 0 6px rgba(122,92,255,.85)) drop-shadow(0 0 18px rgba(122,92,255,.45)); }
}

/* =========================================================
   Latest posts carousel
   ========================================================= */
.fmc-carousel { position: relative; margin: 0 auto 2.5rem; }
.fmc-carousel__viewport {
	overflow: hidden; border-radius: 14px;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	        mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
	touch-action: pan-y; cursor: grab; user-select: none;
}
.fmc-carousel__viewport.is-dragging { cursor: grabbing; }
.fmc-carousel__track { display: flex; gap: 1.25rem; margin: 0; padding: .25rem 0; list-style: none; will-change: transform; }
.fmc-carousel:not(.is-ready) .fmc-carousel__track { overflow-x: auto; }
.fmc-slide { flex: 0 0 clamp(240px, 30vw, 380px); margin: 0; }
.fmc-slide a {
	position: relative; display: block; aspect-ratio: 16/9; overflow: hidden;
	border-radius: 12px; border: 1px solid var(--fmc-line); background: var(--fmc-surface);
	text-decoration: none; transition: border-color .25s ease, transform .25s ease;
}
.fmc-slide a:hover, .fmc-slide a:focus-visible { border-color: var(--fmc-accent); transform: translateY(-3px); }
.fmc-slide img, .fmc-slide__ph { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.fmc-slide__ph { background: linear-gradient(135deg, #2a1f38, #1C1824 60%, #3a1d2b); }
.fmc-slide__title {
	position: absolute; inset: auto 0 0 0; padding: 2.2rem 1rem .85rem;
	background: linear-gradient(to top, rgba(10,8,14,.92), rgba(10,8,14,0));
	color: #fff; font-weight: 700; font-size: 1rem; line-height: 1.3;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.fmc-carousel__arrow {
	position: absolute; top: 50%; z-index: 2; transform: translateY(-50%);
	width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
	border: 1px solid rgba(255,255,255,.18); background: rgba(18,16,22,.72); color: #fff;
	backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
	cursor: pointer; transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.fmc-carousel__arrow svg { width: 22px; height: 22px; }
.fmc-carousel__arrow:hover { background: var(--fmc-accent); border-color: var(--fmc-accent); color: #121016; transform: translateY(-50%) scale(1.06); }
.fmc-carousel__arrow--prev { left: .5rem; }
.fmc-carousel__arrow--next { right: .5rem; }
@media (max-width: 600px) {
	.fmc-slide { flex-basis: 78vw; }
	.fmc-carousel__arrow { width: 40px; height: 40px; }
}

/* =========================================================
   Verified admin badge (glowing rainbow checkmark)
   ========================================================= */
.fmc-verified {
	display: inline-grid; place-items: center; flex: none;
	width: 1.15em; height: 1.15em; border-radius: 50%; vertical-align: -.18em; margin-left: .3em;
	background: conic-gradient(from 0deg, #ff2d55, #ff8a00, #ffe600, #2bff88, #00d4ff, #7a5cff, #ff3df0, #ff2d55);
	animation: fmc-badge-hue 4s linear infinite, fmc-badge-glow 4s linear infinite;
}
.fmc-verified svg { width: 72%; height: 72%; filter: drop-shadow(0 0 1px rgba(0,0,0,.6)); }
@keyframes fmc-badge-hue { to { filter: hue-rotate(360deg); } }
@keyframes fmc-badge-glow {
	0%, 100% { box-shadow: 0 0 6px 1px rgba(255,45,85,.8); }
	25%      { box-shadow: 0 0 6px 1px rgba(255,230,0,.8); }
	50%      { box-shadow: 0 0 6px 1px rgba(0,212,255,.8); }
	75%      { box-shadow: 0 0 6px 1px rgba(255,61,240,.8); }
}

/* =========================================================
   Comments
   ========================================================= */
.fmc-comments { max-width: 760px; margin: 3.5rem auto 0; padding-top: 2rem; border-top: 1px solid var(--fmc-line); }
.fmc-comments__title { font-size: 1.5rem; margin: 0 0 1.5rem; display: flex; align-items: center; gap: .6rem; }
.fmc-comments__count { font-size: .85rem; font-weight: 700; padding: .15rem .6rem; border-radius: 999px; background: var(--fmc-surface); border: 1px solid var(--fmc-line); color: #9C95AA; }
.fmc-comments__empty { color: #9C95AA; }

.fmc-comment-list, .fmc-comment-list .children { list-style: none; margin: 0; padding: 0; }
.fmc-comment-list .children { margin-left: 1.5rem; padding-left: 1rem; border-left: 2px solid var(--fmc-line); }
.fmc-comment { margin: 0 0 1rem; }
.fmc-comment__inner { display: flex; gap: .9rem; padding: 1rem 1.1rem; border-radius: 12px; background: var(--fmc-surface); border: 1px solid var(--fmc-line); }
.fmc-comment--admin > .fmc-comment__inner { border-color: transparent; background: linear-gradient(var(--fmc-surface), var(--fmc-surface)) padding-box, var(--fmc-rainbow) border-box; border: 1px solid transparent; }
.fmc-comment__avatar img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; display: block; }
.fmc-comment--admin .fmc-comment__avatar img { box-shadow: 0 0 0 2px #121016, 0 0 0 4px rgba(255,255,255,.08), 0 0 14px rgba(122,92,255,.55); }
.fmc-comment__main { min-width: 0; flex: 1; }
.fmc-comment__head { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .5rem; margin-bottom: .25rem; }
.fmc-name { font-weight: 700; color: #ECE8F1; }
.fmc-comment__head .fmc-verified { margin-left: -.2rem; }
.fmc-comment__head time { color: #9C95AA; font-size: .8rem; }
.fmc-comment__body p { margin: 0 0 .5rem; overflow-wrap: anywhere; }
.fmc-comment__pending { color: #E8C35A; font-size: .85rem; margin: 0 0 .4rem; }
.fmc-comment__reply a { font-size: .85rem; color: #9C95AA; text-decoration: none; font-weight: 600; }
.fmc-comment__reply a:hover { color: var(--fmc-accent); }

.comment-respond { margin-top: 2rem; padding: 1.4rem; border-radius: 12px; background: var(--fmc-surface); border: 1px solid var(--fmc-line); }
.comment-reply-title { font-size: 1.15rem; margin: 0 0 1rem; }
.comment-reply-title small { margin-left: .75rem; font-size: .8rem; }
.fmc-form-note { color: #9C95AA; font-size: .85rem; margin: 0 0 1rem; }
.fmc-identity { display: flex; align-items: center; gap: .7rem; margin-bottom: 1rem; }
.fmc-identity img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.fmc-identity__text { color: #9C95AA; font-size: .9rem; }
.fmc-identity__text a { color: #9C95AA; margin-left: .4rem; }
.fmc-comment-form p { margin: 0 0 1rem; }
.fmc-comment-form label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: .35rem; }
.fmc-comment-form input[type=text], .fmc-comment-form input[type=email], .fmc-comment-form input[type=url], .fmc-comment-form textarea {
	width: 100%; box-sizing: border-box; background: #121016; color: #ECE8F1;
	border: 1px solid var(--fmc-line); border-radius: 8px; padding: .7rem .85rem; font: inherit;
}
.fmc-comment-form textarea { resize: vertical; min-height: 110px; }
.fmc-comment-form input:focus, .fmc-comment-form textarea:focus { border-color: var(--fmc-accent); outline: none; }
.fmc-comment-form .comment-form-cookies-consent { display: flex; gap: .5rem; align-items: flex-start; }
.fmc-comment-form .comment-form-cookies-consent label { font-weight: 400; margin: 0; color: #9C95AA; }
.fmc-counter { display: flex; justify-content: space-between; gap: 1rem; margin-top: .4rem; font-size: .8rem; color: #9C95AA; }
.fmc-count { font-variant-numeric: tabular-nums; }
.fmc-count.is-over { color: #ff5c7a; font-weight: 700; }
.fmc-count.is-under { color: #E8C35A; }
.fmc-comment-form .submit { background: var(--fmc-accent); color: #121016; border: 0; border-radius: 8px; padding: .75rem 1.4rem; font-weight: 700; cursor: pointer; }
.fmc-comment-form .submit:disabled { opacity: .45; cursor: not-allowed; }

@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; scroll-behavior: auto !important; }
	.wp-block-site-title a, .wp-block-site-title:not(:has(a)), .fmc-verified { animation-duration: 20s !important; }
}