/* =========================================================
   Les Ty-Lutins — Espace famille (connexion + réservations)
   ========================================================= */

.tyl-fam-wrap{
	--ty-violet:#6c4ab6; --ty-violet-fonce:#4a2f87; --ty-violet-clair:#8d6ee0;
	--ty-pale:#f3eefc; --ty-soleil:#ffc24b; --ty-corail:#ff7a85; --ty-menthe:#3ec9a7;
	--ty-encre:#2c2541; --ty-gris:#6b6480; --ty-bord:#e8e3f2;
	max-width:920px;margin:0 auto;color:var(--ty-encre);
}

.tyl-fam-wrap h2{color:var(--ty-violet-fonce);margin:0 0 4px}
.tyl-fam-wrap h3{color:var(--ty-violet-fonce);margin:0 0 4px;font-size:1.2rem}
.tyl-sub{color:var(--ty-gris);font-size:.92rem;margin:0 0 16px}

/* --- cartes --- */
.tyl-card{
	background:#fff;border:1px solid var(--ty-bord);border-radius:18px;padding:24px;
	box-shadow:0 6px 22px rgba(76,47,135,.10);margin-bottom:20px
}
.tyl-card-soleil{border-color:var(--ty-soleil);box-shadow:0 6px 22px rgba(255,194,75,.22)}
.tyl-fam-cols{display:grid;grid-template-columns:1fr 1.3fr;gap:20px}

/* --- champs --- */
.tyl-fam-wrap label{display:block;font-weight:700;font-size:.85rem;margin-bottom:5px;color:var(--ty-violet-fonce)}
.tyl-fam-wrap .req{color:var(--ty-corail)}
.tyl-fam-wrap input,.tyl-fam-wrap select{
	width:100%;padding:10px 13px;border:2px solid var(--ty-bord);border-radius:11px;
	font-size:.95rem;background:#fff;color:var(--ty-encre);font-family:inherit;transition:.2s
}
.tyl-fam-wrap input:focus,.tyl-fam-wrap select:focus{outline:none;border-color:var(--ty-violet-clair);box-shadow:0 0 0 4px var(--ty-pale)}
.tyl-fam-wrap p{margin:0 0 13px}
.tyl-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tyl-grid2 .full{grid-column:1/-1}
.tyl-mini{font-size:.82rem}
.tyl-mini a{color:var(--ty-violet)}
.tyl-rgpd{font-size:.83rem}
.tyl-rgpd label{display:flex;gap:8px;align-items:flex-start;font-weight:400;color:var(--ty-encre)}
.tyl-rgpd input{width:auto;margin-top:3px}

