/*
 * The artist directory (/artists/). Loaded after style.css and builds on its
 * colour tokens, page sections and form styles; only what the directory adds
 * is here.
 */

.art-narrow { max-width: 760px; }
.art-centre { text-align: center; margin-left: auto; margin-right: auto; }
.art-lead { color: var(--color-body-muted, #5a564e); max-width: 640px; line-height: 1.6; }
.art-help { color: var(--color-body-muted, #5a564e); font-size: 14px; margin: 6px 0 0; line-height: 1.5; }
.art-opt { color: var(--color-body-muted, #5a564e); font-weight: normal; font-size: 13px; }
.art-kicker { font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--color-gold, #a3854f); margin: 0 0 8px; }
.art-kicker a { color: inherit; text-decoration: none; }
.art-h2 { font-family: 'Playfair Display', Georgia, serif; font-weight: 500; font-size: 1.5rem; margin: 36px 0 12px; }

.art-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
@media (max-width: 600px) { .art-grid-2 { grid-template-columns: 1fr; } }

.art-fieldset { border: 0; padding: 0; margin: 0 0 16px; }
.art-fieldset legend { font-weight: 500; margin-bottom: 8px; }
.art-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 14px; }
.art-check { display: flex; gap: 8px; align-items: flex-start; font-weight: normal; line-height: 1.4; }
.art-check input { width: auto; margin-top: 3px; flex: none; }

.art-link { background: none; border: 0; padding: 0; color: var(--color-teal, #0e5f4e); text-decoration: underline; cursor: pointer; font: inherit; }
.art-link-danger { color: #b3352c; }
.art-inline { display: inline; }

/* Where the artist's application stands. */
.art-status { padding: 12px 16px; border-radius: 8px; margin: 0 0 20px; background: var(--color-paper, #faf8f5);
              border-left: 4px solid var(--color-gold, #a3854f); line-height: 1.5; }
.art-status-approved { border-left-color: var(--color-teal, #0e5f4e); }
.art-status-hidden { border-left-color: #b3352c; }

.art-pill { display: inline-block; font-size: 12px; padding: 2px 9px; border-radius: 999px; margin: 4px 4px 0 0;
            background: var(--color-paper, #faf8f5); border: 1px solid var(--color-line, #e5e0d8); color: var(--color-ink, #1a1a1a); }
.art-pill-approved, .art-pill-available { background: #e3f3eb; border-color: #bfe1cf; color: #0f5c45; }
.art-pill-pending { background: #fff4d6; border-color: #f0dc9c; color: #7a5200; }
.art-pill-rejected, .art-pill-hidden { background: #fbe9e7; border-color: #f0c6c0; color: #8a2a20; }
.art-pill-sold { background: #eeeae3; color: #5a564e; }

/* The artist's own list of works. */
.art-mywork { border-top: 1px solid var(--color-line, #e5e0d8); margin-bottom: 8px; }
.art-mywork-row { display: grid; grid-template-columns: 72px 1fr auto; gap: 14px; align-items: center;
                  padding: 12px 0; border-bottom: 1px solid var(--color-line, #e5e0d8); }
.art-mywork-img { width: 72px; height: 72px; background: var(--color-paper, #faf8f5); border-radius: 6px; overflow: hidden; }
.art-mywork-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.art-mywork-actions { display: flex; gap: 12px; align-items: center; white-space: nowrap; }
.art-photo-current { display: block; max-width: 180px; border-radius: 6px; margin: 6px 0 10px; }

/* The directory. */
.art-filters { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: center; margin: 24px 0 32px; }
.art-filters select, .art-filters input { min-height: 42px; padding: 8px 10px; border: 1px solid var(--color-line, #e5e0d8);
                                          border-radius: 6px; background: #fff; font: inherit; max-width: 100%; }
.art-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 22px; }
.art-card { display: flex; flex-direction: column; background: var(--color-surface, #fff); border: 1px solid var(--color-line, #e5e0d8);
            border-radius: 8px; overflow: hidden; text-decoration: none; color: var(--color-ink, #1a1a1a);
            transition: border-color .15s, transform .15s; }
.art-card:hover { border-color: var(--color-gold, #a3854f); transform: translateY(-2px); }
.art-card-img { display: block; aspect-ratio: 4 / 3; background: var(--color-paper, #faf8f5); overflow: hidden; }
.art-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.art-card-initial { display: flex; align-items: center; justify-content: center; height: 100%;
                    font-family: 'Playfair Display', Georgia, serif; font-size: 3rem; color: var(--color-gold, #a3854f); }
.art-card-body { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px 16px; }
.art-card-name { font-family: 'Playfair Display', Georgia, serif; font-size: 1.15rem; }
.art-card-meta { font-size: 14px; color: var(--color-body-muted, #5a564e); }
.art-join { text-align: center; margin: 56px auto 0; max-width: 560px; padding-top: 32px; border-top: 1px solid var(--color-line, #e5e0d8); }
.art-join .btn { margin: 4px; }

/* One artist's page. */
.art-profile { display: grid; grid-template-columns: 220px 1fr; gap: 28px; align-items: start; margin-bottom: 12px; }
.art-profile > div:only-child { grid-column: 1 / -1; }
.art-profile-photo { width: 100%; border-radius: 8px; display: block; }
.art-profile-name { text-align: left; margin-bottom: 6px; }
.art-statement { line-height: 1.7; margin: 14px 0; max-width: 680px; }
.art-links { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
@media (max-width: 700px) { .art-profile { grid-template-columns: 1fr; } .art-profile-photo { max-width: 240px; } }

.art-works { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 26px; }
.art-work { margin: 0; }
.art-work img { width: 100%; display: block; border-radius: 6px; background: var(--color-paper, #faf8f5); }
.art-work figcaption { margin-top: 10px; line-height: 1.5; }
.art-work-desc { font-size: 14px; }
.art-video { position: relative; aspect-ratio: 16 / 9; }
.art-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 6px; }
.art-enquire { max-width: 720px; margin-top: 40px; }