/* Self-contained Teclight preorder dialog. All selectors scoped to #tlpo-modal. */
#tlpo-modal[hidden], #tlpo-modal [hidden]{display:none!important}
#tlpo-modal{position:fixed;inset:0;z-index:150000;display:flex;align-items:center;justify-content:center;padding:clamp(8px,2vw,22px);color:#262626;font-family:inherit}
#tlpo-modal .tlpo-shade{position:absolute;inset:0;background:rgba(20,20,20,.62)}
#tlpo-modal .tlpo-panel{position:relative;width:min(100%,565px);max-height:min(94vh,900px);overflow:auto;background:#fff;border-radius:18px;box-shadow:0 16px 70px rgba(0,0,0,.22)}
#tlpo-modal .tlpo-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid #e6e6e6}
#tlpo-modal .tlpo-head h2{font-size:24px;line-height:1.22;font-weight:500;margin:0;color:#242424}
#tlpo-modal .tlpo-close{width:36px;height:36px;border:1px solid #dedede;background:#fff;border-radius:100%;font-size:25px;line-height:1;cursor:pointer;color:#333}
#tlpo-modal .tlpo-body{padding:24px}
#tlpo-modal .tlpo-product{display:flex;align-items:center;gap:18px;padding:15px;background:#fff;border:1px solid #e3e3e3;border-radius:14px;margin-bottom:24px}
#tlpo-modal .tlpo-product>img{width:106px;height:106px;object-fit:contain;flex:0 0 106px}
#tlpo-modal .tlpo-product-text{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
#tlpo-modal #tlpo-product-link{font-weight:500;color:#262626;text-decoration:none;line-height:1.35}
#tlpo-modal #tlpo-product-link:hover{text-decoration:underline}
#tlpo-modal .tlpo-model{font-size:12px;color:#676767}
#tlpo-modal .tlpo-status{font-size:12px;font-weight:500;color:#925000;background:#fff3cd;padding:4px 10px;border-radius:6px}
#tlpo-modal .tlpo-price{font-size:19px;color:#242424}
#tlpo-modal .tlpo-fields{display:grid;grid-template-columns:1fr 1.45fr;gap:15px}
#tlpo-modal .tlpo-field{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:500;color:#353535}
#tlpo-modal .tlpo-wide{grid-column:1/-1}
#tlpo-modal .tlpo-field input:not([type=checkbox]),#tlpo-modal .tlpo-field textarea{box-sizing:border-box;width:100%;border:1px solid #d5d5d5;border-radius:9px;padding:10px 12px;font:inherit;font-weight:400;font-size:15px;color:#222;background:#fff;outline-offset:1px}
#tlpo-modal .tlpo-field input:focus,#tlpo-modal .tlpo-field textarea:focus{border-color:#e4c900;outline:2px solid #ffe22a}
#tlpo-modal .tlpo-counter{display:flex;border:1px solid #d5d5d5;border-radius:9px;background:#fff;overflow:hidden;height:43px}
#tlpo-modal .tlpo-counter input{border:0!important;flex:1;min-width:0;text-align:center;appearance:textfield;padding:6px!important}
#tlpo-modal .tlpo-counter input::-webkit-inner-spin-button,#tlpo-modal .tlpo-counter input::-webkit-outer-spin-button{appearance:none;margin:0}
#tlpo-modal .tlpo-counter button{flex:0 0 34px;background:#fff;border:0;font-size:20px;cursor:pointer;color:#242424}
#tlpo-modal .tlpo-counter button:hover{background:#fff9d9}
#tlpo-modal .tlpo-consent{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.5;color:#65615b;margin:17px 0 7px;cursor:pointer}
/* Native required checkbox with explicit, theme-resistant appearance.
   Keep the real input focusable and clickable for keyboard and form validation. */
#tlpo-modal .tlpo-consent > input[type="checkbox"]{
  -webkit-appearance:none!important;
  appearance:none!important;
  display:block!important;
  position:static!important;
  visibility:visible!important;
  opacity:1!important;
  float:none!important;
  transform:none!important;
  clip:auto!important;
  clip-path:none!important;
  z-index:auto!important;
  box-sizing:border-box!important;
  width:19px!important;
  height:19px!important;
  min-width:19px!important;
  min-height:19px!important;
  flex:0 0 19px!important;
  margin:1px 0 0!important;
  padding:0!important;
  border:1.5px solid #aaa49d!important;
  border-radius:4px!important;
  background:#fff!important;
  box-shadow:none!important;
  pointer-events:auto!important;
  cursor:pointer;
  transition:border-color .15s,background-color .15s;
}
#tlpo-modal .tlpo-consent > input[type="checkbox"]:checked{
  border-color:#e7d000!important;
  background-color:#ffea2c!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5 6.5 12 13 4' fill='none' stroke='%23141414' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-size:15px 15px!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
#tlpo-modal .tlpo-consent > input[type="checkbox"]:focus-visible{
  outline:2px solid #f0d000!important;
  outline-offset:3px!important;
}
#tlpo-modal .tlpo-consent > span{min-width:0;flex:1}

#tlpo-modal .tlpo-message{color:#9f1a17;font-size:13px;min-height:16px;margin:8px 0}
#tlpo-modal .tlpo-submit{display:block;width:100%;min-height:52px;background:#ffeb2f;color:#171717;border:0;border-radius:999px;font-size:16px;font-weight:500;cursor:pointer;transition:background-color .18s ease,transform .18s ease}
#tlpo-modal .tlpo-submit:hover{background:#ffdc00}
#tlpo-modal .tlpo-submit:disabled{opacity:.65;cursor:wait;transform:none}
#tlpo-modal .tlpo-footnote{font-size:12px;line-height:1.5;color:#777;margin:12px 0 0}
#tlpo-modal .tlpo-trap{position:absolute!important;left:-9999px!important;top:-9999px!important}
#tlpo-modal .tlpo-success{text-align:center;padding:26px 8px 12px}
#tlpo-modal .tlpo-success-mark{display:inline-flex;align-items:center;justify-content:center;background:#e5f4e5;color:#167d31;width:58px;height:58px;border-radius:50%;font-size:32px}
#tlpo-modal .tlpo-success p{font-weight:500;margin:18px 0 22px;font-size:18px}
@media (max-width:520px) {
  #tlpo-modal { padding:8px; }
  #tlpo-modal .tlpo-panel { width:100%; max-height:calc(100dvh - 16px); border-radius:14px; }
  #tlpo-modal .tlpo-head { padding:16px 17px; }
  #tlpo-modal .tlpo-head h2 { font-size:20px; }
  #tlpo-modal .tlpo-body { padding:16px; }
  #tlpo-modal .tlpo-product { gap:12px; padding:12px; margin-bottom:18px; }
  #tlpo-modal .tlpo-product > img { width:76px; height:76px; flex-basis:76px; }
  #tlpo-modal .tlpo-fields { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
  #tlpo-modal .tlpo-field { font-size:12px; }
  #tlpo-modal .tlpo-submit { min-height:50px; }
  #tlpo-modal .tlpo-consent { font-size:12px; }
}
@media (max-width:355px) {
  #tlpo-modal .tlpo-fields { grid-template-columns:minmax(0,1fr); }
  #tlpo-modal .tlpo-wide { grid-column:auto; }
}
