/*
Theme Name: Twenty Twenty-Five Child
Template: twentytwentyfive
Description: Child theme for Rising60 — CF7 creative brief form styles.
Version: 1.2.0
*/

.creative-form-section {
  padding: clamp(32px, 6vw, 80px) 20px;
  background: #f5f5f7;
}

/*
 * Page intro copy (wrap paragraphs in a Group, or style one Paragraph).
 * Editor: select block → Styles (brush) → "Form intro text"
 * Or Advanced → Additional CSS class → page-form-intro
 */
.page-form-intro,
.is-style-page-form-intro {
  --page-intro-size: 14px;

  margin: 0 0 clamp(24px, 4vw, 40px);
  color: var(--muted, #74747e);
  font-size: var(--page-intro-size);
  line-height: 1.6;
}

.page-form-intro p,
.is-style-page-form-intro p,
p.is-style-page-form-intro {
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
}

.page-form-intro p + p,
.is-style-page-form-intro p + p {
  margin-top: 1rem;
}

.page-form-intro .form-eyebrow,
.page-form-intro .page-form-intro__eyebrow {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--accent, #6c4cf1);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: none;
}

/* Logo competition page intro — typography only; width follows theme content (645px) */
.page-id-35 .entry-content > .wp-block-paragraph {
  color: #74747e;
  font-size: 14px !important;
  line-height: 1.6;
}

.page-id-35 .entry-content > .wp-block-paragraph + .wp-block-paragraph {
  margin-top: 1rem !important;
  margin-block-start: 1rem !important;
}

/* —— Legal / privacy-policy-style pages —— */
.page-id-31 .wp-block-post-title {
  margin-bottom: 0.35em;
  text-align: center;
  letter-spacing: -0.03em;
}

.legal-document-section {
  padding: clamp(28px, 5vw, 56px) 20px clamp(48px, 8vw, 80px);
  background: #f5f5f7;
}

.legal-document,
.is-style-legal-policy {
  --legal-text: #292930;
  --legal-muted: #74747e;
  --legal-border: #ececf1;

  box-sizing: border-box;
  max-width: 720px;
  margin: 0 auto;
  padding: clamp(28px, 5vw, 44px) clamp(24px, 4vw, 48px);
  color: var(--legal-text);
  background: #fff;
  border: 1px solid var(--legal-border);
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(25, 25, 35, 0.07);
  font-size: 15px;
  line-height: 1.75;
}

.legal-document__eyebrow {
  margin: 0 0 10px !important;
  color: #6c4cf1;
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.legal-document__title {
  margin: 0 0 14px !important;
  color: #17171c;
  font-size: clamp(22px, 3.5vw, 28px) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.03em;
}

.legal-document__lead {
  margin: 0 0 8px !important;
  color: var(--legal-muted);
  font-size: 15px !important;
  line-height: 1.65 !important;
}

.legal-document ul,
.legal-document ol,
.is-style-legal-policy ul,
.is-style-legal-policy ol {
  margin: 1.25rem 0 0 !important;
  margin-block: 1.25rem 0 !important;
  padding-left: 1.35em;
  list-style-position: outside;
}

.legal-document ul {
  list-style-type: disc;
}

.legal-document li,
.is-style-legal-policy li {
  margin: 0;
  padding-left: 0.25em;
  color: var(--legal-text);
}

.legal-document li + li,
.is-style-legal-policy li + li {
  margin-top: 1.1em !important;
}

.legal-document li > ul,
.is-style-legal-policy li > ul {
  margin-top: 0.65em !important;
  margin-bottom: 0.65em !important;
  list-style-type: circle;
}

.legal-document li > ul li + li {
  margin-top: 0.5em !important;
}

.legal-document a,
.is-style-legal-policy a {
  color: #6c4cf1;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.legal-document a:hover,
.is-style-legal-policy a:hover {
  color: #17171c;
}

.legal-document__footer-link {
  margin: 2rem 0 0 !important;
  padding-top: 1.25rem;
  border-top: 1px solid var(--legal-border);
  font-size: 14px !important;
}

.creative-brief-form {
  --text: #17171c;
  --muted: #74747e;
  --border: #e3e3e8;
  --input-bg: #f8f8fa;
  --accent: #6c4cf1;
  --error: #d93025;

  width: 100%;
  max-width: 820px;
  box-sizing: border-box;
  margin: 0 auto;
  padding: 48px;
  background: #fff;
  border: 1px solid #ececf1;
  border-radius: 28px;
  box-shadow: 0 24px 70px rgba(25, 25, 35, 0.08);
}

.creative-brief-form .form-intro {
  margin-bottom: 38px;
}

.creative-brief-form .form-eyebrow {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.creative-brief-form .form-intro h2 {
  margin: 0 0 10px;
  color: var(--text);
  font-size: clamp(32px, 5vw, 48px);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.creative-brief-form .form-intro p {
  margin: 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.6;
}

.creative-brief-form .form-intro p + p {
  margin-top: 1rem;
}

.creative-brief-form .form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 24px;
}

.creative-brief-form .form-field {
  min-width: 0;
  margin-bottom: 24px;
}

/*
 * CF7 merges label + field into one <p> with a <br> between them.
 * Block global styles (loaded after this sheet) also add paragraph margins.
 */
.creative-brief-form .form-field > p {
  margin: 0 !important;
  margin-block: 0 !important;
}

.creative-brief-form .form-field p > br {
  display: none !important;
}

.creative-brief-form label {
  display: block;
  margin-bottom: 9px;
  color: #292930;
  font-size: 14px;
  font-weight: 600;
}

.creative-brief-form .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

/* Phone: narrow country code + number on one row */
.creative-brief-form .form-field--phone > p {
  display: grid;
  grid-template-columns: 6.25rem 1fr;
  column-gap: 10px;
  row-gap: 9px;
  align-items: stretch;
}

.creative-brief-form .form-field--phone > p > label {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

.creative-brief-form .form-field--phone .wpcf7-form-control-wrap[data-name="phone-country"] {
  grid-column: 1;
  width: auto !important;
  max-width: 6.25rem;
}

.creative-brief-form .form-field--phone .wpcf7-form-control-wrap[data-name="your-phone"] {
  grid-column: 2;
  width: auto !important;
  min-width: 0;
}

.creative-brief-form select.phone-country,
.creative-brief-form select.nationality {
  cursor: pointer;
  appearance: auto;
}

.creative-brief-form input[type="text"],
.creative-brief-form input[type="email"],
.creative-brief-form input[type="tel"],
.creative-brief-form input[type="number"],
.creative-brief-form textarea,
.creative-brief-form select {
  width: 100%;
  min-height: 54px;
  box-sizing: border-box;
  padding: 14px 17px;
  color: var(--text);
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  outline: none;
  font: inherit;
  font-size: 16px;
  transition: 0.2s ease;
}

.creative-brief-form textarea {
  min-height: 180px;
  resize: vertical;
  line-height: 1.6;
}

.creative-brief-form input:focus,
.creative-brief-form textarea:focus,
.creative-brief-form select:focus {
  background: #fff;
  border-color: var(--accent);
  box-shadow: 0 0 0 4px rgba(108, 76, 241, 0.12);
}

.creative-brief-form .form-field--phone select.phone-country {
  width: 100%;
  max-width: 6.25rem;
  padding: 14px 1.75rem 14px 12px;
  font-size: 15px;
}

.creative-brief-form input[type="file"] {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 22px;
  color: var(--muted);
  background: #fafaff;
  border: 1.5px dashed #cfcbe9;
  border-radius: 16px;
  font: inherit;
  cursor: pointer;
}

/* English file UI (hides browser locale strings like "tidak ada berkas dipilih") */
.creative-brief-form .file-upload-en {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  width: 100%;
  box-sizing: border-box;
  padding: 22px;
  background: #fafaff;
  border: 1.5px dashed #cfcbe9;
  border-radius: 16px;
}

.creative-brief-form .file-upload-en__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
  background: transparent;
}

.creative-brief-form .file-upload-en__button {
  margin: 0;
  padding: 10px 16px;
  color: #fff;
  background: #24242b;
  border: 0;
  border-radius: 10px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.creative-brief-form .file-upload-en__button:hover {
  background: var(--accent);
}

.creative-brief-form .file-upload-en__name {
  color: var(--muted);
  font-size: 14px;
}

.creative-brief-form input[type="file"]::file-selector-button {
  margin-right: 14px;
  padding: 10px 16px;
  color: #fff;
  background: #24242b;
  border: 0;
  border-radius: 10px;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.creative-brief-form .field-help {
  display: block;
  margin-top: 8px;
  color: #8d8d96;
  font-size: 12px;
}

/* Terms & agreement checkbox block */
.creative-brief-form .form-field small {
  display: block;
  margin: 0 0 14px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 400;
}

.creative-brief-form .wpcf7-checkbox {
  display: block;
}

.creative-brief-form .wpcf7-checkbox .wpcf7-list-item {
  margin: 0;
}

.creative-brief-form .wpcf7-checkbox .wpcf7-list-item label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 14px 16px;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.creative-brief-form .wpcf7-checkbox .wpcf7-list-item label:has(input:focus) {
  border-color: var(--accent);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(108, 76, 241, 0.12);
}

.creative-brief-form .wpcf7-checkbox input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-height: 0;
  margin: 2px 0 0;
  padding: 0;
  flex-shrink: 0;
  accent-color: var(--accent);
  cursor: pointer;
}

.creative-brief-form .wpcf7-checkbox .wpcf7-list-item-label {
  line-height: 1.4;
}

.creative-brief-form .wpcf7-checkbox .wpcf7-list-item + .wpcf7-list-item {
  margin-top: 8px;
}

.creative-brief-form .form-field > p:has(.wpcf7-checkbox) {
  margin: 0;
}

.creative-brief-form .form-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}

.creative-brief-form .form-actions > p {
  margin: 0;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}

/* CF7 adds a spinner after the button; keep the button flush right */
.creative-brief-form .form-actions .wpcf7-spinner {
  order: -1;
  flex: 0 0 auto;
  margin: 0;
}

.creative-brief-form input[type="submit"] {
  min-height: 56px;
  padding: 0 28px;
  width: auto;
  max-width: 100%;
  flex: 0 0 auto;
  color: #fff;
  background: var(--text);
  border: 0;
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(23, 23, 28, 0.18);
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: 0.2s ease;
}

.creative-brief-form input[type="submit"]:hover {
  background: var(--accent);
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(108, 76, 241, 0.28);
}

.creative-brief-form .wpcf7-not-valid {
  border-color: var(--error) !important;
}

.creative-brief-form .wpcf7-not-valid-tip {
  margin-top: 7px;
  color: var(--error);
  font-size: 12px;
}

.creative-brief-form .wpcf7-response-output {
  margin: 1.5em 0 0;
  padding: 12px 16px;
  border-radius: 12px;
  font-size: 14px;
}

@media (max-width: 700px) {
  .creative-form-section {
    padding: 24px 12px;
  }

  .creative-brief-form {
    padding: 28px 20px;
    border-radius: 20px;
  }

  .creative-brief-form .form-grid {
    grid-template-columns: 1fr;
  }

  .creative-brief-form .form-actions {
    display: block;
  }

  .creative-brief-form .form-actions > p {
    display: block;
  }

  .creative-brief-form input[type="submit"] {
    width: 100%;
  }

  .legal-document,
  .is-style-legal-policy {
    padding: 24px 20px;
    border-radius: 20px;
  }
}