/**
 * Imagic Directory — Explorer Dashboard CSS
 *
 * @package ImagicDirectory
 * @since   1.4.0
 */

/* ── Variables ──────────────────────────────────────────────── */
:root {
	--edb-radius  : 14px;
	--edb-gap     : 20px;
	--edb-shadow  : 0 2px 16px rgba(0,0,0,.07);
	--edb-accent  : #111;
	--edb-curator : #a855f7;
	--edb-heart   : #e84545;
	--edb-text    : #222;
	--edb-muted   : #888;
	--edb-border  : #ebebeb;
	--edb-bg      : #f8f8f8;
}

/* ── Reset ──────────────────────────────────────────────────── */
.edb-wrap *, .edb-wrap *::before, .edb-wrap *::after { box-sizing: border-box; }

/* ── Page wrapper ───────────────────────────────────────────── */
.edb-wrap {
	max-width: 1160px;
	margin: 0 auto;
	padding: 36px 24px 80px;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: var(--edb-text);
}

/* ── Notice ─────────────────────────────────────────────────── */
.edb-notice {
	padding: 14px 18px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
}
.edb-notice--error { background:#fef2f2; color:#991b1b; border:1px solid #fca5a5; }
.edb-notice--info  { background:#eff6ff; color:#1e40af; border:1px solid #bfdbfe; }

/* ─────────────────────────────────────────────────────────────
   WELCOME HEADER
───────────────────────────────────────────────────────────── */
.edb-welcome {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 48px;
	padding-bottom: 32px;
	border-bottom: 1px solid var(--edb-border);
}

.edb-welcome__avatar {
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--edb-accent);
	color: #fff;
	font-size: 28px;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	user-select: none;
}

.edb-welcome__title {
	font-size: 26px;
	font-weight: 800;
	margin: 0 0 4px;
	line-height: 1.15;
}

.edb-welcome__location {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 14px;
	color: var(--edb-muted);
	margin: 0;
}
.edb-welcome__location .dashicons {
	font-size: 16px; width: 16px; height: 16px; color: var(--edb-heart);
}

/* ─────────────────────────────────────────────────────────────
   SECTIONS
───────────────────────────────────────────────────────────── */
.edb-section {
	margin-bottom: 56px;
}

.edb-section__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 20px;
}

.edb-section__title {
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 4px;
	display: flex;
	align-items: center;
	gap: 8px;
}
.edb-section__title .dashicons {
	font-size: 20px; width: 20px; height: 20px; color: var(--edb-muted);
}

.edb-section--curator .edb-section__title .dashicons { color: var(--edb-curator); }

.edb-section__subtitle {
	font-size: 14px;
	color: var(--edb-muted);
	margin: 0;
	line-height: 1.5;
}
.edb-section__subtitle a { color: var(--edb-accent); }

.edb-section__see-all {
	font-size: 13px;
	font-weight: 600;
	color: var(--edb-accent);
	text-decoration: none;
	white-space: nowrap;
	border: 1.5px solid var(--edb-border);
	border-radius: 8px;
	padding: 6px 14px;
	transition: background .15s;
	flex-shrink: 0;
	align-self: center;
}
.edb-section__see-all:hover { background: var(--edb-bg); }

