/* demo.css: booking form, success + error states.
   .field is shared with login.css and the console's account page. */

.form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.8rem,1rem + 3vw,3.4rem);align-items:start}
.form-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
           padding:clamp(1.4rem,1.1rem + 1.2vw,2rem);box-shadow:var(--sh-md)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{margin-bottom:1rem}
.field label{font-size:var(--t-xs);font-weight:600;letter-spacing:.03em;text-transform:uppercase;
             color:var(--faint);display:block;margin-bottom:.45rem}
.field input,.field select,.field textarea{
  width:100%;font-family:inherit;font-size:var(--t-sm);color:var(--ink);
  background:var(--surface-alt);border:1.5px solid transparent;border-radius:var(--r-xs);
  padding:.75rem .85rem;-webkit-appearance:none;appearance:none;
  transition:border-color .2s ease,background .2s ease}
.field textarea{min-height:6rem;resize:vertical;line-height:1.5}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.75L6 6.25l4.5-4.5' fill='none' stroke='%233B5250' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
              background-position:right .95rem center;background-size:.7rem;background-repeat:no-repeat;padding-right:2.4rem}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary-2);background:var(--surface)}
.field.err input,.field.err select{border-color:var(--bad);background:var(--bad-soft)}
.field .msg{font-size:var(--t-xs);color:var(--bad);margin-top:.4rem}
.form-card .btn{width:100%}

.form-aside .spec-row{margin-bottom:.6rem}
.form-side-h{font-size:var(--t-xs);font-weight:600;letter-spacing:.03em;text-transform:uppercase;
             color:var(--faint);margin-bottom:.9rem}

.success{background:var(--primary-soft);border-radius:var(--r-lg);padding:clamp(1.4rem,1.1rem + 1.2vw,2rem)}
.success .sh{font-weight:700;font-size:clamp(1.4rem,1.15rem + 1vw,1.9rem);line-height:1.05;
             letter-spacing:var(--track-tight);color:var(--primary)}
.success p{margin:.9rem 0 0;color:var(--ink-soft);font-size:var(--t-sm);line-height:1.55}

.form-error{font-size:var(--t-sm);color:var(--bad);background:var(--bad-soft);
            border-radius:var(--r-sm);padding:.8rem 1rem;margin-bottom:1.1rem}
@media(max-width:880px){.form-wrap{grid-template-columns:1fr;gap:2rem}.form-row{grid-template-columns:1fr}}