/* ============================================================
   CestPasPerdu — Public CSS (version finale)
   ============================================================ */

/* ── Reset & base ─────────────────────────────────────────── */
.cpp-page-wrap *, .cpp-search-wrap * { box-sizing: border-box; }

:root {
    --cpp-dark:    #1a1a2e;
    --cpp-indigo:  #6366f1;
    --cpp-slate:   #64748b;
    --cpp-border:  #e2e8f0;
    --cpp-bg:      #f8fafc;
    --cpp-white:   #ffffff;
    --cpp-radius:  12px;
    --cpp-shadow:  0 4px 24px rgba(0,0,0,.07);
}

/* ── Page wrapper ─────────────────────────────────────────── */
.cpp-page-wrap {
    max-width: 680px;
    margin: 2rem auto;
    padding: 0 1rem;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #1a1a2e;
    line-height: 1.6;
}

/* ── Header site ──────────────────────────────────────────── */
.cpp-site-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    background: var(--cpp-dark);
    color: #fff;
    padding: 1rem 1.5rem;
    border-radius: var(--cpp-radius) var(--cpp-radius) 0 0;
}

.cpp-site-brand {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    text-decoration: none;
    color: inherit;
}

.cpp-site-name {
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: -.01em;
}

.cpp-site-url {
    font-size: .75rem;
    color: #a5b4fc;
}

.cpp-site-contact {
    color: #a5b4fc;
    font-size: .82rem;
    text-decoration: none;
}

