/* 日期时辰滚轮：企名佳主题色 + 表单控件（无多样式切换） */
    /* 输入框样式 */
    .input-group {
      margin-bottom: 20px;
    }
    
    .input-label {
      display: block;
      font-size: 14px;
      color: #333;
      margin-bottom: 8px;
      font-weight: 500;
    }
    
    .date-input-wrapper {
      position: relative;
      display: flex;
      align-items: center;
    }
    
    .date-input {
      width: 100%;
      padding: 12px 40px 12px 12px;
      border: 1px solid #ddd;
      border-radius: 6px;
      font-size: 16px;
      color: #333;
      background: white;
      transition: border-color 0.3s;
    }
    
    .date-input:focus {
      outline: none;
      border-color: #0F4C81;
      box-shadow: 0 0 0 2px rgba(15, 76, 129, 0.12);
    }
    
    .date-input::placeholder {
      color: #999;
    }
    
    .calendar-icon {
      position: absolute;
      right: 12px;
      top: 50%;
      transform: translateY(-50%);
      width: 20px;
      height: 20px;
      cursor: pointer;
      color: #666;
      transition: color 0.3s;
    }
    
    .calendar-icon:hover {
      color: #0F4C81;
    }
    
    .form-label {
      display: block;
      font-size: 14px;
      color: #333;
      margin-bottom: 8px;
      font-weight: 500;
    }
    
    .form-input, .form-select {
      width: 100%;
      padding: 12px 15px;
      border: 1px solid #ddd;
      border-radius: 6px;
      font-size: 16px;
      color: #333;
      background: white;
      transition: border-color 0.3s;
    }
    
    .form-input:focus, .form-select:focus {
      outline: none;
      border-color: #0F4C81;
      box-shadow: 0 0 0 2px rgba(15, 76, 129, 0.12);
    }
    
    .form-input::placeholder {
      color: #999;
    }
    
    .form-select {
      cursor: pointer;
      background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
      background-position: right 12px center;
      background-repeat: no-repeat;
      background-size: 16px;
      padding-right: 40px;
    }

    .date-input-wrapper .form-input {
      padding-right: 40px;
    }
    
    /* 模态框基础样式 */
    .picker-modal {
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      max-width: 600px;
      margin: 0 auto;
      background: white;
      border-radius: 16px 16px 0 0;
      box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
      transform: translateY(100%);
      transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      z-index: 1000;
    }

    @media (max-width: 600px) {
      .picker-modal {
        max-width: 100%;
        border-radius: 16px 16px 0 0;
      }
      
      .wheel-column {
        min-width: 0;
        flex: 1;
      }
      
      .wheel-column:nth-child(1) {
        flex: 0 0 20%;
      }
      
      .wheel-column:nth-child(2) {
        flex: 0 0 20%;
      }
      
      .wheel-column:nth-child(3) {
        flex: 0 0 20%;
      }
      
      .wheel-column:nth-child(4) {
        flex: 0 0 40%;
      }
      
      .wheel-item {
        font-size: 14px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 0 5px;
      }
    }

    .picker-modal.active {
      transform: translateY(0);
    }

    .modal-backdrop {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: rgba(0,0,0,0.5);
      z-index: 999;
      display: none;
      backdrop-filter: blur(2px);
    }

    .modal-backdrop.active {
      display: block;
    }

    /* 选择器头部 */
    .picker-header {
      padding: 15px 20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      border-bottom: 1px solid #eee;
    }

    .picker-title {
      font-size: 18px;
      font-weight: 600;
    }

    .picker-actions {
      display: flex;
      gap: 10px;
    }

    .picker-btn {
      padding: 8px 16px;
      border: none;
      border-radius: 6px;
      font-size: 16px;
      cursor: pointer;
      font-weight: 500;
      transition: all 0.2s;
    }

    .picker-cancel {
      background: #f5f5f5;
    }

    .picker-confirm {
      font-weight: 600;
    }

    /* 日历信息栏 */
    .calendar-info {
      padding: 15px 20px;
      text-align: center;
      font-size: 16px;
      color: #333;
      font-weight: 500;
      border-bottom: 1px solid #eee;
    }
    
    /* 滚轮容器 */
    .wheel-wrapper {
      display: flex;
      height: 240px;
      position: relative;
      overflow: hidden;
    }

    .wheel-column {
      flex: 1;
      position: relative;
      overflow: hidden;
      cursor: pointer;
    }

    .wheel-scroll {
      list-style: none;
      position: absolute;
      width: 100%;
      top: 100px; /* 中间位置 */
      transition: transform 0.1s ease-out;
      padding: 0;
      z-index: 5;
    }

    .wheel-item {
      height: 40px;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 17px;
      font-weight: 500;
      color: #888;
      line-height: 40px;
      margin: 0;
      padding: 0;
      position: relative;
      z-index: 10;
    }

    .wheel-mask {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 100%;
      pointer-events: none;
      background: linear-gradient(to bottom, 
        rgba(255,255,255,0.9) 0%, 
        rgba(255,255,255,0) 25%, 
        rgba(255,255,255,0) 75%, 
        rgba(255,255,255,0.9) 100%);
      z-index: 10;
    }

    .wheel-highlight {
      position: absolute;
      top: 100px;
      left: 0;
      right: 0;
      height: 40px;
      border-radius: 8px;
      z-index: 1;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      pointer-events: none;
      background: rgba(15, 76, 129, 0.06);
      border: 1px solid rgba(15, 76, 129, 0.15);
    }

    /* 企名佳主题：主色 #0F4C81、辅色 #1A6BA9（与 tailwind.config / 页面一致） */
    .style-theme .picker-confirm {
      background: #0F4C81;
      color: white;
    }
    .style-theme .picker-confirm:hover {
      background: #1A6BA9;
    }
    .style-theme .wheel-column .wheel-highlight {
      background: rgba(15, 76, 129, 0.08);
      border: 1px solid rgba(15, 76, 129, 0.22);
    }
    .style-theme .wheel-item.active {
      color: #333 !important;
      font-weight: 600;
      z-index: 20;
      position: relative;
    }
