@import "../../wxssclass/panel.wxss";

/* Slot defaultable styles */
.slot-defaultable { display: contents; }
.slot-defaultable .slot:empty { display: none; }
.slot-defaultable .slot { display: contents; }
.slot-defaultable .default-slot { display: none; }
.slot-defaultable .slot:empty + .default-slot { display: contents; }

.wv-slidepanel {
  background: rgba(var(--wv-theme-light-rgb), 1);
  overflow: hidden;
  --wv-border-radius: var(--wv-border-radius-large);
  position: relative;
  max-height: 100vh;
  max-width: 100vw;
}

.wv-slidepanel.top {
  width: 100vw !important;
  height: var(--wv-slidepanel-height, 50vh); 
  border-radius: var(--wv-border-radius-none);
  border-bottom-left-radius: var(--wv-border-radius);
  border-bottom-right-radius: var(--wv-border-radius);
}

.wv-slidepanel.right {
  height: 100vh !important; 
  width: var(--wv-slidepanel-width, 80vw);
  border-radius: var(--wv-border-radius-none);
  border-top-left-radius: var(--wv-border-radius);
  border-bottom-left-radius: var(--wv-border-radius);
}

.wv-slidepanel.bottom {
  width: 100vw !important; 
  height: var(--wv-slidepanel-height, 80vh); 
  border-radius: var(--wv-border-radius-none);
  border-top-left-radius: var(--wv-border-radius);
  border-top-right-radius: var(--wv-border-radius);
}

.wv-slidepanel.left {
  height: 100vh !important; 
  width: var(--wv-slidepanel-width, 80vw); 
  border-radius: var(--wv-border-radius-none);
  border-top-right-radius: var(--wv-border-radius);
  border-bottom-right-radius: var(--wv-border-radius);
}


.wv-slidepanel.top .wv-panel {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.wv-slidepanel.right .wv-panel {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.wv-slidepanel.bottom .wv-panel {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.wv-slidepanel.left .wv-panel {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}


.wv-slidepanel-close-btn .icon {
  font-size: 33rpx;
}


.wv-slidepanel .wv-panel {
  width: 100%;
  height: 100%;
}
.wv-slidepanel .wv-panel .slide-panel-header {
  width: 100%;
}
.wv-slidepanel .wv-panel .slidepanel-content {
  width: 100%;
  overflow: hidden;
  flex: 1;
}
.wv-slidepanel .wv-panel .slide-panel-footer {
  margin-top: -10rpx;
  width: 100%;
  display: flex;
  padding: var(--wv-padding-default);
  background: rgba(var(--wv-theme-light-rgb), 1);
  justify-content:space-evenly;
  align-items: center;
  flex-shrink: 0;
  gap: var(--wv-padding-mini)
}

.wv-slidepanel .wv-panel .wv-panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-shrink: 0;
  gap: var(--wv-padding-mini)
}

.wv-slidepanel .wv-panel .wv-panel-header .title {
  flex: 1;
}


/* 手势触发区域样式 */
.wv-slidepanel-gesture-area {
  position: fixed;
  z-index: 8999;
  display: flex;
}

.wv-slidepanel-gesture-area.right {
  top: 0;
  right: 0;
  width: var(--wv-gesture-area-width, 20rpx);
  height: 100vh;
}

.wv-slidepanel-gesture-area.left {
  top: 0;
  left: 0;
  width: var(--wv-gesture-area-width, 20rpx);
  height: 100vh;
}

.wv-slidepanel-gesture-area.bottom {
  bottom: 0;
  left: 0;
  width: 100vw;
  height: var(--wv-gesture-area-width, 20rpx);
}

.wv-slidepanel-gesture-area.top {
  top: 0;
  left: 0;
  width: 100vw;
  height: var(--wv-gesture-area-width, 20rpx);
}