.cpp-site-contact:hover { color: #fff; }

.cpp-session-badge {
    font-size: .75rem;
    background: rgba(255,255,255,.12);
    padding: .25rem .65rem;
    border-radius: 9999px;
    white-space: nowrap;
}

/* ── Main ─────────────────────────────────────────────────── */
.cpp-main {
    background: var(--cpp-white);
    border: 1px solid var(--cpp-border);
    border-top: none;
    border-radius: 0 0 var(--cpp-radius) var(--cpp-radius);
    padding: 2rem;
}

/* ── Carte statut ─────────────────────────────────────────── */
.cpp-status-card {
    border: 1.5px solid var(--cpp-border);
    border-radius: var(--cpp-radius);
    overflow: hidden;
    margin-bottom: 2rem;
}

.cpp-status-banner {
    background: var(--status-bg, #f8fafc);
    border-left: 5px solid var(--status-color, #6366f1);
    padding: 1.2rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.cpp-status-icon-lg { font-size: 2.2rem; line-height: 1; }

.cpp-status-info { flex: 1; }

.cpp-status-tag {
    font-size: 1rem;
    font-weight: 700;
    color: var(--status-color, #6366f1);
    margin: 0 0 .2rem;
}

.cpp-status-desc {
    font-size: .85rem;
    color: var(--cpp-slate);
    margin: 0;
}

.cpp-object-identity {
    padding: 1.2rem 1.5rem;
    border-top: 1px solid var(--cpp-border);
}

.cpp-object-name {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 .35rem;
    color: var(--cpp-dark);
}

.cpp-object-pid {
    font-size: .82rem;
    color: var(--cpp-slate);
    margin: 0;
}

.cpp-object-pid code {
    background: var(--cpp-bg);
    padding: .15rem .5rem;
    border-radius: 4px;
    font-family: 'SF Mono', 'Fira Code', 'Courier New', monospace;
    letter-spacing: .1em;
    font-size: .85em;
}

.cpp-owner-message {
    margin: 0 1.5rem 1.2rem;
    padding: .85rem 1rem;
    background: var(--cpp-bg);
    border-radius: 8px;
    font-style: italic;
    color: #475569;
}

.cpp-owner-message-label {
    display: block;
    font-style: normal;
    font-weight: 600;
    font-size: .82rem;
    color: var(--cpp-slate);
    margin-bottom: .4rem;
}

.cpp-last-update {
    padding: .5rem 1.5rem 1rem;
    font-size: .78rem;
    color: #94a3b8;
    margin: 0;
}

/* ── Section contact ──────────────────────────────────────── */
.cpp-contact-section {
    border-top: 1px solid var(--cpp-border);
    padding-top: 1.75rem;
}

.cpp-contact-header h2 {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0 0 .3rem;
}

.cpp-contact-header p {
    font-size: .85rem;
    color: var(--cpp-slate);
    margin: 0 0 1.25rem;
}

/* ── Formulaires ──────────────────────────────────────────── */
.cpp-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
}

.cpp-field {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}

.cpp-field label {
    font-size: .88rem;
    font-weight: 600;
    color: #374151;
}

.cpp-field label span { color: #ef4444; }

.cpp-field input,
.cpp-field textarea,
.cpp-field select {
    padding: .6rem .85rem;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    font-size: .93rem;
    font-family: inherit;
    transition: border-color .15s, box-shadow .15s;
    width: 100%;
    background: #fff;
    color: #1a1a2e;
}

.cpp-field input:focus,
.cpp-field textarea:focus,
.cpp-field select:focus {
    outline: none;
    border-color: var(--cpp-indigo);
    box-shadow: 0 0 0 3px rgba(99,102,241,.15);
}

.cpp-field textarea { resize: vertical; min-height: 100px; }

/* ── Boutons ──────────────────────────────────────────────── */
.cpp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    padding: .65rem 1.4rem;
    border-radius: 8px;
    font-size: .93rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: opacity .15s, transform .1s;
}

.cpp-btn:hover { opacity: .88; transform: translateY(-1px); }

.cpp-btn-primary   { background: var(--cpp-indigo); color: #fff; }
.cpp-btn-secondary { background: var(--cpp-dark);   color: #fff; }

.cpp-btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .85rem;
    color: var(--cpp-indigo);
    text-decoration: none;
    padding: .3rem .6rem;
    border-radius: 6px;
    border: 1px solid var(--cpp-border);
    transition: background .15s;
    font-weight: 500;
}

.cpp-btn-ghost:hover { background: var(--cpp-bg); }
.cpp-btn-ghost--small { font-size: .8rem; }

/* ── Form actions ─────────────────────────────────────────── */
.cpp-form-actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1.2rem;
}

.cpp-privacy-note {
    font-size: .78rem;
    color: var(--cpp-slate);
    margin: 0;
}

/* ── Feedback ─────────────────────────────────────────────── */
.cpp-form-feedback {
    font-size: .88rem;
    padding: .5rem .75rem;
    border-radius: 6px;
    min-height: 1.5rem;
    margin-top: .5rem;
}

.cpp-form-feedback.success { background: #dcfce7; color: #166534; }
.cpp-form-feedback.error   { background: #fee2e2; color: #991b1b; }

/* ── Dashboard propriétaire ───────────────────────────────── */
.cpp-dashboard-wrap .cpp-main { padding: 1.75rem; }

.cpp-dashboard-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.cpp-dashboard-greeting { font-size: 1.4rem; font-weight: 700; margin: 0 0 .25rem; }
.cpp-dashboard-sub      { font-size: .88rem; color: var(--cpp-slate); margin: 0; }

/* ── Alerte urgente ───────────────────────────────────────── */
.cpp-alert {
    display: flex;
    gap: 1rem;
    padding: 1rem 1.2rem;
    border-radius: 10px;
    margin-bottom: 1.5rem;
    align-items: flex-start;
}

.cpp-alert-urgent { background: #fff5f5; border: 1.5px solid #fca5a5; }
.cpp-alert-icon   { font-size: 1.4rem; line-height: 1; }
.cpp-alert-urgent strong { display: block; color: #991b1b; margin-bottom: .4rem; }
.cpp-alert-urgent ul { margin: 0; padding-left: 1rem; font-size: .88rem; color: #7f1d1d; }
.cpp-alert-urgent li { margin-bottom: .2rem; }

/* ── Liste objets ─────────────────────────────────────────── */
.cpp-objects-list { display: flex; flex-direction: column; gap: 1.2rem; }

.cpp-obj-card {
    border: 1.5px solid var(--cpp-border);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.cpp-obj-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.2rem;
    flex-wrap: wrap;
}

.cpp-obj-nature {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 .25rem;
    color: var(--cpp-dark);
}

.cpp-obj-meta {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
}

.cpp-obj-pid {
    font-size: .8rem;
    background: var(--cpp-bg);
    padding: .15rem .45rem;
    border-radius: 4px;
    font-family: monospace;
    letter-spacing: .08em;
    color: var(--cpp-slate);
}

.cpp-obj-group { font-size: .8rem; color: var(--cpp-slate); }

.cpp-obj-status-current {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem 1.2rem;
    padding: .75rem 1.2rem;
    border-top: 1.5px solid transparent;
    background: var(--cpp-bg);
    font-size: .88rem;
}

.cpp-obj-status-badge {
    font-weight: 700;
    font-size: .9rem;
}

.cpp-obj-status-msg {
    color: var(--cpp-slate);
    font-style: italic;
    margin: 0;
    flex-basis: 100%;
    font-size: .85rem;
}

.cpp-obj-status-date {
    font-size: .78rem;
    color: #94a3b8;
    margin-left: auto;
}

/* ── Accordéon statut ─────────────────────────────────────── */
.cpp-status-accordion {
    border-top: 1px solid var(--cpp-border);
}

.cpp-status-accordion-trigger {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .75rem 1.2rem;
    font-size: .88rem;
    font-weight: 600;
    color: var(--cpp-indigo);
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.cpp-status-accordion-trigger::-webkit-details-marker { display: none; }
.cpp-status-accordion-trigger::before { content: '▶'; font-size: .6rem; transition: transform .2s; }
details[open] .cpp-status-accordion-trigger::before { transform: rotate(90deg); }

.cpp-status-accordion > form {
    padding: 1rem 1.2rem;
    display: flex;
    flex-direction: column;
}

/* ── Sélecteur de statut en pills ─────────────────────────── */
.cpp-status-picker {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.cpp-status-option {
    display: flex;
    align-items: center;
    gap: .35rem;
    padding: .4rem .85rem;
    border-radius: 9999px;
    border: 1.5px solid var(--cpp-border);
    cursor: pointer;
    font-size: .85rem;
    font-weight: 500;
    transition: border-color .15s, background .15s;
    user-select: none;
}

.cpp-status-option input { display: none; }

.cpp-status-option:hover {
    border-color: var(--opt-color, var(--cpp-indigo));
    background: color-mix(in srgb, var(--opt-color, var(--cpp-indigo)) 8%, white);
}

.cpp-status-option--active,
.cpp-status-option:has(input:checked) {
    border-color: var(--opt-color, var(--cpp-indigo));
    background: color-mix(in srgb, var(--opt-color, var(--cpp-indigo)) 12%, white);
    color: var(--opt-color, var(--cpp-indigo));
    font-weight: 700;
}

/* ── RGPD box ─────────────────────────────────────────────── */
.cpp-rgpd-box {
    margin-top: 2rem;
    padding: 1.2rem 1.4rem;
    background: #f0f4ff;
    border: 1px solid #c7d2fe;
    border-radius: 10px;
    font-size: .85rem;
}

.cpp-rgpd-box h3 { font-size: .95rem; margin: 0 0 .5rem; }
.cpp-rgpd-box p  { margin: 0 0 .75rem; color: #374151; }

/* ── Empty dashboard ──────────────────────────────────────── */
.cpp-empty-dashboard {
    text-align: center;
    padding: 2.5rem;
    color: var(--cpp-slate);
}

/* ── Shortcode recherche ──────────────────────────────────── */
.cpp-search-wrap {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.cpp-search--card {
    background: var(--cpp-white);
    border: 1.5px solid var(--cpp-border);
    border-radius: var(--cpp-radius);
    padding: 2rem;
    max-width: 560px;
    margin: 1.5rem auto;
    box-shadow: var(--cpp-shadow);
}

.cpp-search--inline {
    max-width: 560px;
    margin: 1rem auto;
}

.cpp-search-header { margin-bottom: 1.2rem; }
.cpp-search-title  { font-size: 1.3rem; font-weight: 700; margin: 0 0 .4rem; color: var(--cpp-dark); }
.cpp-search-subtitle { font-size: .9rem; color: var(--cpp-slate); margin: 0; }

.cpp-search-input-wrap {
    display: flex;
    gap: .5rem;
    align-items: stretch;
}

.cpp-search-input {
    flex: 1;
    padding: .7rem 1rem;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    font-size: 1rem;
    font-family: 'SF Mono', 'Fira Code', 'Courier New', monospace;
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: border-color .15s;
    min-width: 0;
}

.cpp-search-input:focus {
    outline: none;
    border-color: var(--cpp-indigo);
    box-shadow: 0 0 0 3px rgba(99,102,241,.15);
}

.cpp-search-input::placeholder { font-family: inherit; letter-spacing: 0; text-transform: none; color: #9ca3af; }

.cpp-search-btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .7rem 1.2rem;
    background: var(--cpp-indigo);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: .93rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity .15s;
}

.cpp-search-btn:hover { opacity: .88; }

.cpp-search-error {
    font-size: .85rem;
    color: #991b1b;
    min-height: 1.2rem;
    margin-top: .4rem;
}

.cpp-search-example {
    font-size: .8rem;
    color: var(--cpp-slate);
    margin: .75rem 0 0;
}

.cpp-search-example code {
    background: var(--cpp-bg);
    padding: .1rem .4rem;
    border-radius: 4px;
    font-family: monospace;
    letter-spacing: .06em;
}

/* ── Pages d'erreur ───────────────────────────────────────── */
.cpp-error-card {
    max-width: 440px;
    margin: 3rem auto;
    padding: 2.5rem 2rem;
    background: var(--cpp-white);
    border: 1.5px solid var(--cpp-border);
    border-radius: 16px;
    text-align: center;
    box-shadow: var(--cpp-shadow);
}

.cpp-error-icon { font-size: 3.5rem; display: block; margin-bottom: 1rem; }
.cpp-error-card h1 { font-size: 1.3rem; margin: 0 0 .75rem; }
.cpp-error-card p  { color: var(--cpp-slate); font-size: .9rem; }
.cpp-error-card.cpp-error-warn { border-color: #fde68a; background: #fffbeb; }

/* ── Footer ───────────────────────────────────────────────── */
.cpp-page-footer {
    text-align: center;
    font-size: .78rem;
    color: #94a3b8;
    margin-top: 1.5rem;
    padding-bottom: 1rem;
}

.cpp-page-footer a { color: #94a3b8; text-decoration: none; }
.cpp-page-footer a:hover { color: var(--cpp-slate); }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 520px) {
    .cpp-main { padding: 1.25rem; }
    .cpp-form-row { grid-template-columns: 1fr; }
    .cpp-status-banner { flex-direction: column; gap: .75rem; }
    .cpp-search-input-wrap { flex-direction: column; }
    .cpp-search-btn { justify-content: center; }
    .cpp-obj-card-header { flex-direction: column; }
}

/* ── Page d'enregistrement ────────────────────────────────── */
.cpp-register-wrap .cpp-main { padding: 2rem; }

.cpp-register-header {
    text-align: center;
    margin-bottom: 2rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--cpp-border);
}

.cpp-register-icon { font-size: 3rem; margin-bottom: .5rem; }
.cpp-register-title { font-size: 1.6rem; font-weight: 800; margin: 0 0 .4rem; }
.cpp-register-sub { font-size: .9rem; color: var(--cpp-slate); margin: 0; }

.cpp-info-banner {
    background: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: .75rem 1rem;
    font-size: .88rem;
    color: #92400e;
    margin-bottom: 1.5rem;
    text-align: center;
}

/* Fieldsets */
.cpp-fieldset {
    border: 1.5px solid var(--cpp-border);
    border-radius: 10px;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
}

.cpp-fieldset-legend {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: 1rem;
    font-weight: 700;
    color: var(--cpp-dark);
    padding: 0 .5rem;
}

.cpp-legend-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    background: var(--cpp-indigo);
    color: #fff;
    border-radius: 50%;
    font-size: .8rem;
    font-weight: 700;
    flex-shrink: 0;
}

.cpp-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-top: 1rem;
}

.cpp-field-full { grid-column: 1 / -1; }

/* Consentement RGPD */
.cpp-consent-block {
    background: var(--cpp-bg);
    border: 1.5px solid var(--cpp-border);
    border-radius: 8px;
    padding: 1rem 1.2rem;
    margin-bottom: 1.5rem;
}

.cpp-consent-label {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    cursor: pointer;
    font-size: .85rem;
    color: #374151;
    line-height: 1.5;
}

.cpp-consent-label input {
    margin-top: .2rem;
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    accent-color: var(--cpp-indigo);
}

/* Bouton large */
.cpp-btn-large { padding: .85rem 2rem; font-size: 1rem; width: 100%; justify-content: center; }

/* Lien déjà inscrit */
.cpp-register-footer-link {
    text-align: center;
    font-size: .85rem;
    color: var(--cpp-slate);
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--cpp-border);
}

.cpp-register-footer-link a { color: var(--cpp-indigo); font-weight: 600; }

/* Formulaire renvoi lien */
.cpp-resend-wrap {
    margin-top: 1rem;
    padding: 1.25rem;
    background: var(--cpp-bg);
    border: 1.5px solid var(--cpp-border);
    border-radius: 10px;
}

/* ── Page confirmation ────────────────────────────────────── */
.cpp-success-card {
    text-align: center;
    padding: 2.5rem 1.5rem;
    max-width: 500px;
    margin: 0 auto;
}

.cpp-success-icon { font-size: 4rem; display: block; margin-bottom: 1rem; }

.cpp-success-card h1 { font-size: 1.5rem; font-weight: 800; margin: 0 0 .75rem; }

.cpp-success-msg {
    color: var(--cpp-slate);
    font-size: .93rem;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.cpp-success-steps {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    text-align: left;
    margin-bottom: 1.5rem;
}

.cpp-step {
    display: flex;
    align-items: center;
    gap: .75rem;
    font-size: .9rem;
    color: #374151;
}

.cpp-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    background: #e0e7ff;
    color: var(--cpp-indigo);
    border-radius: 50%;
    font-size: .8rem;
    font-weight: 700;
    flex-shrink: 0;
}

.cpp-step-done .cpp-step-num { background: #dcfce7; color: #166534; }

.cpp-email-reminder {
    font-size: .82rem;
    color: var(--cpp-slate);
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: .5rem .85rem;
    margin-bottom: 1rem;
}

@media (max-width: 520px) {
    .cpp-form-grid { grid-template-columns: 1fr; }
    .cpp-register-title { font-size: 1.3rem; }
}