/* style.css - Palette: Rose #ee1867 principal, accents #ff0442, jaune #fff300 highlights ; fond noir */
body { background: #000; color: #fff; font-family: 'Segoe UI', sans-serif; margin: 0; padding: 20px; }
.form-central { max-width: 600px; margin: 0 auto; text-align: center; }
h1 { color: #ee1867; }
input, button { width: 100%; padding: 12px; margin: 10px 0; border: none; border-radius: 8px; font-size: 16px; }
input { background: #333; color: #fff; }
button { background: #ee1867; color: #fff; cursor: pointer; transition: background 0.3s; }
button:hover { background: #ff0442; }
button:disabled { background: #666; cursor: not-allowed; opacity: 0.6; }
.cancel-btn { background: #ff0442 !important; width: auto; padding: 10px 20px; margin: 0 auto; display: block; }
.cancel-btn:hover { background: #ee1867 !important; }
.download-btn { background: #ee1867 !important; color: #fff !important; padding: 15px 30px !important; font-size: 18px !important; font-weight: bold !important; border: none !important; border-radius: 8px !important; text-decoration: none !important; display: inline-block !important; margin: 10px 0 !important; transition: background 0.3s !important; }
.download-btn:hover { background: #ff0442 !important; color: #fff !important; }
.thumbnail { width: 200px; height: 112px; margin: 5px; border-radius: 8px; border: 1px solid #ee1867; }
#tools-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 20px 0; }
.tool-btn { background: #333; color: #fff; padding: 10px 20px; border: 1px solid #ee1867; border-radius: 5px; cursor: pointer; }
.tool-btn:hover:not(:disabled) { background: #ee1867; }
.bar { background: #333; height: 20px; border-radius: 10px; overflow: hidden; margin: 10px 0; }
#progress-fill { background: linear-gradient(to right, #fff300, #ee1867); height: 100%; width: 0%; transition: width 0.3s; }
.logs-panel { background: #111; height: 400px; overflow-y: auto; padding: 10px; border-radius: 5px; font-size: 12px; margin: 10px 0; }
.logs-panel a { color: #fff300 !important; }
.logs-panel img { max-width: 100%; height: auto; }
#logout { background: #ff0442; margin-top: 20px; }
#input-section input { width: calc(100% - 24px); margin-bottom: 10px; }
#tool-submit { background: #ee1867; }
#tool-submit:hover { background: #ff0442; }
/* AJOUT: Styles pour toggle boutons et drop zone */
.toggle-container { display: flex; justify-content: center; gap: 10px; margin-bottom: 10px; }
.toggle-btn { background: #333; color: #fff; padding: 8px 20px; border: 1px solid #ee1867; border-radius: 5px; cursor: pointer; transition: background 0.3s; }
.toggle-btn.active { background: #ee1867; color: #fff; }
.toggle-btn:hover:not(.active) { background: #ff0442; }
.drop-zone { border: 2px dashed transparent; padding: 20px; border-radius: 8px; transition: border 0.3s; text-align: center; }
.drop-zone::before { content: 'Drop fichier vidéo ici (si mode Fichier)'; color: #666; display: block; margin-bottom: 10px; } /* Label drop */
#input-section input[type="file"] { background: #333; color: #fff; cursor: pointer; } /* Style file input */