@import url('https://unpkg.com/xp.css');

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: Tahoma, sans-serif;
}

body {
    background-image: url('bliss.jpg');
    background-size: cover;            /* zoom image to cover entire viewport */
    background-position: center 10%;       /* center the image */
    background-repeat: no-repeat; 
    margin: 0;
    padding: 0;
    font-family: Tahoma, sans-serif;
}

.desktop-icon {
    width: 80px;
    text-align: center;
    color: white;
    text-shadow: 1px 1px black;
    margin: 10px;
}

.desktop-icon img {
    width: 48px;
    height: 48px;
}

.fullscreen-cmd {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  display: flex;
  flex-direction: column;
  z-index: 999;
}

/* Let the black body stretch */
.fullscreen-cmd .window-body {
  flex: 1;
  overflow: auto;
}

/* Make taskbar flush and remove padding */
.taskbar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 30px; /* match your desired height */
  background: url('taskbar.png') no-repeat center;
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  padding: 0;         /* important: remove padding so button can touch edge */
  margin: 0;
}

/* Fully reset and size button to match image */
#startButton {
  all: unset !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: none !important;
  outline: none !important;
  cursor: pointer !important;
  height: 100% !important;     /* match taskbar height */
  display: inline-block !important;
  position: relative;
}

/* Remove highlight/gray on interaction */
#startButton:hover,
#startButton:focus,
#startButton:active {
  background: none !important;
  border: none !important;
  outline: none !important;
  opacity: 1 !important;
}

/* Image defines button width */
#startButton img {
  display: block;
  height: 100%;        /* fill taskbar vertically */
  width: auto;         /* keep natural aspect ratio */
  pointer-events: none;
  user-select: none;
}

.taskbar-window-button {
  height: 100%;
  background: url('taskbarbutton.png') no-repeat center;
  border: 2px outset #fff;
  font-family: Tahoma, sans-serif;
  font-size: 12px;
  padding: 0 10px;
  margin-left: 2px;
  cursor: pointer;
  display: flex;
  align-items: center;
}