/* iPhone 17 Pro frame copied from devices.css iPhone 14 Pro and tuned as one preset. */
.device-iphone-17-pro {
  width: 432px;
  height: 888px;
}

.device-iphone-17-pro .device-frame {
  width: 432px;
  height: 888px;
  padding: 15px;
  background: #010101;
  border: 1px solid #4f4f4f;
  border-radius: 70px;
  box-shadow:
    inset 0 0 3px 1px #c7c3be,
    inset 0 0 0 4px #111111;
}

.device-iphone-17-pro .device-screen {
  width: 402px;
  height: 858px;
  border-radius: 53px;
}

.device-iphone-17-pro .device-stripe,
.device-iphone-17-pro .device-home {
  display: none;
}

.device-iphone-17-pro .device-header {
  position: absolute;
  top: 30px;
  left: 50%;
  z-index: 4;
  width: 120px;
  height: 35px;
  margin-left: -60px;
  background: #010101;
  border-radius: 20px;
}

.device-iphone-17-pro .device-sensors {
  z-index: 4;
}

.device-iphone-17-pro .device-sensors::after,
.device-iphone-17-pro .device-sensors::before {
  position: absolute;
  content: "";
}

.device-iphone-17-pro .device-sensors::after {
  top: 30px;
  left: 50%;
  width: 74px;
  height: 33px;
  margin-left: -60px;
  background: #010101;
  border-radius: 17px;
}

.device-iphone-17-pro .device-sensors::before {
  top: 42px;
  left: 50%;
  width: 9px;
  height: 9px;
  margin-left: 36px;
  background:
    radial-gradient(farthest-corner at 20% 20%, #6074bf 0, transparent 40%),
    radial-gradient(farthest-corner at 80% 80%, #513785 0, #24555e 20%, transparent 50%);
  border-radius: 50%;
  box-shadow: 0 0 1px 1px rgba(255, 255, 255, 0.05);
}

.device-iphone-17-pro .device-btns {
  position: absolute;
  top: 150px;
  left: -2.5px;
  width: 2.5px;
  height: 36px;
  background: #151515;
  border-radius: 2px;
}

.device-iphone-17-pro .device-btns::after,
.device-iphone-17-pro .device-btns::before {
  position: absolute;
  left: 0;
  width: 2.5px;
  height: 70px;
  background: #151515;
  border-radius: 2px;
  content: "";
}

.device-iphone-17-pro .device-btns::after {
  top: 66px;
}

.device-iphone-17-pro .device-btns::before {
  top: 158px;
}

.device-iphone-17-pro .device-power {
  position: absolute;
  top: 235px;
  right: -2.5px;
  width: 2.5px;
  height: 114px;
  background: #151515;
  border-radius: 2px;
}

.device-iphone-17-pro.device-black .device-frame {
  border-color: #4f4f4f;
  box-shadow:
    inset 0 0 3px 1px #c7c3be,
    inset 0 0 0 4px #111111;
}

.device-iphone-17-pro.device-black .device-btns,
.device-iphone-17-pro.device-black .device-btns::after,
.device-iphone-17-pro.device-black .device-btns::before,
.device-iphone-17-pro.device-black .device-power {
  background: #151515;
}