/* Comunidade do simulador (cdf-comunidade): dark like the simulator, so the photos stand out. Uses the
   canaldafoto theme's tokens, with fallbacks for any other theme. */
.cdf-comunidade .site-main { background: var(--ink-2, #171d23); }
.cdfc-head .cdfc-how { margin-top: 16px; color: var(--muted, #a4adb7); font-size: 15px; }
.cdfc-head .cdfc-how strong { color: var(--text, #f0f2f5); }
.cdfc-body { background: var(--ink-2, #171d23); color: var(--text, #f0f2f5); padding: 28px 0 64px; }
.cdfc-body a { color: var(--gold-soft, #f7cb6b); }
.cdfc-notice { margin: 0 0 20px; padding: 12px 16px; border-radius: 12px; background: rgba(56, 211, 159, .12); color: #9ff0d0; font-size: 15px; }

/* scene filter */
.cdfc-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.cdfc-chip {
  display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--line, #343d47); color: var(--text, #f0f2f5) !important; text-decoration: none; font-size: 14.5px; font-weight: 600;
}
.cdfc-chip span { font: 600 12px/1 var(--mono, monospace); color: var(--muted, #a4adb7); }
.cdfc-chip:hover { border-color: var(--gold, #f2b632); }
.cdfc-chip.is-on { background: var(--gold, #f2b632); border-color: var(--gold, #f2b632); color: var(--on-gold, #0e1014) !important; }
.cdfc-chip.is-on span { color: rgba(14, 16, 20, .7); }

/* justified grid: every photo keeps its shape, rows fill the width (--r = width / height, set per card) */
.cdfc-grid { --row: 230px; display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 0; list-style: none; }
.cdfc-grid::after { content: ""; flex: 999 1 0; }
.cdfc-card { flex: var(--r, 1.5) 1 calc(var(--r, 1.5) * var(--row)); min-width: 0; max-width: calc(var(--r, 1.5) * var(--row) * 1.6); }
.cdfc-card__link { display: block; color: inherit !important; text-decoration: none; }
.cdfc-card__frame { display: block; overflow: hidden; border-radius: 10px; background: #0b0e11; }
.cdfc-card__frame img { display: block; width: 100%; height: auto; aspect-ratio: var(--r, 1.5); object-fit: cover; transition: transform .25s ease; }
.cdfc-card__link:hover img { transform: scale(1.03); }
.cdfc-card__link:focus-visible { outline: 3px solid var(--gold, #f2b632); outline-offset: 4px; border-radius: 12px; }
.cdfc-card__body { display: grid; gap: 2px; padding: 10px 2px 0; }
.cdfc-card__title { font-weight: 700; font-size: 15.5px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cdfc-card__by { color: var(--muted, #a4adb7); font-size: 14px; }
.cdfc-readout { font: 600 12px/1.4 var(--mono, monospace); letter-spacing: .04em; color: var(--gold-soft, #f7cb6b); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.cdfc-pages { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px; margin: 36px 0 0; }
.cdfc-pages .btn { color: var(--text, #f0f2f5) !important; }
.cdfc-pages__n { color: var(--muted, #a4adb7); font-size: 14px; }
.cdfc-empty { max-width: 560px; padding: 40px 0; }
.cdfc-empty p + p { margin-top: 14px; }
.cdfc-empty .btn-primary { color: var(--on-gold, #0e1014) !important; }
.cdfc-terms { margin: 40px 0 0; font-size: 14px; color: var(--muted, #a4adb7); }

/* one photo */
.cdfc-back { margin: 0 0 18px; font-size: 15px; }
.cdfc-back a { text-decoration: none; }
.cdfc-photo__grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 32px; align-items: start; }
.cdfc-photo__figure { margin: 0; border-radius: 12px; overflow: hidden; background: #0b0e11; display: grid; place-items: center; }
.cdfc-photo__figure img { display: block; width: 100%; height: auto; max-height: calc(100vh - 160px); object-fit: contain; }
.cdfc-photo__info h1 { font-size: clamp(26px, 3vw, 36px); color: var(--text, #f0f2f5); }
.cdfc-photo__info .readout { color: var(--gold-soft, #f7cb6b); }
.cdfc-photo__by { margin-top: 8px; color: var(--muted, #a4adb7); }
.cdfc-photo__by strong { color: var(--text, #f0f2f5); }
.cdfc-facts { display: grid; grid-template-columns: max-content 1fr; gap: 7px 16px; margin: 22px 0 0; padding: 16px 0 0; border-top: 1px solid var(--line, #343d47); font-size: 15px; }
.cdfc-facts dt { color: var(--muted, #a4adb7); }
.cdfc-facts dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.cdfc-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 0; }
.cdfc-actions .btn-primary { color: var(--on-gold, #0e1014) !important; }
.cdfc-actions .btn-ghost { color: var(--text, #f0f2f5) !important; }
.cdfc-note { margin: 14px 0 0; color: var(--muted, #a4adb7); font-size: 14px; line-height: 1.55; }
.cdfc-remove { margin: 22px 0 0; }
.cdfc-remove button { padding: 0; border: 0; background: none; color: #ff9b8f; font: inherit; font-size: 14px; text-decoration: underline; cursor: pointer; }

/* Minhas fotos */
.cdfc-mine { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.cdfc-mine__item { display: grid; grid-template-columns: 220px 1fr; gap: 18px; align-items: start; padding: 14px; border: 1px solid var(--line, #343d47); border-radius: 14px; }
.cdfc-mine__item img { display: block; width: 100%; height: auto; }
.cdfc-mine__body { display: grid; gap: 4px; min-width: 0; }
.cdfc-status { justify-self: start; padding: 3px 10px; border-radius: 999px; background: rgba(255, 255, 255, .08); color: var(--muted, #a4adb7); font: 600 12px/1.4 var(--mono, monospace); letter-spacing: .04em; text-transform: uppercase; }
.cdfc-status.is-on { background: rgba(242, 182, 50, .16); color: var(--gold-soft, #f7cb6b); }
.cdfc-mine__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 10px; }
.cdfc-mine__actions .btn-ghost { color: var(--text, #f0f2f5) !important; }
.cdfc-mine__actions form { margin: 0; }
.cdfc-remove-btn { padding: 0; border: 0; background: none; color: #ff9b8f; font: inherit; font-size: 14.5px; text-decoration: underline; cursor: pointer; }
.cdfc-head .readout a { color: inherit; }
.cdfc-head .cdfc-how a { color: var(--gold-soft, #f7cb6b); }

.cdfc-notice--error { background: rgba(255, 120, 100, .12); color: #ffb3a8; }
.cdfc-name { margin: 0 0 22px; padding: 14px 16px; border: 1px solid var(--line, #343d47); border-radius: 14px; }
.cdfc-name label { display: block; font-weight: 700; margin-bottom: 8px; }
.cdfc-name div { display: flex; flex-wrap: wrap; gap: 10px; }
.cdfc-name input { flex: 1 1 220px; min-height: 40px; padding: 0 12px; border: 1px solid var(--line, #343d47); border-radius: 10px; background: var(--ink, #11161b); color: var(--text, #f0f2f5); font: inherit; }
.cdfc-name input:focus { outline: 2px solid var(--gold, #f2b632); outline-offset: 1px; }
.cdfc-name .btn-primary { color: var(--on-gold, #0e1014) !important; }
.cdfc-name p { margin-top: 8px; color: var(--muted, #a4adb7); font-size: 14px; }

/* terms */
.cdfc-terms-page { padding: 32px 0 64px; background: var(--ink-2, #171d23); color: var(--text, #f0f2f5); }
.cdfc-terms-page h2 { font-size: 21px; margin: 28px 0 8px; color: var(--text, #f0f2f5); }
.cdfc-terms-page p, .cdfc-terms-page li { color: var(--text, #f0f2f5); }
.cdfc-terms-page strong { color: inherit; }
.cdfc-terms-page a:not(.btn) { color: var(--gold-soft, #f7cb6b); }
.cdfc-terms-page .cdfc-terms-version { color: var(--muted, #a4adb7); }
.cdfc-terms-page .btn-ghost { color: var(--text, #f0f2f5) !important; }
.cdfc-terms-page p { max-width: 68ch; }
.cdfc-terms-page p + p { margin-top: 12px; }
.cdfc-terms-version { color: var(--muted-dark, #545d68); font-size: 15px; margin-top: 28px !important; }

@media (max-width: 900px) {
  .cdfc-photo__grid { grid-template-columns: 1fr; gap: 20px; }
  .cdfc-photo__figure img { max-height: none; }
}
@media (max-width: 600px) {
  .cdfc-mine__item { grid-template-columns: 1fr; }
  .cdfc-grid { --row: 100px; gap: 10px; } /* two 3:2 photos per row on a 360 px phone */
  .cdfc-card__title { font-size: 14.5px; }
  .cdfc-card__by { font-size: 13px; }
  .cdfc-readout { font-size: 11px; white-space: normal; }
  .cdfc-actions .btn { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .cdfc-card__frame img { transition: none; }
  .cdfc-card__link:hover img { transform: none; }
}
