@charset "utf-8";
/*
 _________________________________________________
|                                                 |
|-- MUG FRANCE - HUB COMMUNAUTAIRE ---------------|
|_________________________________________________|
Mobile-first : l'essentiel du trafic vient de LinkedIn, d'un email ou d'un QR
code scanne pendant un evenement (brief §23). Les grilles passent en colonnes
au-dessus de 768px, jamais l'inverse.
Reprend les tokens de css/frontend.css - aucune couleur en dur hors etats.
*/

/* Re-usable attributes */
[data-display="row"],
[data-display="column"] {display: flex;width:100%;}
[data-display="row"] {flex-direction: row;}
[data-display="column"] {flex-direction: column;}
[data-gap="x-wide"]{gap:56px;}
[data-gap="wide"]{gap:30px;}
[data-gap="regular"]{gap:18px;}
[data-gap="small"]{gap:16px;}
[data-gap="x-small"]{gap:12px;}
[data-gap="x-small"]{gap:12px;}
[data-gap="xx-small"]{gap:8px;}

[data-textsize="xx-small"] {font-size:14px;}
[data-textalign="center"] {text-align:center;}
[data-align="left"] {align-items:start;}
[data-align="center"] {align-items:center;}
[data-align="right"] {align-items:end;}
[data-padding="wide"] {padding:30px;}
[data-padding="regular"] {padding:20px;}

[data-type="button"] {display: inline-block;padding:0 16px;line-height: 48px;vertical-align: middle;border: 0;cursor: pointer;text-decoration: none;font-size: .94rem;font-weight: 600;font-weight: 600;border-radius: 5px;transition: color .2s linear, background-color .2s linear;white-space:nowrap;text-overflow: ellipsis;text-overflow: hidden;}

