.boutique-container { max-width: 570px; margin: 46px auto 0 auto; background: var(--card-bg) !important; border-radius: 18px; box-shadow: 0 3px 18px var(--shadow-color) !important; padding: 40px 32px 34px 32px; border: 1px solid var(--card-border) !important; color: var(--text-primary) !important; } h2 { color: var(--primary) !important; font-size: 2.25em; margin-top: 0; margin-bottom: 18px; text-align: center; } .label { font-weight: 600; margin-bottom: 8px; display: block; text-align: left; color: var(--text-primary) !important; } .select-ia, .select-mo, .select-nbscan { width: 100%; padding: 12px; border-radius: 7px; border: 1.5px solid var(--primary) !important; background: #101b2b !important; color: var(--primary) !important; font-size: 1.08em; font-weight: 700; margin-bottom: 18px; appearance: none; } .select-sub-plan { width: 100%; padding: 12px; border-radius: 7px; border: 1.5px solid var(--primary) !important; background: #101b2b !important; color: var(--primary) !important; font-size: 1.08em; font-weight: 700; margin-bottom: 18px; appearance: none; } .select-sub-plan option { background: #101b2b; color: var(--text-primary); } .select-sub-plan:focus { outline: 2px solid var(--primary) !important; } .sub-description { background: var(--card-bg) !important; color: var(--text-primary) !important; padding: 15px 18px 12px 18px; border-radius: 12px; margin-bottom: 8px; font-size: 1.04em; box-shadow: 0 1px 4px var(--shadow-color) !important; border: 1px solid var(--card-border) !important; } .sub-prix { font-size: 1.6em; font-weight: 800; color: var(--primary) !important; text-align: center; margin-bottom: 14px; } .select-ia option, .select-mo option { background: #101b2b; color: var(--text-primary); } .select-ia:focus, .select-mo:focus { outline: 2px solid var(--primary) !important; } .scan-row { display: flex; align-items: center; gap: 13px; margin-bottom: 18px; } .scan-btn { background: linear-gradient(90deg, var(--primary), var(--primary-dark)) !important; color: #fff !important; border: none; border-radius: 9px; padding: 8px 18px; font-size: 1.2em; font-weight: bold; cursor: pointer; transition: background .16s; box-shadow: 0 2px 6px var(--primary)33 !important; } .scan-btn:active { background: var(--primary-dark) !important; } .scan-count { font-size: 1.18em; font-weight: 700; width: 48px; text-align: center; color: var(--text-primary) !important; } .ia-description { background: var(--card-bg) !important; color: var(--text-primary) !important; padding: 15px 18px 12px 18px; border-radius: 12px; margin-bottom: 16px; font-size: 1.04em; box-shadow: 0 1px 4px var(--shadow-color) !important; border: 1px solid var(--card-border) !important; } .prix-bloc { margin: 15px 0 10px 0; text-align: center; } .prix-ligne { font-size: 1.18em; color: var(--text-primary) !important; } .prix-total { font-size: 2.1em; font-weight: 900; color: var(--primary) !important; margin-top: 6px; } .boutique-btn { background: linear-gradient(90deg, var(--primary), var(--primary-dark)) !important; color: #fff !important; border: none; border-radius: 16px; padding: 13px 40px; font-size: 1.19em; font-weight: 700; cursor: pointer; box-shadow: 0 2px 7px var(--primary)33 !important; transition: transform .11s cubic-bezier(.24,.92,.57,1.32); margin-top: 14px; } .boutique-btn:active { transform: scale(0.96); } .contact-link { display: inline-block; color: var(--primary) !important; text-decoration: underline; margin-top: 12px; cursor: pointer; font-weight: 700; } .custom-popup-overlay { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0,0,0,0.53); z-index: 9999; display: flex; align-items: center; justify-content: center; } .custom-popup-content { background: var(--card-bg) !important; padding: 36px 32px 22px 32px; border-radius: 16px; box-shadow: 0 10px 45px var(--shadow-color) !important; max-width: 430px; width: 92vw; position: relative; text-align: center; color: var(--text-primary) !important; border: 1px solid var(--card-border) !important; } .custom-popup-content h3 { color: var(--primary) !important; margin-top: 0; margin-bottom: 16px; font-size: 2em; } .custom-popup-content p { font-size: 1.08em; color: var(--text-muted) !important; } .custom-popup-content button { background: var(--primary) !important; color: #fff !important; border: none; border-radius: 13px; padding: 10px 28px; font-size: 1.1em; cursor: pointer; margin-top: 18px; font-weight: 700; transition: background .16s; box-shadow: 0 2px 8px var(--primary)33 !important; } .custom-popup-content button:active { background: var(--primary-dark) !important; } #scan-count { background: #0f1927 !important; color: #fff !important; border: 1.5px solid var(--primary) !important; font-size: 1.16em; text-align: center; font-weight: bold; opacity: 1 !important; box-shadow: 0 1px 4px var(--primary)22; } #scan-count:read-only { background: #192740 !important; color: #fff !important; } @media (max-width:600px) { .boutique-container { max-width: 99vw; padding: 7vw 2vw; } .custom-popup-content { padding: 18px 5vw; } } .boutique-container, .boutique-container h2, .boutique-container .label, .boutique-container .sub-description, .boutique-container .sub-description p, .boutique-container .ia-description, .boutique-container .ia-description p, .boutique-container .prix-bloc, .boutique-container .prix-ligne, .boutique-container .prix-total, .boutique-container .scan-count { color: var(--text-primary) !important; opacity: 1 !important; filter: none !important; mix-blend-mode: normal !important; } .contact-link { color: var(--primary) !important; } .sub-prix, .prix-total { color: var(--primary) !important; } .section-separator { border: none; height: 1px; background: var(--card-border) !important; opacity: 1 !important; margin: 18px 0; }