/* Primary color: #f2aa1b */
:root{
  --ry-color:#f2aa1b;
  --ry-grey:#e5e7eb;
  --ry-text:#111827;
  --ry-radius:14px;
}
.rydenow-form-wrap{font-family:system-ui,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;color:var(--ry-text)}
.ry-card{background:#fff;border-radius:var(--ry-radius);box-shadow:0 10px 30px rgba(0,0,0,.08);padding:18px}
.ry-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ry-field{position:relative;display:flex;flex-direction:column}
.ry-field label{font-size:.9rem;margin:6px 0}

/* Fields: 5px radius + left icon spacing */
.ry-field input,.ry-field select,.ry-field textarea{
  height:48px;border:1.5px solid #e5e7eb;border-radius:5px;
  padding:0 12px 0 44px;font-size:16px;line-height:48px;
}
.ry-field input:focus,.ry-field select:focus,.ry-field textarea:focus{
  outline:none;border-color:var(--ry-color);box-shadow:0 0 0 4px rgba(242,170,27,.15)
}

/* Actions */
.ry-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.ry-btn{background:var(--ry-color);color:#fff;border:none;border-radius:12px;padding:12px 16px;font-weight:600;cursor:pointer}
.ry-btn[disabled]{opacity:.5;cursor:not-allowed}
.ry-btn.outline{background:transparent;color:var(--ry-color);border:2px solid var(--ry-color)}

/* progress bar centered */
.ry-progress{display:flex;align-items:center;justify-content:center;gap:20px;margin:0 auto 16px auto}
.ry-progress .step{display:flex;align-items:center;gap:10px}
.ry-progress .step:not(:last-child)::after{content:"";display:block;width:56px;height:4px;background:var(--ry-grey);border-radius:9999px}
.ry-progress .dot{width:36px;height:36px;border-radius:9999px;display:grid;place-items:center;background:#d1d5db;color:#fff;font-weight:700}

/* states */
.ry-progress .step.active .dot{background:var(--ry-color)}
.ry-progress .step.done .dot{background:var(--ry-color)}

/* left icons inside fields (centered vertically) */
.ry-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--ry-color);pointer-events:none}
.ry-icon svg{display:block;stroke:var(--ry-color)}

/* saved locations dropdown */
.ry-saved-dd{position:absolute;left:0;right:0;z-index:30;background:#fff;border:1px solid #e5e7eb;border-radius:10px;margin-top:6px;display:none;max-height:220px;overflow:auto;box-shadow:0 10px 20px rgba(0,0,0,.08)}
.ry-saved-dd .item{padding:10px 12px;cursor:pointer}
.ry-saved-dd .item:hover{background:#f9fafb}

/* steps */
.ry-step.hidden{display:none}
.ry-vehicles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ry-vehicle{border:1.5px solid #e5e7eb;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}
.ry-vehicle img{width:100%;border-radius:10px}
.ry-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
#ry_msg,#ry_msg_step2{margin-top:10px;font-weight:600}
#ry_msg.err{color:#b91c1c}

/* Date+Time combined row: mobile 60/40 */
.ry-datetime-row{display:grid;grid-template-columns:3fr 2fr;gap:12px}
@media (max-width: 720px){
  .ry-grid{grid-template-columns:1fr}
  .ry-vehicles{grid-template-columns:1fr}
  .ry-summary{grid-template-columns:1fr}
}
@media (min-width: 1024px){
  .ry-datetime-row{grid-template-columns:1fr 1fr}
}


/* Responsive & CSS variables */
:root{
  --ry-primary: #111827;
  --ry-accent: #2563eb;
  --ry-bg: #ffffff;
  --ry-text: #111827;
  --ry-input-h: 44px;
  --ry-btn-h: 44px;
  --ry-radius: 12px;
}
.rydenow-form-wrap{ background: var(--ry-bg); color: var(--ry-text); }
.ry-btn{ height: var(--ry-btn-h); border-radius: var(--ry-radius); }
.ry-field input, .ry-field select{ height: var(--ry-input-h); }

@media (max-width: 1024px){
  .ry-grid{ grid-template-columns: 1fr 1fr !important; gap: 14px; }
}
@media (max-width: 640px){
  .ry-grid{ grid-template-columns: 1fr !important; gap: 12px; }
  .ry-actions{ flex-direction: column; gap: 10px; }
  .ry-btn{ width: 100%; }
}
/* Success/Fail messages */
#ry_msg{ margin-top: 10px; font-weight: 600; }
#ry_msg.ok{ color: #059669; } /* green */
#ry_msg.err{ color: #dc2626; } /* red */