﻿/* Inscription au GIL (boutons Inscription et Groupe) et traitement des demandes : styles recopiés d'Ivociel (Views/Inscription/Styles.cshtml). */
body.insPage { background: #f3f4ee; margin: 0; font-family: Roboto, Arial, sans-serif; color: #1d2b2d; font-weight: 400; }
    .insBandeau { display: flex; align-items: center; gap: 16px; background: #3CB371; padding: 10px max(3%, calc((100% - 1240px) / 2)); }
    .insLogo img { height: 50px; display: block; }
    .insTitreBandeau { color: #fff; font-size: 20px; font-weight: 500; flex: 1; }
    .insLienConnexion { color: #fff !important; text-decoration: underline; font-size: 14px; }
    .insCarte { width: 94%; max-width: 1240px; margin: 30px auto; background: #fff; border: 1px solid #dde0d0; border-radius: 8px; padding: 28px 32px; box-sizing: border-box; }
    .insEtapes { display: flex; margin: 0 0 24px; padding: 0; gap: 8px; }
    .insEtapes > div { flex: 1; padding: 10px 8px; border-bottom: 3px solid #dde0d0; color: #4a5052; font-size: 14px; font-weight: 500; white-space: nowrap; }
    .insEtapes > div span { display: inline-block; width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 50%; background: #dde0d0; color: #fff; margin-right: 6px; font-size: 13px; }
    .insEtapes > div.actif { color: #1f2d52; border-color: #2C3E6B; font-weight: 700; }
    .insEtapes > div.actif span { background: #2C3E6B; }
    .insEtapes > div.fait { color: #3E6B2F; border-color: #3E6B2F; }
    .insEtapes > div.fait span { background: #3E6B2F; }
    .insEtape { border: 0; margin: 0; padding: 0; display: none; }
    .insEtape legend { font-size: 18px; color: #1f2d52; font-weight: 700; margin-bottom: 14px; }
    .insGrille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 18px; }
    .insChamp { display: flex; flex-direction: column; gap: 4px; font-size: 13.5px; color: #1d2b2d; font-weight: 500; margin: 0; text-transform: none; }
    .insChamp input[type=text], .insChamp input[type=email], .insChamp input[type=tel], .insChamp input[type=password], .insChamp select, .insChamp textarea {
        height: 38px; border: 1px solid #c9ccbc; border-radius: 4px; padding: 0 10px; font-size: 14px; color: #111; font-weight: 400; background: #fff; box-sizing: border-box; width: 100%;
    }
    .insChamp textarea { height: 90px; padding: 8px 10px; }
    .insChamp input[type=file] { font-size: 13px; }
    .insLarge { grid-column: span 2; }
    body.insPage input, body.insPage select, body.insPage textarea, body.insPage td { font-weight: 400; color: #1d2b2d; }
    body.insPage ::placeholder { color: #6b7275; }
    .insAide { font-size: 12px; color: #4a5052; font-weight: 400; margin: 4px 0 14px; }
    .insLogoBloc { display: flex; align-items: center; gap: 18px; margin-top: 18px; padding-top: 16px; border-top: 1px dashed #dde0d0; }
    .insLogoApercu { width: 140px; height: 70px; border: 1px solid #dde0d0; border-radius: 4px; display: flex; align-items: center; justify-content: center; background: #fafbf6; flex: none; }
    .insLogoApercu img { max-width: 130px; max-height: 60px; display: none; }
    .insLogoApercu span { font-size: 12px; color: #4a5052; }
    .insModules { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
    .insModule { text-transform: none; display: flex; align-items: center; gap: 10px; border: 1px solid #dde0d0; border-radius: 6px; padding: 12px; cursor: pointer; font-size: 14px; margin: 0; }
    .insModule i { color: #6B8E23; font-size: 20px; width: 24px; text-align: center; }
    .insModule input { width: 16px; height: 16px; margin: 0; }
    .insModule:has(input:checked) { border-color: #3E6B2F; background: #EEF0DE; }
    .insCase { text-transform: none; display: flex; gap: 8px; align-items: flex-start; font-size: 14px; margin: 16px 0 6px; }
    .insCase input { margin-top: 3px; width: auto; flex: 0 0 auto; }
    .insRecap { border: 1px solid #dde0d0; border-radius: 6px; margin-bottom: 16px; }
    .insRecapLigne { display: grid; grid-template-columns: 160px 1fr; gap: 12px; padding: 8px 12px; font-size: 14px; }
    .insRecapLigne:nth-child(odd) { background: #EEF0DE; }
    .insRecapLigne span:first-child { color: #2C3E6B; font-weight: 500; }
    .insActions { display: flex; justify-content: space-between; margin-top: 24px; gap: 10px; }
    .insActions #insSuivant, .insActions #insEnvoyer { margin-left: auto; }
    .insBouton { border: 0; border-radius: 20px; padding: 9px 24px; font-size: 14px; font-weight: 500; background: #3E6B2F; color: #fff; cursor: pointer; text-decoration: none; display: inline-block; }
    .insBouton:hover { color: #fff; opacity: .9; }
    .insBouton:disabled { opacity: .5; cursor: default; }
    .insSecondaire { background: #DCE2C2; color: #333; }
    .insSecondaire:hover { color: #333; }
    .insDanger { background: #dd0021; }
    .insErreur, .insErreurEtape { color: #dd0021; font-size: 14px; }
    .insErreur { background: #fdecee; border: 1px solid #f5c2c8; border-radius: 6px; padding: 10px 14px; margin-bottom: 18px; }
    .insErreurEtape { margin-top: 12px; text-align: right; }
    .insSucces { background: #EEF0DE; border: 1px solid #c9d3a8; border-radius: 6px; padding: 10px 14px; margin-bottom: 18px; color: #3E6B2F; font-size: 14px; }
    .insPiege { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
    .insConfirmation { text-align: center; padding: 30px 10px; }
    .insConfirmation i { font-size: 54px; color: #3E6B2F; }
    .insConfirmation h1 { font-size: 24px; color: #2C3E6B; margin: 16px 0 10px; }
    .insConfirmation p { font-size: 15px; color: #1d2b2d; max-width: 560px; margin: 0 auto 12px; }
    /* Administration (liste / fiche des demandes) */
    .insAdmin { width: 94%; max-width: 1240px; margin: 0 auto 40px; padding: 0; box-sizing: border-box; }
    .insAdmin h2 { font-size: 20px; color: #2C3E6B; margin: 0 0 16px; }
    .insFiltres { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
    .insFiltres a { border-radius: 20px; padding: 6px 16px; background: #DCE2C2; color: #333; font-size: 13px; text-decoration: none; }
    .insFiltres a.actif { background: #2C3E6B; color: #fff; }
    .insTable { width: 100%; border-collapse: collapse; background: #fff; font-size: 14px; table-layout: fixed; }
    .insTable th { background: #2C3E6B; color: #fff; font-weight: 500; text-align: left; padding: 9px 10px; }
    .insTable td { padding: 9px 10px; border-bottom: 1px solid #e6e8dc; overflow: hidden; text-overflow: ellipsis; }
    .insTable tr:nth-child(even) td { background: #EEF0DE; }
    .insStatut { display: inline-block; border-radius: 10px; padding: 2px 10px; font-size: 12px; color: #fff !important; background: #d98c00; vertical-align: middle; font-weight: 400; }
    .insStatut.A { background: #3E6B2F; }
    .insStatut.R { background: #dd0021; }
    .insType { display: inline-block; border-radius: 10px; padding: 2px 10px; font-size: 12px; color: #fff !important; background: #2C3E6B; vertical-align: middle; font-weight: 400; }
    .insFiche { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    .insBloc { background: #fff; border: 1px solid #dde0d0; border-radius: 8px; padding: 16px 18px; }
    .insBloc h3 { font-size: 15px; color: #2C3E6B; margin: 0 0 10px; }
    .insBloc .insRecapLigne { grid-template-columns: 150px 1fr; padding: 6px 8px; }
    .insDecision { grid-column: span 2; display: flex; gap: 18px; flex-wrap: wrap; align-items: flex-start; }
    .insDecision form { display: flex; gap: 10px; align-items: flex-start; flex-wrap: wrap; }
    .insDecision textarea { width: 360px; max-width: 100%; height: 38px; border: 1px solid #c9ccbc; border-radius: 4px; padding: 8px 10px; box-sizing: border-box; font-size: 14px; }
    .insLogoFiche { max-width: 220px; max-height: 90px; border: 1px solid #dde0d0; padding: 6px; background: #fafbf6; }
    @media (max-width: 760px) {
        .insCarte { width: auto; margin: 0; border-radius: 0; padding: 20px 16px; }
        .insGrille, .insFiche { grid-template-columns: 1fr; }
        .insLarge, .insDecision { grid-column: auto; }
        .insEtapes > div { font-size: 0; }
        .insEtapes > div span { font-size: 13px; }
        .insTitreBandeau { font-size: 16px; }
        .insRecapLigne { grid-template-columns: 1fr; gap: 2px; }
    }
.insModule .insPicto { font-size: 20px; width: 24px; text-align: center; }
.insModule small { display: block; color: #6b7275; font-size: 11.5px; }
