/* KOKO Backoffice — professional image pipeline v146 */
.panel-image-size-picker{
  --img-accent:#0d8370;
  --img-accent-soft:#eaf7f4;
  --img-border:#d7e0e8;
  --img-muted:#667386;
  display:grid;
  gap:12px;
  width:100%;
  min-width:0;
  margin:12px 0;
  padding:14px;
  border:1px solid var(--img-border);
  border-radius:10px;
  background:linear-gradient(180deg,#fbfcfd 0%,#f6f8fa 100%);
  box-shadow:0 1px 2px rgba(15,23,42,.025);
}
.panel-image-size-head{display:flex;align-items:flex-start;gap:10px;min-width:0}
.panel-image-size-head>span{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:9px;background:var(--img-accent);color:#fff;box-shadow:0 4px 12px rgba(13,131,112,.16)}
.panel-image-size-head>div{min-width:0}
.panel-image-size-head strong,.panel-image-size-head small{display:block;overflow-wrap:anywhere}
.panel-image-size-head strong{color:#172033;font-size:13px;font-weight:850;letter-spacing:-.01em}
.panel-image-size-head small{margin-top:3px;color:var(--img-muted);font-size:10.5px;line-height:1.45}
.panel-image-size-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;min-width:0}
.panel-image-size-presets button{min-width:0;min-height:36px;padding:7px;border:1px solid #ccd6df;border-radius:7px;background:#fff;color:#354256;font:inherit;font-size:10.5px;font-weight:800;white-space:nowrap;cursor:pointer;transition:border-color .14s ease,background .14s ease,color .14s ease,box-shadow .14s ease}
.panel-image-size-presets button:hover,.panel-image-size-presets button.active{border-color:var(--img-accent);background:var(--img-accent-soft);color:#086a5b;box-shadow:0 0 0 2px rgba(13,131,112,.06)}
.panel-image-size-presets button:disabled{opacity:.46;cursor:not-allowed;box-shadow:none}
.panel-image-size-custom{display:grid;grid-template-columns:minmax(90px,.7fr) 16px minmax(90px,.7fr) minmax(180px,1.15fr) minmax(150px,.8fr);align-items:end;gap:8px;min-width:0}
.panel-image-size-custom>label{display:grid;gap:5px;min-width:0}
.panel-image-size-custom>label>span{color:var(--img-muted);font-size:9.5px;font-weight:850;letter-spacing:.035em;text-transform:uppercase}
.panel-image-size-custom>i{align-self:center;margin-top:18px;color:#8792a2;text-align:center;font-size:11px}
.panel-image-size-custom input,.panel-image-size-custom select{width:100%;min-width:0;min-height:38px;padding:7px 9px;border:1px solid #ccd6df;border-radius:7px;background:#fff;color:#172033;font:inherit;font-size:11px;font-weight:750;outline:0}
.panel-image-size-custom select{padding-right:28px}
.panel-image-size-custom input:focus,.panel-image-size-custom select:focus{border-color:var(--img-accent);box-shadow:0 0 0 3px rgba(13,131,112,.10)}
.panel-image-size-custom input:disabled,.panel-image-size-custom select:disabled{background:#eef2f5;color:#8792a2;cursor:not-allowed}
.panel-image-policy-row{display:grid;grid-template-columns:minmax(220px,.85fr) minmax(260px,1.15fr);gap:8px;min-width:0}
.panel-image-upscale-switch{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start;gap:9px;min-width:0;padding:9px 10px;border:1px solid #d9e3ea;border-radius:8px;background:#fff;cursor:pointer}
.panel-image-upscale-switch>input{width:16px!important;height:16px!important;min-width:16px!important;margin:2px 0 0!important;accent-color:var(--img-accent)}
.panel-image-upscale-switch>span{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:6px;min-width:0}
.panel-image-upscale-switch i{grid-row:1/3;margin-top:2px;color:var(--img-accent);font-size:10px}
.panel-image-upscale-switch b{color:#334155;font-size:10px;font-weight:850}
.panel-image-upscale-switch small{grid-column:2;color:#728096;font-size:9px;line-height:1.35}
.panel-image-upscale-switch.is-disabled{opacity:.48;cursor:not-allowed}
.panel-image-size-mode{display:flex;align-items:flex-start;gap:8px;min-width:0;padding:9px 10px;border:1px solid #cfe4df;border-radius:8px;background:#edf8f5;color:#0b6f60;font-size:9.8px;font-weight:750;line-height:1.4}
.panel-image-size-mode>i{margin-top:2px;flex:0 0 auto}
.panel-image-size-mode>span{min-width:0;overflow-wrap:anywhere}
.panel-image-size-picker.is-original .panel-image-size-mode{border-color:#d8dfeb;background:#f2f5fa;color:#526176}
.panel-image-size-picker.is-original .panel-image-size-head>span{background:#526176;box-shadow:none}
.panel-file-upload-primary.is-uploading{position:relative;pointer-events:none;overflow:hidden}
.panel-file-upload-primary.is-uploading>*{opacity:.1}
.panel-file-upload-primary.is-uploading::after{content:"Görsel işleniyor…";position:absolute;inset:0;display:grid;place-items:center;padding:6px;background:#0b7565;color:#fff;font-size:10.5px;font-weight:900;letter-spacing:.01em}
.spm-image-preview img,.site-upload-preview>img,.tournament-overview-image img,.payment-logo-preview img,.casino-managed-preview img{image-orientation:from-image}
/* Panel previews never distort an uploaded source. */
.spm-image-preview img,.site-upload-preview>img,.tournament-overview-image img{object-fit:contain!important;object-position:center!important}
.spm-image-preview,.site-upload-preview,.tournament-overview-image{background:linear-gradient(135deg,#eef2f5 25%,#f8fafc 25%,#f8fafc 50%,#eef2f5 50%,#eef2f5 75%,#f8fafc 75%);background-size:18px 18px}
.spm-image-editor .panel-image-size-picker{margin:5px 0;padding:10px;gap:9px}
.spm-image-editor .panel-image-size-presets{grid-template-columns:repeat(2,minmax(0,1fr))}
.spm-image-editor .panel-image-size-custom{grid-template-columns:minmax(72px,1fr) 12px minmax(72px,1fr)}
.spm-image-editor .panel-image-fit-field,.spm-image-editor .panel-image-quality-field{grid-column:span 1}
.spm-image-editor .panel-image-policy-row{grid-template-columns:1fr}
@media(max-width:1050px){
  .panel-image-size-presets{grid-template-columns:repeat(3,minmax(0,1fr))}
  .panel-image-size-custom{grid-template-columns:minmax(0,1fr) 14px minmax(0,1fr)}
  .panel-image-fit-field,.panel-image-quality-field{grid-column:span 1}
  .panel-image-fit-field{grid-column:1/3}
  .panel-image-quality-field{grid-column:3/4}
}
@media(max-width:720px){
  .panel-image-size-picker{padding:11px;gap:10px}
  .panel-image-size-presets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panel-image-size-custom{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr)}
  .panel-image-fit-field,.panel-image-quality-field{grid-column:1/-1}
  .panel-image-policy-row{grid-template-columns:1fr}
}
@media(max-width:420px){
  .panel-image-size-picker{margin:9px 0;padding:9px;border-radius:8px}
  .panel-image-size-presets{grid-template-columns:1fr 1fr;gap:5px}
  .panel-image-size-presets button{min-height:38px;font-size:9.5px}
  .panel-image-size-head>span{width:34px;height:34px;flex-basis:34px}
}