/* ─────────────────────────────────────────────────────────────
   EMPTY STATES
───────────────────────────────────────────────────────────── */
.edb-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 40px 20px;
	background: var(--edb-bg);
	border: 1.5px dashed var(--edb-border);
	border-radius: var(--edb-radius);
	text-align: center;
}
.edb-empty--full { width: 100%; }
.edb-empty .dashicons { font-size: 40px; width: 40px; height: 40px; color: #ccc; }
.edb-empty p { font-size: 14px; color: var(--edb-muted); margin: 0; max-width: 340px; }

/* ─────────────────────────────────────────────────────────────
   BUSINESS CARD
───────────────────────────────────────────────────────────── */
.edb-card {
	background: #fff;
	border: 1px solid var(--edb-border);
	border-radius: var(--edb-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .2s, transform .2s;
	width: 240px;
	flex-shrink: 0;
}
.edb-card:hover {
	box-shadow: var(--edb-shadow);
	transform: translateY(-2px);
}

/* Inside grids, cards fill the column */
.edb-grid .edb-card { width: 100%; }

.edb-card__cover {
	position: relative;
	display: block;
	aspect-ratio: 4/3;
	overflow: hidden;
	background: var(--edb-bg);
}
.edb-card__cover img {
	width: 100%; height: 100%; object-fit: cover;
	display: block;
	transition: transform .3s;
}
.edb-card:hover .edb-card__cover img { transform: scale(1.04); }

.edb-card__cover-placeholder {
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
	background: var(--edb-bg);
}
.edb-card__cover-placeholder .dashicons { font-size: 40px; width: 40px; height: 40px; color: #ccc; }

/* Curator badge on cover */
.edb-card__curator-badge {
	position: absolute;
	top: 10px; left: 10px;
	background: var(--edb-curator);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	padding: 4px 10px;
	border-radius: 20px;
	display: flex; align-items: center; gap: 4px;
	letter-spacing: .02em;
}
.edb-card__curator-badge .dashicons { font-size: 13px; width: 13px; height: 13px; }

.edb-card__body {
	padding: 14px 16px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
}

.edb-card__meta { display: flex; align-items: center; gap: 6px; }

.edb-card__category {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--edb-muted);
}

.edb-card__title {
	font-size: 15px;
	font-weight: 700;
	margin: 0;
	line-height: 1.25;
}
.edb-card__title a { color: var(--edb-text); text-decoration: none; }
.edb-card__title a:hover { color: #000; }

.edb-card__location {
	display: flex; align-items: center; gap: 4px;
	font-size: 12px; color: var(--edb-muted); margin: 0;
}
.edb-card__location .dashicons { font-size: 13px; width: 13px; height: 13px; color: var(--edb-heart); }

.edb-card__actions {
	display: flex; align-items: center; gap: 8px;
	margin-top: auto; padding-top: 10px;
}

.edb-card__view-btn {
	font-size: 12px; font-weight: 600;
	padding: 6px 12px;
	border-radius: 7px;
	background: var(--edb-accent);
	color: #fff;
	text-decoration: none;
	transition: background .15s;
}
.edb-card__view-btn:hover { background: #000; color: #fff; }

/* Save button */
.edb-save-btn {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 12px; font-weight: 600;
	padding: 6px 10px;
	border-radius: 7px;
	border: 1.5px solid var(--edb-border);
	background: #fff;
	color: var(--edb-muted);
	cursor: pointer;
	transition: all .15s;
	white-space: nowrap;
}
.edb-save-btn:hover {
	border-color: var(--edb-heart);
	color: var(--edb-heart);
}
.edb-save-btn--saved {
	border-color: var(--edb-heart);
	color: var(--edb-heart);
	background: #fff5f5;
}
.edb-save-btn .dashicons { font-size: 14px; width: 14px; height: 14px; }
.edb-save-btn.is-loading { opacity: .6; pointer-events: none; }

/* ─────────────────────────────────────────────────────────────
   HORIZONTAL SCROLL ROW  (section 1 — Nearby)
───────────────────────────────────────────────────────────── */
.edb-scroll-row {
	display: flex;
	gap: var(--edb-gap);
	overflow-x: auto;
	padding-bottom: 12px;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: #ddd transparent;
}
.edb-scroll-row .edb-card { scroll-snap-align: start; }
.edb-scroll-row::-webkit-scrollbar { height: 4px; }
.edb-scroll-row::-webkit-scrollbar-thumb { background: #ddd; border-radius: 4px; }

/* ─────────────────────────────────────────────────────────────
   GRID  (section 2 — Saved, section 4 — Curator)
───────────────────────────────────────────────────────────── */
.edb-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: var(--edb-gap);
}

/* Curator grid — bigger cards */
.edb-grid--curator {
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

/* ─────────────────────────────────────────────────────────────
   REVIEWS LIST  (section 3)
───────────────────────────────────────────────────────────── */
.edb-reviews-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.edb-review-item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	background: #fff;
	border: 1px solid var(--edb-border);
	border-radius: var(--edb-radius);
	padding: 16px;
	transition: box-shadow .2s;
}
.edb-review-item:hover { box-shadow: var(--edb-shadow); }

.edb-review-item__logo {
	width: 52px; height: 52px;
	border-radius: 10px;
	border: 1px solid var(--edb-border);
	overflow: hidden;
	flex-shrink: 0;
	background: var(--edb-bg);
	display: flex; align-items: center; justify-content: center;
}
.edb-review-item__logo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.edb-review-item__logo .dashicons { font-size: 24px; width: 24px; height: 24px; color: #ccc; }

.edb-review-item__body { flex: 1; min-width: 0; }

.edb-review-item__header {
	display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
	margin-bottom: 4px;
}

.edb-review-item__biz {
	font-size: 15px; font-weight: 700;
	color: var(--edb-text); text-decoration: none;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.edb-review-item__biz:hover { color: #000; }

.edb-review-item__date { font-size: 12px; color: var(--edb-muted); flex-shrink: 0; }

/* Stars */
.edb-stars { display: flex; gap: 1px; margin-bottom: 4px; }
.edb-star { font-size: 16px; color: #ddd; }
.edb-star--full { color: #f59e0b; }

.edb-review-item__text {
	font-size: 13px; color: #444; margin: 0;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.edb-review-item__link {
	color: var(--edb-muted); align-self: center; flex-shrink: 0;
	display: flex; align-items: center;
}
.edb-review-item__link .dashicons { font-size: 18px; width: 18px; height: 18px; }
.edb-review-item__link:hover { color: var(--edb-accent); }

/* ─────────────────────────────────────────────────────────────
   BLOG GRID  (section 5)
───────────────────────────────────────────────────────────── */
.edb-blog-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: var(--edb-gap);
}

.edb-blog-card {
	background: #fff;
	border: 1px solid var(--edb-border);
	border-radius: var(--edb-radius);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: box-shadow .2s, transform .2s;
}
.edb-blog-card:hover { box-shadow: var(--edb-shadow); transform: translateY(-2px); }

.edb-blog-card__thumb {
	display: block;
	position: relative;
	aspect-ratio: 16/9;
	overflow: hidden;
	background: var(--edb-bg);
}
.edb-blog-card__thumb img {
	width: 100%; height: 100%; object-fit: cover; display: block;
	transition: transform .3s;
}
.edb-blog-card:hover .edb-blog-card__thumb img { transform: scale(1.04); }

.edb-blog-card__thumb-placeholder {
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
}
.edb-blog-card__thumb-placeholder .dashicons { font-size: 40px; width: 40px; height: 40px; color: #ccc; }

.edb-blog-card__cat {
	position: absolute;
	top: 10px; left: 10px;
	background: rgba(0,0,0,.65);
	color: #fff;
	font-size: 11px; font-weight: 700;
	padding: 3px 10px;
	border-radius: 20px;
	text-transform: uppercase; letter-spacing: .05em;
}

.edb-blog-card__body {
	padding: 16px 18px 20px;
	display: flex; flex-direction: column; gap: 6px; flex: 1;
}

.edb-blog-card__date { font-size: 12px; color: var(--edb-muted); margin: 0; }

.edb-blog-card__title {
	font-size: 16px; font-weight: 700;
	margin: 0; line-height: 1.3;
}
.edb-blog-card__title a { color: var(--edb-text); text-decoration: none; }
.edb-blog-card__title a:hover { color: #000; }

.edb-blog-card__excerpt {
	font-size: 13px; color: #555; margin: 0; line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.edb-blog-card__read {
	font-size: 13px; font-weight: 700;
	color: var(--edb-accent); text-decoration: none;
	margin-top: auto; padding-top: 8px;
}
.edb-blog-card__read:hover { color: #000; }

/* ─────────────────────────────────────────────────────────────
   RESPONSIVE
───────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
	.edb-wrap { padding: 24px 16px 60px; }
	.edb-welcome__title { font-size: 22px; }
	.edb-section__title { font-size: 18px; }
	.edb-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
	.edb-grid--curator { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
	.edb-blog-grid { grid-template-columns: 1fr; }
	.edb-card { width: 200px; }
}

@media (max-width: 480px) {
	.edb-grid { grid-template-columns: 1fr 1fr; }
	.edb-grid--curator { grid-template-columns: 1fr; }
	.edb-card { width: 180px; }
	.edb-review-item { flex-wrap: wrap; }
	.edb-review-item__link { display: none; }
	.edb-section__header { flex-direction: column; gap: 8px; }
}