/*
 * Shared picker v2: one common selector + wide result list.
 * The editor/result column ratio follows the established 6sets two-column layout:
 * compact selector on the left, spacious results panel on the right.
 */
/*
 * Hide the legacy repeated-card layout from the very first paint.
 * PHP adds lottery-shared-picker-pending to the root before the browser renders;
 * JavaScript replaces it with lottery-shared-picker-active after building the new UI.
 */
.lottery-shared-picker-pending .modules-wrapper > .lottery-card[data-module],
.lottery-shared-picker-active .modules-wrapper > .lottery-card[data-module]{position:absolute!important;left:-99999px!important;top:auto!important;width:1px!important;height:1px!important;min-width:0!important;min-height:0!important;padding:0!important;margin:0!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important}
.lottery-shared-picker-pending .modules-wrapper > .lottery-card--adder,
.lottery-shared-picker-pending .modules-wrapper > .placeholder,
.lottery-shared-picker-active .modules-wrapper > .lottery-card--adder,
.lottery-shared-picker-active .modules-wrapper > .placeholder{display:none!important}

/* Stable loading shell prevents the old three-card layout and reduces layout shift. */
.lottery-shared-picker-pending .modules-wrapper::after{
  content:"";
  display:block;
  width:100%;
  flex:0 0 100%;
  grid-column:1/-1;
  min-height:420px;
  margin:18px 0 8px;
  border:1px solid #dbe4ef;
  border-radius:24px;
  background:linear-gradient(90deg,#f5f7fa 25%,#eef2f6 37%,#f5f7fa 63%);
  background-size:400% 100%;
  animation:lottery-shared-picker-loading 1.2s ease-in-out infinite;
}
@keyframes lottery-shared-picker-loading{0%{background-position:100% 0}100%{background-position:0 0}}
.lottery-shared-picker-active .modules-wrapper::after{display:none!important}

/* Match the existing page's approximately 1:2 two-column proportion. */
.lottery-shared-picker{width:100%;flex:0 0 100%;grid-column:1/-1;display:grid;grid-template-columns:minmax(360px,.75fr) minmax(0,1.75fr);gap:20px;margin:18px 0 8px;align-items:start}
.lottery-shared-picker__editor-panel,.lottery-shared-picker__results-panel{background:#fff;border:1px solid #dbe4ef;border-radius:24px;box-shadow:0 16px 42px rgba(15,23,42,.06);overflow:hidden}
.lottery-shared-picker__panel-head,.lottery-shared-picker__results-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:20px 22px 16px;border-bottom:1px solid #edf2f7}
.lottery-shared-picker__eyebrow{font-size:12px;line-height:1.35;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#64748b}
.lottery-shared-picker__panel-head h2,.lottery-shared-picker__results-head h2{margin:4px 0 0!important;font-size:20px!important;line-height:1.22!important;font-weight:700!important;letter-spacing:-.02em!important;color:#0f172a!important}
.lottery-shared-picker__results-head p{margin:5px 0 0;color:#64748b;font-size:13px}
.lottery-shared-picker__limit{font-size:12px;line-height:1.4;color:#64748b;text-align:right;max-width:190px}
.lottery-shared-picker__editor{padding:18px}
.lottery-shared-picker__editor .lottery-shared-editor-card{display:block!important;position:relative!important;width:100%!important;max-width:none!important;margin:0!important;border:0!important;box-shadow:none!important;padding:0!important;background:transparent!important}
.lottery-shared-picker__editor .lottery-shared-editor-card>h3{display:none!important}

/* Keep the original picker watermark layer exactly as the established selector. */
.lottery-shared-picker__editor .lottery-shared-editor-card .number-selection{
  position:relative!important;
  min-height:150px;
  text-align:center;
}
.lottery-shared-picker__editor .lottery-shared-editor-card .card-number{
  display:block!important;
  position:absolute!important;
  top:40%!important;
  left:50%!important;
  transform:translate(-50%,-50%)!important;
  font-size:100px!important;
  line-height:1!important;
  font-family:Roboto,sans-serif!important;
  font-weight:700!important;
  letter-spacing:-.02em!important;
  text-align:center!important;
  color:#555555!important;
  opacity:.30!important;
  z-index:10!important;
  pointer-events:none!important;
}

.lottery-shared-picker__results{display:flex;flex-direction:column;gap:10px;padding:16px}
.lottery-shared-result{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 14px;border:1px solid #dbe4ef;border-radius:16px;background:#f8fbff;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
.lottery-shared-result:hover{border-color:#9fc2f7;background:#fff}
.lottery-shared-result.is-active{border-color:#0d6efd;background:#fff;box-shadow:0 0 0 3px rgba(13,110,253,.10)}
.lottery-shared-result.is-incomplete{border-style:dashed}
.lottery-shared-result__main{min-width:0;display:flex;align-items:center;gap:15px;flex:1}
.lottery-shared-result__line{min-width:82px;font-size:13px;font-weight:700;color:#0f172a;white-space:nowrap}
.lottery-shared-result__line span{display:block;margin-top:3px;font-size:10px;font-weight:600;color:#64748b;white-space:normal}
.lottery-shared-result__numbers{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.lottery-shared-result__group{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.lottery-shared-result__plus{font-weight:800;color:#64748b;margin:0 3px}
.lottery-shared-result__ball{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 7px;border-radius:999px;background:#eef3f9;border:1px solid #d7e1ec;color:#0f172a;font-size:12px;font-weight:700;box-sizing:border-box}

/* Result balls use exactly the same palette as selected blocks in each picker. */
.lottery-orders--keno8 .lottery-shared-result__ball{background:#00b08c!important;border-color:#00b08c!important;color:#fff!important}
.lottery-orders--doublecolor .lottery-shared-result__ball.is-red{background:#ff2752!important;border-color:#ff2752!important;color:#fff!important}
.lottery-orders--doublecolor .lottery-shared-result__ball.is-blue{background:#267aff!important;border-color:#267aff!important;color:#fff!important}
.lottery-orders--dlt .lottery-shared-result__ball.is-red{background:#ffa500!important;border-color:#ffa500!important;color:#fff!important}
.lottery-orders--dlt .lottery-shared-result__ball.is-blue{background:#00b08c!important;border-color:#00b08c!important;color:#fff!important}
.lottery-orders--3d .lottery-shared-result__ball{background:#ffa500!important;border-color:#ffa500!important;color:#fff!important}

.lottery-shared-result__incomplete{font-size:12px;color:#b45309}
.lottery-shared-result__tools{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.lottery-shared-result__tool{appearance:none;border:1px solid #d7e1ec;background:#fff;color:#334155;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;transition:border-color .16s ease,color .16s ease,background .16s ease}
.lottery-shared-result__tool:hover{border-color:#c9a96e;color:#8b6a2f;background:#fffaf1}

/* Integrated action bar: primary gold add button + dark secondary remove button. */
.lottery-shared-picker__actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px 18px 18px;border-top:1px solid #edf2f7;background:#f8fafc}
.lottery-shared-picker__actions .lottery-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:100%;min-height:46px;height:46px!important;margin:0!important;padding:0 18px!important;border-radius:14px!important;font-size:13px!important;font-weight:700!important;line-height:1!important;box-sizing:border-box;transition:background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.lottery-shared-picker__add{background:#c9a96e!important;background-color:#c9a96e!important;border:1px solid #c9a96e!important;color:#fff!important;box-shadow:0 10px 22px rgba(201,169,110,.20)!important}
.lottery-shared-picker__add:hover:not(:disabled){background:#b8935a!important;background-color:#b8935a!important;border-color:#b8935a!important;transform:translateY(-1px);box-shadow:0 12px 26px rgba(201,169,110,.25)!important}
.lottery-shared-picker__remove{background:#2d2d2d!important;background-color:#2d2d2d!important;border:1px solid #2d2d2d!important;color:#fff!important;box-shadow:0 10px 22px rgba(45,45,45,.12)!important}
.lottery-shared-picker__remove:hover:not(:disabled){background:#161616!important;background-color:#161616!important;border-color:#161616!important;transform:translateY(-1px)}
.lottery-shared-picker__actions .lottery-button:disabled{opacity:1!important;cursor:not-allowed!important;background:#e8ecf1!important;background-color:#e8ecf1!important;border-color:#dfe5ec!important;color:#9aa5b1!important;box-shadow:none!important;transform:none!important}

@media (max-width:1080px){.lottery-shared-picker{grid-template-columns:1fr}.lottery-shared-picker__results-panel{order:2}}
@media (max-width:640px){.lottery-shared-picker{gap:14px;margin-top:12px}.lottery-shared-picker__panel-head,.lottery-shared-picker__results-head{padding:17px 16px 14px}.lottery-shared-picker__panel-head h2,.lottery-shared-picker__results-head h2{font-size:18px!important}.lottery-shared-picker__editor{padding:13px}.lottery-shared-picker__editor .lottery-shared-editor-card .card-number{font-size:92px!important;opacity:.30!important}.lottery-shared-picker__results{padding:12px}.lottery-shared-result{align-items:flex-start;padding:12px;gap:10px}.lottery-shared-result__main{align-items:flex-start;flex-direction:column;gap:8px}.lottery-shared-result__line{min-width:0}.lottery-shared-result__line span{display:inline;margin-left:7px}.lottery-shared-result__tools{flex-direction:column}.lottery-shared-result__tool{padding:6px 9px}.lottery-shared-picker__actions{padding:12px;grid-template-columns:1fr}.lottery-shared-picker__limit{font-size:10px;max-width:130px}.lottery-shared-result__ball{min-width:28px;height:28px;font-size:11px;padding:0 6px}}

/* v1.1.1: desktop add/remove must never trigger browser scroll anchoring. */
@media (min-width:769px){
  .lottery-shared-picker,
  .lottery-shared-picker__editor-panel,
  .lottery-shared-picker__results-panel,
  .lottery-shared-picker__results,
  .lottery-shared-picker__actions,
  .lottery-shared-picker--viewport-locked,
  .lottery-shared-picker--viewport-locked *{overflow-anchor:none!important}
}
