/* Château Gâteaux Web-to-Case forms — base styles, scoped to .cg-wtc.
   Override with the brand stylesheet as needed. */

.cg-wtc { max-width: 1100px; margin: 2rem auto; padding: 0 1.25rem 3rem; color: #222; }
.cg-wtc *, .cg-wtc *::before, .cg-wtc *::after { box-sizing: border-box; }

.cg-wtc h1 { font-family: "Montserrat", Sans-serif;font-size: 1.6rem; margin: 0 0 0.2rem;font-weight: 600; }
.cg-wtc .wtc-subtitle { font-family: "Montserrat", Sans-serif;color: #555; font-size: 0.92rem; margin: 0 0 2rem;font-weight: 500; }
.cg-wtc .wtc-staff-notice { 
  background: #d1103e;
    border: 1px solid #d00f3d;
    border-radius: 4px;
    padding: 15px 20px;
    font-size: 16px;
    margin-bottom: 1.5rem;
    color: #ffffff;
 }

.cg-wtc .field-group { margin-bottom: 1.25rem; }
.cg-wtc label.field-label { 
    font-family: "Montserrat", Sans-serif;
    display: block;
    font-weight: 600;
    font-size: 0.93rem;
    margin-bottom: 10px;
 }
.cg-wtc .req { color: #c00; margin-left: 2px; }

.cg-wtc input[type="text"], .cg-wtc input[type="email"], .cg-wtc input[type="tel"],
.cg-wtc input[type="date"], .cg-wtc input[type="datetime-local"], .cg-wtc select, .cg-wtc textarea {
  width: 100%; 
  border: solid 1px #9a9a9a;
  background: 0 0;
  color: #121212;
  font-family: Montserrat;
  font-size: 15px;
  font-weight: 400;
  border-radius: 0;
  padding: 14px 24px;
  transition: none !important;
 }
.cg-wtc select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23222' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.9rem center; /* ← move the arrow here */
  background-size: 12px 8px;
  padding-right: 2.5rem; /* keeps the text from running under the arrow */
}
input[type=date]:focus, input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=search]:focus, input[type=tel]:focus, input[type=text]:focus, input[type=time]:focus, input[type=url]:focus, select:focus, textarea:focus {
    border-color: transparent !important;
    outline: 1px solid #dac497 !important;
    box-shadow: none !important;
    border: none !important;
    outline-offset: -1px !important;
    border-color: transparent;
}
.cg-wtc input[type=checkbox]:focus,
.cg-wtc .popia-scroll:focus,
.cg-wtc button:focus {
  outline: 1px solid #dac497 !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}
.cg-wtc [aria-invalid="true"] { border-color: #c00; }
.cg-wtc input[type="checkbox"][aria-invalid="true"] { outline: 2px solid #c00; }
.cg-wtc textarea { min-height: 110px; resize: vertical; }
.cg-wtc textarea.is-tall { min-height: 130px; }
.cg-wtc .field-hint { font-family: "Montserrat", Sans-serif;
    font-size: 0.8rem;
    color: #080808;
    margin-top: 0.25rem;
  font-weight: 500; }

.cg-wtc .error-msg { 
    display: none;
    font-family: "Montserrat", Sans-serif;
    color: #c00;
    font-size: 0.82rem;
    margin-top: 0.3rem;
    font-weight: 500;
 }
.cg-wtc .error-msg.is-visible { display: block; }
.cg-wtc .checkbox-row + .error-msg { margin: -0.75rem 0 1rem; }

.cg-wtc .cond-section { display: none; 
background: #f7f7f7;
    border-left: 3px solid #f8dabc;
    padding: 20px 20px 15px 20px;
    border-radius: 0 4px 4px 0;
    margin-bottom: 1.25rem;
}
.cg-wtc .cond-section.visible { display: block; }
.cg-wtc .section-heading { 
      font-family: "Montserrat", Sans-serif;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #000000;
    margin: 0 0 0.9rem;
 }

.cg-wtc .info-box { font-size: 0.88rem; color: #444; background: #eef2f7;
                    padding: 0.75rem 1rem; border-radius: 4px; margin-bottom: 0.5rem; }

.cg-wtc .popia-scroll { max-height: 220px; overflow-y: scroll; border: 1px solid #ccc;
                        padding: 0.9rem 1rem; font-size: 0.8rem; line-height: 1.55;
                        background: #fafafa; border-radius: 4px; margin-bottom: 0.75rem; }
.cg-wtc .popia-scroll h3 { font-family: "Montserrat", Sans-serif;font-size: 0.88rem; margin: 0 0 0.5rem; }
.cg-wtc .popia-scroll h4 { font-family: "Montserrat", Sans-serif;font-size: 0.82rem; margin: 0.75rem 0 0.25rem; }
.cg-wtc .popia-scroll p  { font-family: "Montserrat", Sans-serif;margin: 0 0 0.45rem;font-weight: 500; }
.cg-wtc .popia-scroll ul { font-family: "Montserrat", Sans-serif;padding-left: 1.2rem; margin: 0 0 0.45rem;font-weight: 500; }
.cg-wtc .popia-scroll li { font-family: "Montserrat", Sans-serif;margin-bottom: 0.2rem; }

.cg-wtc .checkbox-row { display: flex; gap: 0.65rem; align-items: flex-start; margin-bottom: 1.25rem; }
.cg-wtc .checkbox-row input[type="checkbox"] { flex-shrink: 0; margin-top: 3px; width: auto; cursor: pointer; }
.cg-wtc .checkbox-row label { font-family: "Montserrat", Sans-serif;font-size: 0.9rem; font-weight: 500; cursor: pointer; }

.cg-wtc .submit-wrap { margin-top: 0.5rem; }
.cg-wtc button[type="submit"] { 
  font-family: "Montserrat", Sans-serif;
  background: #cf0f3c;
    color: #fff;
    border: none;
    padding: 15px 55px;
    font-size: 1rem;
    border-radius: 0;
    cursor: pointer;
    font-family: inherit;
 }
.cg-wtc button[type="submit"]:hover { background: #cf0f3c; }
.cg-wtc button[type="submit"]:disabled { opacity: 0.6; cursor: wait; }

.cg-wtc .form-error-summary { display: none; color: #c00; font-size: 0.88rem; margin-top: 0.5rem; }
.cg-wtc .form-error-summary.is-visible { display: block; }
.cg-wtc .cg-wtc-notice { background: #fdecea; border: 1px solid #e6a5a0; color: #8a1c13; border-radius: 4px;
                         padding: 0.6rem 0.9rem; font-size: 0.88rem; margin: 0.75rem 0; }

/* Store form: code screen and admin QR panel */
.cg-wtc-gate { max-width: 1100px; }
.cg-wtc input.cg-wtc-code { font-size: 1.5rem; letter-spacing: 0.3em; text-align: center; }
.cg-wtc .cg-wtc-admin { display:none; border: 1px dashed #bbb; border-radius: 4px; padding: 0.6rem 0.9rem;
                        margin-bottom: 1.5rem; font-size: 0.88rem; }
.cg-wtc .cg-wtc-admin summary { cursor: pointer; font-weight: 600; }
.cg-wtc .cg-wtc-admin p, .cg-wtc .cg-wtc-admin pre { margin: 0.75rem 0 0; }
.cg-wtc .cg-wtc-admin pre { white-space: pre-wrap; word-break: break-all; }
.cg-wtc .cg-wtc-qr { margin-top: 0.75rem; }
.cg-wtc .cg-wtc-qr img, .cg-wtc .cg-wtc-qr canvas { display: block; }