/* --- boutons --- */
.tyl-btn{font-weight:700;border:0;cursor:pointer;padding:11px 22px;border-radius:13px;transition:.2s;font-size:.95rem;font-family:inherit;display:inline-block;text-decoration:none;text-align:center}
.tyl-btn.primary{background:var(--ty-violet);color:#fff}
.tyl-btn.primary:hover{background:var(--ty-violet-fonce)}
.tyl-btn.soleil{background:var(--ty-soleil);color:#5a3d00}
.tyl-btn.soleil:hover{filter:brightness(.96)}
.tyl-btn.ghost{background:var(--ty-pale);color:var(--ty-violet-fonce)}
.tyl-link{color:var(--ty-violet);font-weight:600}

/* --- messages --- */
.tyl-alert{background:#ffe9eb;border:2px solid var(--ty-corail);color:#b3303f;padding:13px 16px;border-radius:12px;margin-bottom:18px}
.tyl-ok{background:#e3f6ec;border:2px solid var(--ty-menthe);color:#1f7a52;padding:13px 16px;border-radius:12px;margin-bottom:18px}

/* --- hero connecté --- */
.tyl-hero{background:linear-gradient(120deg,var(--ty-violet),var(--ty-violet-clair));color:#fff;border-radius:18px;padding:22px 24px;margin-bottom:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.tyl-hero h2{color:#fff}
.tyl-hero p{opacity:.9;margin:0;font-size:.92rem}
.tyl-hero-ic{width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:1.6rem}
.tyl-hero .tyl-btn{margin-left:auto}

.tyl-attente h2{color:var(--ty-violet-fonce)}
.tyl-attente{border-left:5px solid var(--ty-soleil)}

/* --- enfants --- */
.tyl-enfants{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.tyl-enfant-chip{background:var(--ty-pale);border-radius:14px;padding:12px 16px;display:flex;flex-direction:column;gap:2px;min-width:140px}
.tyl-enfant-chip strong{color:var(--ty-violet-fonce);font-size:1.05rem}
.tyl-enfant-chip span{font-size:.8rem;color:var(--ty-gris)}
.tyl-enfant-chip .tyl-allerg{color:var(--ty-corail);font-weight:600}
.tyl-add-enfant{margin-top:8px;border:2px dashed var(--ty-bord);border-radius:14px;padding:14px 16px}
.tyl-add-enfant summary{cursor:pointer;font-weight:700;color:var(--ty-violet);list-style:none}
.tyl-add-enfant summary::-webkit-details-marker{display:none}
.tyl-add-enfant[open] summary{margin-bottom:14px}

/* --- navigation semaine --- */
.tyl-week-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.tyl-week-label{font-weight:700;color:var(--ty-violet-fonce)}

/* --- grille de réservation --- */
.tyl-planning{margin-bottom:22px;border:1px solid var(--ty-bord);border-radius:14px;overflow:hidden}
.tyl-planning-head{background:var(--ty-violet);color:#fff;padding:10px 16px;font-weight:700;font-size:1.05rem}
.tyl-grid-resa{
	display:grid;
	grid-template-columns:1.3fr repeat(5,1fr);
	gap:6px;padding:12px;background:#fff
}
.tyl-grid-corner{}
.tyl-col-head{text-align:center;display:flex;flex-direction:column;padding:6px 0;background:var(--ty-pale);border-radius:9px}
.tyl-col-head .d{font-weight:700;color:var(--ty-violet-fonce);font-size:.82rem;text-transform:capitalize}
.tyl-col-head .n{font-size:.74rem;color:var(--ty-gris)}
.tyl-row-head{display:flex;align-items:center;font-size:.84rem;font-weight:600;color:var(--ty-encre);padding-right:6px}
.tyl-cell{
	border:2px solid var(--ty-bord);background:#fff;border-radius:9px;height:38px;cursor:pointer;
	font-size:1rem;color:#fff;transition:.15s;font-weight:700
}
.tyl-cell:hover{border-color:var(--ty-violet-clair);background:var(--ty-pale)}
.tyl-cell.on{background:var(--ty-menthe);border-color:var(--ty-menthe)}
.tyl-cell.loading{opacity:.5;pointer-events:none}
.tyl-quota-note{font-size:.82rem;color:var(--ty-gris);background:var(--ty-pale);padding:10px 14px;border-radius:10px}

@media(max-width:740px){
	.tyl-fam-cols{grid-template-columns:1fr}
	/* Grille condensée : colonnes plus étroites mais on garde la matrice. */
	.tyl-grid-resa{grid-template-columns:0.9fr repeat(5,1fr);gap:4px;padding:8px;overflow-x:auto}
	.tyl-col-head .d{font-size:.7rem}
	.tyl-col-head .n{font-size:.64rem}
	.tyl-row-head{font-size:.72rem}
	.tyl-cell{height:40px;font-size:1.05rem}
	.tyl-hero .tyl-btn{margin-left:0;width:100%;margin-top:8px}
}

/* --- Champs ajoutés (v1.6) --- */
.tyl-note-champ{display:block;font-size:.78rem;color:var(--ty-corail);font-weight:600;margin-top:4px;font-style:italic}
.tyl-pills small{color:var(--ty-gris);font-weight:400}
.tyl-sexe{font-weight:400;color:var(--ty-violet-clair);font-size:.95rem}

/* --- Enfants éditables (v1.6) --- */
.tyl-enfants-list{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}
.tyl-enfant-edit{border:2px solid var(--ty-bord);border-radius:14px;overflow:hidden;background:#fff}
.tyl-enfant-edit summary{
	cursor:pointer;padding:14px 16px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
	list-style:none;background:var(--ty-pale);transition:.2s
}
.tyl-enfant-edit summary::-webkit-details-marker{display:none}
.tyl-enfant-edit summary:hover{background:#ebe3f9}
.tyl-enfant-titre{display:flex;flex-direction:column}
.tyl-enfant-titre strong{color:var(--ty-violet-fonce);font-size:1.05rem}
.tyl-enfant-meta{font-size:.8rem;color:var(--ty-gris)}
.tyl-edit-hint{margin-left:auto;font-size:.82rem;font-weight:700;color:var(--ty-violet);background:#fff;padding:5px 12px;border-radius:20px;border:1px solid var(--ty-bord)}
.tyl-enfant-edit[open] summary .tyl-edit-hint{background:var(--ty-violet);color:#fff;border-color:var(--ty-violet)}
.tyl-enfant-form{padding:18px 16px}
.tyl-enfant-form textarea{width:100%;padding:10px 13px;border:2px solid var(--ty-bord);border-radius:11px;font-family:inherit;font-size:.95rem;color:var(--ty-encre)}
.tyl-enfant-form textarea:focus{outline:none;border-color:var(--ty-violet-clair);box-shadow:0 0 0 4px var(--ty-pale)}