body {
        font-family: 'Rubik', sans-serif;
        background-color: #f3f4f6;
        margin: 0;
        padding: 0;
        overflow: hidden;
      }

      .blocklyToolboxDiv {
        background-color: #ffffff;
        border-right: 1px solid #ddd !important;
        padding-top: 10px;
        z-index: 100;
        box-shadow: none !important;
        width: 72px !important;
      }

      .blocklyFlyoutBackground {
        stroke: #ddd !important;
        stroke-width: 1px !important;
        fill: #f9f9f9 !important;
        fill-opacity: 1 !important;
        vector-effect: non-scaling-stroke !important;
        shape-rendering: crispEdges !important;
      }

      .blocklyFlyout {
        filter: none !important;
        -webkit-filter: none !important;
        box-shadow: none !important;
      }

      .blocklyFlyoutBackgroundShadow, 
      .blocklyFlyoutShadow {
        display: none !important;
        visibility: hidden !important;
      }

      .blocklyMainBackground {
        stroke: none !important;
      }

      /* החזרת הצבע לאפור לאחר אישור הזיהוי */
      .blocklyScrollbarHandle {
        fill: #d1d5db !important;
        rx: 4px;
      }

      /* העלמת פס הגלילה של ה-Flyout (התפריט השמאלי) באופן מוחלט */
      .blocklyFlyoutScrollbar {
        display: none !important;
        visibility: hidden !important;
      }

      .blocklyTreeRow {
        height: auto !important;
        min-height: 64px;
        padding: 8px 0 !important;
        margin-bottom: 2px;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        cursor: pointer;
        border-left: 4px solid transparent;
      }

      .blocklyTreeRowContentContainer {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
      }

      .blocklyTreeLabel {
        font-family: 'Rubik', sans-serif;
        font-weight: 700;
        font-size: 11px;
        text-align: center !important;
        width: 100%;
        margin: 0 !important;
        padding: 2px 0 0 0 !important;
        order: 2;
      }

      .blocklyTreeIcon {
        display: none !important;
      }

      .blocklyTreeRowContentContainer::before {
        content: '';
        display: block;
        width: 24px;
        height: 24px;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        order: 1;
        margin-bottom: 2px;
      }

      .category-motion .blocklyTreeLabel { color: #4C97FF; }
      .category-motion .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234C97FF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 9l7-7 7 7'/%3E%3Cpath d='M12 2v20'/%3E%3C/svg%3E");
      }
      
      .category-looks .blocklyTreeLabel { color: #9966FF; }
      .category-looks .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239966FF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 14c.2-1 .7-1.7 1.5-2.5 1-1 1.5-2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5'/%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3C/svg%3E");
      }

      .category-pen .blocklyTreeLabel { color: #0FBD8C; }
      .category-pen .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230FBD8C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z'/%3E%3Cpath d='m15 5 4 4'/%3E%3C/svg%3E");
      }
      
      .category-events .blocklyTreeLabel { color: #FFBF00; }
      .category-events .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFBF00' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z'/%3E%3Cline x1='4' y1='22' x2='4' y2='15'/%3E%3C/svg%3E");
      }
      
      .category-control .blocklyTreeLabel { color: #FFAB19; }
      .category-control .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFAB19' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m17 2 4 4-4 4'/%3E%3Cpath d='M3 11v-1a4 4 0 0 1 4-4h14'/%3E%3Cpath d='m7 22-4-4 4-4'/%3E%3Cpath d='M21 13v1a4 4 0 0 1-4 4H3'/%3E%3C/svg%3E");
      }
      
      .category-sensors .blocklyTreeLabel { color: #00C7E5; }
      .category-sensors .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2300C7E5' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 10 10 0 0 0-10-10zm0 18a8 8 0 1 1 8-8 8 8 0 0 1-8 8z'/%3E%3Cpath d='M12 8a4 4 0 1 0 4 4 4 4 0 0 0-4-4z'/%3E%3C/svg%3E");
      }
      
      .category-logic .blocklyTreeLabel { color: #59C059; }
      .category-logic .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2359C059' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'/%3E%3Cpath d='M9 3v18'/%3E%3Cpath d='M14 9h7'/%3E%3Cpath d='M14 15h7'/%3E%3C/svg%3E");
      }
      
      .category-variables .blocklyTreeLabel { color: #FF8C1A; }
      .category-variables .blocklyTreeRowContentContainer::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF8C1A' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'/%3E%3Cpolyline points='7.5 4.21 12 6.81 16.5 4.21'/%3E%3Cpolyline points='7.5 19.79 7.5 14.6 3 12'/%3E%3Cpolyline points='21 12 16.5 14.6 16.5 19.79'/%3E%3Cpolyline points='3.27 6.96 12 12.01 20.73 6.96'/%3E%3Cline x1='12' y1='22.08' x2='12' y2='12'/%3E%3C/svg%3E");
      }

      .blocklyTreeRow.blocklyTreeSelected {
        background-color: #F3F4F6 !important;
        border-left: 4px solid currentColor;
      }
      
      .blocklyWidgetDiv { z-index: 99999 !important; }
      .blocklyDropDownDiv { z-index: 99999 !important; }
      .blocklyTooltipDiv { z-index: 99999 !important; }
      
      .blocklyModalDialog {
        background-color: white !important;
        border-radius: 1rem !important;
        box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1) !important;
        border: 4px solid #9966FF !important;
        padding: 1.5rem !important;
      }