/* L::eS shared form component system — single source of truth.
   Add .les-form to any customer-facing form. Variants share the same
   dark fields, gold focus, privacy control and glass CTA. */
.les-form{--les-form-bg:#252930;--les-form-border:#555b65;--les-form-fg:#fff;--les-form-muted:#c5c7cb}
.les-form :is(input:not([type=hidden]):not([type=checkbox]),select,textarea){box-sizing:border-box;width:100%;min-width:0;border:1px solid var(--les-form-border)!important;border-radius:9px!important;background-color:var(--les-form-bg)!important;color:var(--les-form-fg)!important;padding:14px 15px!important;font:400 16px/1.55 Arial,Helvetica,sans-serif!important;outline:0;box-shadow:none;transition:border-color .2s,box-shadow .2s}
.les-form :is(input,select,textarea):focus-visible{border-color:#c7a65d!important;outline:none!important;box-shadow:0 0 0 3px rgba(184,155,77,.2)!important}
.les-form :is(input,textarea)::placeholder{color:#a3a7ae!important;opacity:1}
.les-form select{appearance:none;-webkit-appearance:none;padding-right:44px!important;background-image:linear-gradient(45deg,transparent 50%,#c3c5c8 50%),linear-gradient(135deg,#c3c5c8 50%,transparent 50%)!important;background-position:calc(100% - 21px) 50%,calc(100% - 16px) 50%!important;background-size:5px 5px!important;background-repeat:no-repeat!important}
.les-form select option{background:#252930;color:#fff}
.les-form :is(.field label,.contact-form label){font-size:13px;color:#e4e5e6!important;font-weight:600}
.les-form :is(.checkline,.contact-privacy){font-size:13px;line-height:1.7;color:#c5c7cb!important}
.les-form :is(.checkline,.contact-privacy) input[type=checkbox]{appearance:auto!important;-webkit-appearance:checkbox!important;accent-color:#b89b4d!important;flex:0 0 auto!important;width:18px!important;height:18px!important;background:transparent!important;box-shadow:none!important;margin:4px 0 0}
.les-form :is(.checkline,.contact-privacy) input[type=checkbox]::after{content:none!important}
.les-form :is(.checkline,.contact-privacy) a{color:#e0c483!important;text-decoration:none!important}
.les-form :is(.contact-button,.les-form-action){display:inline-flex!important;align-items:center;justify-content:center;min-height:54px;padding:16px 27px!important;border:1px solid rgba(184,155,77,.64)!important;border-radius:14px!important;background:rgba(51,55,63,.3)!important;color:#fff!important;font:700 14px/1.5 Arial,Helvetica,sans-serif!important;text-decoration:none!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 12px 28px rgba(0,0,0,.16)!important;backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);transition:background .2s,transform .2s}
.les-form :is(.contact-button,.les-form-action):hover{background:rgba(74,78,86,.4)!important;border-color:#d3b975!important;transform:translateY(-2px)}
.les-form .les-form-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}
.les-form .les-form-actions .les-form-action{width:100%!important;max-width:100%!important;margin:0!important}
@media(max-width:700px){.les-form .les-form-actions{grid-template-columns:minmax(0,1fr)}.les-form .les-form-actions .les-form-action{width:100%!important}.les-form .contact-button{width:100%}}
/* ESET assessment panel uses the same dark corporate form treatment as Mainpage. */
#content .form-card.les-form-panel{background:#191c21!important;border:1px solid rgba(184,155,77,.34)!important;color:#fff!important}
#content .les-form-panel :is(h2,h3){color:#fff!important}
#content .les-form-panel :is(.form-intro p,.form-section>p){color:#bfc4ca!important}
#content .les-form-panel .fit-box{background:#252930!important;border:1px solid #555b65!important}
#content .les-form-panel .fit-box p{color:#c5c7cb!important}
#content .les-form-panel .form-section{border-top-color:#42464d!important}
#content .les-form-panel .field small{color:#aeb4bc!important}
#content .les-form-panel .les-form-actions .les-form-action{background:rgba(51,55,63,.3)!important;color:#fff!important;border-color:rgba(184,155,77,.64)!important}

/* Shared form layout: align to the mainpage's global .container gutter.
   Do not add nested card padding to form columns. */
.les-form-section{background:#191c21;color:#fff}
.les-form-section>.container{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.les-form-section .les-form-panel{box-sizing:border-box;width:100%;max-width:none;margin:0;padding:0;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.les-form-section .les-form-panel .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.les-form-section .les-form-panel .form-section{margin-top:36px;padding-top:36px;border-top:1px solid #42464d}
.les-form-section .les-form-panel .form-section:first-of-type{border-top:0}
.les-form-section .les-form-panel .field{min-width:0}
.les-form-section .les-form-panel .field.full{grid-column:1/-1}
.les-form-section .les-form-panel .field input,
.les-form-section .les-form-panel .field select,
.les-form-section .les-form-panel .field textarea{max-width:100%}
@media(max-width:700px){
 .les-form-section .les-form-panel .form-grid{grid-template-columns:minmax(0,1fr);gap:20px}
 .les-form-section .les-form-panel .field.full{grid-column:1}
 .les-form-section .les-form-panel{padding:0}
}

/* Shared mobile form sizing: native date/month inputs must not escape their grid cell.
   Keep native iOS date picker behaviour while constraining intrinsic width. */
.les-form,
.les-form :is(.field,.contact-form-row,.form-grid),
.les-form-section .les-form-panel,
.les-form-section .les-form-panel .form-grid > *{min-width:0;max-width:100%;box-sizing:border-box}
.les-form input[type="month"],
.les-form input[type="date"],
.les-form input[type="datetime-local"],
.les-form input[type="time"],
.les-form input[type="number"]{
 display:block!important;width:100%!important;min-width:0!important;
 max-width:100%!important;box-sizing:border-box!important;
 overflow:hidden;font-size:16px!important;
}
.les-form input[type="month"]::-webkit-datetime-edit,
.les-form input[type="date"]::-webkit-datetime-edit,
.les-form input[type="datetime-local"]::-webkit-datetime-edit{min-width:0;max-width:100%;overflow:hidden}

/* Reusable month/year picker — avoids native iOS month input intrinsic-width overflow. */
.les-form .les-month-year{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:12px;width:100%;max-width:100%;min-width:0}
.les-form .les-month-year select{box-sizing:border-box;display:block;width:100%!important;min-width:0!important;max-width:100%!important}
@media(max-width:380px){.les-form .les-month-year{grid-template-columns:minmax(0,1fr);gap:10px}}

/* Reusable two-column scroll wheels for month/year selection. */
.les-form .les-date-wheels{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:12px;max-width:100%;min-width:0}
.les-form .les-date-wheels>div{min-width:0}
.les-form .les-wheel-title{display:block;color:#c5c7cb;font-size:12px;letter-spacing:.06em;margin:0 0 8px}
.les-form .les-date-wheel{position:relative;box-sizing:border-box;width:100%;height:220px;overflow-y:auto;overscroll-behavior:contain;scroll-snap-type:y mandatory;border:1px solid #555b65;border-radius:10px;background:#252930;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.les-form .les-date-wheel::-webkit-scrollbar{display:none}
.les-form .les-date-wheel::before,.les-form .les-date-wheel::after{content:"";position:sticky;left:0;right:0;height:0;display:block;pointer-events:none}
.les-form .les-wheel-spacer{height:88px;flex:0 0 88px}
.les-form .les-wheel-option{box-sizing:border-box;display:flex;align-items:center;justify-content:center;width:100%;height:44px;min-height:44px;padding:0 5px;border:0;border-radius:0;background:transparent;color:#a9adb4;font:400 15px/1.3 Arial,Helvetica,sans-serif;text-align:center;scroll-snap-align:center;cursor:pointer}
.les-form .les-wheel-option.is-selected{background:rgba(184,155,77,.14);color:#fff;font-weight:700;box-shadow:inset 0 1px 0 rgba(184,155,77,.4),inset 0 -1px 0 rgba(184,155,77,.4)}
.les-form .les-date-wheel:focus-visible{outline:2px solid #b89b4d;outline-offset:3px}
.les-form .les-wheel-status{display:block;margin-top:8px;color:#bbc0c6;font-size:12px}

/* L::eS date wheels: refined, restrained and compatible with shared form geometry. */
.les-form .les-date-wheels{gap:14px;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.les-form .les-wheel-title{font-size:13px;font-weight:600;color:#c9cbd0;margin:0 0 10px}
.les-form .les-date-wheel{height:220px;border-radius:12px;border:1px solid #555b65;background:#252930;box-shadow:inset 0 4px 15px rgba(0,0,0,.08);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.08) 19%,#000 43%,#000 57%,rgba(0,0,0,.08) 81%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.08) 19%,#000 43%,#000 57%,rgba(0,0,0,.08) 81%,transparent 100%)}
.les-form .les-wheel-option{border:0!important;border-radius:0!important;background:transparent!important;color:#a6aab2!important;font-weight:400!important;box-shadow:none!important;transition:color .15s,background .15s}
.les-form .les-wheel-option.is-selected{background:rgba(184,155,77,.095)!important;color:#f5f2e9!important;font-weight:700!important;box-shadow:inset 0 1px 0 rgba(184,155,77,.38),inset 0 -1px 0 rgba(184,155,77,.38)!important}
.les-form .les-wheel-status{margin-top:12px;font-size:13px;color:#c5c7cb}

/* Compact date wheels, preserving three clearly readable selection rows. */
.les-form .les-date-wheel{height:176px}
.les-form .les-wheel-spacer{height:66px;flex-basis:66px}

/* Past months remain visible for wheel continuity, but cannot be selected. */
.les-form .les-wheel-option:disabled{opacity:.22;cursor:not-allowed;color:#6e737b!important;background:transparent!important}

/* Canonical form field structure and CTA geometry, independent of page. */
.les-form .field{display:flex;flex-direction:column;gap:9px;min-width:0}
.les-form .field small{font-size:12px;line-height:1.5;color:#aeb4bc}
.les-form .required{color:#b89b4d}
.les-form .checkline{display:flex;align-items:flex-start;gap:12px}
.les-form .form-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:30px}
.les-form .form-section>p{color:#bfc4ca}
.les-form-section .form-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:30px}
.les-form-section .form-intro p{color:#bfc4ca}
.les-form-section .form-section h3{margin:0 0 7px}
.les-form-section .form-section>p{margin:0 0 23px;color:#bfc4ca}
.les-form-section .form-grid .field.full{grid-column:1/-1}
.les-form .les-form-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.les-form .les-form-actions>.contact-button{width:100%;min-width:0;max-width:none;margin:0;white-space:normal}
@media(max-width:900px){.les-form-section .form-intro{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){.les-form .les-form-actions{grid-template-columns:minmax(0,1fr)}.les-form-section .form-grid .field.full{grid-column:auto}}

/* Preserve the dark enterprise form's structure across desktop and iOS Safari. */
#content section.check.les-form-section{background:#191c21!important;color:#fff}
#content .les-form-section .les-form-panel{color:#fff!important;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}
#content .les-form-section .form-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:30px;align-items:start;margin-bottom:34px}
#content .les-form-section .form-intro h2,#content .les-form-section .form-section h3{color:#fff!important}
#content .les-form-section .form-intro p,#content .les-form-section .form-section>p{color:#c2c6cc!important}
#content .les-form-section .fit-box{background:#252930!important;border:1px solid #555b65!important;padding:24px;border-radius:12px}
#content .les-form-section .fit-box strong{color:#d1b474!important}
#content .les-form-section .fit-box p{color:#c5c7cb!important}
#content .les-form-section .form-section{padding:32px 0 0!important;margin:32px 0 0;border-top:1px solid #42464d}
#content .les-form-section .form-section .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
#content .les-form-section .form-section .field{min-width:0}
#content .les-form-section .form-section .field label{display:block;margin-bottom:9px;color:#e4e5e6!important}
#content .les-form-section .hidden-honeypot{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important}
@media(max-width:900px){#content .les-form-section .form-intro{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){
  #content .les-form-section .form-section .form-grid{grid-template-columns:minmax(0,1fr)}
  #content .les-form-section .form-intro{gap:22px}
  #content .les-form-section .form-section{padding-top:28px!important;margin-top:28px}
  #content .les-form-section .les-form-panel{min-width:0}
}

/* Standalone contract-end selector, independent of the two-column field grid. */
#content #security-switch-form .security-contract-date{display:flex;flex-direction:column;align-items:center;width:100%;max-width:none;margin-top:22px}
#content #security-switch-form .security-contract-date>.les-date-wheels{width:min(100%,550px);max-width:550px;margin-inline:auto}
#content #security-switch-form .security-contract-date>#security-end-label,
#content #security-switch-form .security-contract-date>.les-wheel-status{width:min(100%,550px);text-align:center}
@media(max-width:700px){#content #security-switch-form .security-contract-date>.les-date-wheels{width:100%;max-width:100%}}

/* Accessible step controls and clearer selected state for date wheels. */
.les-form .les-wheel-control{display:grid;grid-template-columns:31px minmax(0,1fr) 31px;align-items:center;gap:6px;min-width:0}
.les-form .les-wheel-control>.les-date-wheel{min-width:0}
.les-form .les-wheel-control>.les-wheel-step{display:grid;place-items:center;width:31px;height:46px;padding:0;border:1px solid rgba(184,155,77,.48);border-radius:9px;background:#292d34;color:#dfc481;font:700 29px/1 Arial,Helvetica,sans-serif;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.les-form .les-wheel-control>.les-wheel-step:hover{background:#454036;color:#fff;border-color:#d5b46d}
.les-form .les-wheel-control>.les-wheel-step:focus-visible{outline:2px solid #d8bc78;outline-offset:2px}
.les-form .les-date-wheel .les-wheel-option.is-selected{background:rgba(184,155,77,.27)!important;color:#fff!important;font-weight:700!important;box-shadow:inset 0 1px 0 #b89b4d,inset 0 -1px 0 #b89b4d!important}
.les-form .les-date-wheel .les-wheel-option:not(:disabled):not(.is-selected):hover{background:rgba(184,155,77,.11)!important;color:#eee2c5!important}
@media(max-width:450px){.les-form .les-wheel-control{grid-template-columns:26px minmax(0,1fr) 26px;gap:4px}.les-form .les-wheel-control>.les-wheel-step{width:26px;height:42px;font-size:24px}.les-form .les-wheel-option{font-size:13px!important}}

/* Side-mounted up/down arrows for month and year wheels. */
.les-form .les-wheel-control{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;grid-template-rows:176px;align-items:center;justify-items:stretch;gap:8px;min-width:0}
.les-form .les-wheel-control>.les-date-wheel{grid-column:2;grid-row:1;min-width:0;width:100%}
.les-form .les-wheel-control>.les-wheel-step{display:flex;align-items:center;justify-content:center;grid-row:1;width:36px;height:40px;padding:0;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1;letter-spacing:0;text-align:center}
.les-form .les-wheel-control>.les-wheel-step:first-child{grid-column:1}
.les-form .les-wheel-control>.les-wheel-step:last-child{grid-column:3}
@media(max-width:450px){.les-form .les-wheel-control{grid-template-columns:30px minmax(0,1fr) 30px;gap:5px}.les-form .les-wheel-control>.les-wheel-step{width:30px;height:38px;font-size:14px}}

/* Outer-edge stacked wheel controls. */
#security-switch-form .les-wheel-control{display:grid;grid-template-rows:1fr 40px 40px 1fr;gap:6px 8px;align-items:center}
#security-switch-form .les-wheel-control--month{grid-template-columns:36px minmax(0,1fr)}
#security-switch-form .les-wheel-control--year{grid-template-columns:minmax(0,1fr) 36px}
#security-switch-form .les-wheel-control>.les-date-wheel{grid-row:1/5;height:176px;min-width:0;width:100%}
#security-switch-form .les-wheel-control--month>.les-date-wheel{grid-column:2}
#security-switch-form .les-wheel-control--year>.les-date-wheel{grid-column:1}
#security-switch-form .les-wheel-control--month>.les-wheel-step{grid-column:1}
#security-switch-form .les-wheel-control--year>.les-wheel-step{grid-column:2}
#security-switch-form .les-wheel-control>.les-wheel-step{width:36px;height:40px;display:grid;place-items:center;padding:0;font:700 16px/1 Arial,sans-serif}
#security-switch-form .les-wheel-control>.les-wheel-step:first-child{grid-row:2}
#security-switch-form .les-wheel-control>.les-wheel-step:last-child{grid-row:3}
@media(max-width:450px){#security-switch-form .les-wheel-control--month{grid-template-columns:30px minmax(0,1fr)}#security-switch-form .les-wheel-control--year{grid-template-columns:minmax(0,1fr) 30px}#security-switch-form .les-wheel-control>.les-wheel-step{width:30px;height:40px}}

/* ESET wheel arrows: frameless controls, keep hit areas and placement. */
#security-switch-form .les-wheel-control>.les-wheel-step{border:0!important;background:transparent!important;box-shadow:none!important;border-radius:0;color:#dfc481;transition:color .18s,transform .18s}
#security-switch-form .les-wheel-control>.les-wheel-step:hover{background:transparent!important;border:0!important;color:#fff;transform:scale(1.12)}
#security-switch-form .les-wheel-control>.les-wheel-step:focus-visible{outline:2px solid #d8bc78;outline-offset:2px;border-radius:4px}

/* Touch layouts: wheel swiping replaces external arrow buttons. */
@media (max-width:900px), (hover:none) and (pointer:coarse){
 #security-switch-form .les-wheel-control>.les-wheel-step{display:none!important}
 #security-switch-form .les-wheel-control--month,
 #security-switch-form .les-wheel-control--year{grid-template-columns:minmax(0,1fr)!important;gap:0}
 #security-switch-form .les-wheel-control>.les-date-wheel{grid-column:1!important;grid-row:1/5;width:100%}
}

/* Tighten desktop outer wheel arrows against the selection panes. */
@media (min-width:901px) and (hover:hover) and (pointer:fine){
 #security-switch-form .les-wheel-control{column-gap:0}
 #security-switch-form .les-wheel-control--month>.les-wheel-step{justify-self:end}
 #security-switch-form .les-wheel-control--year>.les-wheel-step{justify-self:start}
}

/* Keep the desktop up/down arrows closer together vertically. */
@media (min-width:901px) and (hover:hover) and (pointer:fine){
 #security-switch-form .les-wheel-control{grid-template-rows:1fr 28px 28px 1fr;row-gap:0}
 #security-switch-form .les-wheel-control>.les-wheel-step{height:28px}
}
