.wp_accessible_color_panel{
  position:fixed;top:50%;left:-260px;
  transform:translateY(-50%);
  width:260px;background:#fff;
  border:1px solid #ccc;border-radius:0 12px 12px 0;
  box-shadow:0 4px 12px rgba(0,0,0,0.2);
  transition:all 0.5s ease;z-index:9999;
}
.wp_accessible_color_panel.open{left:0;}
.wp_accessible_toggle_btn{
  position:absolute;right:-45px;top:30px;width:45px;height:45px;
  background:#fff;border:1px solid #ccc;border-radius:0% 50% 50% 0%;
  box-shadow:4px 6px 10px rgba(0,0,0,0.15);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
}
.wp_accessible_color_icon{
  width:22px;height:22px;border-radius:50%;
  background:conic-gradient(red,orange,yellow,green,blue,indigo,violet,red);
}
.wp_accessible_close_icon{position:absolute;font-size:22px;color:red;opacity:0;transition:opacity .4s;}
.wp_accessible_color_panel.open .wp_accessible_close_icon{opacity:1;}
.wp_accessible_color_panel.open .wp_accessible_color_icon{opacity:0;}
.wp_accessible_panel_content{padding:15px;}

.ic_section_wrap{
  margin-bottom:12px;border:1px solid #ddd;border-radius:10px;overflow:hidden;
  box-shadow:0 2px 6px rgba(0,0,0,0.08);background:#fafafa;
}
.ic_section_header{
  background:#f0f0f0;padding:8px 10px;
  display:flex;justify-content:space-between;align-items:center;
  cursor:pointer;font-weight:600;color:#333;font-size:14px;
}
.ic_color_arrow{
  transition:transform .3s;
}
.ic_color_arrow.rotated{
  transform:rotate(180deg);
}
.ic_section_body{
  display:none;padding:10px;
}

.ic_color_box_wrap{
    --columns: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.ic_color_section{
    border: 1px solid #ddd;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    box-sizing: border-box;
    flex: 1 1 calc(50% - 5px);
    max-width: calc(50% - 5px);
}

.ic_color_header{
    background: #f7f7f7;
    padding: 6px 10px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    text-align: center;
}
.ic_color_arrow_small{
  transition:transform .3s;
}
.ic_color_arrow_small.rotated{
  transform:rotate(180deg);
}

.ic_color_body{
  padding:10px;background:#fff;text-align:center;
}

.ic_color_picker {
    width: 65px !important;
    height: 50px !important;
    transition: background 0.3s ease;
    box-shadow: 0 0 5px 5px rgb(203 203 203 / 41%);
    cursor: pointer;
    margin-bottom: 10px;
}
.wp_accessible_colors{
  display:flex;gap:5px;justify-content:center;
}
.wp_accessible_color_box{
  width:20px;height:20px;border-radius:4px;
  cursor:pointer;transition:transform 0.2s; 
    box-shadow: 0 0 2px 2px rgb(203 203 203 / 41%);
}
.wp_accessible_color_box:hover{transform:scale(1.2);}


/* text arrea */

.wp_font_control {
  display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;
}

.wp_font_actions {
  display:flex;gap:10px;align-items:center;
}

.wp_font_minus, .wp_font_plus {
  background:#eee;border-radius:6px;width:28px;height:28px;text-align:center;line-height:28px;cursor:pointer;
  user-select:none;transition:0.2s;
}
.wp_font_minus:hover, .wp_font_plus:hover { background:#ddd; }

.wp_font_value { min-width:40px;text-align:center;font-weight:500; }

.ic_color_body .wp_font_control label {
  flex:1;
  font-size:13px;
  font-weight:500;
  color:#333;
}