/* User-selected wallpapers are confined to messages and voice-call identity. */
@layer vobixLight {
  body:not(.seniorHighContrast):not(.contrast) #messages.vobixWallpaper {
    background-color:#c4d0db!important;
    background-image:var(--wallpaper-image)!important;
    background-position:center!important;background-size:var(--wallpaper-size,320px) var(--wallpaper-size,320px)!important;background-repeat:repeat!important;
  }
  body:not(.seniorHighContrast):not(.contrast) #callVideoArea[data-call-type=audio] .audioCallIdentity.vobixWallpaper {
    background-color:#dfefff!important;
    background-image:var(--wallpaper-image)!important;
    background-position:center!important;background-size:var(--wallpaper-size,320px) var(--wallpaper-size,320px)!important;background-repeat:repeat!important;
  }
  body:not(.seniorHighContrast):not(.contrast) #callVideoArea[data-call-type=audio] .audioCallIdentity.vobixWallpaper .audioCallName{
    color:#12354d!important;background:#f5fbfff2!important;padding:8px 16px;border-radius:18px;text-shadow:none!important;
  }
  #wallpaperDialog{color:#12354d!important;background:#f5faff!important;border:1px solid #c4ddf1!important;border-radius:24px;width:min(660px,calc(100vw - 24px));max-height:calc(100dvh - 24px - var(--vobix-safe-top,0px) - var(--vobix-safe-bottom,0px));padding:0;overflow:auto;box-sizing:border-box;overscroll-behavior:contain;font:16px/1.4 system-ui}
  #wallpaperDialog::backdrop{background:#06203980}
  #wallpaperDialog *{box-sizing:border-box}
  #wallpaperDialog .wallpaperHeader{display:flex;align-items:center;gap:12px;padding:14px 18px;position:sticky;top:0;background:#f5faff;z-index:2;border-bottom:1px solid #d2e4f3}
  #wallpaperDialog h2{font-size:22px;line-height:1.2;margin:0;color:#12354d!important}
  #wallpaperDialog h3{font-size:16px;margin:20px 0 10px;color:#12354d!important}
  #wallpaperDialog button,#wallpaperDialog select{font:600 15px/1.3 system-ui;min-height:44px;border:1px solid #c1dcf0!important;border-radius:12px;padding:10px 14px;cursor:pointer;background:#fff!important;color:#12354d!important}
  #wallpaperDialog :is(button,select,input):focus-visible{outline:3px solid #0087dd!important;outline-offset:3px}
  #wallpaperDialog button:disabled{opacity:.5;cursor:default}
  #wallpaperDialog .wallpaperContent{padding:0 18px 18px}
  #wallpaperDialog .wallpaperIntro{font-size:14px;color:#3d627b!important;margin:14px 0}
  #wallpaperDialog .wallpaperTabs{display:flex;gap:8px;margin:12px 0}
  #wallpaperDialog .wallpaperTabs button{flex:1}
  #wallpaperDialog button[aria-pressed=true]{border-color:#0087dd!important;box-shadow:0 0 0 2px #0087dd;background:#e0f1ff!important;color:#0b5c91!important}
  #wallpaperDialog label{display:block;margin:12px 0;color:#12354d!important;font-size:14px;font-weight:600}
  #wallpaperDialog select{width:100%;margin-top:6px}
  #wallpaperDialog .wallpaperPreview{height:160px;border-radius:20px;background-color:#dfefff;background-image:var(--wallpaper-image);background-size:var(--wallpaper-size,320px) var(--wallpaper-size,320px);background-position:center;background-repeat:repeat;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:14px;overflow:hidden;border:1px solid #bddbef}
  #wallpaperDialog .wallpaperBubble{border-radius:14px 14px 14px 4px;background:#fff;color:#12354d;padding:9px 12px;max-width:85%;align-self:flex-start;font-size:14px;box-shadow:0 2px 8px #12354d15}
  #wallpaperDialog .wallpaperBubble.mine{align-self:flex-end;background:#cceaff;border-radius:14px 14px 4px 14px}
  #wallpaperDialog .wallpaperVoice{align-self:center;margin:auto;text-align:center;color:white;background:#102b48c9;border-radius:18px;padding:10px 22px;font-size:18px}
  #wallpaperDialog .wallpaperVoice span{display:block;font-size:32px}
  #wallpaperDialog .wallpaperGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}
  #wallpaperDialog .wallpaperTile{min-width:0;padding:0;overflow:hidden;font:600 max(12px,calc(var(--vobix-menu-font,15px) - 3px))/1.3 system-ui!important;white-space:normal;overflow-wrap:anywhere}
  #wallpaperDialog .wallpaperSample{width:100%;height:62px;display:block;background-color:#eaf5ff;background-image:var(--wallpaper-image);background-size:230px 230px;background-repeat:repeat}
  #wallpaperDialog .wallpaperTile span{display:block;padding:7px 2px!important;min-width:0;white-space:normal;font-size:inherit!important;line-height:1.3!important;word-break:normal;overflow-wrap:normal!important}
  #wallpaperDialog .wallpaperSliders{padding:2px 12px;background:#e6f3ff;border-radius:14px}
  #wallpaperDialog input[type=range]{width:100%;margin:8px 0;accent-color:#0087dd;min-height:32px}
  #wallpaperDialog .wallpaperCheck{display:flex;gap:10px;align-items:center}
  #wallpaperDialog input[type=checkbox]{width:22px;height:22px;accent-color:#0087dd}
  #wallpaperDialog .wallpaperFooter{display:flex;gap:8px;position:sticky;bottom:0;padding:12px 18px;background:#f5faff;border-top:1px solid #d2e4f3;z-index:2}
  #wallpaperDialog .wallpaperFooter button{flex:1}
  #wallpaperDialog #saveWallpaperButton{background:#007bbb!important;color:#fff!important;border-color:#007bbb!important}
  #wallpaperDialog #wallpaperStatus{font-size:14px;margin:12px 0;min-height:20px;color:#194d71!important}
  #wallpaperDialog [hidden]{display:none!important}
  html:is([data-vobix-font=large],[data-vobix-font=xlarge]) #wallpaperDialog .wallpaperGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  @media(max-width:360px){#wallpaperDialog .wallpaperGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}#wallpaperDialog .wallpaperContent{padding:0 12px 12px}#wallpaperDialog .wallpaperHeader{padding:12px}#wallpaperDialog h2{font-size:20px}}
  @media(max-height:480px){#wallpaperDialog .wallpaperPreview{height:160px}}
}