// PrimeNG Datepicker specific styles
.lib-date-picker-styles {
  #libDatePicker {
    width: 300px;
    background: transparent;
    border: none;
    box-sizing: border-box;
    font-size: var(--input-font-size, 16px) !important;
    font-weight: var(--input-font-weight, 600) !important;

    &::placeholder {
      opacity: 0;
      transition: opacity 0.2s ease;
      font-size: var(--placeholder-font-size, 16px) !important;
      font-weight: var(--placeholder-font-weight, 600) !important;
    }

    &:hover::placeholder {
      opacity: 0 !important;
    }

    &:focus::placeholder {
      opacity: 1 !important;
    }
  }

  .p-datepicker {
    font-size: var(--input-font-size, 16px) !important;
    font-weight: var(--input-font-weight, 600) !important;

    .p-inputtext {
      font-size: var(--input-font-size, 16px) !important;
      font-weight: var(--input-font-weight, 600) !important;

      &::placeholder {
        opacity: 0;
        transition: opacity 0.2s ease;
      }

      &:hover::placeholder {
        opacity: 0 !important;
      }

      &:focus::placeholder {
        opacity: 1 !important;
      }
    }
  }

  &.lib-date-filter-field {
    .p-datepicker {
      font-size: var(--input-font-size, 16px) !important;
      font-weight: var(--input-font-weight, 600) !important;

      .p-inputtext {
        &::placeholder {
          color: transparent !important;
        }

        &:hover::placeholder {
          color: transparent !important;
        }

        &:focus::placeholder {
          color: rgba(255, 255, 255, 0.5) !important;
        }
      }
    }
  }

  /* === Remove hard borders between calendar cells === */
  .p-datepicker table {
    border-collapse: collapse !important;
  }

  .p-datepicker table td,
  .p-datepicker table th {
    border: none !important; /* remove grid borders */
  }

  /* Optional – make hover/selected smoother */
  .p-datepicker table td > span {
    border: none !important;
    box-shadow: none !important;
  }

  .p-datepicker table td > span:hover {
    background: rgba(254, 60, 114, 0.15) !important;
  }

  /* Optional – keep clean separation under week row */
  .p-datepicker .p-datepicker-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
  }
}
