/**
 * Garage Tec CRM — public-facing styles for shortcode-rendered widgets.
 * Scoped under .gtcrm-* classes so we don't bleed into the host theme.
 */

/* ── Form ─────────────────────────────────────────────────────────── */
.gtcrm-form-wrapper { max-width: 500px; margin: 0 auto; }
.gtcrm-form-group { margin-bottom: 15px; }
.gtcrm-form-group label { display: block; margin-bottom: 5px; font-weight: 600; }
.gtcrm-form-group input,
.gtcrm-form-group select,
.gtcrm-form-group textarea {
    width: 100%; padding: 12px;
    border: 1px solid #ddd; border-radius: 6px; font-size: 16px;
    box-sizing: border-box;
}
.gtcrm-form-group input:focus,
.gtcrm-form-group select:focus,
.gtcrm-form-group textarea:focus {
    border-color: #e63946; outline: none;
    box-shadow: 0 0 0 3px rgba(230,57,70,.1);
}
.gtcrm-submit-btn {
    width: 100%; padding: 15px 30px;
    background: #e63946; color: #fff; border: none; border-radius: 6px;
    font-size: 18px; font-weight: 600; cursor: pointer; transition: background .3s;
}
.gtcrm-submit-btn:hover    { background: #c1121f; }
.gtcrm-submit-btn:disabled { background: #ccc; cursor: not-allowed; }
.gtcrm-form-message { padding: 15px; border-radius: 6px; margin-top: 15px; }
.gtcrm-form-message.success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.gtcrm-form-message.error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }

.gtcrm-consent-group { font-size: 12px; line-height: 1.5; color: #475569; }
.gtcrm-consent-label { display: flex; align-items: flex-start; gap: 8px; font-weight: 400; cursor: pointer; }
.gtcrm-consent-label input[type="checkbox"] { width: auto !important; margin-top: 3px; flex-shrink: 0; }
.gtcrm-consent-text { flex: 1; }

.gtcrm-req { color: #dc2626; font-weight: 700; margin-left: 2px; }
.gtcrm-form-desc { color: #475569; font-size: 14px; margin: 0 0 16px; line-height: 1.5; }
.gtcrm-step-divider { font-weight: 700; font-size: 15px; padding: 14px 0 6px;
    border-bottom: 1px solid #e5e7eb; margin: 18px 0 14px; color: #1e293b; }
.gtcrm-opt { display: block; margin: 4px 0; font-size: 14px; cursor: pointer; font-weight: 400; }
.gtcrm-opt input { width: auto !important; margin-right: 8px; }

/* ── Booking widget ───────────────────────────────────────────────── */
.gtcrm-booking-widget { max-width: 720px; margin: 0 auto; }
.gtcrm-booking-head h3 { margin: 0 0 4px; font-size: 22px; font-weight: 800; }
.gtcrm-booking-head p { margin: 0 0 16px; color: #475569; }
.gtcrm-booking-zip { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.gtcrm-booking-zip input { flex: 0 0 140px; padding: 10px 12px; font-size: 16px; border: 1px solid #ddd; border-radius: 6px; }
.gtcrm-booking-zip label { font-weight: 600; align-self: center; margin-right: 6px; }
.gtcrm-booking-loadbtn {
    padding: 10px 18px; background: #1e293b; color: #fff; border: none;
    border-radius: 6px; cursor: pointer; font-weight: 700;
}
.gtcrm-booking-loadbtn:hover { background: #0f172a; }

.gtcrm-booking-loading, .gtcrm-booking-empty {
    padding: 16px; text-align: center; color: #6b7280; background: #f8fafc; border-radius: 6px;
}

.gtcrm-slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.gtcrm-slot-card {
    background: #fff; border: 2px solid #e2e8f0; border-radius: 10px;
    padding: 14px; cursor: pointer; text-align: left; transition: all .15s;
}
.gtcrm-slot-card:hover { border-color: #e63946; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,.05); }
.gtcrm-slot-label { font-weight: 700; color: #0f172a; font-size: 15px; }
.gtcrm-slot-meta  { color: #6b7280; font-size: 12px; margin-top: 2px; }

.gtcrm-booking-selected { padding: 8px 0; }
.gtcrm-back-btn { background: none; border: none; color: #e63946; cursor: pointer; padding: 0; margin-bottom: 10px; font-weight: 600; }
.gtcrm-selected-card { background: #fef3c7; border-left: 4px solid #d4a14a; padding: 12px 14px; border-radius: 8px; margin-bottom: 16px; }
.gtcrm-selected-card strong { display: block; }
.gtcrm-selected-card small  { color: #78350f; font-size: 12px; }

/* ── ZIP check / lead status ──────────────────────────────────────── */
.gtcrm-zip-check, .gtcrm-leadstatus { max-width: 520px; margin: 0 auto; padding: 18px; background: #f8fafc; border-radius: 10px; }
.gtcrm-zip-check h3, .gtcrm-leadstatus h3 { margin: 0 0 4px; }
.gtcrm-zip-check p, .gtcrm-leadstatus p   { color: #475569; margin: 0 0 12px; }
.gtcrm-zip-row, .gtcrm-leadstatus-row { display: flex; gap: 8px; flex-wrap: wrap; }
.gtcrm-zip-row input, .gtcrm-leadstatus-row input { flex: 1; min-width: 120px; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 16px; }
.gtcrm-zip-row button, .gtcrm-leadstatus-row button { padding: 10px 18px; background: #e63946; color: #fff; border: none; border-radius: 6px; cursor: pointer; font-weight: 700; }
.gtcrm-zip-result, .gtcrm-leadstatus-result { margin-top: 12px; padding: 10px 14px; border-radius: 6px; font-size: 14px; }
.gtcrm-zip-result.ok, .gtcrm-leadstatus-result.ok { background: #d4edda; color: #155724; border-left: 3px solid #10b981; }
.gtcrm-zip-result.warn, .gtcrm-leadstatus-result.warn { background: #fef3c7; color: #78350f; border-left: 3px solid #d4a14a; }
.gtcrm-zip-result.err, .gtcrm-leadstatus-result.err { background: #f8d7da; color: #721c24; border-left: 3px solid #ef4444; }
.gtcrm-zip-result.loading, .gtcrm-leadstatus-result.loading { background: #e0e7ff; color: #3730a3; }

/* ── Phone tracking link ──────────────────────────────────────────── */
.gtcrm-tel-link { color: inherit; font-weight: 700; text-decoration: none; }
.gtcrm-tel-link:hover { text-decoration: underline; }
