/* Data Center Directory front-end styles — built on the real brand colors
   from the logo (crimson) and homepage banner (teal), not a generic theme. */

:root {
	--ddc-crimson: #D91A5C;
	--ddc-teal: #1B6B7A;
	--ddc-ink: #1A1A1A;
	--ddc-bg: #FFFFFF;
	--ddc-hairline: #E8E5E9;
	--ddc-verified: #2E9E5B;
	--ddc-pending: #C98A2E;
	--ddc-disclaimer-tint: #FDF0F4; /* very faint crimson tint, bottom disclaimer only */
}

.ddc-page { max-width: 900px; margin: 0 auto; padding: 24px; color: var(--ddc-ink); }
.ddc-page h1 { font-size: 30px; margin-bottom: 14px; }
.ddc-page h2 { font-size: 22px; margin: 32px 0 14px; border-bottom: 2px solid var(--ddc-crimson); padding-bottom: 6px; }
.ddc-page h3 { font-size: 18px; margin: 20px 0 8px; color: var(--ddc-teal); }
.ddc-page h4 { font-size: 15px; margin: 14px 0 6px; }

.ddc-breadcrumb { font-size: 13px; color: #888; margin-bottom: 10px; }
.ddc-breadcrumb a { color: var(--ddc-teal); text-decoration: none; }
.ddc-breadcrumb a:hover { text-decoration: underline; }
.ddc-breadcrumb .sep { margin: 0 6px; color: var(--ddc-hairline); }

.ddc-list { list-style: none; padding: 0; }
.ddc-list li { padding: 8px 0; border-bottom: 1px solid var(--ddc-hairline); }
.ddc-list a { color: var(--ddc-crimson); text-decoration: none; font-weight: 600; }
.ddc-list a:hover { text-decoration: underline; }

.ddc-badge { font-size: 10px; letter-spacing: 0.5px; padding: 2px 7px; border-radius: 3px; margin-left: 6px; font-weight: 700; }
.ddc-badge.verified { background: #E7F5EC; color: var(--ddc-verified); }
.ddc-badge.pending { background: #FBF1E3; color: var(--ddc-pending); }

.ddc-mono { font-family: monospace; font-size: 12px; color: #666; margin-left: 6px; }
.ddc-contact { font-size: 13px; color: #444; }
.ddc-company-notes { font-size: 14px; color: #444; font-style: italic; }
.ddc-source { font-size: 12px; color: #888; }

/* Top disclaimer — deliberately the least visually assertive element on
   the page: bold, muted, no box, blends into normal text flow. Matches
   the site's existing convention, kept intentionally subtle. */
.ddc-disclaimer-top { font-weight: 700; color: #888; font-size: 13px; margin: 10px 0 20px; }

/* Bottom disclaimer — the more complete legal statement, given a touch
   more visual weight than the top one, still restrained (no alert-box
   styling, no red border, just a faint tint and a top rule). */
.ddc-disclaimer {
	margin-top: 36px; padding: 14px 18px; border-top: 2px solid var(--ddc-hairline);
	background: var(--ddc-disclaimer-tint); font-style: italic; font-size: 13px; color: var(--ddc-ink);
}

/* FAQ / long facility lists — native <details>/<summary>, zero JS, and
   content is always present in the initial HTML regardless of open/closed
   state (the condition that keeps it fully crawlable/indexable). */
.ddc-faq details { border-bottom: 1px solid var(--ddc-hairline); padding: 10px 0; }
.ddc-faq summary { font-weight: 600; cursor: pointer; }
.ddc-faq summary::marker { color: var(--ddc-crimson); }

/* Submission CTA — visible prompt by default (never accordion'd away,
   since hiding a call-to-action defeats its purpose); only the detailed
   form fields expand on click. */
.ddc-cta-prompt { background: var(--ddc-crimson); color: #fff; padding: 14px 20px; border-radius: 6px; margin: 30px 0; }
.ddc-cta-prompt summary { color: #fff; font-weight: 700; cursor: pointer; list-style: none; }
.ddc-cta-fields { background: #fff; color: var(--ddc-ink); padding: 16px; border-radius: 6px; margin-top: 10px; }

.ddc-type-phrase { font-weight: 600; color: var(--ddc-teal); }