/* Bibliothèque (06/11/2026) : bloc « Où mettre tes efforts » + bulle de survol des blocs de matière. Les blocs eux-mêmes gardent le décor du thème. */
.lib-top { display: grid; grid-template-columns: minmax(230px, 320px) minmax(0, 1fr); gap: 1rem; align-items: start; margin: .8rem 0 1.2rem; padding: .9rem; border-radius: 16px;
  background: rgba(255, 255, 255, .96); border: 1px solid #dfe4ea; box-shadow: 0 2px 12px rgba(0, 0, 0, .08); }
.lib-top-side { display: flex; flex-direction: column; gap: .45rem; min-width: 0; }
.lib-top-h { margin: 0; font-size: 1.25rem; }
.lib-global { display: grid; grid-template-columns: auto 1fr; align-items: baseline; column-gap: .5rem; row-gap: .3rem; }
.lib-global-n { font-size: 1.7rem; font-weight: 800; }
.lib-global .lib-bar { grid-column: 1 / -1; }
.lib-prio { display: flex; align-items: center; gap: .6rem; text-align: left; padding: .5rem .7rem; border-radius: 12px; background: #fff; border: 1px solid #dfe4ea; border-left: 6px solid var(--c, #7c8794); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.lib-prio:hover, .lib-prio:focus-visible { transform: translateX(4px); box-shadow: 0 4px 12px rgba(0, 0, 0, .12); }
.lib-prio-n { flex: none; width: 1.6rem; height: 1.6rem; border-radius: 50%; display: grid; place-items: center; background: var(--c, #7c8794); color: #fff; font-weight: 800; }
.lib-prio-t { display: flex; flex-direction: column; min-width: 0; }
.lib-top-note { margin: .2rem 0 0; opacity: .85; }
.lib-emo { font-size: 1.6rem; line-height: 1; }
.lib-bar { display: block; width: 100%; height: .45rem; border-radius: 999px; background: #e6eaf0; overflow: hidden; }
.lib-bar > span { display: block; height: 100%; width: 0; border-radius: 999px; background: #16a34a; transition: width .6s ease; }
.lib-bar.big { height: .7rem; }

/* mise en avant d'un bloc de matière (survol du camembert, d'une priorité ou du bloc) */
details.subject { transition: opacity .2s, filter .2s, box-shadow .2s, transform .2s; }
details.subject.lib-dim { opacity: .4; filter: grayscale(.7); }
details.subject.lib-hl { box-shadow: 0 0 0 3px var(--accent, #2a78d6), 0 8px 20px rgba(0, 0, 0, .18); transform: translateX(4px); }

/* bulle de survol */
.lib-tip { position: fixed; z-index: 9000; width: 300px; max-width: calc(100vw - 16px); display: flex; flex-direction: column; gap: .5rem; padding: .8rem; border-radius: 16px;
  background: #fff; color: #1d2433; border: 1px solid #dfe4ea; box-shadow: 0 14px 34px rgba(0, 0, 0, .28); animation: lib-tip-in .16s ease; font-family: system-ui, sans-serif; }
@keyframes lib-tip-in { from { opacity: 0; transform: translateY(4px) scale(.98); } }
.lib-tip-head { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.lib-tip-head strong { font-size: 1.02rem; flex: 1; }
.lib-tip-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .3rem; }
.lib-tip-stat { display: flex; flex-direction: column; align-items: center; padding: .35rem .2rem; border-radius: 10px; background: #f3f5f8; font-size: .72rem; text-align: center; border-top: 4px solid #9aa5b4; }
.lib-tip-stat.done { border-top-color: #16a34a; } .lib-tip-stat.start { border-top-color: #e08a00; } .lib-tip-stat.due { border-top-color: #d93030; }
.lib-tip-n { font-size: 1.25rem; font-weight: 800; line-height: 1.1; }
.lib-tip .p3-box { box-shadow: none; padding: 0; background: transparent; }
.lib-tip .p3-cap { min-height: 0; }
.lib-tip-hint, .lib-tip-ok { margin: 0; opacity: .8; }
.lib-dots { display: flex; flex-wrap: wrap; gap: 3px; }
.lib-dot { display: inline-block; width: .62rem; height: .62rem; border-radius: 50%; flex: none; border: 2px solid #9aa5b4; background: #fff; }
.lib-dot.s-start { border-color: #e08a00; background: linear-gradient(90deg, #e08a00 50%, #fff 50%); }
.lib-dot.s-done { border-color: #16a34a; background: #16a34a; }
.lib-dot.due { box-shadow: 0 0 0 2px #fff, 0 0 0 3.5px #d93030; }
.lib-tag { font-size: .72rem; font-weight: 700; padding: .08rem .5rem; border-radius: 999px; }
.lib-tag.exam { background: #fde2e2; color: #8a1c1c; }

:root:root .lib-top :is(h2, p, span, strong, div, button):not(.lib-prio-n):not(.lib-tag), :root:root .lib-tip :is(p, span, strong, div):not(.lib-tag):not(.lib-dot) { color: #1d2433 !important; -webkit-text-fill-color: #1d2433 !important; -webkit-text-stroke: 0 !important; text-shadow: none !important; }
:root:root .lib-prio-n { color: #fff !important; -webkit-text-fill-color: #fff !important; }
:root:root .lib-top a { color: #1f5f8b !important; -webkit-text-fill-color: #1f5f8b !important; }
:root:root .lib-tag.exam { color: #8a1c1c !important; -webkit-text-fill-color: #8a1c1c !important; }
@media (max-width: 760px) { .lib-top { grid-template-columns: minmax(0, 1fr); } .lib-top .p3-box { max-width: 360px; width: 100%; justify-self: center; } }

/* Reflet jaune toutes les 5 s : matières et chapitres au programme d'aujourd'hui (Mon programme) */
details.subject.lib-sweep > summary, .chap.lib-sweep-row { position: relative; overflow: hidden; }
.lib-sweep-fx { position: absolute; inset: 0; pointer-events: none; z-index: 2; transform: translateX(-100%);
  background: linear-gradient(105deg, transparent 30%, rgba(255, 221, 51, .18) 42%, rgba(255, 236, 120, .75) 50%, rgba(255, 221, 51, .18) 58%, transparent 70%); animation: lib-sweep 5s ease-in-out infinite; }
@keyframes lib-sweep { 0% { transform: translateX(-100%); } 26%, 100% { transform: translateX(100%); } }
details.subject.lib-sweep { box-shadow: 0 0 0 2px rgba(255, 210, 40, .85); }
.lib-today-tag { background: #ffe066 !important; color: #5a4300 !important; -webkit-text-fill-color: #5a4300 !important; -webkit-text-stroke: 0 !important; text-shadow: none !important; }
@media (prefers-reduced-motion: reduce) { .lib-sweep-fx { animation: none; display: none; } }

/* Double reflet : les plus importants du jour (gros coefficient, examen proche) */
.lib-sweep-fx2 { animation-delay: .38s; }
details.subject.lib-sweep2 { box-shadow: 0 0 0 3px rgba(255, 200, 0, 1), 0 0 18px rgba(255, 210, 40, .55); }
.lib-today-tag.top { background: #ffc800 !important; box-shadow: 0 0 0 2px #fff3b0; }
/* Fini : cadre blanc + coche blanche (à la place du reflet) */
details.subject.lib-won { box-shadow: inset 0 0 0 3px #fff, 0 0 0 1px rgba(255, 255, 255, .5); }
.chap.lib-won { box-shadow: inset 0 0 0 2px #fff; border-radius: 10px; }
details.subject.lib-won > summary .joy-check { margin-left: .2rem; }
.chap.lib-won .lib-won-check { width: 1.45rem; height: 1.45rem; }
.lib-won-tag { background: #fff !important; color: #116b32 !important; -webkit-text-fill-color: #116b32 !important; -webkit-text-stroke: 0 !important; text-shadow: none !important; }
details.subject.lib-won-new, .chap.lib-won-new { animation: lib-won-in 1.4s ease-out both; }
@keyframes lib-won-in { 0% { box-shadow: inset 0 0 0 0 #fff, 0 0 0 0 rgba(255, 255, 255, 0); } 40% { box-shadow: inset 0 0 0 5px #fff, 0 0 30px 8px rgba(255, 255, 255, .8); } 100% { box-shadow: inset 0 0 0 3px #fff, 0 0 0 1px rgba(255, 255, 255, .5); } }
@media (prefers-reduced-motion: reduce) { details.subject.lib-won-new, .chap.lib-won-new { animation: none; } }
details.subject.lib-won > summary .joy-check { align-self: center; }