[data-theme="light"] [data-type="button"][data-style="base"] {background-color: var(--color-bright-gray);color: inherit}
[data-theme="light"] [data-type="button"][data-style="base"]:hover {color:#fff;background-color: var(--color-android-green)}
[data-theme="dark"] [data-type="button"][data-style="base"] {background-color: var(--color-slate-gray);color: inherit}
[data-theme="dark"] [data-type="button"][data-style="base"]:hover {color:#fff;background-color: var(--color-android-green)}

[data-theme="light"] [data-type="button"][data-style="purple"] {color:#fff;background-color: var(--color-royal-purple);}
[data-theme="light"] [data-type="button"][data-style="purple"]:hover {color:#fff;background-color: var(--color-android-green)}
[data-theme="dark"] [data-type="button"][data-style="purple"] {color:#fff;background-color: var(--color-slate-gray);}
[data-theme="dark"] [data-type="button"][data-style="purple"]:hover {color:#fff;background-color: var(--color-android-green)}

app[data-theme="light"] [data-type="button"][data-style="ghost"] {color:var(--color-moutain-gray);border:2px solid var(--color-moutain-gray);}
app[data-theme="light"] [data-type="button"][data-style="ghost"]:hover {color:var(--color-slate-gray);border:2px solid var(--color-slate-gray);}
app[data-theme="dark"] [data-type="button"][data-style="ghost"] {color:#fff;border:2px solid var(--color-slate-gray);}
app[data-theme="dark"] [data-type="button"][data-style="ghost"]:hover {color:#fff;background-color:var(--color-slate-gray);}

[data-type="button"][data-type="button"][data-style="alert"] {color:#fff;background-color: #DD504F}
[data-type="button"][data-style="alert"]:hover {background-color: #b53e3c;}
/*
 _________________________________________________
|                                                 |
|-- ARCHIVE  -------------------------------------|
|_________________________________________________|
*/

.mug-archive-ongoing apps-grid {padding-top:0;}
.mug-archive-ongoing h2 {margin:0 0 16px;}
.mug-archive-ongoing [data-type="button"] {margin-left:auto;}

[data-col="mug-archive"] {}
[data-col="mug-archive"] page-title {width:100%;max-width:760px;margin:0 auto;}
[data-col="mug-archive"] page-title .page-description p a {color: inherit;}
[data-col="mug-archive"] .form-card {max-width:400px;margin-right: auto;}
@media (min-width: 1px) and (max-width: 1023px) {
    [data-col="mug-archive"] .form-card {max-width:100%;}
}


content-layout-cell[data-col="sidebarmug"] {width:380px;}
@media (min-width: 1px) and (max-width: 1023px) {
    content-layout-cell[data-col="sidebarmug"] {width:100%;}
}

.form-card {width:100%;margin:0 auto;border-radius: 12px;padding:2rem;margin-bottom:56px;}
.form-card-fix {max-width:100% !important;margin-bottom:0 !important;}
.form-card-fix h2 {margin-bottom:0 !important;padding-bottom:0 !important;}
app[data-theme=light] .form-card {
    background-color:#fff;
    filter: drop-shadow(0 .5rem 2rem rgba(137, 149, 162, .2));
}
app[data-theme=dark] .form-card {
    background: var(--color-outer-space-alt);
    filter: drop-shadow(0 .5rem 2rem rgba(0, 0, 0, .2));
}
.form-card h2 {
    font-size: 1.5em;
    font-weight: 700;
    text-align: left;
    margin: 0 auto;
    line-height: 130%;
    padding-bottom: 20px;
}
.form-card p {margin:0;padding:0;line-height: 140%;}

.form-inputs input[readonly="readonly"] {opacity:0.4;pointer-events: none;}
.form-inputs input[type="text"], 
.form-inputs input[type="password"], 
.form-inputs input[type="email"], 
.form-inputs input[type="number"], 
.form-inputs input[type="url"], 
.form-inputs input[type="date"], 
.form-inputs input[type="month"], 
.form-inputs input[type="time"], 
.form-inputs input[type="datetime-local"] {padding:0 12px;height:44px;display:block;width:100%;margin:0 auto;border-radius:5px;-webkit-appearance: none;font-family: inherit;transition:border-color .2s linear;color:inherit;}

app[data-theme="light"] .form-inputs input[type="text"], 
app[data-theme="light"] .form-inputs input[type="password"], 
app[data-theme="light"] .form-inputs input[type="email"], 
app[data-theme="light"] .form-inputs input[type="number"], 
app[data-theme="light"] .form-inputs input[type="url"], 
app[data-theme="light"] .form-inputs input[type="date"], 
app[data-theme="light"] .form-inputs input[type="month"], 
app[data-theme="light"] .form-inputs input[type="time"], 
app[data-theme="light"] .form-inputs input[type="datetime-local"] {border:2px solid var(--color-bright-gray);background-color: #FFFFFF} 
app[data-theme="light"] .form-inputs input[type="text"].valid, 
app[data-theme="light"] .form-inputs input[type="password"].valid, 
app[data-theme="light"] .form-inputs input[type="email"].valid, 
app[data-theme="light"] .form-inputs input[type="number"].valid, 
app[data-theme="light"] .form-inputs input[type="url"].valid, 
app[data-theme="light"] .form-inputs input[type="date"].valid, 
app[data-theme="light"] .form-inputs input[type="month"].valid, 
app[data-theme="light"] .form-inputs input[type="time"].valid, 
app[data-theme="light"] .form-inputs input[type="datetime-local"].valid {border:2px solid var(--color-android-green) !important;} 
app[data-theme="light"] .form-inputs input[type="text"].invalid, 
app[data-theme="light"] .form-inputs input[type="password"].invalid, 
app[data-theme="light"] .form-inputs input[type="email"].invalid, 
app[data-theme="light"] .form-inputs input[type="number"].invalid, 
app[data-theme="light"] .form-inputs input[type="url"].invalid, 
app[data-theme="light"] .form-inputs input[type="date"].invalid, 
app[data-theme="light"] .form-inputs input[type="month"].invalid, 
app[data-theme="light"] .form-inputs input[type="time"].invalid, 
app[data-theme="light"] .form-inputs input[type="datetime-local"].invalid {border:2px solid var(--color-error) !important;} 
app[data-theme="light"] .form-inputs ::-webkit-input-placeholder { /* Chrome/Opera/Safari */color:var(--color-halftone-gray);}
app[data-theme="light"] .form-inputs ::-moz-placeholder { /* Firefox 19+ */color:var(--color-halftone-gray);}
app[data-theme="light"] .form-inputs :-ms-input-placeholder { /* IE 10+ */color:var(--color-halftone-gray);}
app[data-theme="light"] .form-inputs :-moz-placeholder { /* Firefox 18- */color:var(--color-halftone-gray);}
app[data-theme="dark"] .form-inputs ::-webkit-input-placeholder { /* Chrome/Opera/Safari */color:var(--color-slate-gray);}
app[data-theme="dark"] .form-inputs ::-moz-placeholder { /* Firefox 19+ */color:var(--color-slate-gray);}
app[data-theme="dark"] .form-inputs :-ms-input-placeholder { /* IE 10+ */color:var(--color-slate-gray);}
app[data-theme="dark"] .form-inputs :-moz-placeholder { /* Firefox 18- */color:var(--color-slate-gray);}
app[data-theme="light"] .form-inputs input[type="text"]:focus, 
app[data-theme="light"] .form-inputs input[type="password"]:focus, 
app[data-theme="light"] .form-inputs input[type="email"]:focus, 
app[data-theme="light"] .form-inputs input[type="number"]:focus, 
app[data-theme="light"] .form-inputs input[type="url"]:focus, 
app[data-theme="light"] .form-inputs input[type="date"]:focus, 
app[data-theme="light"] .form-inputs input[type="month"]:focus, 
app[data-theme="light"] .form-inputs input[type="time"]:focus, 
app[data-theme="light"] .form-inputs input[type="datetime-local"]:focus {border:2px solid var(--color-mosaic-gray);}
app[data-theme="dark"] .form-inputs input[type="text"], 
app[data-theme="dark"] .form-inputs input[type="password"], 
app[data-theme="dark"] .form-inputs input[type="email"], 
app[data-theme="dark"] .form-inputs input[type="number"], 
app[data-theme="dark"] .form-inputs input[type="url"], 
app[data-theme="dark"] .form-inputs input[type="date"], 
app[data-theme="dark"] .form-inputs input[type="month"], 
app[data-theme="dark"] .form-inputs input[type="time"], 
app[data-theme="dark"] .form-inputs input[type="datetime-local"] {border:2px solid var(--color-inner-space);background-color: var(--color-outer-space-alt)} 
app[data-theme="dark"] .form-inputs input[type="text"].valid, 
app[data-theme="dark"] .form-inputs input[type="password"].valid, 
app[data-theme="dark"] .form-inputs input[type="email"].valid, 
app[data-theme="dark"] .form-inputs input[type="number"].valid, 
app[data-theme="dark"] .form-inputs input[type="url"].valid, 
app[data-theme="dark"] .form-inputs input[type="date"].valid, 
app[data-theme="dark"] .form-inputs input[type="month"].valid, 
app[data-theme="dark"] .form-inputs input[type="time"].valid, 
app[data-theme="dark"] .form-inputs input[type="datetime-local"].valid {border:2px solid var(--color-android-green) !important;} 
app[data-theme="dark"] .form-inputs input[type="text"].invalid, 
app[data-theme="dark"] .form-inputs input[type="password"].invalid, 
app[data-theme="dark"] .form-inputs input[type="email"].invalid, 
app[data-theme="dark"] .form-inputs input[type="number"].invalid, 
app[data-theme="dark"] .form-inputs input[type="url"].invalid, 
app[data-theme="dark"] .form-inputs input[type="date"].invalid, 
app[data-theme="dark"] .form-inputs input[type="month"].invalid, 
app[data-theme="dark"] .form-inputs input[type="time"].invalid, 
app[data-theme="dark"] .form-inputs input[type="datetime-local"].invalid {border:2px solid var(--color-error) !important;} 
app[data-theme="dark"] .form-inputs input[type="text"]:focus, 
app[data-theme="dark"] .form-inputs input[type="password"]:focus, 
app[data-theme="dark"] .form-inputs input[type="email"]:focus, 
app[data-theme="dark"] .form-inputs input[type="number"]:focus, 
app[data-theme="dark"] .form-inputs input[type="url"]:focus, 
app[data-theme="dark"] .form-inputs input[type="date"]:focus, 
app[data-theme="dark"] .form-inputs input[type="month"]:focus, 
app[data-theme="dark"] .form-inputs input[type="time"]:focus, 
app[data-theme="dark"] .form-inputs input[type="datetime-local"]:focus {border-color:var(--color-grey-black)}

.form-inputs textarea {resize: vertical;padding:10px 12px;display:block;width:100%;margin:0 auto;border-radius:5px;-webkit-appearance: none;font-family: inherit;transition:border-color .2s linear;color:inherit}
app[data-theme="light"] .form-inputs textarea {border:2px solid var(--color-bright-gray);background-color: #FFFFFF}
app[data-theme="light"] .form-inputs textarea:focus {border:2px solid var(--color-mosaic-gray);}
app[data-theme="dark"] .form-inputs textarea {border:2px solid var(--color-inner-space);background-color: var(--color-outer-space-alt)}
app[data-theme="dark"] .form-inputs textarea:focus {border-color:var(--color-grey-black)}


.form-inputs textarea {resize: vertical;padding:10px 12px;display:block;width:100%;margin:0 auto;border-radius:5px;-webkit-appearance: none;font-family: inherit;transition:border-color .2s linear;color:inherit}
  app[data-theme="light"] .form-inputs textarea {border:2px solid var(--color-bright-gray);background-color: #FFFFFF}
  app[data-theme="light"] .form-inputs textarea:focus {border:2px solid var(--color-mosaic-gray);}
  app[data-theme="dark"] .form-inputs textarea {border:2px solid var(--color-inner-space);background-color: var(--color-outer-space-alt)}
  app[data-theme="dark"] .form-inputs textarea:focus {border-color:var(--color-grey-black)}

.form-inputs select {-webkit-appearance: none;-moz-appearance: none;appearance: none;outline: 0;font: inherit;width: 100%;height: 44px;padding: 0 4em 0 1em;border-radius: 5px;box-shadow: none;cursor: pointer;transition:border-color .2s linear;}
.form-inputs select[size] {height: auto !important;}
.form-inputs select option {color: inherit;}
.form-inputs select:focus {outline: none !important;}
.form-inputs select::-ms-expand {display: none;}
[data-theme="light"] .form-inputs select {color: var(--color-slate-gray);border:2px solid var(--color-bright-gray);background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' width='42' height='42'%3E%3Cdefs%3E%3Cpath fill='%23707E8D' d='m0 240 160 144 160-144v-48H0v48Z' id='a'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' transform='translate(9.95 1.15) scale(.06874)'/%3E%3C/svg%3E") no-repeat right 0.8em center/1.4em, #fff;}
[data-theme="light"] .form-inputs select option {background-color:#FFF;}
[data-theme="light"] .form-inputs select:hover {border-color:var(--color-mosaic-gray);}

[data-theme="dark"] .form-inputs select {border: 2px solid var(--color-inner-space);background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='none' width='42' height='42'%3E%3Cdefs%3E%3Cpath fill='%23FFFFFF' d='m0 240 160 144 160-144v-48H0v48Z' id='a'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' transform='translate(9.95 1.15) scale(.06874)'/%3E%3C/svg%3E") no-repeat right 0.8em center/1.4em, var(--color-outer-space-alt);color: #C1C7CE;}
[data-theme="dark"] .form-inputs select option {background-color:#2D353D;}
[data-theme="dark"] .form-inputs select:hover {border-color:var(--color-grey-black);}

.form-inputs .oto-switch-wrapper { display: flex; flex-direction:row; align-items: top; gap:12px;}
.form-inputs .oto-switch {
    position: relative;
    display: inline-block;
    width: 34px;
    height: 20px;
    flex-shrink:0;
}
.oto-switch-desc {flex-shrink:1;font-size:0.86rem;line-height: 140%;}
.oto-switch-desc a {color:inherit;}
.oto-switch input { display: none; }
.oto-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    transition: .4s;
    border-radius: 20px;
}
.oto-slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 3px;
    bottom: 3px;
    transition: .4s;
    border-radius: 50%;
}
app[data-theme="light"] .form-inputs .oto-slider {background-color:var(--color-halftone-gray);}
app[data-theme="light"] .form-inputs .oto-slider:before {background-color: white;}
app[data-theme="light"] .form-inputs input:checked + .oto-slider { background-color: var(--color-android-green); }

app[data-theme="dark"] .form-inputs .oto-slider {background-color:var(--color-slate-gray);}
app[data-theme="dark"] .form-inputs .oto-slider:before {background-color: white;}
app[data-theme="dark"] .form-inputs input:checked + .oto-slider { background-color: var(--color-android-green); }

input:checked + .oto-slider:before { transform: translateX(14px); }

/*
 _________________________________________________
|                                                 |
|-- MUG ACCOUNT  ---------------------------------|
|_________________________________________________|
*/
[data-col="mug-account"] page-title {width:100%;max-width:760px;margin:0 auto;}
[data-col="mug-account"] section {width:100%;max-width:760px;margin:0 auto;}
[data-col="mug-account"] .form-card {max-width:760px;}
@media (min-width: 1px) and (max-width: 1023px) {
    [data-col="mug-account"] .form-card {max-width:100%;}
}

/*
 _________________________________________________
|                                                 |
|-- MUG SINGLE  ----------------------------------|
|_________________________________________________|
*/
[data-col="mug-single"] h2 {margin:0 0 16px;}
[data-col="mug-single"] page-title {width:100%;max-width:760px;margin:0 auto;text-align:center }
[data-col="mug-single"] page-title .page-description p a {color: inherit;}
[data-col="mug-single"] section-title {display: block;width:100%;max-width:760px;margin:0 auto;text-align:center;}
[data-col="mug-single"] section {width:100%;max-width:760px;margin:0 auto;}
[data-col="mug-single"] section#mug-auth {margin-bottom:50px;}
[data-col="mug-single"] section[data-step="wizard"] {margin-bottom:50px;}
[data-col="mug-single"] .form-card {max-width:400px;margin-right: auto;}
@media (min-width: 1px) and (max-width: 1023px) {
    [data-col="mug-single"] .form-card {max-width:100%;}
}
[data-col="mug-single"] .mug-badge {margin-bottom:20px;}
[data-col="mug-single"] ul.mug-stats {display:inline-flex;padding-top:20px;}

[data-col="mug-single"] .buttons {display:flex;flex-direction: row;justify-content: end;gap:12px;}
[data-col="mug-single"] .buttons button {}

/* Votes */
[data-section="mu-gal"] apps-grid {padding-top:0;}
/*
 _________________________________________________
|                                                 |
|-- AUTH BOX  ------------------------------------|
|_________________________________________________|
*/
.mug-auth-loggued a,
#mug-dto-hint a {color:inherit;}

/*
 _________________________________________________
|                                                 |
|-- MISC  ----------------------------------------|
|_________________________________________________|
*/
@media (min-width: 1px) and (max-width: 1023px) {
    .mug-archive-ongoing[data-display="row"] {flex-direction: column}
}


/*
 _________________________________________________
|                                                 |
|-- GRILLES --------------------------------------|
|_________________________________________________|
*/
ul.mug-grid {display:grid;grid-template-columns:1fr;gap:20px;list-style:none;margin:0 0 30px;padding:0;}
ul.mug-grid > li {}
ul.mug-grid card {background:var(--color-white);border:1px solid var(--color-bright-gray);border-radius:8px;overflow:hidden;transition:box-shadow .2s ease,transform .2s ease;}
ul.mug-grid card:hover {box-shadow:0 .5rem 2rem rgba(137,149,162,.25);transform:translateY(-2px);}
ul.mug-grid card-space {display:flex;flex-direction:row;gap:12px;padding:24px;width:100%;}
ul.mug-grid h2 {font-size:20px;line-height:130%;font-weight:700;margin:0;}
ul.mug-grid h2 a {text-decoration:none;}
ul.mug-grid paragraph {display:block;font-size:14px;line-height:160%;}
ul.mug-grid .cover {max-width:25%;}
ul.mug-grid .cover img {width:100%;height:auto;display:block;}
li.mug-empty {padding:32px;text-align:center;border-radius:8px;}
ul.mug-grid .cover {border-top-left-radius:12px;border-bottom-left-radius:12px;overflow: hidden;transition:all .2s linear;position:relative;display:flex;}
ul.mug-grid .cover a {display:flex;opacity: 0.8;aspect-ratio:1 / 1;}
[data-theme="light"] ul.mug-grid .cover a {background-blend-mode: multiply;background:var(--thumbnail), linear-gradient(90deg, #4D357A, #7650BA) no-repeat center center scroll; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;background-blend-mode:lighten;}
[data-theme="dark"] ul.mug-grid .cover a {background-blend-mode: multiply;background:var(--thumbnail), linear-gradient(90deg, var(--color-outer-space-alt), var(--color-outer-space)) no-repeat center center scroll; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;background-blend-mode:lighten;}
app[data-theme="light"] ul.mug-grid .cover {background-color: #2d1d4b;}
app[data-theme="dark"] ul.mug-grid .cover {}
ul.mug-grid paragraph p {margin:0;}

@media (min-width: 1px) and (max-width: 1023px) {
  ul.mug-grid .cover {display: none}
}
apps-grid ul.mug-grid li {margin-bottom:0 !important;}
/*
@media only screen and (min-width:768px) {
  ul.mug-grid {grid-template-columns:repeat(2,1fr);}
}
@media only screen and (min-width:1200px) {
  ul.mug-grid {grid-template-columns:repeat(3,1fr);}
}
*/
/*
 _________________________________________________
|                                                 |
|-- BADGES DE STATUT -----------------------------|
|_________________________________________________|
*/
.mug-badge {display:inline-block;font-size:11px;font-weight:500;letter-spacing:.04em;padding:8px 12px;border-radius:99px;background:var(--color-ghost-white);color:var(--color-slate-gray);}
.mug-badge[data-mug-status="open"] {background:var(--color-blush-pink);color:var(--color-white);}
.mug-badge[data-mug-status="voting"] {background:var(--color-pale-pink);color:var(--color-blush-pink);}
.mug-badge[data-mug-status="shortlisted"] {background:var(--color-ghost-white);color:var(--color-royal-purple);}
.mug-badge[data-mug-status="workshop_planned"] {background:var(--color-android-green);color:var(--color-vampiro-purple);}
.mug-badge[data-mug-status="closed"],
.mug-badge[data-mug-status="archived"] {background:var(--color-bright-gray);color:var(--color-slate-gray);}

/*
 _________________________________________________
|                                                 |
|-- COMPTEURS ------------------------------------|
|_________________________________________________|
*/
ul.mug-stats {display:flex;flex-wrap:wrap;gap:8px 20px;list-style:none;margin:12px 0 0;padding:0;font-size:13px;}
ul.mug-stats strong {font-weight:700;}
small.mug-deadline {display:block;font-size:12px;}

/*
 _________________________________________________
|                                                 |
|-- FICHE PROPOSITION ----------------------------|
|_________________________________________________|
*/
.mug-idea {padding:30px;}
.mug-idea .mug-idea-inner {display:flex;width:100%;gap:10px;flex-direction: column;}
.mug-idea h2 {text-align: left;margin:0;}
.mug-idea .paragraph p {text-align: left;margin:0;}
.mug-idea .paragraph-quote p {text-align: left;margin:0;font-size:1.16rem;font-style: italic}

dl.mug-idea-facts {display:flex;flex-direction: column;gap:6px;line-height:150%;padding-top:20px;margin-top:16px;font-size:.9rem;}
dl.mug-idea-facts dt {font-weight:700;}
dl.mug-idea-facts dd {margin:0;padding-left:12px;}
[data-theme="light"] dl.mug-idea-facts {border-top:2px dashed var(--color-bright-gray);}
[data-theme="dark"] dl.mug-idea-facts {border-top:2px dashed var(--color-outer-space-alt);}

.mug-idea-vote {margin-top:auto;padding-top:14px;}
button.mug-vote-button {display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background .15s ease,color .15s ease;}
button.mug-vote-button.is-voted {background:var(--color-royal-purple);color:var(--color-white);}
button.mug-vote-button:disabled {opacity:.55;cursor:not-allowed;}
button.mug-vote-button .mug-vote-count {display:inline-block;min-width:26px;padding:2px 8px;border-radius:99px;font-variant-numeric:tabular-nums;}

[data-theme="light"] button.mug-vote-button {border:2px solid var(--color-royal-purple);background:var(--color-royal-purple);color:var(--color-white);}
[data-theme="light"] button.mug-vote-button:hover:not(:disabled) {border:2px solid var(--color-regalia-purple);background:var(--color-regalia-purple);color:var(--color-white);}
[data-theme="light"] button.mug-vote-button .mug-vote-count {background:rgba(0,0,0,0.4);color:var(--color-white);}
[data-theme="light"] button.mug-vote-button.is-voted .mug-vote-count {background:rgba(255,255,255,.22);color:#fff;}

[data-theme="dark"] button.mug-vote-button {border:2px solid var(--color-white);background:var(--color-white);color:var(--color-onyx-gray);}
[data-theme="dark"] button.mug-vote-button:hover:not(:disabled) {border:2px solid var(--color-mosaic-gray);background:var(--color-mosaic-gray);color:var(--color-onyx-gray);}
[data-theme="dark"] button.mug-vote-button .mug-vote-count {background:rgba(0,0,0,0.4);color:var(--color-white);}
[data-theme="dark"] button.mug-vote-button.is-voted .mug-vote-count {background:rgba(0,0,0,0.4);color:#fff;}

/*
 _________________________________________________
|                                                 |
|-- BARRE DE TRI / FILTRE ------------------------|
|_________________________________________________|
*/
.mug-gallery-toolbar {display:flex;flex-wrap:wrap;gap:12px;margin:0 0 20px;}
buttons.mug-gallery-more {display:block;text-align:center;margin-top:10px;}

/*
 _________________________________________________
|                                                 |
|-- WIZARD ---------------------------------------|
|_________________________________________________|
*/
box.mug-wizard {display:block;}

.mug-wizard-progress {height:6px;border-radius:99px;overflow:hidden;margin:0 0 4px;}
.mug-wizard-progress span {display:block;height:100%;border-radius:99px;transition:width .25s ease;}
[data-theme="light"] .mug-wizard-progress {background:var(--color-bright-gray);}
[data-theme="light"] .mug-wizard-progress span {background: linear-gradient( to right, #4D357A, #E85278);}
[data-theme="dark"] .mug-wizard-progress {background:var(--color-outer-space-alt)}
[data-theme="dark"] .mug-wizard-progress span {background: linear-gradient( to right, var(--color-slate-gray), var(--color-moutain-gray));}

ul.mug-choices {display:grid;grid-template-columns:1fr;gap:8px;list-style:none;margin:8px 0 0;padding:0;}
ul.mug-choices label {display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:6px;cursor:pointer;font-size:14px;line-height:140%;transition:border-color .15s ease,background .15s ease;}
ul.mug-choices .dot {margin-top:2px;flex:0 0 auto;width:16px;height:16px;border-radius:8px;}
ul.mug-choices input {
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}
ul.mug-choices label:has(input:focus-visible) {outline:2px solid var(--color-android-green);outline-offset:2px;}
ul.mug-choices input:checked ~ span {font-weight:600;}
ul.mug-choices-stack {grid-template-columns:1fr;}

[data-theme="light"] ul.mug-choices label {border: 2px solid var(--color-bright-gray);background-color: #ffffff;color: var(--color-slate-gray);transition:all .2s linear;}
[data-theme="light"] ul.mug-choices label:hover {border: 2px solid var(--color-mosaic-gray);}
[data-theme="light"] ul.mug-choices .dot {background-color: var(--color-bright-gray);}
[data-theme="light"] ul.mug-choices input:checked + .dot {background-color:var(--color-android-green);border:3px solid #fff;}
[data-theme="light"] ul.mug-choices label:has(input:checked) {border: 2px solid var(--color-android-green);background-color:var(--color-android-green);color:#fff;}

[data-theme="dark"] ul.mug-choices label {background: var(--color-outer-space-alt);border: 2px solid var(--color-inner-space);color: var(--color-ghost-white);}
[data-theme="dark"] ul.mug-choices label:hover {border: 2px solid var(--color-grey-black);}
[data-theme="dark"] ul.mug-choices .dot {background-color: var(--color-inner-space);}
[data-theme="dark"] ul.mug-choices input:checked + .dot {background-color:#fff;border:3px solid var(--color-inner-space);}
[data-theme="dark"] ul.mug-choices label:has(input:checked) {border: 2px solid #fff;color:var(--color-inner-space);background-color:#fff;}

@media only screen and (min-width:600px) {
  ul.mug-choices {grid-template-columns:repeat(2,1fr);}
  ul.mug-choices-stack {grid-template-columns:1fr;}
}
/*
ul.mug-choices label {flex:1 0 calc(25% - 50px);height: 240px;position: relative;}
ul.mug-choices label input[type="checkbox"]{-webkit-appearance: none;position: relative;height: 100%;width: 100%;border-radius: 10px;cursor: pointer;box-shadow: 15px 15px 25px rgba(2,28,53,0.05);}
ul.mug-choices label input[type="checkbox"]:after{position: absolute;font-family: "Font Awesome 6 Pro";font-weight:600;content: "\f111";font-size: 22px;top: 10px;left: 10px;color: #e2e6f3;transition: all .2s linear;}
ul.mug-choices label input[type="checkbox"]:hover {transition: all .2s linear;}
ul.mug-choices label input[type="checkbox"]:checked:after{font-weight: 900;content: "\f058";color: #bada55;}
ul.mug-choices label {display: flex;flex-direction: column;align-items: center;justify-content: center;gap: 20px;height: 100%;width: 100%;position: absolute;bottom: 0;cursor: pointer;text-align: left}
ul.mug-choices label svg {width:60px;}
ul.mug-choices label input[type="checkbox"]:checked + label .fas{animation: grow 0.5s;}
ul.mug-choices label h6{font-size: 15px;font-weight: 500;line-height: 150%;margin:0 30px 0 36px;text-align: center;}
*/
/*
 _________________________________________________
|                                                 |
|-- SONDAGES -------------------------------------|
|_________________________________________________|
*/
ul.mug-poll-options {list-style:none;margin:8px 0 0;padding:0;display:grid;gap:10px;}
ul.mug-poll-options li {display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;padding:12px 14px;border:1px solid var(--color-bright-gray);border-radius:6px;}
ul.mug-poll-options li.is-chosen {border-color:var(--color-royal-purple);background:var(--color-ghost-white);}
ul.mug-poll-options label {display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;}
ul.mug-poll-options input:disabled + .mug-poll-label {opacity:.7;}
.mug-poll-label small {display:block;font-size:12px;color:var(--color-slate-gray);}
.mug-poll-bar {grid-column:1 / -1;height:6px;background:var(--color-bright-gray);border-radius:99px;overflow:hidden;}
.mug-poll-bar span {display:block;height:100%;background:var(--color-royal-purple);transition:width .3s ease;}
.mug-poll-score {font-size:12px;font-variant-numeric:tabular-nums;color:var(--color-slate-gray);white-space:nowrap;}

/*
 _________________________________________________
|                                                 |
|-- EVENEMENT CONFIRME ---------------------------|
|_________________________________________________|
*/
box.mug-event {border-left:4px solid var(--color-android-green);}

/*
 _________________________________________________
|                                                 |
|-- COMMENTAIRES ---------------------------------|
|_________________________________________________|
*/
.mug-idea-actions {display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:auto;padding-top:14px;}
button.mug-comments-toggle {display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:border-color .15s ease,color .15s ease;}
button.mug-comments-toggle .mug-comments-count {display:inline-block;min-width:26px;padding:2px 8px;border-radius:99px;font-variant-numeric:tabular-nums;}

[data-theme="light"] button.mug-comments-toggle {border:2px solid var(--color-mosaic-gray);background:var(--color-white);color:var(--color-slate-gray);}
[data-theme="light"] button.mug-comments-toggle:hover {border-color:var(--color-moutain-gray);}
[data-theme="light"] button.mug-comments-toggle .mug-comments-count {background:rgba(0,0,0,0.4);color:var(--color-white);}

[data-theme="dark"] button.mug-comments-toggle {border:2px solid var(--color-slate-gray);background:var(--color-slate-gray);color:#fff;}
[data-theme="dark"] button.mug-comments-toggle:hover {border:2px solid var(--color-moutain-gray);background:var(--color-moutain-gray);}
[data-theme="dark"] button.mug-comments-toggle .mug-comments-count {background:rgba(0,0,0,0.4);color:#fff;}

.mug-comments {margin-top:14px;padding-top:14px;}
[data-theme="light"] .mug-comments {border-top:2px dashed var(--color-bright-gray);}
[data-theme="dark"] .mug-comments {border-top:2px dashed var(--color-outer-space);}
ul.mug-comments-list {list-style:none;margin:0;padding:0;display:flex !important;gap:12px;flex-direction: column}
ul.mug-comments-list li {font-size:13px;line-height:160%;padding:16px;}
ul.mug-comments-list strong {}
ul.mug-comments-list p {margin:2px 0 0;}
ul.mug-comments-list li.mug-empty {padding:12px;font-size:13px;background-color: transparent }

form.mug-comment-form {margin-top:12px;display:grid;gap:8px;}
form.mug-comment-form textarea {width:100%;padding:10px 12px;border:1px solid var(--color-mosaic-gray);border-radius:6px;font-size:13px;font-family:inherit;line-height:150%;resize:vertical;}
form.mug-comment-form textarea:focus {border-color:var(--color-royal-purple);outline:none;}

small.mug-step-help {display:block;margin:-4px 0 8px;font-size:12px;color:var(--color-slate-gray);}

/*
 _________________________________________________
|                                                 |
|-- ACCESSIBILITE --------------------------------|
|_________________________________________________|
Classe dediee au basculement JS (etapes du wizard, boutons, indices).
On NE reutilise PAS .visually-hidden du theme : elle masque en clip, donc
l'element reste focalisable au clavier et annonce par les lecteurs d'ecran.
Une etape de wizard masquee doit sortir du flux, sinon on tabule dans des
champs invisibles. .visually-hidden reste reservee aux libelles reellement
destines aux seuls lecteurs d'ecran.
*/
.mug-hidden {display:none !important;}

@media (prefers-reduced-motion:reduce) {
  ul.mug-grid card,
  .mug-wizard-progress span,
  .mug-poll-bar span,
  button.mug-vote-button {transition:none;}
  
}