body {
  font-family: Arial, sans-serif;
  margin: 2em;
  background: #f5f8fa;
  color: #333;
}
@media (min-width: 769px) {
  body.admin-page {
    max-width: 980px;
    margin: 2rem auto;
  }
}
.admin-back-row {
  margin: .35rem 0 1rem;
}
body.admin-page .admin-back-row .admin-back-button {
  margin-top: 0;
}
body.admin-page .admin-back-row form {
  margin: 0;
}
@media (max-width: 768px) {
  body.admin-page .admin-back-row .admin-back-button,
  body.admin-page .admin-back-row button.admin-back-button {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  body.admin-page .admin-back-row form {
    display: block;
  }
  body.admin-page h1,
  body.admin-page h2,
  body.admin-page h3 {
    text-align: center;
    font-size: 1.34rem;
    line-height: 1.2;
  }
}
h1, h2, h3 { color: #ff8c00; }
fieldset {
  margin-bottom: 1.5em;
  padding: 1em;
  border: 1px solid #ccc;
  border-radius: 8px;
  background: #fff;
}
label { display: block; margin-top: 0.5em; }
input[type="text"], input[type="email"], input[type="tel"] {
  width: 100%;
  padding: 0.5em;
  margin-top: 0.3em;
  border: 1px solid #ccc;
  border-radius: 5px;
}
button, .button {
  display: inline-block;
  padding: 10px 20px;
  background: #ff8c00;
  color: white;
  border: none;
  border-radius: 5px;
  text-decoration: none;
  cursor: pointer;
  margin-top: 1em;
}
button:hover, .button:hover { background: #e67600; }
ul { list-style: none; padding-left: 0; }

/* --- Tableaux génériques (fallback) --- */
table.recap { border-collapse: collapse; table-layout: auto; width: auto; margin: 0; }
table.recap th, table.recap td { border: 1px solid #ccc; padding: .45rem .6rem; text-align: left; white-space: nowrap; }
table.recap thead th { background: #f7f7f7; }
table.recap tbody tr:nth-child(even) { background: #fafafa; }
table.recap tbody tr.day-start td { border-top: 3px solid #333; }
table.recap tbody tr.pm-start td { border-top: 2px solid #777; }
table.recap th.desc, table.recap td.desc { white-space: normal; }
/* Admin sortable tables: auto width based on content */
table.sortable { table-layout: auto; width: auto; margin: .5rem 0 1.5rem; }
table.sortable th, table.sortable td { white-space: nowrap; }

/* --- Accueil (home) : thème orange/jaune --- */
body.home, body.inscription {
  background: #fff8e1; /* jaune très clair */
  color: #3d2a00;
}
@media (min-width: 769px) {
  body.home,
  body.inscription {
    max-width: 980px;
    margin: 2rem auto;
  }
}
body.home h1, body.home h2, body.home h3,
body.inscription h1, body.inscription h2, body.inscription h3 {
  color: #ff8c00; /* orange */
}
/* Bannière */
body.home .hero-banner {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 0 1rem 0;
  border-radius: 8px;
}
/* Bandeau session */
body.home .session-banner {
  margin: .5rem 0 1rem;
  font-weight: 600;
  padding: .4rem .6rem;
  background: #fff3cd; /* jaune pâle */
  border: 1px solid #ffcc80; /* jaune/orange */
  color: #7a4b00;
  display: inline-block;
  border-radius: 6px;
}
/* Tableau récapitulatif */
body.home table.recap { border-collapse: collapse; table-layout: auto; width: auto; margin: 0; border: 1px solid #d39e00; }
body.home table.recap th, body.home table.recap td {
  border: 1px solid #d39e00; /* plus contrasté */
  padding: .45rem .6rem;
  text-align: left;
  white-space: nowrap;
}
body.home table.recap thead th { background: #ffe08a; color: #5a3b00; }
body.home table.recap tbody tr:nth-child(even) { background: #fff9e6; }
body.home table.recap tbody tr.day-start td { border-top: 3px solid #ff9800; }
body.home table.recap tbody tr.pm-start td { border-top: 2px solid #f0ad4e; }
body.home table.recap th.desc, body.home table.recap td.desc { white-space: normal; }
/* Bouton accueil */
/* Boutons orange (accueil + inscription) */
body.home .button, body.inscription .button { background: #ff8c00; }
body.home .button:hover, body.inscription .button:hover { background: #e67600; }
body.home button, body.inscription button { background: #ff8c00; }
body.home button:hover, body.inscription button:hover { background: #e67600; }
/* CTA spacing */
body.home .cta { margin-top: 1rem; }
/* Inscription layout tweaks */
body.inscription fieldset { margin-bottom: 1rem; }
body.inscription fieldset { width: 100%; max-width: 700px; }
/* Inputs plus étroits sur la page d'inscription */
body.inscription input[type="text"],
body.inscription input[type="email"],
body.inscription input[type="tel"] {
  width: 100%;
  max-width: 300px;
}
body.inscription label { display:block; margin-top: .5rem; }
body.inscription h3 { margin: .75rem 0 .25rem; }
body.inscription h4 { margin: .5rem 0 .25rem; }
body.inscription ul { margin: .25rem 0 1rem; }
body.inscription li { margin: .25rem 0; }
body.inscription ul.periode li { display: flex; align-items: center; gap: .5rem; }
body.inscription ul.periode li label { display: flex; align-items: center; flex: 1; margin: 0; }
body.inscription ul.periode li label { gap: .5rem; min-width: 0; }
body.inscription ul.periode li .activity-main { display: flex; align-items: center; gap: .35rem; min-width: 0; flex: 1 1 auto; }
body.inscription ul.periode li .activity-name { font-weight: 600; }
body.inscription ul.periode li .activity-time { margin-left: auto; white-space: nowrap; text-align: right; flex: 0 0 auto; }
body.inscription ul.periode li .voeu-rank { align-self: center; }
body.inscription .repas-midi label { display: flex; align-items: center; margin: 0; }
body.inscription .muted { color:#666; font-size:.9em; }
body.inscription #form-wrap > h1 { text-align: left; }
body.inscription #form-wrap > .top-back { text-align: left; }
@media (min-width: 769px) {
  body.inscription ul.periode li .voeu-rank {
    order: 0;
    width: 2.1em;
    min-width: 2.1em;
    text-align: center;
    margin-left: 0;
    margin-right: .2rem;
  }
  body.inscription ul.periode li label {
    order: 1;
  }
}
/* content wrapper used to sync width with home table */
.content-wrap { display: block; }
/* Deadline info */
body.home .deadline { margin: .25rem 0 1rem; font-weight: 600; }
body.home .deadline.open { color: #7a4b00; }
body.home .deadline.expired { color: #c0392b; }
body.home .home-mobile { display: none; }
body.home .home-desktop { display: block; }

/* --- Inscription mobile --- */
@media (max-width: 768px) {
  body.home {
    margin: .75rem .4rem;
  }
  body.home .session-banner,
  body.home .deadline {
    display: block;
  }
  body.home .hero-banner {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
  body.home table.recap {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.home table.recap th,
  body.home table.recap td {
    white-space: nowrap;
  }
  body.home .button,
  body.home button {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
  }
  body.home .home-desktop { display: none; }
  body.home .home-mobile { display: block; }
  body.home .mobile-day {
    margin: .8rem 0 1rem;
    padding: .55rem .5rem;
    border: 1px solid #f0cf8a;
    border-radius: 10px;
    background: #ffffff;
  }
  body.home .mobile-day h3 {
    margin: .15rem 0 .55rem;
    font-size: 1.02rem;
  }
  body.home .mobile-period-title {
    margin: .45rem 0 .25rem;
    font-size: .96rem;
  }
  body.home ul.mobile-period {
    margin: .2rem 0 .75rem;
    padding: 0;
    list-style: none;
  }
  body.home ul.mobile-period .mobile-activity-item {
    margin: .3rem 0;
    border-radius: 8px;
    overflow: hidden;
  }
  body.home ul.mobile-period.period-am .mobile-activity-item {
    background: #e9f3ff;
    border: 1px solid #9fc5ef;
  }
  body.home ul.mobile-period.period-pm .mobile-activity-item {
    background: #fffdf5;
    border: 1px solid #f0cf8a;
  }
  body.home .mobile-activity-toggle,
  body.home .mobile-activity-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: .58rem .62rem;
    text-align: left;
    border: 0;
    background: transparent;
    color: inherit;
    margin: 0;
    font: inherit;
  }
  body.home .mobile-activity-toggle {
    cursor: pointer;
  }
  body.home .mobile-activity-desc {
    padding: .45rem .62rem .62rem;
    border-top: 1px dashed rgba(0,0,0,.2);
    font-size: .93rem;
  }
  body.home .mobile-activity-name {
    font-weight: 600;
    padding-right: .5rem;
  }
  body.home .mobile-activity-meta {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    margin-left: auto;
    flex: 0 0 auto;
  }
  body.home .mobile-status-icons {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
  }
  body.home .mobile-legend {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    margin: .25rem 0 .8rem;
    padding: .5rem .55rem;
    border: 1px solid #e9d8a6;
    border-radius: 8px;
    background: #fffdf5;
    font-size: .9rem;
  }
  body.home .mobile-legend-item {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
  }
  body.home .mobile-status-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.05rem;
    height: 1.05rem;
    border-radius: 999px;
    font-size: .67rem;
    line-height: 1;
    font-weight: 700;
    border: 1px solid transparent;
  }
  body.home .mobile-status-icon.icon-college {
    color: #1f6f2b;
    background: #e8f6ec;
    border-color: #97d8a5;
  }
  body.home .mobile-status-icon.icon-closed {
    color: #b71c1c;
    background: #fdeaea;
    border-color: #f1b4b4;
  }
  body.home .mobile-status-icon.icon-limited {
    color: #8a6d00;
    background: #fff8dc;
    border-color: #e8cf7a;
  }
  body.home .mobile-activity-time {
    white-space: nowrap;
    font-size: .92rem;
    text-align: right;
  }
  body.home .mobile-tag.tag-college {
    color: #1f6f2b;
    font-weight: 600;
  }
  body.home .mobile-tag.tag-closed {
    color: #b71c1c;
    font-weight: 600;
  }
  body.home .mobile-tag.tag-limited {
    color: #8a6d00;
    font-weight: 600;
  }
  body.inscription {
    margin: .75rem .5rem .75rem .4rem;
  }
  body.inscription h1 {
    font-size: 1.45rem;
    line-height: 1.2;
    margin-bottom: .75rem;
    text-align: center;
  }
  body.inscription h3 {
    font-size: 1.05rem;
    margin-top: 1rem;
  }
  body.inscription h4 {
    font-size: 1rem;
  }
  body.inscription .content-wrap {
    max-width: 100%;
    padding-right: .25rem;
    box-sizing: border-box;
  }
  body.inscription #form-wrap > .top-back {
    text-align: center;
  }
  body.inscription fieldset {
    padding: .8rem;
    border-radius: 10px;
    margin-right: .25rem;
    box-sizing: border-box;
  }
  body.inscription input[type="text"],
  body.inscription input[type="email"],
  body.inscription input[type="tel"],
  body.inscription select {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    font-size: 16px;
  }
  body.inscription button,
  body.inscription .button {
    width: auto;
    min-width: 220px;
    max-width: 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-size: 1rem;
  }
  body.inscription ul.periode {
    margin: .35rem 0 .9rem;
  }
  body.inscription ul.periode li {
    margin: .3rem 0;
    padding: .55rem .6rem;
    border: 1px solid #f0cf8a;
    border-radius: 8px;
    background: #fffdf5;
  }
  body.inscription ul.periode.period-am li {
    border-color: #9fc5ef;
    background: #e9f3ff;
  }
  body.inscription ul.periode.period-pm li {
    border-color: #f0cf8a;
    background: #fffdf5;
  }
  body.inscription ul.periode li.none-li {
    border-color: #f2b8b8;
    background: #fff7f7;
  }
  body.inscription ul.periode li .activity-desc {
    display: none;
  }
  body.inscription table.recap {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  body.inscription .actions-row {
    display: flex;
    flex-direction: column;
    gap: .6rem;
  }
  body.inscription .actions-row form {
    margin: 0;
  }
  body.inscription .repas-midi {
    padding: .55rem .6rem;
    border: 1px solid #c6dfb9;
    border-radius: 8px;
    background: #f7fff2;
  }
}